top of page

Project Background


How often have you donated your clothes to charities ? Do you know Only 0.1 percent of all clothing collected by charities and take-back programs is recycled .Many second hand stores will reject items from fast-fashion chains like Forever 21, H&M, Zara and Topshop.

Synthetic fibers, like polyester, nylon and acrylic, have the same environmental drawbacks, and because they are essentially a type of plastic made from petroleum, they will take hundreds of years, if not a thousand, to biodegrade.


Trashing the clothes is also a huge waste of money. Nationwide, a municipality pays $45 per ton of waste sent to a landfill.



In Sep of 2016, I started to design my personal project, a mobile app that help users exchange their unwanted clothes with the people they know.  Users can upload the clothes they don’t need and search the item they need. This app will not only be a digital closet but also contribute to a sustainable environment and avoid wastes.

My Role

My Closet is my personal project. I did the project between Sep 2016 to Oct 2016. I did the UX work and UI design. This project includes

-Competitive research

-User research

-Storyboard design



-Usability testing

-iOS app design

The process

competitive research

I conducted market research and customer to drive my planning phase. Before I designed My Closet, I did competitive research for similar products in the App Store.









What does 'Closet' mean to you?

My research revealed that the concept of 'Closet' represented something different to users of the scheme. Users' motivations for exchanging and participating in the scheme differed, hinting at different requirements.

After designating persona types and aligning this with our phasing strategy I was able to prioritise who I would be focusing on supporting in the early stages. The phase 1 app focused on supporting the goals of Christine Yang, our primary personas.




The process​

Defining what matters to a Closet Organizer& Stylist app.

-Easy to create your own digital closet

-Know user's personal style 

-Subsequently finds people with similar taste that you can follow

-Buy and Sell











How can I design a page that is directly shows the information that each person wants to see and they can understand even the first time they use it? How to design an unique way to perform at the app?

-What is more user friendly to people?

-What color will be unique as a closet organizer app?

-How can I make it looks different from other app?

-How to present the most important information in the dashboard?


The Framework

Setting the Design Direction

I took a top‐down approach to defining the overall structure of the experience. Sketching and storyboarding, I generated stacks of ideas about the arrangement of UI, functional and data elements, and interactive behaviours. Starting broad, My vision began evolving into something tangible. A high‐level design language, interactions and the app's anatomy began to piece together.

Moody Listening

I conducted a small group survey to understand how people exchange clothes online. I learned that:

  1. Cheap and Easy to pick up were the most important influencers when choosing clothes online.

  2. People like to search the clothes and consider is this one match their cloth in the closet?

  3. People need to communicate first before exchange clothes.


Based on these insights, I designed the use case for prototyping. 


My process involved sketching and white‐boarding concepts and flows with my friends and then translating these directly into hi‐fidelity design comps. Since I was working by myself in this project, it was relatively quick to move straight into hi‐fidelity designs.

My next step involved slicing the comps and piecing them together with Sketch into a prototype. In the early stages I focussed only on representing the highest risk areas of the design. 

Design Sell/Exchange Feature

Embedding Sell/Exchange feature in a fashion App presented a novel design challenge, because user may not expect to sell their clothes online. I asked myself two questions:

  1. How was it possible to effectively satisfy both user who only want to browse fashion trend and purchasing clothes customers, when they have very different motivations and goals?

  2. How would I optimize the selling process?

The style


With 80% of our human experience filtered through our eyes, visual cues are vital to successfully getting a message across. It’s crucial when making color decisions for the app to consider how the shade will broadcast the image. 

I chose the color blue as the theme color because I want to make the user feel trust and organized. This is a color that seeks peace and tranquility above everything else, promoting both physical and mental relaxation. 

What kind of blue I should choose? What's the opacity I should set?



I compared 3 color robin’s-egg blue, forget-me-not blue​ and Tiffany blue. And I decided to use the color ABD8E8 which is a color between robin's egg blue and Tiffany blue. A color that speaks to vibrancy and escape, I want to transported user into a world filled with luxury, delight, clear and hope.

I used white color FFFFFF as the text color which is also the color Tiffany's ribbon. Because I want to make the user feels the app is a luxury and delicate gift.






































I use snell round font in the login page and titles because the font has an elegant and festive feel. The font is well-suited to middle length texts and headlines.

Snell Roundhand

Welcome to my Closet

I use Lucida Grande as the primary text for better readability.Because Lucida Grande supports the most commonly used characters defined in version 2.0 of the Unicode standard.

Detailed Design

I assumed user knew where to see the outfit—in the ClosetI designed the closet from Top to Shoes. So user could match at least 4 outfit in one App Page. I was wrong. User was not discoverable because user did not expect to look for it in the Closet page. The concept of match multiple outfit, did not exist in user’s minds.

“Why can’t it be a standalone section? Why do I have to see other outfit?”

—Anonymous Beta Participant

To solve the discoverability issue, I extracted the outfit feature from the Closet page and positioned it as a standalone area in the top‐level of dashboard page.

Finial Design
bottom of page