Roseanne Chao
UX designer

CBoard

An Augmentative and Alternative Communication app for children with speech impediment.

Team

Group of 10 designers & Developers

Estimated Timeline

4 months (Sep 2020 - Jan 2021)

Impact

Improved the experience of current users drastically, with a 100% positive feedback. It also increased user retention by 30%.Improved the experience of current users drastically, with a 100% positive feedback. It also increased user retention by 30%.

CBoard

The Problem to Solve

The augmentative and alternative communication (AAC) app, CBoard, is used primarily by children, but edited and customized by parents and guardians. The original app that UNICEF came back with negative reviews - we were given the list of feedback from the current users and were able to pinpoint the more obvious problems of the app - the app was said to be difficult to customize and edit to suit the primary users needs. Therefore, we needed to create an app for the guardians to be able to quickly customize the AAC device to instantly suit the needs of the child using the app.

CBoard

Desk Research

We approached desk research by first doing some competitive landscape analysis. Two of the competitors we looked at were Let Me Talk and Dynavox. We looked at the features they were known for, and took note of what they both had that CBoard lacked. What was in the center of the venn diagram would be the main factors we need to consider during our design.

Venn Diagram comparing Let Me Talk (left) and Dynavox (right), as well as some overlapping features.

Venn Diagram comparing Let Me Talk (left) and Dynavox (right), as well as some overlapping features.

CBoard

User Surveys, screenings, interviews

I was able to find two people to interview. What I wanted to find out during the interviews were:

• How guardians used AAC devices for their children

• Must-haves in an AAC device

• What they wished AAC apps would implement

• Let them look at the current CBoard edit mode and see if they are able to customize a board. And to get their thoughts after.

‍I consolidated all the notes into summaries on sticky notes next to the screens they talked about. This way it was easier to present my findings to my team.

Finding users to interview: made a form to screen potential users to interview.

Finding users to interview: made a form to screen potential users to interview.

CBoard
We wrote out all the problems with the current design based on user feedback/interviews

We wrote out all the problems with the current design based on user feedback/interviews

The current design

Our client said that they wanted to keep all the current features, but somehow improve flow and customer satisfaction for the app. Originally, CBoard is able to create new word tiles, customize sentences, and build your own word tile/board. It is confusing when there is "build," "edit," and a similar feature when users tap on "boards." They are all essentially the same feature but with three buttons, each to edit something that could technically be simplified into one user flow.

Some screenshots of feedback from users regarding CBoard's customization and edit mode into sticky notes.

Some screenshots of feedback from users regarding CBoard's customization and edit mode into sticky notes.

CBoard

Ideation and Prototyping

Here are some changes we made to the original app for our wireframes/lofi design. We knew that we wanted to focus on simplification and personalization of the app.

1. Word tiles can be hidden and locked - hiding tiles saves time compared to deleting then needing to remake it again. Locking word tiles can help smoother customization during edit mode.

2. Sentence can be revised if a mistake is made without needing to restart

3. The app's interface changes design so parents/teachers will know whether the app is locked or unlocked.

4. Merging certain build and edit features together to decrease unnecessary steps.

I designed the new edit mode and decided on the interface colors and symbol placements when the app is locked/unlocked.

Some of our lofi screens with descriptions above for our developers to understand what each screen does. The last screen shot is our system map with our mid-fi to show our developers how screens flow.


CBoard

Think Aloud Feedback User Testing

I interviewed the same two people from my previous interviews for feedback on what they thought of the new features. The feedback from user interviews were positive - As they walked through each screen, they were able to figure out what is new and were happy with the new changes. They enjoyed the easier flow to create sentences, change settings and customize word tiles and boards in edit mode. For our hifi, we knew to focus on eliminating sentence creation header in edit mode and to provide a stronger lock system.


Prototyping and refining

Prototyping and refining

Feedback and Refining

We created our lofi prototype and colors based on existing design systems. The flow was slowly tweaked through weekly client meetings.

FINAL UI

Onboarding

Personalization of the app begins right in the beginning, so users don't need to figure out how to change or edit CBoard by themselves.

Main Screens

Screens with 1, 2 or 3 columns, customized by users. Predictive cards for faster speech creation. Unlocking the screen to edit boards also became much more obvious with clearer instructions.

Personalization after onboarding

Users can always quickly edit the layout after unlocking the board. Colors, size, font, and labels can be changed based on the child's preference. this will help increase engagement and fun for children as they can make screens they like.

Quick editing tile locations

This is the edit mode. All editing of word tiles and board are in new respective places that can be found easily (previously, editing board is found in " build," but clicking on "board" leads you to community boards. Now everything is under "board name" itself). Ability to hide and move tiles just by dragging rather than going through settings.

Creating/Editing Word Tiles

Word tiles can now be edited on the main edit screen (three steps less than the original flow). Users can customize background colors, text colors, duplicate or hide the tile, and customize the word's image all in one flow. One can also locate what board they are on and within which folder of words (if they have multiple boards) by "board name > folder name."

Managing boards

Manage all boards in one area at once rather than exiting and entering one by one.

CBoard

Reflection

I'm proud of how my team and I were able to communicate with our non-design client to explain the necessities of our design choices. We were able to come up with an app that had successful, positive feedback despite not being able to conduct  in-person user testings due to Covid. Something I think I would do differently next time is to do user research and test our hi-fi more by observing the interaction between children with speech impediment disabilities and parents when using this app. This way we would know exactly what the problems we need to fix or include is. Finally, this project definitely taught me how to communicate with developers and project managers. Handling work given and being able to present out work and prove to non-designers why certain choices had to be made is an important skill to have!