CASE STUDY

Devi Brown: Web Design

#unfadeable

With a rich history in entertainment and wellness, Devi Brown is a respected media personality, author, and wellness entrepreneur who is dedicated to helping women of color find their truth through meditation, powerful self-discovery, and meditation. I worked with Devi to redesign and develop her website from the ground up.

UI Design
UX Strategy
Web Development
Prototyping
Wireframing
Arrow Down

Project Details

#unfadeable

Client:

Devi Brown

Design Tools:

Adobe XD, Sketch, Photoshop, Illustrator

Key Performance Metrics:

Session Duration, Bounce Rate

Link To Final Project:

Click here

Platform:

Squarespace

01

Discovery

Wireframing

Since we had the “bones” of the site’s content and layout, I created wireframes using Adobe XD and Balsamiq to iterate through different design options. 

Working with Devi directly, we went through these options quickly.

No items found.
No items found.

02

Design

Colors & Typography

Once we decided on the aesthetic direction, I began to put together new color palette and font combinations, taking inspiration from other media influencers in the space.

Devi wanted to stay true to a warm, polished, & sophisticated feel, so we played around with different combinations through the process.

No items found.

High-Fidelity Prototypes

After getting clarity on the color and typography, I jumped right into the prototyping stage using Adobe XD and spent more time getting the visual aesthetics to match her brand and her taste. 

Through weekly check-in Zoom calls, we made decisions fast without the back-and-forth of email communication. 

Devi wanted to ensure that her site felt warm and inviting, while showing all the different sides of her rich career accomplishments.

This was very important to her.

No items found.

03

Development

Staging

After getting her approval on the final design of the website, I started development on the site using Squarespace Developer Tools. 

Since her live site was already on Squarespace, it was much easier to migrate her site over without the need for cross-platform compatibility. Squarespace’s Base Template code also gave me the flexibility to code freely. 

I’m not a highly-trained developer by any means, but their framework let me build on top of everything fast and efficiently.

No items found.
No items found.
Thank you, Tony!

Devi Brown

Recap

I learned quickly through this process that Squarespace’s Developer Tools are both robust and efficient. 

I realized how easy it was to apply my designs to their framework and create something amazing.

The most challenging part about this project, for me, was code structure for this project.

I began using my own naming conventions and hierarchies, but soon realized that there were better, more efficient ways to structure classes. 

Going back and doing cleanup on messy code was tough and time-consuming, but proved to be what helped me push everything past the finish in the last couple of weeks of the project.

Prior to our project, the previous version of her website had a bounce rate percentage in the upper 80s and a session duration of about 30 seconds. 

After launching her new site, her bounce rate dropped to the mid-50s and session duration rose to about 2 minutes 30 seconds - an incredible increase!

While the entire process was incredibly fun to do, the part that I enjoyed putting together the most was her Partnerships and Journey pages. 

These were new additions to the new site, and were designed for explicitly telling her story and showcasing what she can do for potential partners. 

Typically, most public figures rely on a simple About Me and Contact page, but Devi wanted to go beyond and truly craft a narrative on her site that stood out.

She challenged me to think outside the box with these new additions and I’m grateful for it.

Ready To Chat?

Fill out the form below and let's see how we can work!

** Your information is private and secure. It will not be shared with any third parties. **

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.