Copy of Xion.Store

Xion.Store

Xion Project Overview  Dark Grayish blue.png
 

Project Brief

Xion.Store Utah based startup company currently undergoing growth. The company operates an eCommerce website in which local bike shops can sell their products, similar to how Amazon's business model is structured. During the briefing with the CEO of the company, he informed me that he would like particular attention devoted to helping first customers understand what the Xion website is all about. He mentioned that many people don't realize they are buying from brick and mortar bike shops. The rest of the project he left up to me to discover things that were problematic.

My Approach

It was very important to be careful to only chip away on at things I thought were necessary for improving the user's experience while at the same time realizing the the stakeholder's goal. It was important to allow users to reveal the flaws in the design by instructing them to perform tasks and studying where their greatest difficulties sprang from, then make iterations based off those findings.

Checkout Form

ORIGINAL

REVISION

1) Xion buyer protection seal is better situated next to the credit card information. 2) Users could not figure out how to remove an item after it was placed in the cart. 3) Quantity of items were not adjustable. 4) Studies show that credit card information placed on a banner with a darker background makes people feel safer.

ORIGINAL

REVISION

1) Local Bike Shops carousel adds to an overcrowded look and is unnecessary. 2) Multiple users commented that the blurry video thumbnail seemed out of placed. To reduce it's distraction and improve aesthetics I designed an invisible thumbnail. 

 

1) Moving words were originally placed next to the search bar. The area was so small that it was easy for it to go unnoticed. 2) The main image needed to be replaced by a larger hero image to create an open space to reduce the overcrowded look and provide a place to put important information. 3) Poor quality images needed to be replaced with higher quality. 4) The title "Learn" was unclear needing an alternative description.

REVISION

ORIGINAL

1) Users found that highlighting information contained within each word category made it easier to track. 2) Users were confused as to why the word "All" was located in two different spots but performed different task. I replaced one of them with the more descriptive term "Category".

Visual Design

Creating a larger hero image helped the website appear less crowded and provided a place where important messages are easily noticed, where eyes can readily detect movement. An about us section was moved to a more common location as well as a section were people can find participating xion.store retailers.

Xion psd mockup 1.png

Learnings

Competitive analysis can be critically important when trying to discover flaws in a design. Studying the layout of multiple designs provided inspiration and insights that would otherwise go unnoticed.  I also devoted a significant amount of time studying UX articles on how to improve eCommerce layouts. Studying UX research while conducting my own research helped improve the ideation process .