ALOUD Archives

VOICES ALOUD

design for web

Final Screen of the redesigned homepage for the ALOUD Archives.

Making digital media content more accessible to ALOUD Archives users.

Over fourteen weeks, our design team collaborated to improve the Library Foundation's website, making its untapped media collection more accessible to users through enhanced organization, navigation, and search functionality.

see the prototype

project type

Academic Project

role

Project Manager & Product Designer — Responsible for delivering wireframes, prototypes, user research, user journey maps, visual design choices, and final mockups.

timeline

Fall 2024 (10 weeks)

team

Arthur Jensen (Me)
Michelle Cheng Celia Choi
Lois Kim ‍

problem

The Library Foundation's vast collection of digital media lacks proper organization and tagging, making it difficult to search and largely inaccessible to users.

solution

An automated tagging system, redesigned website sections, and enhanced search and discovery features to improve the accessibility and organization of audio content.

impact

Provided a strategic roadmap that outlines tools and processes for enhancing digital media accessibility, affirming the direction taken by an external development agency.

introduction

Meeting the Library Foundation's ALOUD Program

The project began with an initial meeting with ALOUD, a program created by the Library Foundation that fosters community through events and recordings connecting diverse thinkers, performers and writers with the public.
Within this project, I served as project manager, bridging stakeholders and the team while setting priorities, defining deliverables, and establishing deadlines.

Background photos for the ALOUD program.

stakeholder meeting

Engaging ALOUD Stakeholders to Understand Their Challenges

To kick off the project, the team met with project stakeholders to have a conversation on the issues that the ALOUD Archives is currently facing.
I uncovered key challenges the ALOUD team faced in connecting their content with their audience, revealing three insights that shaped the design process.

""It's untapped territory—you can explore the archives and listen to past recordings, but it's not enticing unless you know there's a notable author involved.""

Jessica Strand

Senior Director

The ALOUD Archives needs context to engage users.

"The team lacks the manpower and resources to sustain ALOUD's current operations, requiring prioritized resource allocation and external support."

Jorge Martinez

Programs Coordinator

The current ALOUD team lacks resources and manpower.

"There's already so much content—we don't need more creation, but better ways to access it. We haven’t done effective targeted marketing or outreach so far."

Sandra Kulli

Board Member

ALOUD's digital media content needs to be more accessible.

surveys

Surveying ALOUD Archives Users to Identify Their Needs and Preferences

I designed both open-ended and close-ended survey questions to collect qualitative and quantitative data about how users interact with the Archives.
The survey indicated that 40% of users are aged 65 or older, 60% are female, and the majority reside in the Los Angeles area.
The survey revealed that most ALOUD users engage to discover new ideas or hear specific speakers, which led us to identify our users as lifelong learners.

Chart depicting ALOUD Archives user preferences.

Users Value Educational and Culturally-Enriching Content

Over 90% of respondents want culturally enriching and educational content on the ALOUD Archives site.

Survey reveals user motivations when using the ALOUD Archives.

Users Want to Discover New Topics and Hear from Notable Speakers

40% of respondents primarily use the Archives to discover new ideas or hear from specific speakers.

subject matter expert

Meeting with Philip Leers to Learn About Managing a Digital Media Archive

The Hammer Channel is a grant-funded initiative to centralize video content and improve access to the Hammer museum's programming.
I led an interview with Philip Leers, creator of the Hammer Channel, to learn about design techniques and processes for improving user engagement, accessibility, and making large archives more navigable.

Hammer Channel's digital asset management system.

insight

Utilize a Digital Asset Management System

A digital asset management system is necessary for managing a vast video collection.
Identify video-compatible systems with robust APIs, prioritizing automation and ensuring technical feasibility.

Hammer Channel's topics and tags.

insight

Incorporate Tags

Tags serve as metadata that enhances the search functionality, enabling users to find content related to specific topics or artists.
Tags power the recommendation system, suggesting content based on user viewing history.

Hammer Channel uses the platform, Trint, to feature transcripts.

insight

Feature Transcripts

Transcripts are essential for accessibility in archival content sites, and The Hammer Channel uses Trint's automated services.
Users can search terms in transcripts or titles, view all instances, and jump to matching video points.

define

Defining our Goals with the ALOUD Archives

We’ve identified goals to improve the user experience of the ALOUD Archives, making it easier for users to access desired media content.

Organize and label content using an effective tagging system.

Create a robust filtering system to help users easily find media.

Enhance navigation, accessibility and engagement on the site.

Mid-fidelity screens

Designing Features to Improve Search and Content Discovery on the Archives Site

We conducted a heuristic evaluation of the site to identify major usability issues.
We redesigned screens to improve the ALOUD Archives by addressing its limited context and enhancing search and discovery features.

Providing More Context on the Homepage

ALOUD Archives homepage.

Before
Current homepage lacks context.

