Budget App
ComBoard
Svetim Logos
View all 1-Pagers
About Me
Resume
Budget App
Budget App
ComBoard
ComBoard
Svetim Logos
Svetim Logos
Lidia's Logo; a two tone teal "L" shape with an orange arc over the right side create a capital "D" shape.
Lead UX Research & Design (solo)
Figma
May - Oct 2024
ComBoard
Problem: Improve a disabled student's communication options
Tobii device induces strain due to small focus targets and reliance on fine motor control; additionally, both Tobiii and plexiglass board are unwieldy, limiting options for eye-based communication in most environments.
Animated preview of creating a budget in three taps on the desktop site
Responsive Site on Tablet (click to see prototype)
Content
Understanding Users
Name
Elie
Age
16
Education
High School
Hometown
Seattle, WA
Family
Two Siblings
Occupation
Student

User Story

Ellie communicates primarily with left-right eye movements and interpretation support from an adult aide. Existing AAC solutions cause eye strain and exacerbate social friction. A personalized, pocket-sized, predictive, eye-tracking app would boost spontaneous, independent communication, allowing her to connect socially and learn without barriers.

Problem Statement: Student with cerebral palsy needs a lightweight, intuitive communication app. Current bulky and slow AAC tools cause physical strain and limit communication. She wants to chat with friends, participate in class, and prepare for college without barriers.

Goals
Frustrations
Spontaneous communication
Enriched social interaction
Bulky, expensive solutions
Slow setup disrupts natural flow
Active class participation
Calibration lag for eye-tracking
Reduce physical strain
Limited predictive vocabulary
Goals
Spontaneous communication
Bulky, expensive solutions
Active class participation
Reduce physical strain
Frustrations
Enriched social interaction
Calibration lag for eye-tracking
Slow setup disrupts natural flow
Limited predictive vocabulary

(Ellie is a persona created to protect the identity of the real individual I worked with)
I worked with "Ellie" from May 2024-June 2025 as her full-time, in-school aide. During that time, she completed over 20 courses ranging from Calculus II and Neuroscience to Liberation Theologies and Art History. Not to mention Poetry and Painting class and her Independent Study course. Throughout her senior year, she used her eye gaze to complete Calculus assessments, write essays and poems, to create posters and presentations, and to contribute to classroom conversations.

My job was to notice, to listen, and to collaborate with her to translate her thoughts and ideas so that the world could hear them too. We primarily used left/right selections with hand signals to communicate. Multiple times a week I asked her to assess my efficacy as her aide with the following questions on a scale of 1-5: "Did I interpret your ideas correctly?" "How am I doing as your interpreter?" "How well does this sentence represent what you meant to say?"

ComBoard was used to write essays, chat during free time, and answer free response prompts.

Key Research Insights (Recurring user interviews + competitive audit of AAC tools)

Communication boards have limited word categories and lack spelling options for free expression.
Design decisions:
Create a keyboard that integrates predictive text.
Many devices require fine motor control to select from many on-screen or on-page options.
Design decisions:
Cluster letters to make selection more accessible to users with limited motor control.
Communication boards often have juvenile visual aids.
Design decisions:
Custom design minimalist icons to aid in pairing letters to sounds.
Many devices are distracting and cluttered, creating strain for users with limited sustained gaze.
Design decisions:
Animate the interface to clear away distractions after each gaze selection.
Many devices and tools limit social interaction by blocking the user's face and view.
Design decisions:
Create an app that anyone can download on any device so that the communication partner can hold the device instead of blocking the disabled individual's face.
Journey Map: Communicate a Thought

Summary:
Ellie is frustrated and exhausted by current communication methods that further create distance between her and her aspirations. She wants to communicate independently and in real time.

Trigger: Need to Communicate
Tasks
Feeling
Improvement Opportunities
Ellie feels the need to ask a question or share an idea
Urgent
Always available AAC that allows self initiation
Signals with eye movements or gesture
Anxious
Trigger: Need to Communicate
Tasks
Ellie feels the need to ask a question or share an idea
Signals with eye movements or gesture
Feeling
Urgent
Anxious
Improvement Opportunities
Always available AAC that allows self initiation
Wait to be Noticed
Tasks
Feeling
Improvement Opportunities
Wait quietly
Helpless
Visual or audio cues built into app to alert when she has something to say
Vocal noises to get attention
Dependant
Wait to be Noticed
Tasks
Wait quietly
Vocal noises to get attention
Feeling
Helpless
Dependant
Improvement Opportunities
Visual or audio cues built into app to alert when she has something to say
Interpretation Attempt
Tasks
Feeling
Improvement Opportunities
Aide interprets intent through body language and eye gaze
Embarassed
Smart, predictive text
Possibly set up bulky Tobii or plexiglass E-TRAN
Impatient
Interpretation Attempt
Tasks
Aide interprets intent through body language and eye gaze
Possibly set up bulky Tobii or plexiglass E-TRAN
Feeling
Embarassed
Impatient
Improvement Opportunities
Smart, predictive text
Classroom Participation
Tasks
Feeling
Improvement Opportunities
Tobii blocks Ellie's face, E-TRAN is unweildy
Frustrated
Eye-tracking technology
Ellie is limited to aide-proposed options
Excluded
Use of common device screens that don't block face
Classroom Participation
Tasks
Tobii blocks Ellie's face, E-TRAN is unweildy
Ellie is limited to aide-proposed options
Feeling
Frustrated
Excluded
Improvement Opportunities
Eye-tracking technology
Use of common device screens that don't block face

Defining the Challenge

