Party Supplies E-commerce — UX Case Study

Challenge

The Business

Brief

  • Showcase highly-curated products
  • Focus on hand-picked quality over quantity
  • Maintaining its brand image and ‘small shop’ appeal
  • Great customer service
  • Brand personality playful, bright, friendly, affordable, informal

User Research

Contextual Inquiry

Party Party — London, E8 2NP

Insights

  • Most shoppers were locals
  • Products were arranged in clear categories in their aisles
  • Staff were attentive and ready to help out
  • Last-minute shopping — for events happening on the day to 1weeks time
  • The convenience of buying in person, it is instant
  • Reasonable pricing
  • A wide selection of products & availability
  • Dealing with shipping delays & returns is not ideal
  • Quality issues — in stores you get what you see, unlike online
  • Lack of stock or sizes available in stores
Quotes from user interviews

Competitive Analysis

ATG — Competitive Analysis

Insights

  • Improvement of the navigation system, flexibility and ease of use
  • Logistics — Offering fast deliveries, collection in stores and free returns
  • Building on their ‘small-shop’ brand image and appeal
  • Offering a relevant amount of information on products online eg. more photos and details

The Opportunity

  • Focusing on user-centred design methods
  • With a focus on great customer service

Solving the Problem

JTBD Framework

Job Statement

User Flow — Happy Path

User Journey

Information Architecture

A user card sorting

Open Card-Sorting

  • 42 unique categories were created!
  • I was able to narrow it down to 8

Closed Card-Sorting

  • 8 categories given to users
  • I narrowed this down further to 6 categories

Site Map

ATG — Site Map

The Solution

Sketches for Ideation

Ideation

Key features

  • Top navigation bar —which will appear constant on every page
  • Search bar
  • Logo & about section — for the user to get to know more about the business
  • Product categories — including a new in or popular section
  • Cart
  • User details — Log in / Register
  • Footer — including contact details, help section, FAQ and t&c’s, appearing on every page to ease navigation

Prototyping

Paper Prototype

ATG Paper Prototype — home, home with top nav, browse, product, cart, check out

Usability Testing

Usability Testing — Paper Prototype

Insights

  • 5/5 found it easy and straightforward to find a product and purchase it
  • 3/5 found the check out page slightly confusing, the order is not right
  • 4/5 wanted to see a confirmation once the purchase was made.

Wireframes

Iterations

Insights key:

  • Green — positive
  • Red — problem (to change)

Home page

Wireframe iterations — Home page

Product Description page

Wireframe iterations — Product description page

Check Out page

Wireframe iterations — Check out page

Prototype

Hi-fidelity

ATG — Hi-fi prototype in motion
ATG — Hi-fi prototype

Next Steps

  • Focusing on higher fidelity prototype, adding UI elements to effectively showcase brand values, through the use of colour, imagery and copy
  • Usability testing with party store customers and conducting surveys to measure success and points for improvement in further iterations
  • Think about how this desktop design may look like on other devices. eg mobile or tablet, as the number of users shopping through these devices, are continuously growing

Learnings

  • I started this project assuming that it would be a breeze, as I have experience working at multiple e-commerce businesses, however, I was very wrong and it was a lot more complex than I originally thought!
  • Good navigation is well thought through and a very difficult job. Doing the card sorting exercises made me realise how differently people choose to categorize things and this is such a big consideration when building the structure of the website, the sitemap.
  • Good design is good business — it is so important that an e-commerce website works VERY well (also, Thomas Watson)

--

--

--

👩🏽‍💻 Product Designer → kikilena.com

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

A multi-store online store like Amazon

Designers & Agency Owners: Why You Should Learn Facebook Advertising. Now.

3D Wing Filter with animation/ Butterfly Wings Best Instagram Filter

Meme analysis but this time I made it myself

What ‘Space’ in your home defines your happiness?

Redesign Rakuten Mobile Apps - UX Case Study

DESIGN GUIDE PART 2: Framework & Layouts

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Kiki Wellenhofer

Kiki Wellenhofer

👩🏽‍💻 Product Designer → kikilena.com

More from Medium

A boring registration process (an award-winning UX case study)

UX Case Study: Changing Patients’ Behavior via AMAZE

Four screens of AMAZE sign in process

UX Case Study — Creating seamless flow for collecting task and seeing announcement on COMPFEST 13…

Doctar - UX Strategy