UX/UI Design Case Study

OVERVIEW

Calendoo is a native mobile app designed to help users organize events and tasks in their life.

Purpose + Context

Calendoo was one of the first projects from the UI Design course of Careerfoundry. This project introduced me to the UX/UI Design process and helped familiarize me with design techniques.

Objective

Calendoo is for users who need help getting their to-do lists organized. My goal was to design a relatively simplistic interface that would not overwhelm a user who most likely already has a lot on their mind. Calendoo allows users to create to-do lists, organize individual lists into categories, favorite lists, and set reminders.

My Role

I was responsible for developing the UX/UI design of Calendoo. I conducted research of similar apps and identified key UI patterns. I created Low, Mid, and High-Fidelity Wireframes.

MY APPROACH

Research

I researched similar to-do list apps like Evernote, Todoist, and Lists To Do. Researching similar apps taught me how to identify UI patterns and their key functions. I implemented some of these key functions into Calendoo.

User Personas

I created 3 user personas based off of my research which helped me design smarter for the users of Calendoo.

User Flows

I developed a user flow diagram that would illustrate the key functions of Calendoo.

Low-Fi Wireframes

I started out by sketching Low-Fidelity Wireframes of the IOS mobile version of the app.

Mid-Fi Wireframes

Prototyping

I had a few different users test out a prototype of Calendoo in its beginning stages. I created hotspots on my Mid Fidelity Wireframes in Sketch so users could click through the app as if they were really using it. Users identified what they liked and didn’t like. This feedback allowed me to make adjustments before I created my polished High-Fidelity Wireframes.

Mood Board

I wanted the overall feel of Calendoo to be refreshing and to put users minds at ease. Mixing the mint with a few other bright accent colors gives off a clean easy-going vibe.

Color

Typography

Icongraphy

Elements

Hi-Fi Wireframes

Establishing the design direction of Calendoo guided how I designed the High-Fidelity Wireframes.

Challenges & Takeaways

There are so many organizational apps already out there. It was challenging to brainstorm ideas that did not already exist. The more I researched inspiration, the more I was able to come up with unique ideas of my own. I designed a home screen that had minimal elements so the user would not be distracted with extra “fluff”. Less distractions = Efficiency. On the lists screen, I designed icons that represented list categories to help users keep all of their tasks organized.

Calendoo was my first app design and I am proud of it! As I’ve learned more about UX/UI Design throughout my Careerfoundry course, I had to go back and make some updates to Calendoo. For future iterations I would like to add screens that show the user profile page, pop-ups, empty screens, and more details of the task draft screen.