Kobo
A redesign of the user interface and user flow of the popular eBook and audiobook app.
TEAM
Independent Project
Role
Design Research, UI & UX Design
TimeLine
Nov - Dec 2021
Overview
Introduction
This project, the final assignment for the UI Design course at BrainStation, involved choosing the Kobo mobile application to redesign its user interface.
What is Kobo?
Kobo is a reading platform that offers a wide selection of e-books and audiobooks for users to access on their electronic devices.
Objective
The objective of the project was to enhance the app's user interface by applying the skills and knowledge acquired throughout the course. Additionally, I aimed to improve user flows and clarify the application's offerings for users seeking a comprehensive e-book and audiobook app.
Outcomes
A redesigned onboarding process to better showcase the app's key features, setting clear expectations.
Reorganizing the tab bar and redesigning the hierarchy helps users navigate the app more efficiently, while an updated visual style offers a more modern look.
Design Research
Competitor Analysis
A competitor analysis was conducted to better understand the e-book and audiobook market and gather insights into user expectations in terms of features and flows.
Additional Apps
Additional platforms were studied to gain insights into how content is organized when there is large number of content to choose from. For example, apps like Spotify were examined to see how users manage access to two different types of content (music and podcasts).
App Analysis
The app was reviewed in-depth through a heuristic review using Jakob Nielson's 10 general principles for interactive design. This approach helped identify areas for improvement and ensured that the redesign would align with industry standards.
Key Takeaways
More context should be provided for features to effectively communicate their value.
Offer personalization during onboarding to tailor content for users.
Ensure consistency with features shown online and make different subscription tiers visible.
Navigation Key Takeaways
Clarify the purpose of unclear sections in the app.
Could combine e-books and audiobooks into one library for simpler navigation.
Can increase customization options to include progress tracking and other relevant features.
App Store Reviews
Takeaways based on app store reviews to see how real users felt about the app.
Confusing Aspects
The application is difficult to navigate
Misunderstandings of how books can be purchased
Lacks User-Friendliness
Accessing various features are not very intuitive
Frustrations from unresponsiveness
Missing Features
Unable to search books based on author or certain genres
Book recommendations that are relevant to the user
Design Process
Information Architecture
Planning the information architecture visually allowed me to map out where to move or combine different features and as a reference for prioritizing redesigns within the project's scope. The goal was to make it easier for users to find what they are looking for by improving the app's navigation and organization.
Early Wireframes
Early ideations were explored through sketches and mid-fidelity wireframes of key screens. These helped to iterate on navigation and interactions, and refine the information architecture.
Moodboard
This moodboard was created with the goal of using imagery that evokes a nostalgic and warm feeling of a local bookshop inspired by copy on Kobo's website stating, 'Your favourite local bookshop.
Style Guide
This style guide introduces an updated color palette that revitalizes Kobo's current visual language.
Final Design
Kobo Redesign
Introducing Key Features
The redesigned onboarding process introduces users to personalization possibilities and the breadth of content available. This ensures users are immediately aware of the app's capabilities, setting the stage for a tailored and engaging experience from the start.
Subscriptions & User Preferences
The different subscription plans are outlined upfront. Users can choose their preferred genres, enabling the tailored recommendations.
Redesigned Tab Bar & Home Screen Customization
The tab bar has been redesigned for improved navigation efficiency. Users can also reorganize their Home Screen according to their usage patterns.
Combined eBook & Audiobook Library
Users can now effortlessly switch between their eBooks, audiobooks, and collections in a unified library interface. Simplifying navigation and reducing the cognitive load, making it easier for users to manage and access their content.
Easier to Find & Choose Books
A new grid view showcases book covers, enabling users to visually sift through titles more easily. Accompanied by personalized book lists, this design enhances discoverability and ensures users can find books that cater to their tastes with minimal effort.
Key information about books is displayed above the fold, including a clear indication that books cannot be directly purchased in the app. This transparency eliminates confusion and helps set accurate expectations for the purchasing process.
Search & Profile
An updated search that allows users to search titles and authors.
The profile design is a quick concept where users can follow each other, view the books they are currently reading, share goals and awards, and more.