Case Study Overview
Rye 51 is a men’s fine clothing retailer, that currently has a limited selection
of footwear to pair with their clothing lines. Johnston & Murphy is primarily
a men’s fine shoe producer. We believe there is space for these two
companies to work hand in had to provide customers with a complete
online clothing experience.
Marketing Rationale
Rye 51 is a men’s fine clothing retailer, that currently has a limited selection of footwear to pair with their clothing lines. Johnston & Murphy is primarily a men’s fine shoe producer that currently has a limited clothing line. While on some levels both companies are competitors we believe there is space for these two companies to work hand in had to provide customers with a complete online clothing experience.
Our solution is to create a micro site that exclusively offers Johnston & Murphy shoe lines that are perfectly pared to match the clothing selected on the Rye 51 website.
Persona: Blake
Needs
- Confidence in product inventory
- Regularly updated inventory
- Fast shipping
- Able to purchase from mobile
- Able to submit product reviews
Pain Points
- Poorly-written website copy
- Too little choice of retro stuff
- Lengthy checkout process
- Services that don’t work on mobile
Opportunities
- Characterful copy writing
- Efficient checkout process
- Responsive website
Scenario
Blake has limited time to shop online and needs the ability to put together complete casual attire quickly. Having a single source to buy custom paired clothing and footwear to match will save Blake precious time.
Competitive & Comparative Analysis
Summary
After conducting the C & C analysis it became clear that a variety of categories were needed as well as guest checkout and suggested item carousels.
1st Semi Open Card Sort
5 basic shoe categories were provided: Sneakers, Boots, Loafers, Dress & Casual. Participants were asked to create categories if necessary.
Default Setup 
2nd Closed Card Sort
5 basic shoe categories were provided along with several subcategories listed below. Changes were made through out the experiment based on user feedback.
Default Setup 
Card Sort Summary
After the initial round of card sorting, several sub categories were added. During the second round, adjustments were made in between each user. The main categories were reordered and several sub categories were eliminated. The result is the card sort below.
Site Map
User Flow
Home Page Wireframe
1
2
3
4
5
6
1
Main navigation that features drop downs for subcategories.
2
Shopping cart icon with drop down options.
3
Hero slider showing featured items.
4
Clickable product images that represent the 3 top categories.
5
Featured product section with write up and button linking to featured product.
6
Carousel of new products.
Category Page Wireframe
1
2
3
4
5
1
Header image.
2
Size, width and sort filters.
3
Clickable product image.
4
Clickable product title, description and price.
5
Clickable star rating that opens a list of ratings in a lightbox container.
Product Page Wireframe
1
2
3
4
5
6
7
8
1
Product image and with additional thumbnails below.
2
Product title and description.
3
Clickable star rating that opens a list of ratings in a lightbox container.
4
Product filters including color, shoe size and width.
5
Clickable add to bag (add to cart) button.
6
Add item to wish list.
7
Carousel of suggested products.
8
Detailed product description.
Sign In Page Wireframe
1
2
1
Sign in option.
2
Guest checkout option.
My Bag Page Wireframe
1
2
3
4
5
6
7
1
Product image.
2
Product description.
3
Quantity selection.
4
Product price.
5
Edit, remove links.
6
Continue Shopping / Checkout.
7
Recommended products.
Checkout Page Wireframe
1
2
3
4
5
6
1
Billing form.
2
Delivery form.
3
Product image.
4
Shipping options.
5
Credit card form.
6
Place order button.
Wish List Page Wireframe
1
2
3
4
5
6
1
Product image.
2
Product description.
3
Quantity selection.
4
Product price.
5
Edit, remove links.
6
Add to bag button.
My Orders Page Wireframe
1
2
4
1
Product image.
2
Product description.
3
Quantity selection.
4
Product price.
1st Round Usability Test
Users were asked to select a shoe and follow through to checkout. Following each test, users were asked if any improvements could be made.
Summary
After conducting the first round of usability testing the following changes were made:
- Continue shopping button added to the shopping cart page.
- “Your order is complete” confirmation added after user clicks Place Order button on the checkout page
- Return to shop button added to the confirmation message on the checkout page.
2nd Round Usability Test
Users were asked to select a shoe and follow through to checkout. Following each test, users were asked if any improvements could be made.
Summary
After conducting the second round of usability testing the following changes were suggested:
- Add chat function
- Convert sign in page to pop up window
- Add PayPal and Apple Pay options to expedite checkout.
Next Steps
Production of full fidelity mock-ups.
Thank You For Viewing!