Yoto App Design Project

Designing a tablet interface that helps librarians foster early literacy through adaptable listening content.

Project Summary

The Problem

While the Yoto Player offers an excellent screen-free audio experience for children at home, it doesn’t scale well to public school settings where librarians support diverse student populations. Educators often lack the tools to curate or adapt listening content for students with varying English proficiency.

The Solution

I redesigned the Yoto experience as a tablet interface for librarians supporting English language learners. The system lets educators browse audio by language or reading level, create custom playlists, and manage student devices from one dashboard. Clear task flows and a warm, intuitive design balance educator control with a simple, child-friendly experience.

Context

A concept project for my Master’s degree to create a solution based on an existing project. This was created as a hypothetical solution and extension to a real product.

Research

Two paper prototype tests with educators . Their feedback highlighted issues with navigation, content discoverability, and modal layout, which guided improvements to task flow and interface clarity.

My Role

Led the project from start to finish: defined the challenge, gathered user insights through testing, designed the interface, and developed the final prototype.

Overview

For this concept project, I reimagined the Yoto Player, a screen-free audio device designed for children, as a touchscreen experience to better support educators working with multilingual learners. This project explores how librarians can more easily browse, assign, and adapt audio content for students learning English as a second language, especially in high-diversity classroom settings. The resulting interface balances educator control with a simplified, child-friendly UI.

The Yoto Player

While Yoto's current system works well for parents, it's not built with school environments in mind. In classrooms where students come from multiple linguistic backgrounds, teachers and librarians often rely on printed or one-size-fits-all audio content that doesn’t meet students where they are.

This project began with a core question:
How might we support school librarians who run literacy programs for diverse, multilingual student populations by helping them curate and assign engaging, adaptable audio content?

By focusing on the librarian’s administrative needs and the student’s self-guided listening experience, I aimed to design a system that could scale across classrooms and reading levels, while remaining intuitive and playful for young users.

Building a Persona

I began by defining a specific user: Rachel, a bilingual collection developer at a public elementary school. She's responsible for planning read-aloud sessions, selecting content by grade and language level, and managing multiple listening devices.

"I believe it’s my responsibility to ensure our children’s collection is both comprehensive and inclusive."

Rachel became more than a persona, she became a narrative anchor for the project. I built her from a composite of real interviews and user insights, and then fleshed out her constraints:

  • Has 10–15 minutes between classes to prep playlists

  • Manages 20+ students with varied English comprehension levels

  • Frequently toggles between English and Spanish content

  • Prefers predictable, low-friction systems

Critique feedback encouraged me to focus more narrowly here. Rather than vaguely designing “for librarians,” I reframed the case study around Rachel’s exact context. That simple change immediately clarified my design priorities and made the project feel more grounded.

Sketches & Wireframes

To explore layout possibilities, I created three distinct design concepts. One emphasized suggested content, another prioritized device management, and the third grouped librarian actions into distinct modes.

Sketch 1 became the preferred direction based on initial feedback—it segmented tasks clearly, reducing cognitive overload and keeping attention focused on one primary function at a time.

From those sketches, I created two paper prototypes to test:

  • Creating a new playlist and adding titles by reading level or language

  • Assigning that playlist to a student’s tablet

Key Feedback from Usability Testing

  • Discoverability: Users struggled to locate the menu icon in Prototype A, prompting me to switch to a persistent sidebar.

  • Browsing-first behavior: Several participants wanted to explore the catalog before starting a task. I reorganized the homepage to surface popular and recommended titles first.

  • Modal overload: A scrollable carousel inside a modal confused testers. They didn’t know additional options were available by swiping.

These insights informed not just the visual design but also my informational architecture choices. Thanks to critique guidance, I began thinking more intentionally about what information to prioritize and how best to visually signal interactivity.

Final Design Screens

With validated flows in hand, I explored three polished mockups:

  • A dashboard-focused design highlighting top titles

  • A device-centric layout that prioritizes session management

  • A brand-partner-heavy approach aimed at title exploration

I selected Mockup #2 as the base for my prototype. It felt the most inviting and intuitively mapped to Rachel’s workflows.

To bring it to life, I developed a clickable prototype with a warm color palette, rounded icons, and familiar gestures. The UI Style Guide helped maintain consistency across pages, from device tracking to content filtering.

The Yoto App homepage

An overview of the device’s library

A modal for creating a playlist

Next Steps

While the prototype is fully navigable, I didn’t conduct a full usability study due to time and resource constraints. That said, critique feedback encouraged me to think critically about what I would test if I had the opportunity.

If tested, I would explore:

  • Can users distinguish between "Preview" and "Assign" in under 3 seconds?

  • Does the modal layout reduce decision fatigue or create new confusion?

  • Are edge cases like “device already in use” handled clearly and helpfully?

  • Do users understand the horizontal swipe behavior without prompts?