ALOUD Archives

ALOUD Archives

Designing a scalable system that simplifies content exploration and strengthens user retention.
Designing a scalable system that simplifies content exploration and strengthens user retention.

Overview

ALOUD Archives is a cultural program by the Library Foundation of Los Angeles dedicated to preserving and sharing recorded public talks with prominent figures in art, literature, and film.

Our work with ALOUD focused on improving how users discover and navigate this rich archive through its website.

Role

Product Designer

Timeline

Aug 2024 – Dec 2024

(10 weeks)

My Responsibilities

UX/UI Design

Visual System

UX Research

Design Thinking

Team

Lois Kim

Michelle Cheng

Celia Choi

Arthur Jensen

My Impact

I worked alongside three other designers to develop a more user-centered web experience for ALOUD Archives.

I conducted an expert interview with Esperanza Bey, an LFLA archivist, and uncovered key insights about how users approach searching and categorizing content. I translated these findings into a tagging system that aligns with user mental models and improves user retention.

I also identified and implemented a Google Sheets-based prototype to organize both existing and future media. The tagging system establishes a scalable framework for internal workflows and ensures consistent tagging as the archive grows.

Problem

Despite housing over 20 years of content, the ALOUD Archives website offered users limited ways to explore the collection.

PAIN POINTS

Limited Filtering Options

Users could only search and filter by media type such as podcasts, videos, or gallery. This limits more precise exploration.

Low Engagement

Without relevant filters, users often missed recordings aligned with their interests.

Inefficient Navigation

Finding specific recordings required excessive scrolling or guesswork.

Underutilized Archive

The rich library of talks felt hidden due to the lack of intuitive ways to browse.

How might we organize the archive in a way that supports intuitive exploration though tags and filters?

How might we organize the archive in a way that supports intuitive exploration though tags and filters?

Solution

We designed a dynamic tagging and filtering system that allows users to browse recordings by media-type, genre, and sub-genre.

KEY FEATURES

Media Type Filters

Genre Filters

Sub-Genre Filters

OUTCOME

This solution helps users quickly find relevant content, explore areas of interest, and stay engaged longer with the archive's collection.

Media Type Filters

Quickly narrow content by format—such as gallery, video, or podcast—to make browsing more efficient.

  • Fast Content Discovery

  • Simplified Browsing

  • Supports Multiple Formats

Genre Filters

Filter talks by broad categories like Autobiography, Mystery, etc. to find content that matches user interests at a glance.

  • Targeted Exploration

  • Improved Content Relevance

  • Easy Navigation

Sub-Genre Filters

Explore more specific topics within each genre to uncover niche content and hidden gems.

  • Granular Navigation

  • Enhanced Discoverability

  • Supports Focused Exploration

Design Approach

We focused on creating a filtering system that gave users more control over how they search and explore the archive. Since the archive already supported browsing by media type, we refined that feature and introduced genre and sub-genre filters to add context and depth. Together, these categories make exploration easier and more engaging for a wider audience.

Based on research and testing, our design focused on simplicity, handheld comfort, and clear visual feedback.

User Research Survey

We conducted a survey with 32 regular ALOUD Archives users to understand how they interacted with the website and what challenges they faced. The findings highlighted issues with clarity and discoverability, reinforcing the need for a more structured system of filters and categories.

Expert Insights

Our conversations with the LFLA team and external professionals highlighted the importance of clear organization, user-focused tagging, and long-term resource management. These insights led us to design a flexible system for organizing both existing and future content. Doing so would allow ALOUD to scale while making it easier for users to discover and engage with vast amount of content.

Testing Organization Methods

We conducted two card sorting activities to understand user priorities and mental models:

  • Feature prioritization: Participants ranked what they looked for most in the archive. Results showed that users want more context before engaging with the content.

  • Content grouping exercise: Participants organized event content using only titles and thumbnails. Difficulties here confirmed the need for clear contextual cues like genre and sub-genre.

These exercises directly informed our filtering and tagging system, so that our designs were aligned with user expectations and behaviors.

Internal Organization Prototype

To support consistent tagging across ALOUD's extensive catalog, we developed a sample tagging system in Google Sheets that breaks down each talk into key components. This prototype demonstrated a scalable approach for organizing both existing and future content to make it easier for the internal team to maintain consistency.

REFLECTION

What I Learned

Stay Flexible When the Project Shifts

Our team's pivot from redesigning the website to building a tagging and filtering system taught me how important it is to stay adaptable. Even when the scope changed, keeping sight of the core problem kept the project grounded.

A first look at our early wireframes, mid-fidelity screens, and initial drafts. These designs went through dozens of iterations as the project evolved. The UI design was envisioned as an AI-enhanced AAC app that was inspired by the familiar structure of Proloquo.

We grounded the interface in grid-based navigation and color-coded word types (Fitzgerald Key) to minimize frustration and build on what users already know. Early explorations centered around these features:

  • AI-generated word prediction informed by user habits and geolocation.

  • AI-generated images for custom buttons to make communication more personalized.

  • Conversation recording which could suggest entire phrases for the user to respond with.

