Muji Back to School Microsite
The Prompt
To create a Muji microsite that caters to the Back to School customer.
This Tablet version of the site that I designed showcases a few select back to school items.
Existing User Flow
Understanding the current path that the user takes toward identifying a product, creating an account and checking out was the first step in the process
Information Architecture
Card Sorting with four users helped me arrive at the Information Architecture represented in this Site Map.
Initial sketches
Designing with Mobile first was easy and set the stage for Tablet and Desktop Designs
Annotated WirEframes
Mockup: Homepage
Kept it simple with only one product (as part of a carousel) that was visible above the fold.
Deliverable: Clickable prototype.
Mobile Checkout: Billing
Keeping the user informed on the step they are at is critical. A clear and uncluttered interface allows the user to easily add their billing information.
Mobile Checkout: Review & Place Order
This page highlights the product that the user selected: offers easy navigation, clear description (including price and shipping), ability to change the quantity and place order.
Mobile Checkout: Confirmation
The Confirmation Page tells the user that the checkout process is compete and suggests other products that they may be interested in - based on their browsing history.
Deliverable: Clickable prototype.
MUJI Store
Design Choices
I tried to be as close to the Muji aesthetic as possible in my design choices: bare bones simplicity and a restricted color palette.