SlideShare verwendet Cookies, um die Funktionalität und Leistungsfähigkeit der Webseite zu verbessern und Ihnen relevante Werbung bereitzustellen. Wenn Sie diese Webseite weiter besuchen, erklären Sie sich mit der Verwendung von Cookies auf dieser Seite einverstanden. Lesen Sie bitte unsere Nutzervereinbarung und die Datenschutzrichtlinie.
SlideShare verwendet Cookies, um die Funktionalität und Leistungsfähigkeit der Webseite zu verbessern und Ihnen relevante Werbung bereitzustellen. Wenn Sie diese Webseite weiter besuchen, erklären Sie sich mit der Verwendung von Cookies auf dieser Seite einverstanden. Lesen Sie bitte unsere unsere Datenschutzrichtlinie und die Nutzervereinbarung.
Good morning, my name is Houteng from Novel & Chord. Today we’ll be presenting to you our proposed design for the new Kinokuniya responsive website. Through this redesign, we hope to increase sales and membership sign ups for Kinokuniya.
Our agenda for today focuses on how we streamline the book finding process and enhance the Kinokuniya Privilege Card Membership programmes.
Before we begin, let me introduce to you our consultancy, Novel and Chord.
We are user-centered rock stars made up of a team of books and music-loving individuals. Our creative consultancy helps companies conquer their online businesses through strategy, productivity, and authentic fun!
Our team of UX designers who will be collaborating with your developers is Si Liang, Yvonne, and I.
We’ve been awarded to work on projects including Toggle, Uniqlo, and Canadian Pizza and we’ll be delighted to work together with kinokuniya.
Let us look at the project brief.
The focus of our project is on these 3 key points. Streamlining the book finding process and make it easier for customers to navigate the website. Enhancing the appeal of the KPC membership programme. Improving the mobile & web usability.
At the start of the project, we conducted a competitive analysis to find out how kinokuniya compares with its competitors
Our competitors includes local bookstores and online competitors such as Popular bookstore, times, and Book Depository.
We compared Kinokuniya to its competitors base on Pricing, the books and products it offers, the size and scale of the bookstore, and the appeal of its membership programmes.
We found out that Kinokuniya stands out as it provides the widest selection of books in English, Chinese, French, German, and Japanese. It is also the best place to buy Japanese books, mangas, magazines, and stationeries. In addition, Kinokuniya is one of the largest bookstores in South-East Asia.
However, Kinokuniya cannot compete with pricing offered by its competitors. The membership programme is also not as appealing as Popular which is cheaper and more accessible since it has 27 stores islandwide. Through this redesign, we hope to level the playing field, to better compete with our competitors. With our enhanced membership programme, we can offer more discounts to match the prices of our competitors.
3:00 We conducted user research to find out more about customers’ needs.
For example, we spoke to customers at the store. We also did house visits to find out the books they like to buy.
Through this research we found out that Users love Kinokuniya. They are aware that it is the largest bookstore in South East Asia and has the widest selection of books. Most users love shopping at the physical store since they can read the books and browse on the shelves.
While the experience at the store is good, this is not the case when they shop online. For instance, they can’t read the content inside the book that they are intending to purchase. They also noted that there are less discounts online since they can’t use a physical voucher. The membership sign up process is also troublesome.
4:00 As customers are loyal to Kinokuniya, they may be converted into online customers. This can be done by providing value-added services that complements their offline experience. For example, we can provide customised book recommendations and book previews. The KPC membership sign up can also be simplified on the website.
We listed our various new features that we may include on the new website.
These features were arranged according to its business impact and whether it meets user needs.
They can be further split into 2 categories, book finding and membership enhancement features. We’ll elaborate more on them on the following pages.
5:00 First, Let me share about the features we are including on the website to streamline the book finding process.
On one hand, Kinokuniya wants to get more sales from online. On the other hand, customers want to find the books they like online. So for our website redesign, we try to meet both the business goals and user needs.
We drew out a customer journey map to illustrate the process of how a typical online customer uses the website.
While browsing for a book, users find that the site is difficult to browse and the website is over cluttered. Hence,
Our strategy is: To increase sales, we will provide customized book recommendations that help our online members browse and select the books that they like.
6:00 Several features were improved on our new website. For example, on the current website, users have to scroll down a list of main categories then access sub genres from these pages. Now, they can quickly look for these sub-genres from the mega menu
From research, most users say that the main reason they used the site, was to look for a specific book. Hence, in our redesign, we made the search bar more prominent by enlarging it and contrasting it against a dark coloured background.
Another enhancement we made was to provide visual search suggestions. Instead of having to look for the book on the search results page, we immediately provide a book cover to allow users to go directly to the product page. It is also easier for users who recognises books by its cover.
A highlight of our website is the new book preference customisation feature. Customers gets to pick the topics they are interested in so as to see recommended books on the homepage. Let me pass the time to Yvonne who will share with you about the enhanced membership features.7:12
Thank you! Next, Let me share to you how we can attract more users to sign up the membership.
On one hand, Kinokuniya wants to get more members through the online platform. While customers want to to get more discount through online. So we try to meet both the business goals and user needs in our new design.
Using the CJM shared by Houteng previously, I will be diving into the “add payment” section.
While users are making payment for their purchase, they feel that they can't use the physical voucher they had received on online purchases. There isn’t any other much additional useful privileges for the member. So with this...
Our strategy is: To increase membership card sign-ups, we will integrate a streamlined membership application process during online checkout for customers to get more discounts while making their purchases.
To improve on our online service, we represented it on the service design blueprint. As you can see...
Normally at the physical store, the sales assistant will ask for your membership card in order to give you the discount on your purchases. If you don’t have one, they will suggest that you can sign up for one. SO we replicated that in our proposed website by asking the online customer if they’ll like to sign up for the membership while they are making a purchase. And they could use the discounts immediately on the current order and no additional details needed to be filled in (for signed-in users)
This is how the page looks like for the membership information. Showing the comparison on the same page helps the decision-making easier for them. As they can visually see the breakdown and why they should join the membership.
So we are proposing these few new privileges to be added into the KPC membership. Number 1, Able to preview the content and chapter 1 of any books. 2. A credit point system for further discounts. And 3. birthday vouchers will be given out as a gift to them for their birthday month. This will also encourage the user to buy more books.
This is how the user can preview the book looks like on the website itself. They can browse through what are the content inside of the book and read it before deciding on purchasing the book.
Next we go on testing out our new and improved website design.
The tests were conducted face-to-face. Participants were asked to complete a series of routine tasks. These are the 4 main task assigned. 1,2,3,4. Through this 4 tasks we will be able to know how much improvement is being made Let me show you the breakdown result on the task 1.
On the completion successful rate: None of the users completed the task on the current website, while all our 6 users successfully completed the task on the new website
The average time taken to complete task 1 improved from 2:20 – 1:09
After each task, we asked them to rate on a scale of 1(very easy) – 5(very difficult) what they felt about the assigned tasks.
For More in-depth information can be found on our usability test report. Here you go.(give the report)
The new features that we included were well-received. These are some of the following comments given straight from our user. They like that the website informs them how much they can save by signing up for the membership and able to use the discount on the spot right after they sign up as a KPC member. Having recommendations on the home page also allows them to browse the books they like more convenience. While viewing the selected book, they can see the price straight away too. And lastly book preview feature allows them to read part of the book if they are unsure about buying it. In conclusion, our participants found the proposed Kinokuniya website to be well-organized, comprehensive, clean and uncluttered, very useful, and easy to use. They also felt the process was easy since it adopts a familiar e-commerce process. Next, let me pass on to Siliang who will be explaining and showing you the interactive prototype.
Through our redesign, We streamline the book finding process so that customers can find the books that they like. We enhance the membership programme to reward our loyal customers
Wide range of books is a huge draw to customers Being accessible online gives Kinokuniya a wider market Customers must be able to find what they want easily
If we are selected for this project this will be the projected timeline.We will be adopting an agile process by breaking up the 9 months into 3 epics and having 2 weeks per sprint. On the 1st 2 epic we will be focusing on the features we mentioned earlier
This is the amount of how much we will be charging
Based on the research done by the National Library Board in the year 2017,there are 5.6M singaporeans of which 19% read books. Out of the 19% 95% read physical books
Based on the 1.064M Singaporeans 53% of them bought the books from bookstore.out of the 53% of the users that purchase books from stores, 41% main source for finding a new book is via browsing online.
By raising awareness of the kinokuniya website in the physical bookstore coupled with a the revamped website, this is the estimated potential amount of new members for kinokuniya. Just a fraction of this community signing up for the membership and buying more books from kinokuniya will outweigh the cost of giving us the project. Are you ready to see a boom in business?
UX Case Study: Books Kinokuniya Responsive Web Redesign
Increasing Sales &
through Responsive Website Redesign
1. Project Brief
2. User Research
3. Streamlining the Book Finding Process
4. Enhancing Kinokuniya Privilege Card (KPC) Membership
5. Usability Test
6. Interactive Prototype
7. Plans & Schedule
User Interviews, Contextual Inquiry, and House Visits
Contextual inquiry – Speaking
House visits – Interview, Observing book
collections, user-testing of current site
Users love Kinokuniya
1. Largest bookstore in South-East Asia
a. Nice environment
2. Huge selection of books, especially foreign languages book
a. Japanese, French, German
b. Japanese Mangas & magazines
3. They love shopping at a physical store
a. Read books (as they are not wrapped)
b. Easy to browse on the shelves
1. Can't read the content inside the book
2. Less discounts online
a. Physical voucher can't be used on online payment
3. Messy layout, difficult to browse
4. Troublesome to sign up as member
Pain Points – Shopping online
1. Customers are loyal to Kinokuniya
a. May be converted into online customers
2. Value-added services
a. Offer customised book recommendations ⇒ More sales
b. Personalised recommendations at a later stage
c. Book previews ⇒ Do not need to read at the physical store
3. Simplified KPC membership Sign Up process
New Website Features
Key features in the website redesign
Content & Feature Prioritisation 20
● Customised book recommendations
by genres on homepage
● Image of the book cover in Search
● Easy navigation
● Loyalty points system
● Preview book contents and chapter one
● Online 20% discounts on books
● Ability to use gift vouchers on online
● Reviews from Goodread API
● Promoting events and activities
● Promote books through blog content
— Customised book
on home page
— Visual suggestions on the
— Easy navigation with mega-
— Integrated membership sign
— Book preview feature
— Loyalty points system
Book Finding Process
Increasing online sales
Kinokuniya wants to.. Customers wants to..
To increase membership card sign-ups,
we will integrate a streamlined membership
application process during online checkout
for customers to get more discounts
while making their purchases.
What users think of the new site
1. Using the navigation menu, search for an assigned book.
Next, check for the stock availability at the outlet
2. Using the search bar, look for the same book.
3. Place an order for the book.
4. From the home page, sign up for a membership.
43Task Completion Success Rate
Task 1: Find a Book using the Navigation Menu
Task 1: Find a Book using the Navigation Menu
Average Time Taken to
*Time taken to find the correct sub-genre
45Rating on Task
Task 1: Find a Book using the Navigation Menu
— Addition of the membership sign up in the checkout process
— Recommendations on the home page based on their book preferences
allows them to browse easily.
— Book preview feature is useful when a user is unsure about buying a
What Users Like Most
Projected Fees & Charges
3 x UX Designer $3500 x 3 9 Months
Projected Fees & Charges
19% Read Books
5.6 M Singaporeans 1.064 M Singaporeans
- Read Books
People who Read Books
1.064 M Singaporeans
- Read Physical Books
- Purchases from Bookstores
for books by
People who Buy Books
Potential Membership Sign Ups
— Improve usability
— Streamlining the book
— Easier for customers to
navigate the website
— Enhancing membership card