UX/UI Design

Web

Prototyping

Apr. 2024

DE JAPAN Redesign

A Japan proxy shopping service.

Duration

8 hours

My role

UX/UI Designer

Responsibility

UX/UI Design

Introduction

This is a design challenge intended as opportunity for myself to demonstrate my method and skills.
I will optimize the DE JAPAN proxy shopping platform website within the given timeframe.
Due to time constraints, this session will focus solely on optimizing the process of Submitting proxy purchase requests using product URLs.

Time Commitment

8 hours

Problem Statement

Design a better way for a first-time user who want to purchase J-POP albums or anime peripheral when using the DE JAPAN website.

My Approach

Heuristic Review

1/ Home Page

  • Aesthetic and minimalist design


    Double navigation bar with excessive action buttons, which may makes user feel dizzy and confused.

  • Aesthetic and minimalist design


    Search for products or pasting URLs should be the first action users take when they arrive at the website, but the search bar isn't highlighted especially beneath the yellow banner.

  • Help and document


    No prompt is displayed on the website to remind users that they can paste the URL directly into the search bar.

2/ Product Page

  • Aesthetic and minimalist design


    Poor text hierarchy, it’s hard to scan and generally read.

  • Aesthetic and minimalist design


    Poor presentation on product description and too much wasted white space

  • Consistency and standards


    The images, comment sections, and buttons all have different rounded corners, also there is a purple action btn that does not match the color scheme of the website, resulting in a cluttered appearance overall.

  • Help and document


    Without clear instruction, user may confused what is “Time Left”and “Used”mean

  • Match between system and the real world


    The translation feature on the website is great, but it would be even more user-friendly if it provided estimated prices in user country's currency.

3/ Shopping Cart Page

  • Aesthetic and minimalist design


    The display of each store's count contributes to clutter on the screen.

  • Aesthetic and minimalist design


    Too many action button which will make the user hard to focus on the goal

  • User control and freedom


    Users are unable to adjust the quantity and the option of the product directly. If a user wishes to decrease the quantity from 2 to 1, the only option is to remove the item entirely.

  • Match between system and the real world


    Would be even more user-friendly if it provided estimated prices in user country's currency.

4/ Checkout Page

  • Recognition rather than recall


    On this page, users cannot verify whether the selected products are correct. It would be better to display the product name and thumbnail here.

  • Consistency and standards


    The checkbox format for the payment method is different from others on the website.

  • Error prevention


    The proxy purchase service usually require two-stage charge, but there’s no related information on the page

  • Aesthetic and minimalist design


    Once again, there are numerous action buttons on this page, and the varying colors of the buttons make it difficult to discern the hierarchy.

Competitive Analysis

Observe how other competitors organize the product information on product page.

  • Both competitors require at least 4 steps to complete the purchase.

  • Buyee provides a more clearer shopping cart page

Ideate

Facilitate brainstorming sessions and translate the outcomes into sketches.

Final Design

1/ Home Page

  • Reduce excessive information and buttons, highlight the search bar to increase user focus

  • Re-organize the layout to let it looks more clear

  • Adjust the wording in the search bar to guide users take the action

2/ Product Page

  • Improve the hierarchy and information displayed on the page/ easier readability

  • Prevent various color of buttons, which makes the page more clearer

  • Provide the estimated USD dollars

  • Highlight the information user really care/ action btn we like user to take

3/ Shopping Cart Page

  • Reduce buttons to make it more cleaner and not cluttered

  • User can edit the quantity in the shopping cart

  • User can selects specific products to checkout, the rest would still remain in the shopping cart

4/ Checkout Page

  • Add the product information for confirmation

  • Standardize component styles to create a more cohesive layout

  • Provide payment information and remind the user that there may be two charges.

Prototype

If I have more time...

  • Conduct User Interview/ User Testing 


    Due to time constraints, the optimization content is based on my personal perspective. However, DE JAPAN's target audience consists mainly of users from Europe and the United States. Therefore, I hope to invite some locals from Europe and the United States to come for interviews and conduct user tests to see if the optimized version meets their shopping needs.

  • Optimize the entire homepage 


    As this challenge primarily focuses on optimizing the process of requesting proxy purchases using product links, I concentrated solely on the top half of the homepage. However, there are still many modules below the homepage that need optimization. I believe that by optimizing the homepage thoroughly, we can help users explore more themes and products.

  • Enhancing Functionality


    In the optimized version, I included estimated prices in different currencies. However, I overlooked adding an option for users to switch currencies during the design phase. If given more time, I would like to delve into each detail further and consider additional enhancements.

Thank you for reading through! ☺️

Feel free to reach out, I’d love to chat with you! :)

© Valerie Liu 2024 Copyright.

Feel free to reach out, I’d love to chat with you! :)

© Valerie Liu 2024 Copyright.

Feel free to reach out, I’d love to chat with you! :)

© Valerie Liu 2024 Copyright.