Espresso a study tool (codelabs)
Role:
- Team UX Designer
- Team UI Researcher
Timeline:
Professional Project Fall 2023 - Spring 2024 (estimated 3 quarter completion)
Overview:
A new take on a studying application for students consisting of both mobile and desktop executions.
PROBLEM:
Students have barely any free studying resources that can help them with their academics.
- Quizlet, a main resource for students is now paywalled and is not practical option for students to pay for
- Many free study tools are outdated and difficult to navigate/use, for example Anki, a free study tool has not been updated in years
- Students need a way to study that keeps up with modern university technology, along with providing them easy navigational and organization options
RESEARCH:
The most efficient way to study for everyone.
Our team used a variety of researching methods to be able to best understand what students need most from a studying tool.
- Our main pain points surrounded paywalls and the learning about the engagement levels of study tool users
- We focused early research on color theory. This helped us integrate a reward system for users, ex: we learned the color green is perceived by users as doing well/improving
- Interviews included my team researching different study methods from a variety of majors. This allowed our team to thoroughly learn about how different majors used different study tactics
RESEARCH SUMMARY & SOLUTIONS:
Our main goals surrounded removing a paywall and making an engaging study application.
- Branding and a theme would have to be essential, keeping users engaged while studying was incredibly crucial.
- Different types of studying, not everyone studies the same, implementing variation allows for more students to utilize this application.
- Streamline and simple, users want to be able to study efficiently, while engagement is important so is clarity on features and functions.
LOW FIDELITY WIREFRAMES:
- Challenges:
Designing a homepage that prioritized google sign instead of the traditional user name and password.
- Resolution:
Our design team learned how to let go of designs we personally really liked for the practicality of the developer team
This design is what as a team we thought was best to work with in further stages regarding our home page
Old home page screens we scrapped, however still took inspiration from later on during the project.
MID FIDELITY WIREFRAMES:
- Challenges:
Tackling the features we wanted to add and being hit with the reality that there was a lot to do.
- Resolution:
Developers and designers both realized this project was going to take a lot, the best solution was breaking it down step by step and helping each other out.
Home page improvements, finalizing placements of icons and starting branding
Landing page mid fi, laying down placements and content.
FLASH CARD PAGE EVOLUTION:
- Challenges:
As this project moved further along our greatest design challenge was also the core of our project, the flashcard page. It felt like we were throwing ideas out constantly and nothing was sticking, a truly frustrating process for the team.
- Resolution:
Combine what you like, we realized many of our iterations had small features we really resonated with. As we tried more and more ideas our flash card page became a combination of everything we liked from previous designs. Creating the perfect balance between usability and aesthetic.
What we ended up finalizing after a lot of testing and designing.
Other page iterations our final incorporated.
SMART STUDY FEATURES:
- Challenges:
With our project concluding we faced one final challenge, which was making our final pages and tools, as stated earlier we wanted to be inclusive with different study methods, so how do we do that with flash cards?
- Resolution:
Smart study features, for our final wireframes and tasks we implemented smart studying features, which allowed users to toggle between space repetition studying and normal flash card quick studying.
Spaced Repetition feature
Quick Study feature
High Fidelity Wireframe:
All finalized screens produced in this project.
REFLECTIONS:
Letting Go: While us designers were absolutely in love with some of the designs we made they just wre not practical to keep in the project as we progressed. Learning to let go for the better usability was something we were taught during this project.
Deadlines: Working with a team of designers and coder we needed to have this project completely coded and running by the end of the school year, this really helped us designers learn about staying on track and making sure deadlines were met so developers could also complete their tasks in a timely manner.