BroglieBox

 The Challenge

The objective was to design a website that clearly explains the product and rationale behind the items which may be in the quarterly box. It was also a priority to integrate resources into the purchase flow so users are aware of the immediate resources they also have access to. We needed to integrate the donation feature into the purchasing process so that users are aware of The BroglieBox Foundation and have the opportunity to give back.

Screen Shot 2019-12-03 at 8.51.38 PM (7)

 Competitive Analysis

I began researching other major subscription websites to learn more about their best practices, any unique interactions, and major themes for information architecture. 

Screen Shot 2019-12-03 at 8.51.38 PM (4)

 Caring-Crate

When I landed on the Caring-Crate website, I found messaging that I received as “I understand”, “I’m listening” and “I’m here for you”. This company brings transparency to the forefront by allowing customers to see benefits and savings upfront and explore past boxes, all while giving them confidence and trust in the Caring-Crate brand. I made the decision to adapt their structure into my approach when redesigning the Broglie Box subscription page.

 

ThriveWise 

Although ThriveWise was established by a health psychologist (which was plus) the website only gave vague descriptions and very broad categories that left me confused about the "why" behind their product. This was a pain point we were addressing with BroglieBox as well. Knowing that other subscription services were also missing the mark on transparency and specificity gave us the fuel to make this a top priority.

both current subscribers as well as mental wellness professionals. This consisted of asking qualitative questions that ranged from customer experience to client website user workflow. 

Screen Shot 2019-12-03 at 8.51.38 PM (5)

You know the drill. Have to talk to the users to make sure we’re designing the right thing or what the heck is the point?  Sorry, preaching to the choir here. Now, back to the case study…

BroglieBox

Brogliebox requested a redesign of their existing website that would allow new and current users to clearly understand their product and subscription terms. They aimed to highlight BroglieBox’s mental health and wellness resources on the site, all while providing a calming and visually welcoming experience. 

Goals 

  

Clearer navigation.                                    

Better integration of educational

resources                                                                              

Ability to understand the product while maintaining an element of surprise 

Lighthearted branding 

Determine target demographic and have website design reflect brands culture

Tools                                                         

XD, InDesign, Photoshop.

Role

UX Designer

TEAM:

Irene Park

Zoë Bax

Bruce ELebee 

Paige Libadisos

smartmockups_k3z1y7w1.png
Screen Shot 2019-12-05 at 6.38.51 PM.png

 Task Analysis

Conducting a task analysis allowed us to discover true user needs as well as generate preliminary ideas as to how we might change the site in order to support efficient user navigation. We asked 8 participants to perform certain tasks on the existing site in order to discover hidden opportunities to improve their user experience. 

Screen Shot 2019-12-09 at 11.00.09 PM.pn

 Key Findings

01 Keep It Organized

Website navigation should be clearly labeled and users should be able to jump to relevant sections and resources with one click.

 

02 Give me personalize support 

Serve as a single place for users to take time for self-care and nourish their mental health.

 

03 Let Me Find It Quickly

Everything should have helpful links and resources for a particular topic. 

 

04 Pretty Never Hurts

This website should highlight their mental health and wellness resources, all while providing a calming and visually welcoming experience.. 

 

05 Evoke Brand Values

Integrate the donation feature into the purchasing process so that users are aware of The BroglieBox Foundation and mission giving them the opportunity to give back.

 

06 Keep Me Interested

No blah, we wanted to design the site so users would feel like they’ve entered a safe space that would allow them to feel excited to visit the site and confident in BroglieBox’s resources and product.

Screen Shot 2019-12-09 at 11.31.23 PM.pn
Screen Shot 2019-12-09 at 11.31.42 PM.pn

Facebook and Instagram Analytics + Psychographic to identify Target Market

I used social media analytics + Psychographic to identify the target market. By gathering information about audience attitudes, beliefs, emotions, and values, it helped identify answers to questions like Why do people buy Brogliebox? Why is mental wellness important to them? Why do they prefer to shop online? etc.

Screen Shot 2019-12-05 at 6.39.18 PM.png

User Personas

Our persona consisted of 4 different archetypes which we used to facilitate discussions about our user's needs, desires and varying contexts of use. Through careful analysis of our user research, we identified sufficient behavioral variables to segment our user audience. These variables could be categorized into activities such as understanding of subscription boxes, having disposable income, seeking tools for self-betterment, and knowledge of tech and social media. Their motivations fueled them to strive for overall mental and physical wellness. We discussed the personas with our client to develop a clear picture of who the design of the website would target.

Screen Shot 2019-12-04 at 4.55.19 PM.png

Whether you’re on the giving or receiving end of a gift, that gift can elicit feelings of gratitude - it can be a way of expressing gratitude or instilling gratitude in the recipient. It induces feelings of warmth, euphoria, and connection to others. BriglieBox contribution to mental wellness is connection. A connection that can improve physical health, longevity, and overall mental wellness that helps decrease stress, which is associated with a variety of health problems including depression.

take.png

 The Journey

We developed a customer journey map to create a visual representation of Taylor’s pain points while trying to navigate through the BroglieBox website and find resources that could address her needs. We highlighted the major problems to explore opportunities toward a solution.

Screen Shot 2019-12-04 at 5.44.02 PM.png

 The design studio/Wireframe

The design studio process allowed us to collaborate on a wide set of ideas and different variations to help create the first 3 ideations of the website.

Screen Shot 2019-12-04 at 6.24.44 PM.png
Screen Shot 2019-12-04 at 6.23.23 PM.png
1.5 BroglieBox Current Site Map.png

 Usability Testing

After developing the initial sketches and wireframes, we began conducting usability tests to determine what worked and what didn't. Following each user test, I updated certain features and took notes on areas that needed improvement. I discovered that:

 

  • Testers wanted to know how resources in the mental health and stress relief categories were chosen and how each of them played a part in mental wellness. 

I created elements for each wellness category that would help users learn about how the resources delivered specific benefits of stress relief and improved wellness.
 

  • Because the donation option was buried and visually camouflaged toward the bottom of the website, testers were unaware they had the option to donate a box or give to the BroglieBox nonprofit foundation. 

With the redesign of the website, I moved the donation button to the primary navigation, updated the donation section to clearly communicate BroglieBox’s mission, and introduced a one-time gift purchase option.

Screen Shot 2019-12-04 at 7.47.58 PM.png

 Visual Design

For the visual design, we wanted something that would clearly communicate balance, relaxation and a sense of calming wellness. To meet these requirements, we decided to utilize white space with accents of natural, earthy colors to create a calm browsing experience. 

Screen Shot 2019-12-04 at 8.08.49 PM.png
Screen Shot 2019-12-04 at 8.10.38 PM.png
Screen Shot 2019-12-04 at 8.09.44 PM.png
Screen Shot 2019-12-03 at 8.51.38 PM (6)
smartmockups_k3tf9z3x.png
smartmockups_k3tf7as4.png
smartmockups_k3tfc1ir.png

 But What About Mobile?

In 2019, 63% of Google searches originated from mobile browsers, with mobile phones accounting for nearly 56% of total searches. We also learned that Social media influencers were playing a big part in BroglieBox brand awareness with high engagement on popular mobile platforms such as Instagram.  With that information, we determined that a key next step would be to create a responsive mobile experience. This would allow BroglieBox to reach their potential customers, connecting to them across all platforms.

smartmockups_k3zm24eg.png