A responsive e-commerce website that transitions a brick and mortar fashion boutique to the online retail market.


Overview & Challenge

Design a responsive e-commerce website that will help client successfully transition to online retailer, and provide customers with a positive experience similar to visiting the storefront.

My Role: Branding, UX/UI research and design


Research Goals:

Identify online shopping habits and preferences

Learn about competitors’ advantages and disadvantages

Identify consumer frustration with online shopping


Participants were fashionable young professionals, who see shopping as an activity that they enjoy. It’s important to them to follow trends and stay up-to-date with fashion without spending a lot of money. 5 people were interviewed: males and females between the age of 25 and 35. Questions asked include:


  • Do you prefer online or in-store shopping?

  • What influences your online buying decisions?

  • Can you tell me about the last time you bought something online?


  • 40% prefer shopping at a physical store to make sure the fitting is appropriate.

  • 50% don’t have time to go shop at the mall and they think is very convenient to shop for their needs online.

Common Problems:

  • Always worried about size and fitting

  • The product doesn’t match the image or description


Common Needs:

  • Good quality with affordable price

  • Convenience

  • Good fitting

Buying Influences:

  • Ads and social media

  • Sale

  • Free shipping and returns

Empathy Map:

Information Architecture 

I did an open card sorting interview in which participants organized the cards in a way that made sense to them and gave each category a name. For this research, I had 5 participants who shop online regularly. They all completed the task with very few questions asked. I had total of 48 cards to organize. Then, I analyzed the findings and put together a sitemap for all the main sections of the website.



Interaction Design

Annotated Wireframes:



I found that developing mobile prototypes in Marvel and Adobe XD to facilitate testing was helpful in cleaning up some user interface and flow issues before initiating the first test. I conducted testing in-person on basic site functionality: I asked testers to place an order as their main task. Taking the time to clearly outline tasks and objectives was not only useful for me as a facilitator, but also for the users completing the test, and it also helped me analyze the results afterwards. In testing, we achieved 100% success rates and received a lot of positive feedback about the experience, as well as plenty of insights to improve the experience further.