Redesigned Voices ALOUD homepage.

After
Redesigned homepage to include more information.

Thumbnail Card Redesign

ALOUD Archives media thumbnails.

Before
Current thumbnails lack clarity.

Redesigned Voices ALOUD thumbnails.

After
Redesigned thumbnails provide more details.

Redesigning the Current Filter System

Current media filtering system on ALOUD Archives.

Before
The current filter system is limited.

Reimagined media filtering system for the ALOUD Archives.

After
Redesigned filter system enhances media search.

visual design

VOICES ALOUD Style Guide

To better reflect the wide range of perspectives and experiences shared in the audio collection, we've rebranded the ALOUD Archives to VOICES ALOUD.
My research involved developing potential color and typography palettes—after reviewing the options, the team chose a purple and green combination.

Style guide for VOICES ALOUD.

solutions

Voices ALOUD

Our vision for the ALOUD Archives reimagines how users explore and engage with impactful recordings of past conversations. By redesigning the homepage and episodes page, we preserve their significance while making them more accessible.

see it live

media organization

Exploring Two Options for Categorizing and Organizing Digital Media

We recommended ALOUD organize their digital media into a database with keywords, key topics, and collections to streamline navigation and curation.
I researched automated tagging platforms in an effort to help the ALOUD team save time and focus on content curation instead of manual tagging.

Google Spreadsheet of organized media content.

Option 1: Creating a Google Spreadsheet

Manually tagging content is cost-effective and leverages team members' content knowledge for greater accuracy.

Kontent.AI's platform for automated tagging.

Option 2: Using an Automated Tagging System

Kontent.AI efficiently organizes the archive by automatically tagging and categorizing content.

search & discovery

Making It Easier for Users to Find Desired Content

Users come to the ALOUD Archives to hear from notable speakers and to learn about specific topics they are intereseted in.
The current website lacks tags and efficient ways to find speakers and topics, so the team designed a robust filter system to help users narrow their searches.

filter

Robust FIilter System for Searching Content

By enabling users to filter their searches, we can quickly connect them to specific notable speakers and topics they want to explore. Filters allow users to search digital media content by media type, genre, and sub-genre.

high-fidelity screens

We Redesigned Screens to Enhance Usability

Our goal is to transform how users discover and engage with ALOUD's media collection by redesigning the website and creating potential features.
In Figma, I designed variations of the redesigned screens, focusing on providing clear information and context to improve user navigation and site experience.

essential info

More Context on Thumbnail Cards

A card-sorting test revealed users struggled to understand content at a glance. We redesigned thumbnail cards to include key details, including speaker name, media length, topic tags, a descriptive title, and date.

User engagement

Providing a Media Collection Overview and Trending Topics

The redesigned homepage offers clear context about the media collection. It also allows users to explore trending topics based on current news, events, and featured content. This fosters immediate connections and enhances relevance for users.

User retention

Boosting User Retention with Tags and Content Recommendations

We plan to add tags to help users easily find related topics and speakers. Additionally, we explored adding recommendations for related talks to enhance discovery and keep users engaged on the site.

accessibility

Transcripts and Improved Readability

The redesigned webpage improves hierarchy and readability. We plan to add transcripts, allowing users to download content, search keywords, and navigate specific moments. This feature enhances accessibility, usability, and engagement.

reflection

Prioritize Clear Communication to Create Feasible and Relevant Client Solutions

The Importance of User Research: From stakeholder interviews to user surveys, understanding the needs and frustrations of both the ALOUD team and their audience was crucial. It highlighted the need for context, efficient organization, and robust search functionality.

‍Bridging the Gap Between Stakeholders and Design: As project manager, I learned the importance of clear communication, setting expectations, and translating user needs into actionable design solutions.

‍Accessibility is Key: This project solidified my understanding of digital accessibility and its importance in creating an inclusive online experience. Developing the strategic roadmap with accessibility guidelines was a valuable learning experience.

‍The Value of Collaboration: Working with my design team, we brainstormed ideas, iterated on designs, and learned from each other's strengths. This collaborative process was essential to the success of the project.

‍Consider Limited Resources: The ALOUD team's constraints in terms of manpower and resources pushed us to find creative solutions, such as exploring automated tagging systems to streamline their workflow.

‍Balancing Stakeholder Needs: Balancing the needs and desires of various stakeholders required careful communication and negotiation. I learned to prioritize key features and ensure everyone felt heard throughout the process.

‍Designing for an Older Audience: With a significant portion of users being 65 or older, we had to pay close attention to accessibility and usability for this demographic. This involved considering font sizes, color contrast, and clear navigation.

‍Creating Strategic Roadmap for Accessibility: This roadmap provides a valuable resource for the ALOUD team and their external development agency, ensuring that accessibility remains a priority throughout the website redesign.

Let’s make something great together!

Let’s make something great together!