Paving the way for a buyer-centric shopping experience

Japan’s largest online mall was merchant-centric as they defined their core user group as their merchants (who purchased advertisements) rather than the shoppers.

As a Creative Web Director, I collaborated closely with producers and inspired fellow directors to shift the focus; to engage the real audience — the shoppers.

Leading by example

The standard for featured genre pages in Japan’s massive online mall was to merely display a grid of products without much context. To challenge this status quo, I collaborated closely with producers to:

  • bring focus and purpose to the page by defining a narrower audience, the tone of language, content and visual direction;
  • direct user flow, to better reflect buyers’ shopping mindsets and help make purchase decisions;
  • specify the mobile experience to follow closely to that of the desktop experience; and
  • spread design thinking and inspire other directors and producers to place buyers at the centre of design.

Helping shoppers make purchase decisions

Prior to collaboration, clicking on a product on a feature page took users to search results using the product name as the keyword, which meant users would be faced with thousands of merchant results but no further information on the product. Instead, we started to make sure that clicking on a product takes users to the product description followed by a list of online shops within its mall that it can be purchased from.

To help reduce the dilemma of choice that is apparent in a massive online mall, a select few recommended products were featured on campaign pages along with their unique characteristics to help with decision making.

Inclusion of mobile users

The mall's mobile content consisted of a single list of products on sale regardless of what the desktop counterpart displayed. In order to enable mobile users to engage in the same way as desktop users, mobile pages were designed to mirror its desktop counterpart.

To make this happen, detailed coding briefs were shared with developers to communicate how each element shall translate to mobile devices. The coding brief also included granular front-end specifications so that future editing of content would not require a designer and coder.  (e.g. avoiding text and buttons as images, separating the background from the foreground, avoiding inline styling.)

This paved way for templating, and enabled serialisation of featured and topical pages.

Spreading the trend

In order to not affect the normal operations of the web department, all projects were completed in a normal 2-week campaign page creation cycle that usually only require product item updates.  The process and outcome were featured in director meetings to educate and continue the trend of putting the buyers at the centre of designs.

Different product categories were owned by different producers.  To spread design thinking, I collaborated with many producers owning various categories.  Getting projects featured in producer meetings raised other producers’ expectations about their future projects, and inspired fellow directors to create feature pages that engage customers through the use of strategic content and layouts.

Through close collaboration with immediate team members and leading the broader team by example, the mindset of directors and producers shifted from making pages in order to sell advertisement space, to crafting informative pages that help buyers make purchasing decisions.