Reimagining audio for everyone

LEARN MORE LEARN MORE

ALTiO

[alt - ee - oh]

noun

a combination of alternative and audio that describes a visual interpretation of audio

slightly rotated iphone 13 mockup of altio's home screen
empty iphone 13 for use as background in image carousel that shows on larger screens
empty iphone 13 for use as background in image carousel that shows on smaller screens

ALTiO

[alt - ee - oh]

noun

a combination of alternative and audio that describes a visual interpretation of audio

About Us

Deaf and hard of hearing individuals often miss the nuanced information presented by audio, and feel left out of spaces when they are unable to have the same emotional experience as their hearing peers.

Using ALTiO, users can supplement audio posts with drawings and artwork that convey these specific feelings in a visual way. The stakes for creating an “ALTiO” are only personal–users don't have to be artists to show how they feel, they just need the tools to do so! Users can then explore these various creations by artist or genre to discover and engage with different visual content.

High-Fidelity Prototype Video

Our Team


photograph of team member Emily drawn portrait of team member Emily

Emily Huang

Designer & Lead Developer
photograph of team member Frankie drawn portrait of team member Frankie

Frankie Sperka

UX Designer & Needfinder
photograph of team member Jared drawn portrait of team member Jared

Jared Poblete

Graphic & UX Designer
photograph of team member Hannah Kim drawn portrait of team member Hannah

Hannah Kim

Developer & UX Designer

Concept Video

Our Process

The journey we took to produce ALTiO consisted of a deep dive into the design process, below is the outline of how the app came to be.

red drawn icon of a magnifying glass with a heart inside

Needfinding

To begin the process, our team interviewed members of the Deaf community and hard of hearing community to understand more about their interactions and grievances in daily life.


Slides PDF

blue drawn icon of two heads facing each other talking

POV / Experience Prototypes

Using additional interviews, we identified problems and worked on understanding the perspectives of our interviewees, and tested our assumptions through targeted activities designed for observation.


Slides PDF

green drawn icon of clapperboard

Concept Video

We produced a concept video that introduced the main features and tasks of our product at a high level. This includes posting content with audio interpretations, and interacting with content and artists on the platform.


Slides PDF Concept Video

yellow drawn icon of top of phone peeking out

Low Fidelity Prototype

We tested our proposed design with potential users through sketched prototype screens using POP by Marvel.


Slides PDF Report

red drawn icon of half of phone peeking out

Medium Fidelity Prototype

Based on user feedback, we refined our prototype in Figma to incorporate more clarity about our app and additional functionality to better support Deaf and HoH users.


Slides PDF Prototype

green drawn icon of three people's busts with a shared dialogue box of a check mark

Group Heuristic Evaluation

We received feedback from our studio peers and iterated on our design to make it more usable and intuitive to users.


Report PDF

blue drawn icon of full phone

High Fidelity Prototype

Incorporating feedback from the heuristic evaluations, we used React Native and Expo, to turn our designed prototype into a higher fidelity mobile application.


Midway Presentation Midway PDF Report

yellow drawn icon of poster on a stand

Poster and Pitch Slide

We documented our process of ideating and building ALTiO through presenting a pitch and poster, as well as writing a final report to be presented in a final project expo.


Pitch Slide Poster

yellow drawn icon of poster on a stand

Project Recap

To continue our work on this project, we synthesized our process, design, and implimentation to share with our new team members and course collaborators. This was our starting point as we looked to conintue the development of our product.


Slides PDF

yellow drawn icon of poster on a stand

Lab Usability Study

We continued getting input from the Deaf and Hard of Hearing community by taking our final prototype and testing it with potential users. We ran three interviews and collected feedback for future adjustments and devlopment.


Slides PDF

yellow drawn icon of poster on a stand

High Fidelity Prototype 2

Based on feedback and pain points from our Lab Usability Study we made changes to our high fidelity prototype. This included both moving away from hard coded solutions and updating our UI to be more intuitive.


Slides PDF

yellow drawn icon of top of phone peeking out

Field Usability Test

We tested with participants of our target audience and made note of important learnings.


Slides PDF

red drawn icon of half of phone peeking out

High Fidelity Prototype 3

Our third iteration of our high fidelity prototype based on feedback from our field usability testing.


Slides PDF

green drawn icon of clapperboard

High Fidelity Video Prototype

A video of using our high fidelity prototype.


Video YouTube

yellow drawn icon of poster on a stand

High Fidelity Final Prototype

Download Expo Go and try out our prototype!


README

yellow drawn icon of poster on a stand

Final Report, Presentation, Poster

A summary of our two quarter work!


Final Report Poster Slides PDF