Your Time 

Role

Your Time is a self-assigned project undertaken to gain a better knowledge of eCommerce design and to work through a design iterations quickly in an effort to push my design process tempo and create what could be a Minimum Viable Product.

challenge

Design a responsive eCommerce experience that works across devices.

 

Your Time quick user flow

Foundation and Approach 

Online stores exist for everything. Being able to design an elegant shopping experience that works well on all devices can increase sales and set your company ahead of its competitors. 

Your Time is a responsive, mobile-ready eCommerce shop that welcomes browsing, provides a highly curated selection of products, and allows for easy ordering.

 

Logo and Color Palette

Research

Competitive analysis of various eCommerce sites provided me with an opportunity to determine how to position Your Time in terms of product selection and display. It also allowed me to pinpoint my primary audience and target market by price point and product range. Analyzing competitors also helped me to identify areas of design and layout that I could leverage to differentiate Your Time.

 

Landing page wireframe

Browsing wireframe

Product wireframe

Design Development

In an effort to push the tempo of the design process, I decided to create a minimum viable product. I did so by identifying "must have" features and taking a hard look at "nice to have" features to determine if they would add substantially to the ability of Your Time to deliver an elegant and responsive shopping experience.

"Must have" Features include:

  • A Home Page

  • Search functionality

  • Browse View

  • Product View

  • Shopping Cart and Checkout

  • Basic Account Creation

  • Contact

  • About

"Nice to have" Features include:

  • Ratings and customer reviews - require active monitoring to ensure content is appropriate.

  • Quick view - added level of functionality that many have come to expect when browsing an eCommerce site.

  • Social media shares - right on the cusp of "must have". Allowing visitors to share to social media is generally going to benefit the site.

  • FAQ - really only necessary as a site develops (but if people have to ask a question frequently, perhaps the functionality of the site isn't as good as it should be?

  • View similar/related products - helps to keep people interested if they don't see exactly what they want.

 

Mobile and desktop landing page mockups

Mock Ups 

One of the key factors that will make or break Your Time as an successful retailer will be a mobile-ready and responsive design. Keeping with the theme of rapid development and prototyping, I worked in Sketch to flesh out my wireframes into mock ups. I feel strongly that the design of Your Time, and any eCommerce site for the matter, benefits from cutting out the noise as much as possible. Keep the focus on the products and don't force the branding. With Your Time, I rely on a flat and somewhat dusty, muted color palette in an effort to keep the site in the background and let the product images pop.

 

Interaction mockup

Interaction Design

One of the main points of frustration with eCommerce is product selection. More often than not, there is little attention drawn to input that is required by the user. Examples include size, color, or quantity. With Your Time, I explored a variety of solutions for this issue.

One solution is to grey out the "Add to Cart" button which should help to draw the user's attention to the selections that they are required to make. Another solution is to add an intermediate step where the user is presented with an additional screen or overlay which prompts them to make necessary selections. Or use a combination of both, as seen here.