The Grateful Wardrobe

The Grateful Wardrobe is a local boutique that aims to provide mental care treatment assistance for those in need. My role was Web Design, Branding , and UI Design.

My Role:
Time Line:
This is some text inside of a div block.
Project Type:


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Step 1


Step 2


  • The Problem
  • User Personas
  • Key Behaviours
  • Initial Functionality

Workflow Interactions

Through various usability interviews during the research process, I optimized this work flow so that the users could add
their friends and their gift ideas as fast as possible.

Step 3

Visual Design

  • The Problem
  • User Personas
  • Key Behaviours
  • Initial Functionality
Step 4

Impact and Reflection

  • Testimonials
  • What I would do differently

Marketing and Design Goals

  • Improve organic traffic
  • Make the website mobile friendly
  • Improve user experience in the website for mental care applications

About The Grateful Wardrobe

The Grateful Wardrobe is a non-profit that aims to help people who are in need of mental health care.  It sells usd clothing  and donates the profit it earns from the sale to provide mental care treatment in Halifax.

Meet Michelle The Owner of The Grateful Wardrobe

Michelle had one thing many people I met in life don't have. Passion. If you sit in a room with her and listen to her  for 5 minutes, you begin wondering: "What the hell am I wasting my life for?"

That is exactly what intrigued  me to begin working with her.

Working on two businesses(Address busyness)

Michelle was juggling her accounting practice with a non-profit she had  created called The Grateful Wardrobe.

Michelle wanted a place online where she could show the people what The Grateful Wardrobe was about. A non-profit that focuses on helping mental health patients one donation at a time.

Before we met she had  a website but it wasn't working for her. The website was clunky which made it difficult for her customers to us but also created a mismatch between her store and her website:

First Strategy Session

In our first meeting, my goal is usuall to determine the answer to these three questions:

1) What are your goals with the website?

2) What are your goals as a business for this year?

3) How will we know this project is a success in terms of your eyes?

Before using any pixels or paper and pen, I knew I had to learn from Michelle the one thing that would make all the difference.

2) Why should her customers pick her store to buy clothes from instead of dozen others second hand boutique shops?

It took a little time but we figured out the answer to the question was:

"Used clothing used for good."

Creating The Initial Copywriting draft

Once I knew Michelle's goals with her site, I  needed to find out for whom were we going to write the copy for?

Who was the  customer that was going to use Michelle's site?

The answer to the first question wasn't that hard because Michelle already had customers  who shopped with her  in her store. She knew her ideal customer would be somebody who was  environment conscious, cared about mental health and helping their community.

The second question though took a bit more time. It was:

Why should they choose  The Grateful Wardrobe to shop for their clothing instead of other boutiques?

Is it because  The Grateful Wardrobe   was a second hand boutique?

Nope, there were many others in the city who was a second hand boutique.

Was it because The Grateful Wardrobe had fantastic clothes?

Nope. Although The Grateful Wardrobe did have great clothes, so did the other boutiques.

Then what was it?

It was because The Grateful Wardrobe actually donated most of the money it made to provide mental care treatment. That was the stick.

Once we came with that answer, we had to get it down to one sentence:

"Used clothing used for good."

became our motto and everything else we wrote about the company, the work it does,  was about showing the potential customer.

We  found out that the potential customer who would use the website was somebody  who was environment conscious, cared about mental health and  helping their community.

She wanted a website that  shows to the world The Grateful Wardrobe's mission but also a place where she could get potential applicants for mental care help she provides with her store.

Initial Wireframe

In the second meeting, we had the  initial wireframe prototype ready which would serve as the blueprint of how Michelle's site would look like.  Now was the time to find out the unique seling point of The Grateful Wardrobe. Our conversation went like this:

"What makes The Grateful Wardrobe different than the rest of  your competiton?"

This tackeld us. This is always the haret question to answer because when you are buidling a business you have two questions to answer:

"Why should your ideal customer buy?

"Why should they buy from you?"

The Wireframing Stage

Once we had the content of the site down and we had established the goals, we had to now create the site structure.

At this point, I explained Michelle that it is okay to do as many revision as we can in this stage. Making mistakes at this stage is common,  and unfixed mistakes at this stage grows bigger once we move on to high fidelity design.

Here are samples of our wireframes:

High Fidelity Design

From the second meeting we knew our selling proposition was:

"Used clothes used for good."

Everything else in the content and design of the website was built on this sentence.  I created a high fidelity prototype that told the wrold about  The  Grateful Wardrobe's Mission, how they work and their goal is.


The High Fidelity Design

Once we came up with the right content and the structure of the website, I began working on  working on the website.  I created an initial deck for colors/typogaphy and also implemented the site structure using Webflow.

Once I was done with High Fidelity design, I showed Michelle the website. We came up with a few changes to the content and next thing we know we were live.


Once we finished polishing the website in terms of color and typography, we were ready to launch.

Since, the launch The Grateful Wardrobe has received multiple applications for its mental care help treatment. It also got many happy visitors.

Below are some screenshots of our final designs before we launched:

Click here to check out the Grateful Wardrobe  website.

Once we had the color scheme and typography we wanted, we polished and got ready to launch the website. Below, you can look at the finished version of the website: