The pandemic caused a seismic shift to online shopping. With its bricks and mortar stores quiet, Japan Centre became acutely aware of a reliance on an aged website built on bespoke architecture that was now difficult to maintain.
This specialist retailer of Asian groceries and lifestyle goods needed a solution that could keep pace with the changing landscape, addressing customer needs and new regulation for shipping food to their existing EU markets.
I was hired as the lead product designer to create the vision, help determine the technologies and deliver the designs for an e-commerce platform fit for the future.
The old site had evolved over many years and obtained a tired and cluttered look that did little to convey a compelling proposition of authentic Japanese produce.
Content was available in five languages, but few pages were fully translated from English.
Navigation was such that some content was not discoverable on mobile. Product categories were not always logical and popular blog content was hosted on a separate site, providing poor conversion for sales.
As this successful London based business had grown, so had the complexity of the underlying technical architecture. Japan Centre were now considering whether to continue maintaining their bespoke build or to replace it entirely.
The very open brief of “we need an updated website” needed to be translated into something more formal. I set about interviewing Japan Centre managerial staff to understand their challenges and to get their view of the customer – both existing and prospective.
I also wanted to know how they perceived their brand and what the core proposition was. Japanese groceries are increasingly available in the major supermarkets, so I felt a differentiation was necessary.
Interviews were recorded and transcribed with Otter.ai. I then noted the key themes that would require more research in the full discovery phase. From there I would be able to deliver a vision and a proposal for the new online shopping experience.
The discovery phase was fairly standard in terms of the research conducted and documentation produced. The client did not possess any personas or defined customer segmentation, so I recommended that we addressed this.
I also asked that they identified their direct competition, but made them aware that research could surface more (and it did). Competitor analysis was amongst the activities I conducted.
The existing site also underwent an heuristic usability study, which threw up many more questions. It became clear that much was restrained by back-end technology and back-of-house methodologies such as stock control or order fulfilment.
Working in partnership with Japan Centre’s Head of Digital, I also looked at the pros and cons of working with the existing technical architecture. We very soon came to the conclusion that replacement with SaaS products would allow Japan Centre to concentrate on what they do best rather than managing a cumbersome bespoke platform. From then on I was also involved in researching and vetting numerous third parties who could supply e-commerce platforms, search services, loyalty programmes and the like.
With COVID restrictions still in place all work was planned to be conducted remotely but I did manage a day in London visiting the Japan Centre stores and restaurants.
Competitor analysis.
Initially, the competitors were identified by the clients. As discovery progressed, the list expanded and the document was revisited. The analysis demonstrated both good and bad about each brand from the proposition, branding, UI and UX perspectives.
GA interrogation.
The existing website had been tagged to a certain extent and Google Analytics could provide general insights about traffic and shopping, but very little at page level. I don’t profess to being a GA genius, but got enough to build some early hypotheses.
I requested that we bring someone onto the team who could configure the site and GA to provide richer data.
Findings were summarised in a document as part of my stakeholder management process and formed the first step towards creating personas.
Customer survey.
I wrote a survey which went out to the Japan Centre subscriber base. This served a research purpose but also allowed the brand to seed the fact that a new website was on the way and the customers could help define it. The survey got over 2000 respondents.
SaaS investigations.
During discovery, the identification of the possible components of an e-commerce ecosystem was commenced. Japan Centre’s Head of Digital did most of the research and shortlisting, but called me in to discuss solutions with numerous suppliers and ultimately help make the decisions on who to select.
From an initial set of draft customer types I was able to identify a narrow set of four personas, of which I believed two were most important and the other two required further research.
I wrote up the two primary personas and shared these with the business, explaining their purpose in a customer-centric organisation and the part they would play in our design process. I also provided the drafts of the subsequent personas.
It was extremely pleasing to hear the personas being referenced by management throughout the project, as so often they are created and forgotten.
Along with the identified personas, I wrote a vision document. This articulated the strategic goals of the project, specifically around the proposition of the online brand and the experience pillars that the design should deliver to.
The internally-facing proposition was finessed over a few meetings with senior stakeholders. These sessions were held every two weeks and allowed for progress to be shared and key decisions to be made.
Designs started with pen on paper and drew on a combination of e-commerce best practice and the specific requirements of a multi-lingual audience seeking inspiration and specialist ingredients.
I brought in a visual designer and a front end developer to provide early input. We agreed to work on modular components, despite final decisions on the technical architecture having yet to be made.
A separate brief for a set of campaign pages on the existing site allowed us to see how far we could ‘push’ the design. Whilst the creative idea worked well, the existing tech architecture proved to be problematic for our front end ambitions. This was a good early learning.
I progressed the initial concepts to Adobe XD prototypes so that interaction and flow could be tested and demonstrated. Especially important was the navigation by various means through many categories, though part of the agreed plan was to rationalise a bloated catalogue structure.
When the prototype concepts and principles were broadly agreed, the specifications were formalised in wireframe documents.
Later prototypes used high fidelity layouts to test and demonstrate content design and distribution.
Annotated wireframes, visual layouts, an asset library and style guide formed the foundation for the front end build.
As part of the experience pillars that I had defined, Japanese authenticity was key. Our audience needed to know that they were buying genuine Japanese ingredients from a store that knew their noodles.
The experience would incorporate the blog content, previously exiled to a separate WordPress site, and would make much more of the huge inventory of recipes that were a magnet for internet traffic but rarely converted to sales.
I chose to place Japanese language at strategic positions on English pages. I also set a rule that all pages must be available in both English and Japanese. The previous experience had been very hit and miss for Japanese readers.
As part of this ‘authenticity’ drive, I requested a revision to the Japan Centre logo to include Japanese characters. It now says ‘Japan is here’.
The new Japan Centre website was fully launched in June 2022. Prior to that we made the site available to limited audiences, increasing the numbers in stages.
During the phased release we gathered user feedback, both through observation sessions and with the use of a prominent feedback form.
The June ‘22 release is considered the MVP as some features and content were descoped during build, but will be added in time.
The live site can be seen at
https://www.japancentre.com
