Duration
2 monthsYear
2024Responsibilities
ResearchDeliverables
PersonasThe Opportunity
Designing for a new audience
In the fall of 2024, I had the opportunity to spend a semester abroad. I packed my bags and traveled to Stuttgart, Germany, where I immersed myself in UX and UI design. This project was created as part of the Interaction Design course, where we worked in pairs following the design thinking process. The task was to design an audiobook app for a public library, targeting a user group of our choice. I chose seniors (65+) and focused on making the app visually appealing, user-friendly, and well-adapted to their needs in terms of UX and UI.
Why Seniors?
Our society is becoming more digital, which can leave older people behind. Weak contrasts, small text, and unclear information make digital tools hard to use. For many seniors, this means they can't use them at all. Digital exclusion often leads to social isolation, which can result in loneliness. But tales are something everyone enjoys. Many older people love reading physical books, but over time, their eyesight may weaken, or holding a book may become tiring. A simple and accessible audiobook app designed for their needs could help them continue enjoying tales — in a way that works for them.
The Requirements of a Public Library App
Similarly to how there is a distinction between bookshops and libraries, there is a difference between commercial apps and public library apps. First of all, library audiobook apps are free since they're publicly funded, unlike commercial apps that require a subscription. But there's a catch, libraries have a limited number of copies, so you might have to wait your turn and return the book after a set period. Another big difference is the selection. Libraries offer a wider mix, including non-fiction and classics, while commercial apps tend to focus on the latest bestsellers and popular titles.
Final Prototype
How to make the most impact
Due to time constraints of the course, I chose to focus on a single user flow and selected the flow where the design would make the most significant impact on our target audience. The entire app has been designed with clarity as the main priority. To ensure accessibility, I used a high-contrast color palette. The language is kept simple and guiding, complemented by clear, easy-to-read fonts.
The Library
In the user's "Library", they can see their current listening progress and organize books into personal shelves. Some shelves are automatically generated to help users keep track of books with expiring loan licenses, books in the waiting list, and books they have finished listening to.
Book Details
When selecting a book, users get an overview with details such as the title, author, and rating. To start listening, they simply press "Play Book", and just below the button, the return date is displayed. Returns happen automatically, so users don't need to remember the date themselves. Further down, there is a clear and easy-to-read book description. If the text is too small, users can adjust the font size and style by clicking the "Aa" icon. Next to it, they can also enable text-to-speech, further enhancing accessibility.
Accessibility Features
To enhance the target audience's experience, settings for the narrator's voice were implemented. Through research and conversations with elderly individuals in my surroundings, I gained insight into how those with hearing impairments often perceive deeper voices more clearly than higher-pitched ones. Depending on the type of hearing aid they use, certain frequencies and tonal ranges may be preferred over others.
AI chatbot
We've all experienced our minds wandering or getting distracted while listening to an audiobook or music. To address this, we implemented an AI chat assistant designed to help users navigate the story when distractions occur. The chatbot is voice-controlled, allowing users to receive assistance even when their phone is out of reach. With voice commands, they can ask the AI to rewind a specific time span or jump directly to a particular event in the story. Since estimating the exact time to rewind can be difficult, users can instead describe the last event they remember, and the app will identify and return to the scene.
The Visual Identity
You're not old, you're vintage
When designing the identity for Tale, I first created a mood board. I gathered shapes, colors, emotions, and activities that I envisioned users engaging in while using the app—such as baking, taking walks, or gardening. I also wanted to give the concept a playful and nostalgic feel that would resonate with the target audience. For this reason, I drew inspiration from vintage artifacts, such as old car posters, Bauhaus designs, and retro images featuring radios and televisions.
Colors
The final color palette emerged from the images in my mood board and includes shades of green, orange, and yellow. Contrast was a key consideration for the target users, so I ensured that my color choices consistently met WCAG's AAA accessibility standards when implemented in the app. The combination of these colors, the light background, and black text creates a bold yet harmonious aesthetic. Colors are used to guide users, and the icons are simple, clean, and intuitive. The audio player is inspired by vinyl records, with the book cover placed at the center of the spinning disc. As the book plays, the record rotates, and a yellow timeline around its edge indicates progress within the chapter.
Typography
For typography, I chose DM Mono as the headline font—a sleek typeface reminiscent of typewriters and vintage aesthetics. For body text, I used Inclusive Sans, a sans-serif designed specifically for high readability and accessibility. Additionally, it pairs good with DM Mono. The icons used in the app are sourced from Material Design. As previously mentioned, accessibility and clarity were top priorities throughout the app. The visual identity is colorful and playful without detracting from the information and functionality.