Background

Pinkoi.com was established in 2012; since then, there was no major revision about the shop page where the brand's designer can curate their product. In other words, this shop page was out of fashion and can't meet customers' needs nowadays.

Problem

Through user research and data analysis, we found three significant issues with the shop page:

😡 Information architecture is messy; users can't find where they can contact the designer, and very hard to browse the designer's products with the filter function.

🤔 Users consider the shop page as product racks instead of a brand shop because the designer had limited space to display the brand concept & story, both text and visual.

🚨 As a landing page of Pinkoi, the shop page's bounce rate was not as good as other landing pages.

Goal

Following the problems we found, we set 3 goals for this project. By achieving these goals, we can provide a pleasant & shiny shop page that can meet customers' and designers' needs.

1. Decrease bounce rate by providing a more attractive and organized shopfront layout.

2. Increase the user interaction with the shop page, for example, more "follow the brand" actions.

3. Improve the usability of browsing products and acquire information about the brand.

Progress

For Project

I set 5 2-week sprints (sometimes three weeks) to make five releases. Each sprint focus on 1-2 specific feature releases or iterations. Using these methods, we can acquire feedback from actual users as soon as possible and make revisions based on the input.

For Design

In the ideation phase, I developed several design proposals with different strategies. I printed them out and stuck them on the hallway wall to obtain feedback from internal. Then I held a simple user interview to test which approach might work.

Based on the feedback and test results from the previous stage, I focus on one specific strategy to design the detail. Then I collaborated with developers to build the interactive prototypes for tests & minor iterations until the deliverables' quality was met.

Solution

1. Visual element with a large area.

Container width shop banner was introduced. Also, we enlarged the image size of each product. To make the customers feel the ascetics of the brand when they enter the page, we increase white space on the shop pages, making the visual popup.

2. Information rearrangement.

The information was placed to meet customer's needs: Shop & designer information first, then sales campaign information and highlight products curated by designers, finally the whole items with filer functions, just like the offline shopping experience.

Outcome/ Result

The shop page redesign has had a positive impact on customer experience and lets designers control their shop page.

📈 The Shop page bounce rate decreased by 25%, and the exit rate decreased by 38%.

📈 User interaction with shop pages (follow the brand, contact designer, browsing products) increase 120%

Lesson Learned

There was a big crisis that happened when we shipped sprint 2 iterations. In sprint 2, we launched the major shop page layout revision, and it turned out we received quite an amount of negative feedback from designers, mainly complaining about they don't like the layout.

Besides a little bit of frustration, we dig into the negative feedback to find real insight into the feedback very quickly. We found that designers did not consider the layout awful; they just thought the change was not enough to meet their needs; they want to show more visuals and need time to adopt the changes.

To respond to the conditions, we quickly changed the plan, and focus on delivering more visual element ratio on pages in the next sprint. After following iterations, we stopped the negatives feedbacks successfully and learned a lot from the failure.