NEVER PAY FULL PRICE

INTRODUCTION

WWKB is an online store and brand directory. With the ever-growing number of brands and products in the online retail space, consumers should be properly informed and educated about the brands and products that they buy.

HMW STATEMENT

How might we help people who love online shopping to find the best deals?

CHALLENGE

The company needs to design and build the website to create an engaging user experience while maintaining an aesthetically clean look. The challenges include:
1. Construct the information architecture to help users find the information and complete the tasks
2. Test and create cross-platform navigation hand gestures
3. Design the website in a grid layout across all platforms

  • DATE:
    Mar 2018 - MAR 2018
  • ROLE:
    UX/UI DESIGNER
  • CLIENT:
    PERSONAL PROJECT
  • CODED LANDING PAGE

    DESIGN GOALS

    Users can easily find deals without stress

    Users should feel a sense of trust while browsing the site

    Smooth & easy keyboard and hand interaction

    SOLUTIONS

    1. Use card-sorting to create easy to navigate information architecture
    2. Analyze competitors to gain insight into the brand advantages
    3. Use rapid user testing and prototypes to create smooth interactions
    4. Conduct user interviews and observe user interactions with the site to define and improve the usability of the website

    My Design Process

    MISSION

    Unlike most deal/coupon/cashback sites, our mission is to educate consumers about the brands and products that they buy, and provide them the best deals available. In addition, the users will accumulate points and get additional discounts on the next purchases.

    COMPETITIVE ANALYSIS

    TARGET AUDIENCE

    Primary Target Audience: 18 - 40 years old, higher educated.
    Secondary Target Audience: 40 - 60 years old, mid - high educated.

    USER EMPATHY MAP

    Competitor Analysis and User Needs Key Findings:


    PERSONAS


    JACK

    21 Years Old

    College Student

    ABOUT:

    I am a shoe lover! I want to find the best deals.

    BIO:

    Jack is a college student who lives a lone in San Francisco. He has a tight budget to buy his needs. He loves online shopping because it is convenient and easy to find great deals.

    PAIN POINT:

    - Many coupon codes do not work
    - Takes too much time to find a coupon code

    DEVICE:



    ACTIVITY:

    Shoes

    Electronics






    Lisa

    31 Years Old

    Graphic Designer

    ABOUT:

    I love shopping! I want to go to one place to find the best deals. .

    BIO:

    Lisa is a graphic designer who works at a small company in Mountain View. She loves shopping both in-store and online. She thinks shopping is a great way to reduce her stress, so she spends a lot of time browsing on the e-commerce site.

    PAIN POINT:

    - Coupon code does not work, but I still make the purchase anyway
    - Doesn’t want to spent too much time looking for deals all over the place. Would love to go to one place to find the deals

    DEVICE:



    ACTIVITY:

    Fashion

    Home Goods

    CARD SORT



    Card Sort Key Findings:


    • Users report that they do not need to have a clear goal to browse the site. The good deals will excite them alone the way.
    • Best deals are the first thing users want to see.
    • Users are used to have the category main navigation on the top.
    • Costumed Deals will excite the user individually.

    SITE MAP

    I took the insight from the card sort, and create the site map.

    WIREFRAME SKETCH

    WIREFRAME

    MOODBOARD


    Yellow is considered the brightest and most energizing of the warm colors. It’s associated with happiness and sunshine. Yellow can also be associated with deceit and cowardice. I picked yellow to create the atmosphere of yelling the sales to the crowds.
    Green is related to wealth, stability, renewal, and nature. I choose green as the button color to send the message of browser security and we will help the users save money.


    LOGO


    COLOR & TYPOGRAPHY

    UI KIT

    GRID LAYOUT


    PLATFORM HAND GESTURE TESTING

    Card Sort Key Findings:


    • Users respond more positively when swiping left to right while browsing the site on an Ipad, with the screen displayed in landscape.

    USER TESTING

    Tester Name: Jan

    Date: 05/20/2017

    Task: Find deals that you like and apply the discount or coupon to your purchase

    • What is your rating for this experience?
    • Which category interest you the most?
    • Do you think the navigation links on homepage helped you complete your task?
    • What suggestions do you have?

    Feedback & Suggestions:

    The home screen navigation is easy to use. I like the endless scroll button to navigate through all the deals. It somehow helps me reduce the stress while I scroll it. I like the categories of Kevin’s Choice, it makes me feel like the deals were chosen by real people.






    Tester Name: Lucy

    Date: 06/14/2017

    Task: Shop on tablet devices.

    • What is your rating for this experience?
    • Which category interests you the most?
    • Do you prefer having endless deals on the main page or categorized navigation?
    • What suggestions do you have?

    Feedback & Suggestions:

    I prefer just simple endless scrolling on the home page only. I few that I have less stress just scrolling to see other deals, and I would like to scroll the site with no purchase needs, just to preview deals.

    USER JOURNEY MAP




    THANKS FOR WATCHING