An international bookstore website provides online and offline shopping
This project focuses on improving the user experience when using the Kinokuniya bookstore website. According to different research method, we redesigned the website and present the result in wireframe.
Kinokuniya is a Japanese-based retailer known for its collection of books and magazines, along with gifts and stationery items, Japanese Books, and English Books. Established in 1972 in Japan, it now has over 80 stores and 35 sales office locations worldwide, including Australia, Singapore, Malaysia, Taiwan, Thailand, Indonesia, Myanmar, Cambodia, United Arab Emirates, and the United States (US).
3 members' team project
As an international bookstore in America, Kinokuniya has to compete with local American bookstores. For this project, we will narrow our scope to only the website for US customers. Our target group is people in America who like to purchase books via online bookstore websites.
RESEARCH METHODS & TIMELINE
We selected Amazon, Barnes & Noble, Books-A-Million, and Book Depository as our competitor websites where people can buy books online as competitors.
We mainly focused on three parts: Information architecture, website content, and visual design.
In information architecture: We discuss their organization, labeling, navigation, and search systems. For the search system, we believe it is important for a book website to provide a logical presentation of results and recommend relevant results. A search autocomplete feature can also save users time and effort to type a book’s name.
In website content: The data of overview (book summary) and editorial reviews are a special feature for the book website because it provides users inference to buy a book or not if they do not have a specific preference. Furthermore, users can use a filter function first and then use a sorting function to help them make a decision.
In visual design: Since bookstore websites comprise a lot of information, how to arrange the website’s aesthetics with a clean look and feel, logical layout, and with readability are quite significant in the visual design section.
This table shows the results of the analysis. For more details, please check.
The purpose of a content inventory is to produce a listing of the website’s content to give us a) a system for managing the content we need in the redesign and b) bringing awareness of the full extent of the website’s content.
To see more details of content inventory, please check.
Through conducting the content inventory, we gained a better understanding of the information architecture and hierarchical structure of Kinokuniya’s US website. It helped us assess what kind of content (and how much) we had to work with for the redesign. In addition to having a clear visual of the website’s structure, we uncovered: broken links, links that lead to the same page but have different labels, links that lead to blank search results, and search results that do not match link labels. Mostly, this content inventory helped us assess Kinokuniya’s book subject categories and we used this later on for our card sorting.
We conducted two in-person card sorting sessions to help us infer the most natural organization of book subject categories (main category and sub-category)
The first card sorting group consisted of three people, while the second group was made of five. We conducted an open card sorting to see which subjects card sorting participants would choose and the main label and which would be sub-categorized. We printed out each subject label on a card and ask participants to first group the cards together as they saw relevant and then choose a card within a group as the main subject category. They were also allowed to discard cards, but they had to provide their reasoning (e.g. too vague, redundant, etc.)
After compiling the results and our notes from the two card sorting sessions, we compiled a list of cards (subject categories) that participants found confusing, questionable, vague, or difficult to categorize.
New category Creation
In order to create and finalize our subject labels and categorization, we compared results from the card sorting sessions against our competitors’ categories. If we noticed that a majority of our competitors labeled/categorized a subject a particular way, and input from our card sorts were congruent, we change the category label. We also eliminated subject sub-categories that displayed that displayed zero books (e.g. Languages > German). Sub-categories that displayed fewer than five books results, we merged into larger sub-categories (e.g. Languages > Thai → Languages > Other).
We conducted usability tests in order to better understand how users interact and accomplish key tasks on Kinokuniya’s website and use these finding to inform and guide our redesign.
Participants & Method
We conducted five usability tests across five participants. Three participants were male and two were female. They ranged in age from 23 to 30 years old. Each usability test consisted of five tasks that tested the usability of key areas of Kinokuniya’s website. We focused mainly on usability issues with information recognition, retrieval, and search results. On average participants took an hour to complete the test. As participants completed a task, we asked them to rate the difficulty of the task on a Likert scale from one to five and provide an explanation of why they chose the rating.
Results, Analysis, & Recommendations
System Usability Scale (SUS) Results
The results from our SUS show that Kinokuniya’s website received failing scores from four out of five test participants. This means that the website’s usability is below average.
We conducted a heuristic evaluation to identify broader usability issues with Kinokuniya’s website since there would have been too many to conduct usability tests.
Findings & Recommendations
Severity level: Sev1 indicates problems that have to be solved, and Sev4 indicates minor problems.
Based on our card sorting, we applied new categories in website navigation. Furthermore, we revised the usability problems collected from usability test and severity level 1 and 2 problems in heuristic evaluation then redesign the website layout. The wireframe helps us focus on the information architecture of the websites.
What I learned?
Card sorting can examine information architecture.
Card sorting is a useful method to examine the information architecture. It helped us to understand what the users think about the categories make sense to them, and which are questionable one we should redesign and which are fine we can keep it.
Content inventory will be more useful when the detail is specific.
The content inventory provided us more detail than general information architecture in this project. It might provide us more information if the URL is different. However, it still facilitated our speed when we discussed redesign the new categories.
Competitors are good referring examples.
Since the bookstore has various and complicated categories, it was hard for us to understand all of them. The competitors provided us a good insight when we met difficulties in making decisions.