A first look at our early wireframes, mid-fidelity screens, and initial drafts. These designs went through dozens of iterations as the project evolved. The UI design was envisioned as an AI-enhanced AAC app that was inspired by the familiar structure of Proloquo.

We grounded the interface in grid-based navigation and color-coded word types (Fitzgerald Key) to minimize frustration and build on what users already know. Early explorations centered around these features:


  • AI-generated word prediction informed by user habits and geolocation.

  • AI-generated images for custom buttons to make communication more personalized.

  • Conversation recording which could suggest entire phrases for the user to respond with.

Let Research Lead the Solution

Field research, interviews, and usability testing revealed that lack of organization was the core issue behind users' difficulty finding content. This reinforced how crucial it is to validate assumptions early and let user needs shape the final directions.

A first look at our early wireframes, mid-fidelity screens, and initial drafts. These designs went through dozens of iterations as the project evolved. The UI design was envisioned as an AI-enhanced AAC app that was inspired by the familiar structure of Proloquo.

We grounded the interface in grid-based navigation and color-coded word types (Fitzgerald Key) to minimize frustration and build on what users already know. Early explorations centered around these features:

  • AI-generated word prediction informed by user habits and geolocation.

  • AI-generated images for custom buttons to make communication more personalized.

  • Conversation recording which could suggest entire phrases for the user to respond with.

A first look at our early wireframes, mid-fidelity screens, and initial drafts. These designs went through dozens of iterations as the project evolved. The UI design was envisioned as an AI-enhanced AAC app that was inspired by the familiar structure of Proloquo.

We grounded the interface in grid-based navigation and color-coded word types (Fitzgerald Key) to minimize frustration and build on what users already know. Early explorations centered around these features:

  • AI-generated word prediction informed by user habits and geolocation.

  • AI-generated images for custom buttons to make communication more personalized.

  • Conversation recording which could suggest entire phrases for the user to respond with.

Small Systems Can Create Big Impact

Working on a seemingly simple feature like tagging made me appreciate how foundational information architecture is. A strong organizational system unlocks better search, discovery, and future features like recommendations.

A first look at our early wireframes, mid-fidelity screens, and initial drafts. These designs went through dozens of iterations as the project evolved. The UI design was envisioned as an AI-enhanced AAC app that was inspired by the familiar structure of Proloquo.

We grounded the interface in grid-based navigation and color-coded word types (Fitzgerald Key) to minimize frustration and build on what users already know. Early explorations centered around these features:

  • AI-generated word prediction informed by user habits and geolocation.

  • AI-generated images for custom buttons to make communication more personalized.

  • Conversation recording which could suggest entire phrases for the user to respond with.

A first look at our early wireframes, mid-fidelity screens, and initial drafts. These designs went through dozens of iterations as the project evolved. The UI design was envisioned as an AI-enhanced AAC app that was inspired by the familiar structure of Proloquo.

We grounded the interface in grid-based navigation and color-coded word types (Fitzgerald Key) to minimize frustration and build on what users already know. Early explorations centered around these features:

  • AI-generated word prediction informed by user habits and geolocation.

  • AI-generated images for custom buttons to make communication more personalized.

  • Conversation recording which could suggest entire phrases for the user to respond with.

Design for Longevity, Not Just the Present

Thinking about future iterations such as expanding filters or integrating AI suggestions, reminded me to design with scalability in mind. A good system should grow with the archive, not limit it.

A first look at our early wireframes, mid-fidelity screens, and initial drafts. These designs went through dozens of iterations as the project evolved. The UI design was envisioned as an AI-enhanced AAC app that was inspired by the familiar structure of Proloquo.

We grounded the interface in grid-based navigation and color-coded word types (Fitzgerald Key) to minimize frustration and build on what users already know. Early explorations centered around these features:

  • AI-generated word prediction informed by user habits and geolocation.

  • AI-generated images for custom buttons to make communication more personalized.

  • Conversation recording which could suggest entire phrases for the user to respond with.

A first look at our early wireframes, mid-fidelity screens, and initial drafts. These designs went through dozens of iterations as the project evolved. The UI design was envisioned as an AI-enhanced AAC app that was inspired by the familiar structure of Proloquo.

We grounded the interface in grid-based navigation and color-coded word types (Fitzgerald Key) to minimize frustration and build on what users already know. Early explorations centered around these features:

  • AI-generated word prediction informed by user habits and geolocation.

  • AI-generated images for custom buttons to make communication more personalized.

  • Conversation recording which could suggest entire phrases for the user to respond with.

Next Project

VoxAI

Reimagining a communication app for young adults with non-verbal autism.

VoxAI

Reimagining a communication app for young adults with non-verbal autism.

Next Project

VoxAI

Reimagining a communication app for young adults with non-verbal autism.

Next Project

VoxAI

Reimagining a communication app for young adults with non-verbal autism.

VoxAI

Reimagining a communication app for young adults with non-verbal autism.

loisykim.design

LOIS KIM © 2025
MADE WITH CARE

loisykim.design

LOIS KIM © 2025
MADE WITH CARE

loisykim.design

LOIS KIM © 2025
MADE WITH CARE