How might we design an AAC app that minimizes eye strain, integrates AI for predictive text and smart gaze tracking, and adapts to the unique needs of the individual so that they can communicate efficiently and independently without obscuring their face?

Quantitative Goal

Target

Double instances of spelling to communicate from 2x/month (spring 2024) to 4x/month (spring 2025)

Results

980% increase in spelling instances using ComBoard 5x/week by spring 2025 on aide's phone and student's school tablet compared to 2x/month spelling instances when relying on heavy, bulky, plexiglass board.  

Qualitative Goal

Target

User preference rating at least 20% higher than other methods.

Results

Method preferences were scored by the user Tobii (1/5), Plexiglass board (3/5), ComBoard (5/5)

A line graph shows device usage per month from may 2024 to june 2025. The student requested to use tobii device the least and the line is nearly horizontal at zero, her plexiglass board occasionally, and the digital comboard most often and the line graph shows a peak of 24 uses in jan 2025. Plexiglass board usage decreased as digital board usage increased.  There is a dip in com board use during dec 2024.

Based on observational data. Mid-summer 2024, the student began consistently choosing to use the digital ComBoard over the plexiglass. Once school started, this became the exclusive choice for spelling tasks in school, but it is my understanding that the plexiglass solution was still used at home.

Design Process

Animated preview of creating a budget in three taps on the desktop site
Animated preview of creating a budget in three taps on the desktop site

Ideation & Drafting (week 1)

Draft 1 was a communication board on google slides. Ellie would use eye gaze to select a category and her aide would click it leading to a new page with more options. This is a common format for communication boards.

This design is limited and not scalable as I would have to manually add each category and word option.

I switched to a keyboard design that puts more power back in the hands of the user.
A11y-Color contrast checker plug in on figma says "all texts meet AAA color contrast requirements"

Custom Designing Icons (week 2)

After learning that Ellie struglles with spelling, we decided that small icons on each key of the board would help.

I sketched my ideas on paper and used that to create illustrations in Figma.

I tested layouts with Ellie to decide how to balance letters, icons, and white space.  

A page from the figma design file shows a picture of the original paper and pen sketches for keyboard icons and an early iteration of the digital components.

UI (week 3 - 7)

Ellie indicated some preferences for the keyboard layout 

Alphabet-based organization to help her find the letters where she would expect them to be.
Diverse clusters to limit misinterpretation by an eye tracker, predictive text, or a communication partner.
Include all english sounds as keys, like "TH," to speed up spelling.  
A11y-Color contrast checker plug in on figma says "all texts meet AAA color contrast requirements"

Interaction, User Testing, Prototyping (week 8-12)

Once the layout was Ellie-approved, I began to develop the interactions and test the prototype in her real-life, daily school setting to complete assignments and have conversations.

I designed a unique interaction that changes the ComBoard display based on Ellie's selections. Ellie rated this 5/5, indicating it significantly reduced her strain.

Make-a-thon!

In July of 2025, Figma Make became available! This drove me into a second round of prototyping to build more robust settings to personalize to a greater range of AAC users' needs.
I integrated predictive text, text-to-speech, and speech to text.
I refined the UI to make better use of screen space.
I switched from custom to Lucide icons for consistency.
I improved selection feedback with scaling and highlighting.

Sticker Sheet

Every button, tile, and card layout, along with their interaction states, used in both the mobile and desktop designs. This sticker sheet makes modifying and personalizing the ComBoard hassle-free, allowing me to continuously provide the student with a tool that best suits her needs as she is able to communicate them to me over time.  

Learnings

I spent a lot of time creating custom icons. In hindsight, this was not the best use of my efforts - it delayed the completion of a functioning product and introduced inconsistencies into the design. Lucide, and other sources and design systems, already exist with libraries of icons readily available, making it only necessary to create custom icons when what I need doesn't already exist (like the "owl" icon I wanted).
I learned that state management is not only extremely important, but actually quite complicated. Poor state management leads to messy and confusing code and introduces friction to the user experience.
Color choices go far beyond aesthetic beauty! This is sort of obvious, but it is always good to reinforce that fact through experience. ComBoard went through several sets of brand colors before landing on a set that I feel supports the user experience by helping them focus on their selections by looking towards colors rather than individual letters. The Figma Make prototype includes a set of alternate color themes too, allowing the user to create a personalized experience that suits their preferences and address color-blind needs.

Next Steps

Mobile Layout & Text Field

Improve mobile layout; the utility buttons are cramped, creating an accessibility obstacle; the text field needs to be re-imaged to support focused spelling, sentence tracking, and predictive text options.

Update
This improvement was implemented in the Figma Make prototype.

Robust Personalization

Designing several more "presets" and work with other developers to find the best way to put power in the hands of users to personalize the layout and function to fit their unique needs.

Update
Presets and robust settings were implemented in the Figma Make prototype.

Eye-Gaze Tracking Technology

I attempted to integrate Webgazer into the Figma Make prototype, but the calibration needs a lot of work before it is actually useful. I will continue to research and find alternate software and hardware solutions.

More User Interviews & Usability Study

Interview 5 additional individuals who use AAC devices to understand their needs and let them guide further design decisions. Later, moderated usability studies will guide iteration.  

Dev Collab

Publish as a website and as a downloadable app for Ellie to continue using with other communication partners.
Previous
Budget App
UX Research/Design
Next
Always open to new connections, engaging conversation, and opportunities in art and design!
Designed by Lidia Ochoa; Powered by Webflow
2025 UXbyLidiaOchoa. All rights reserved.