Shop Main E-Commerce Website

Converting Window Shoppers To Online Shoppers

Timeline: 2 weeks

Deliverables: Domain Research, Heuristic Evaluation, User Interviews, Persona Development, Information Architecture, User Testing, Wireframes, Interactive Prototype

The Opportunity.

My focus on this project was to design the men’s clothing section of this store. And discover the needs and wants that people who would shop at this specific section, would want.

Contextual Inquiry.

I went to 3 stores on Main Street, 8th and Main, The Corner Store, and F as in Frank. To observe how the customers acted when shopping for clothes.

  • When men shopped at 8th and main the usually go for one specific item.
  • At The Corner Store, people come here for new rare items that you cannot buy anywhere else.
  • At F as in Frank men know what they want to buy before the go in there. 


From my 4 interviews, I learned why people like to shop at these smaller boutique stores on Main St.The reason why people like to shop at these stores on Main St is that they like to:

  • Support the local businesses, even if it costs them more.
  • Also so they are able to buy unique clothes that you wouldn’t be able to buy anywhere else.
  • The quality of the material is better than most larger corporate clothing store.
  • Main Street has niche stores that fit exactly to their style (hipster).


Using sticky notes I was able to start realizing which features I would use on the shopmain website.

I would focus on returns, the checkout process, and product details. Returning an item bought online can be a hassle. Long checkout processes that don’t look trustworthy enough to put your credit card information in is a deterrent. Also when shopping online since you cannot physically feel the item, the product descriptions/images become very important, to convince shoppers to buy the clothing.


Photo: Highlighting key information gathered from interviews


I based a persona of the key characteristics and issues brought up in the affinity diagram. By defining his goals and fears/frustrations regarding shopping.


Photo: A User persona created from research gathered contextual inquiry and interviews

User Flow.

After knowing what my user would look like, and what his goals and frustrations are, I would start to layout how my user would navigate through the sites to achieve his goal of buying an item. By drawing it out could identify where I would put the features of my site.


Photo: User flow from homepage to checkout


When I began sketching, and designing I had a couple of guidelines I wanted to follow, which are:

  • Clarity — White Space.
  • Consistency — layout is the same, wish list feature and logo for stores are in the same spot.
  • Understand-ability — labels on each page so they know where they are.
  • Flexibility — Breadcrumbs, so the user can return to a previous screen

The Men’s clothing section I put new and sales items on top because people come to the sites to get what is new or to save money on a deal.



Photo: Category selection

The product page is where a shopper is interested enough to learn more about an item. The items will all have a product video showing it in motion and explaining the details/story of the item.


Photo: Product Page

I designed the Your Cart screen so that when people can start getting cold feet and want to abandon the cart they would see the 3 icons at the bottom: security, shipping, and returns(each have a pop up to explain each icon) to make help the user trust the site.


Photo: Check out page


As I was doing my tests I wasn’t getting very good results. But it wasn’t because of how my prototypes looked. It was because the tasks I was giving my users were too complicated. At first, I was telling them to buy a specific item, with a color and size, and the users were getting confused. So I changed it to be more of a general task. By giving the tester context as to why they are on the site and what they should be looking for, it was easier for them to relate to a user, therefore giving me more feedback.


This project was very difficult for me because of the time I had which was 2 weeks. For me, the hardest part of was doing user research. Because it required me to go out of my shell and interview, strangers which can be quite awkward. Also to get a paper prototype ASAP so you can start testing, and learning what does and doesn’t work about your site early on.

Get In Touch

Get In Touch.