(Click on images to enlarge)
Echo.AI is a product created as a part of Product Association @ UCI's Fellowship Program. Throughout this project, I worked in a cross-functional team and created a presentation to pitch Echo.AI to industry professionals from companies such as Microsoft and ServiceNow.
The goal of Echo.AI is to assist students who are travelling abroad in practicing and learning a new language by completing a three-stage lesson plan.
What'd I do?
Product designer - UX/UI, Prototyping, User Surveys, User Flows, Branding, Usability Testing, Research.
When?
January 2024 to March 2024. (3 months)
Meet my Team
Aadi M. (Product Manager), Ruby K. (Product Marketer), Rhea J. (Software Engineer), Benjoseph V. (Software Engineer)
The Problem 😵💫
It can be pretty hard to learn the ins and outs of a language.
Many language learners experience a lack of real-life practice, making it difficult for users to grasp the cultural nuances needed for effective communication. Furthermore, it is hard to find topic-specific lessons, making niche situations hard to navigate.
With these pain points, I crafted this problem statement:
How might we create a language learning app with customized lesson plans to help students who are studying abroad enhance their situational speaking skills?
User Research
To ground our design decisions in real user needs, I began by conducting a mix of surveys and interviews with students preparing for or currently studying abroad:
-
30 participants revealed that 80% struggled with applying classroom-taught language skills to real-life situations.
-
Interviews with 5 users highlighted frustrations around the lack of personalized lesson plans and cultural context in existing apps.
To begin user research, my team and I conducted a competitive analysis.
I analyzed competitor apps like Duolingo and Rosetta Stone, noting that while effective for vocabulary building, they often lacked the depth needed for cultural immersion. This research ensured Echo.AI could address a unique market need while offering a streamlined, user-friendly experience.
We also ideated our target audience:
-
18-22 years old, tech-savvy, and studying abroad
-
Interests:
- Exploring new cultures, and cuisines, and making local friends
-
Challenges:
- Limited experience with the local language (outside of the classroom)
Design Iterations 🔄
There were many, many iterations done in my design process.
I began with rough sketches to explore different ideas and ensure a strong foundation for the design. These sketches evolved into low-fidelity wireframes to map out the structure and functionality of key screens. From there, I refined the designs into mid-fidelity prototypes to focus on layout and usability.
Throughout this iterative process, I constantly revisited user needs and project goals, ensuring that each iteration brought the product closer to a polished and user-friendly experience. Being the sole designer gave me the freedom to experiment creatively, but it also required me to make confident design decisions and trust my instincts. This experience taught me the value of adaptability and the importance of continuously refining designs through feedback and testing.
Learning Dashboard Iterations
Visual Identity
When my team and I settled on a language-learning app, I knew I wanted to have a mascot to have a strong visual identity. Duolingo's strong success heavily inspired me in terms of branding, and thus Echo was born. A purple little robot that would be the user's guiding light.
I first started with initial sketches of Echo. I wanted the mascot to feel approachable and tech-savvy while maintaining a fun, educational vibe. Then, I picked up Adobe Illustrator to make my designs official.
Looking back, if I had more time I would have made its design simpler. I experienced difficulties with wanting to animate it in loading screens, but I'm still happy with how my first brand design ended!
I also created a design system so that all of my designs would be cohesive, including ChakraUI so that my software engineers could smoothly translate my designs into code.
When designing the visual identity for Echo.AI, I aimed to create a cohesive and educational feel that supports the app’s goal of enhancing language learning. Given that Echo.AI is an education app, I selected Lexend as the primary font. Lexend is designed to improve reading comprehension and accessibility, making it a perfect fit for this educational context.
Validating my designs
Once I completed our mid-fi wireframes, my product manager and I collaborated to conduct 3 usability testing sessions.
From these usability testing sessions, I received valuable feedback, such as
-
Users want confirmation once lessons have been created.
-
Users may feel overwhelmed at the starting landing page.
From this feedback, I implemented key changes to improve the user experience.
-
I added a confirmation message after lesson creation to provide users with a sense of completion and clarity.
-
I redesigned the starting landing page to simplify navigation and reduce cognitive load, ensuring users feel welcomed rather than overwhelmed.
These adjustments were guided by user needs and reminded me of the importance of iterative design in creating a more intuitive and enjoyable experience!
What I delivered 💌
Introducing Echo.AI, a user-friendly language learning tool designed to make mastering a new language simple and enjoyable. With a diverse selection of languages and personalized scenarios, Echo.AI offers a tailored approach to language learning. Our unique 3-step lesson plan breaks down complex language concepts into manageable steps, ensuring that learners of all levels can progress at their own pace.
Design Details
Final Screens
And finally, my team and I presented at Product Association @ UCI's demo day. Below is my final demo, as well as a photo of my team and I!
All in all... 💭
This was an incredibly rewarding experience. This was my first time being a solo designer while in a cross-functional team, and I learned a lot through my time working on Echo.AI. I learned more about the importance of mentorship, as I looked towards my mentors during times I had difficulties. I learned more about trusting my own design decisions, and gained confidence through the many decisions I had to make. Surprisingly, I got to learn more about education curriculums while ideating the three-step program!
I am grateful for the many learning experiences I had during this project. I hope to leverage these skills in many more projects to come.
I'm also very excited to say I have been given the opportunity to give back to the Product UCI community by serving as a Product Design Lead for the 2024-25 fellowship cohort! I will be passing on the many lessons I learned while giving constructive feedback to the curriculum. :)
Feel free to poke around my Figma file!
Also, here is a link to my team's final presentation.
Thank you for viewing my case study! Feel free to browse around my other works as well.
~ Kaylee Doliente :]