top of page
Autem
Created: 6/28/22
Purpose: Google Design Project
Author: Christopher Moore
Role: UX Designer, UX Researcher
Duration: 1 Month
Autem
The goal of AutEm was to develop a mobile and responsive website design that would allow for the emotional development of Autistic children. I’ve learned from this project that children with autism have tons of emotions. They just need a better way to manage them. This just so happens to be a passion project for me as well since both my son and step son are on the spectrum.
Starting Point: Research and Insights
I have two autistic children of my own so I know full well their struggles. With that being said, I still wanted to keep my biases out of the equation.
To combat my biases, I sought out the experience of other parents and experts in the field of child development. Luckily for me, there is a Facebook group for that.
Between the facebook groups and personal testimonials from autistic adults on Youtube, I was able to gather a good foundation of the exact purpose and function of my designs.
I began my journey by diving into both Qualitative and Quantitative research from various sources.
For instance:
Interview Quotes:
“I wish I had the resources for functional communication training”
“Social development is definitely a big issue. my 17 year old expreses sadness because he has no friends to spend time with.”
“Autisitc children are really tied to their childhood habits. This can turn bad if the proper boundaries aren’t set”
Relevant Statistics:
Autism Spectrum Disorder is diagnosed in about 1 out of every 54 kids
40% are nonverbal
44% have average or above average intellectual ability
31% have an intellectual disability
Most Kids are diagnosed after the age of 4.
With 36.5% of caregivers utilizing ABA
Story board
I wanted to capture two of the most important scenarios that my target user would face and how AutEm could remedy the issue the user faced.
Some key components I knew I needed to add were a way for children to distinguish boundaries and a way for them to recognize different faces and what they mean.
One of the main activities I wanted to add was the facial recognition activity. This idea came from a lack of emotional disernment children have in general, and that autistic children have an especially hard time dealing with.
%202.png)
This activity in particular, in my opinion, will help my target users better understand/relate to facial expressions.
Based on the competitive analysis I conducted for other direct and indirect sites/apps, I believe that this feature is being underutilized.
Also, based on the user pain point I found by creating two seperate user personas, I was able to get a better understanding of WHO I was designing for.
.png)
Design Process
Getting to talk to parents of Autistic children and learning from adult individuals on the spectrum, helped put me in a good creative space to sketch and pre-plan the foundation of what I wanted , or better yet, what the user needed the most.
I knew right away this was going to be a little more ambitious than previous works, but I wasn’t going to shy away from the challenge.
I utilized crazy 8’s to get a grasp on various screens that I thought might be important landmarks for AutEm. Like the boundary board, the home screen, and the main activity.
Getting to talk to parents of Autistic children and learning from adult individuals on the spectrum, helped put me in a good creative space to sketch and pre-plan the foundation of what I wanted , or better yet, what the user needed the most.
For this project I used the Bottom-up design method beginning with mobile first. Only because I needed to create a dedicated mobile app as well.
I still kept in mind that 67% of my target users relied on tablet sized devices. So that’s where most of my focus was going to be.
With the prototyping completed I began creating the reseach plan for the usability study I needed to conduct to get user feedback and guage if we were on the right track.
The study yeilded these results:
.png)
.png)
.png)
The framing/prototyping was going well enough that I made the decision to progress to higher fidelity mockups. This is also when I began putting together the components and elements that would make up my design system for this particular project.
.png)
.png)
%202.png)
After I put together satisfactory hi-fi mockups and prototypes, I knew all the changes I made and new visual elements I included, needed to be user tested again to determine if the visual elements worked well together, as well as, revisiting the same questions about how the flow and functions works in the app.
.png)
The Usability study for the hi-fi prototype yielded a new Usability score of 84%. The Major takeaways from this test were content spacing and the scroll menus. Almost all of the user pain points stemmed from these two elements.
I carried over the general design I used for the mobile version over to the tablet version
Since I had more space to work with, I was really able to stretch my legs.
I used this IA scheme to guide my process
%202.png)
In these versions I wanted to showcase some of the sections that couldn’t get a lot of visibility in the mobile version
.png)
While designing for both tablet and desktop versions of AutEm, I was able to optimize the certain elements. Thus making the User Experience easier and bit more pleasing to the eye in the mobile version
.png)
Conclusion
Final Remarks
Working on this project and getting to talk with people with years of experience working with autistic children has been a real eye opener. I learned so much that I want to apply to future iterations of AutEm and use in my personal life with my own kids. My hope for AutEm is to get it fully functional and reviewed so it can get out in the world to do some good for the community.
bottom of page