top of page
School Kids Meditating

Redesigning Inner City Bliss

Based in Oakland, CA, director Andre Humphrey and his team have been working in trauma-informed meditation for over 5 years, and worked hard to create this 503c nonprofit. Their goal is to bring mindfulness skills to those who most need it, namely city kids who experienced trauma and stress in their young lives.

The Problem

ICB had a functional, but somewhat confusing website. They needed more engagement from high-value clients, such as partners interested in bringing ICB to their organization, or generous donors.

ICB wanted the site to feel more professional and clean. Andre said "I want to simplify the site-- I try to do too much!"

Image by João Rafael
The Process

I began with a site review and competitive analysis session with the stakeholder to determine the course of action. Next, I created a redesigned site map, then moved on to full wireframes using the whiteboarding tool Miro. With everything nailed down, I created a mood board and finally redesigned the entire site in Wix.


Miro, Canva, Adobe Illustrator, Wix


  • February 20 - initial meeting

  • February 27 - competitive research, user evaluation

  • March 3 - sitemap and wireframes

  • March 10- mid-fidelity review

  • March 6 - final design launch

My Roles

Project planning, site structuring, wireframes, testing, live site design and implementation.

ICB project map.png

Breathe in: Starting the Process- Empathize and Define

  • Increase donor appeal and engagement- UX
  • Update look and feel
  • Improve site usability

Donors Speak: Research

I spoke with 3 people who manage donations in non-profit spaces, and asked them what they thought was missing from ICB's site. The top responses:

  • Where are they?

  • Are there any testimonials?

  • Who’s in charge?

  • What are their names and bona fides?

  • Do they have a track record?

  • How did they come about? 

"What is their backstory? I want to see an introduction or something."

"Who is running the program? If I'm going to invite them into my space, I want to be sure they're qualified"

"I'm not sure if they're local."

"Any endorsements? Proven results?"

Problem Statement:

"As a potential donor, I need to trust the organization I'm supporting, so that I know my money is being used effectively."

Competitive Analysis

In researching similar organizations, I came across a few patterns that helped solve this trust issue:

  • Lots of 1-2-3 style infographics: e.g. three tiers of donating, three data points, three benefits of meditation.

  • Donation button "above the fold", usually in the navigation bar.

  • Donation and sign-ups in the footer.

  • Videos, photos, quotes, and testimonials make the organization look active and engaged.

  • Clear, detailed information on the program and it's services, especially the kind that involve patronage and coordination.

competitive analysis showing website elements to copy

User Persona

The above conversations helped me create a user persona.

I needed to keep in mind that the stakeholder and the donor need to be able to connect in several different ways.


User Journey: Making a Difference

ICB User journey.png

Breathe Out:

  • Reduce the amount of pages.

  • Flesh out the About, Support, Programs and Home pages.

  • Create a streamlined site map.

What it Was

Shown here, the site had a lot of pages and sub-pages. 

The site needed to answer questions potential donors might have, and provide more reassurance that ICB is an active, locally engaged, and organized that has proven program results.


Funnel potential partners to donation or contact for further review by increasing confidence in the program.

icb old site.png

Former ICB site structure


Create a consistent tone:

Eliminate program offerings that sounded more quick-fix self-help oriented. We wanted to focus more on trauma-informed wellness.

Donation confidence: make clear what impact financial support will do. Structured gifting, proven results, and lots of photos/videos.

Make it more personal: Show the faces of the staff members and program leaders. Explain the mission and successes fully.

The Restructure

I reduced the number of navigation tabs from 7 to 5, and consolidated some of the sections.

ICB's director jumped in at this point and helped define the direction on certain sections, namely:

  • Change the "Programs" section to more of a conceptual design, rather than a pick-and-choose shopping cart experience.

  • Create a graphics-heavy informational portion  on the concept of Trauma-Informed Meditation in the "About" section.

  • Provide detailed and robust information in the "Support" section.

new site structure.png

Wireframing and Design

  • Streamline content

  • Develop graphics and assets.


I took a lot of care in organizing the content to be digestible, and made sure that the CTA buttons and links were everywhere they needed to be.

Our goal was to make donations easier and the content more elevated.

You can see the beginnings of the asset development on the About and Support Us pages.

asset 123.png


The stakeholders wanted to maintain a black and white color palate. After examining some styles, we were really attracted to the "texture" board, followed by the "nu brutalist" and "mystical" styles. The idea is to create an elevated, consistent look that projects professionalism.

I created these in Canva, and took the mood board picks to create some assets.


Styling and Assets


The Finished Product

  • New Features
  • Launch

New Features

  • Donation CTA

A nav bar based donation button makes it easy for casual site visitors to donate- previously donation was difficult to find.

A more professional presentation of ICB's offerings reassure organizations that donations are being put to good use. 

  • tiered gift suggestions

  • easy to understand graphics

  • simplified course offerings 

Reassurance to potential partners that ICB is a thriving organization.

  • bona fides

  • testimonials

  • candid photos

  • "About" page is more clear

Visit here: Inner City Bliss

Home page

About page

Programs page

Key Performance Indicators:

+ %200
New leads

With the new design, ICB has doubled new cold leads.

+ 80%
"Donate" page visits 

The donate page page got a major overhaul, and people are noticing!

Site Sessions

More people are coming checking in with ICB. It looks promising!

+ 109%
"About" page visits

People want to know more about ICB, leading to more intrest and lead generation.

Final Thoughts

ICB mock.png


This was a great collaboration with the client: I found that keeping us in contact keeps us aligned to the users' needs as well as his own.  The stakeholder said this:

"I just wanted to reach out and thank you for all the amazing work you did with our website.Our team is overjoyed with the makeover our website received! "

Next Steps: 

ICB hopes to grow in the future, and hopefully will have more data to share to attract larger donors. I suggest:

  • A built-out thank-you package for donors, showing the direct impact of their contributions.

  • More free resources to engage site visitors.

  • A more engaging text on the history of the program.

Case Studies
bottom of page