SpeakEZ
End-to-end translation mobile app
Project request
“Bring to life a product of your design; taking it from initial concept, then to branding, and finally to a full-blown app prototype. The key element of this Capstone is the MVP, or minimum viable product. This means you want to prepare a proof of concept that performs at least one feature exceptionally well.”
Problem
Imagine two people standing on opposite sides of a river, unable to reach each other. The river represents the language barrier between teachers and non-english speaking parents. Without a bridge, they can only shout across, leading to misunderstandings or missed connections.
Solution
A mobile application that bridges the gap between both parties and creates confidence by allowing for easy message translation, voice memo translation and options to save conversations to create actionable plans to improve the student’s learning journey.
How it works: key features
Translating Voice Memos
Send and translate voice memos to have more in depth conversations with each other when a more serious matter is at hand.
This removes the stress users may feel about making a phone call and struggling to translate and communicate effectively.
Translate Documents
Use the document scanner to translate documents such as report cards into preferred language.
This eliminates the hassle of sending documents to an external organization for translation and demonstrates to parents that, as a teacher, you genuinely care about sharing their child's progress.
Translating Messages
Translate messages directly within the chat feature for easier comprehension.
This eliminates the need to visit a separate translation website, streamlining the process and saving time.
A little bit of background
As a recent graduate, I started to notice a few gaps in the education system that I felt needed more attention.
During my EdTech internship, I had the chance to address some of these issues by developing a software solution that identified skill gaps in curricula. This experience deepened my passion for EdTech and sparked my interest in exploring further solutions.
Given my growing enthusiasm for the field, I knew Edtech would be the perfect focus for my final Capstone project.
Finding the right materials: user research
Narrowing the scope
Before delving into my research, I needed to narrow down what my focus would be.
Casual conversations with teachers revealed a critical need to improve teacher-parent communication.
Competitor analysis
I started my research with a competitor analysis where I researched popular edtech platforms to understand how they address similar challenges. This background research was invaluable in shaping my approach, guiding me toward designing a straightforward, user-friendly app without unnecessary features that might overwhelm or confuse users.
Findings
Both Bloomz and ClassDojo address a variety of problems, which is beneficial in theory, but their robust feature sets can overwhelm teachers and parents who lack the time to navigate and learn them effectively.
Users like Remind because it uses similar UI patterns to Imessage and WhatsApp, reducing their cognitive load.
Bloomz limits its translation feature to paid subscriptions, which significantly reduces accessibility for non-English-speaking parents.
User interviews
I conducted 5 user interviews with teachers who taught k-12 in order to dive deeper into the problem and empathize with the users.
My approach for these interviews was very specific. In order to get strong insights, I made sure that each interview was at least 40 minutes long and involved 7 core questions that elicited stories.
The stories allowed me to get many insights and uncover a problem that I had not initially thought of.
Through these user interviews I wanted to find out:
What problems teachers have when attempting to communicate with parents.
How teachers manage problems communicating with parents when they arise.
Why teachers feel that it is important to have strong communication with students’ parents.
Unexpected Findings
Identified language barriers as the primary factor creating communication gaps between teachers and non-English-speaking families.
5/5 participants said that parents of English Language Learning students are the hardest to get in touch with.
5/5 teachers said that there are currently not many standardized methods across schools to communicate with non-english speaking parents.
5/5 participants said that they often see a direct correlation of poor behavior from the student when the communication with the parent is weak.
A lack of strong communication methods that translate information easily is creating a disconnect between teachers and non-English-speaking parents, ultimately impacting student success.
User Persona
Meet Melissa, a second-grade teacher with ten years of experience. While she has had few communication issues with parents, she struggles to connect with non-English-speaking families. Despite using tools like the Language Line, she still feels a disconnect.
Melissa aims to:
Create strong learning environments by having strong communication with parents.
Make the students and parents feel comfortable to reach out to her.
Utilize any resources to make this communication easy for both parties.
Her motivations are:
creating a strong learning environment for her students and believes this heavily stems from strong communication.
enhancing communication with non-english speaking parents to ensure every student and family receives equitable support and treatment.
“When parents are very involved, kids know that school’s important, but if their parents aren’t involved, they might not care as much about how they’re doing themselves. So it kind of starts at home.”
Constructing the bridge
Building out the frames
Wire flows
Prior to creating my user flows I created wireflows for each of the tasks.
Creating these helps me visualize every page of the flow so that I don’t miss any crucial interactions that would lead the user astray. This is a method that I learned during an internship that had been very beneficial throughout this course.
Low-fidelity testing
My Approach
Since I had already built out all of the wireflows, I went ahead and used those for my low-fidelity testing. I gave each of my participants the scenarios for each task and had them point to and verbalize their choices.
Pros: Using these wireflows allowed for a bit more accuracy since there were no hints about what steps to take next.
Cons: It doesn’t look as realistic as the Figma prototype which caused some confusion like when the user was supposed to type in their name.
What went well
“I think the voice memo part will be a great solution to help parents and teachers communicate better.”
“Reminds me of a typical messaging app.”
“Overall this was very easy and intuitive to follow.”
“These are great solutions for this problem.”
What went wrong
The most friction happened on the first screen when having to change the language preference. 5/5 users skipped over the language icon initially to navigate to the language preference page, indicating it was not obvious enough. I used this feedback , and made iterations on my high fidelity mockup.
Branding
Color Palette
I chose various shades of blue because blue is often associated with calmness, trust, focus, and intelligence, which are all qualities considered beneficial for learning.
I also included the the pop of orange to add some contrast and it demonstrates confidence and sociability, which is essentially the goal for the users.
Typography
I chose Noto Sans because it is a clean and easy to read digitally across many screens.
Since the goal of the app is to easily translate messages, I needed to make sure that I chose a font that would be easy to read and align with this goal.
Logo
UI kit
Final Touches
Iterations
After incorporating my branding into the UI, I conducted another round of user testing. The goal of this testing was to measure what features were intuitive after implementing all of the UI elements.
The feedback from these sessions directly informed the following iterations. Here are the changes I made based on the results.
#1: Ability to save conversation
4/5 participants expressed a desire for a feature to save or pin messages, allowing them to take actionable steps to support their child’s success in school. To do this, I added a feature to save selected messages and tag the message into a specific category for easier filtration.
Before
After
#2: Ability to send translated document
3/5 participants had made comments such as, “where does it go” or “what now” after translating the report card. I saw this as a less impactful solution, so I added the option to directly send the translated report card. This shows that the teacher is being thoughtful and taking that extra step to help parents understand their child's progress.
Before
After
Why these iterations are important
Giving teachers the ability to act on translations helps them work with parents to support a child’s growth. By staying on the same page about both school progress and home life, they can team up to make plans for improvement or celebrate successes together.
Final High Fidelity
Construction Complete!
What’s next?
For my future roadmap, I have several features that I would like to build on based on research, testing, and outside feedback. These features include:
AI summaries to help filter and sort saved messages.
Built out the saved conversations page.
Tooltips over icons to explain the function to minimize confusion
Create and test prototype from the parent side.
Calendar Feature
What I learned
Overall, this project was incredibly rewarding to work on. I set out to focus on accessibility and inclusivity, and this topic emerged unexpectedly. Key takeaways from this process that have impacted me as a designer include:
Open-ended questions to encourage storytelling during user interviews, resulting in deeper insights and more meaningful data.
Insights need to influence every aspect of the persona.
Looking at other designs for UI inspiration isn’t copying, it’s learning.
While functionality of the application is important, aesthetics and the UI are what draw people in.
Thanks for reading!
