HYBRID APP

A to-do list progress tracker

A to app that tracks the progress of a to-do list and encourages user to complete tasks created on the to-do app.

splash screen for hybrid app

PROBLEM

How did the problem arise?

As an individual , I often create tasks list which I find difficult ro follow up due to busy activities and also, no constant reminder of the tasks I have to complete. Eventually leading me to forgetting about the tasks I’ve created on the to-do apps on my smart device.

GOAL

What outcome is expected?

The aim is to design an app that helps track the progreess of tasks created on the app and give a realtime feedback as a task is completed. In order to make the user keep in mind the tasks created, visual feedback will be shown through the notification pane of the smartphone. This constantly reminds the user the tasks to be completed. In addition, the tasks created will be backedup to a cloud database so it can be accessed anytime, anywhere. This step helps prevent data loss.

splash screen for hybrid app

IDEATION

Idea generation and problem solving

After deciding the features the app is expected to have, I checked out similar to-do apps to get a better insight of how a typical to-do app looks like. Afterwards, I created a userflow that shows a user’s journey when interacting with the app, starting from the splash screen to where lists are created and completed.

image showing the sitemap of hybrid app

Using the userflow, I sketched out a wireframe on a paper that represents the skeleton of the to-do app interface.

sketch showing the wireframe of hybrid app

PROTOTYPING

Steps taken to create the final design

CONSTRAINT

I was stuck with the problem of getting the perfect illustrations for the onboarding, so I created one from scratch.

illustrations used for hybrid app

COLOR DECISION

I chose to use blue-purple color scheme because purple both calms and stimulates the body, putting the mind in the right for introspection. Blue also signifies progress and ambition which tallies with the aim of the app.

sketch showing the wireframe of hybrid app

RESULT

The final design screens

ONBOARDING SCREENS

A series of screens which direct users through the app interface. These onboarding screens help educate the user about the functions and benefits of the app.

splash screen for hybrid app
splash screen for hybrid app

SIGN UP AND LOGIN SCREENS

The sign up screen to prompt users to sign up so as to get a backup account to sync their data and a login screen to help restore previous data backup if there’s any.

TASK CATEGORY

Makes it possible for users to group similar tasks into categories for easy identification instead of scrolling through long list of tasks. Users can also create new category with an appealing layout.

splash screen for hybrid app
splash screen for hybrid app

TASKS LIST AND TASK VIEWING

Users can view tasks in each category and take some actions like renaming the category, mark a task as completed, create new task and delete multiple tasks. Users can also view full details of a tasks and take few actions like task editing and marking a task as completed.

TASK OPERATIONS

Users can easily create new tasks, add each task into their category of choice, may add time and date and can also give optional description to the task. Users can as well edit task and modify any part that needs modification.

splash screen for hybrid app
splash screen for hybrid app

PROFILE SETTINGS

Profiles can easily be edited by users. Here, users can change their display picture, username, password and choose a backup email.

NOTIFICATION PANEL

Users are given notification of tasks that are to be completed which shows the description of the task as well, with an easy option to dismiss the notification or mark it as completed.

splash screen for hybrid app

CONTACT US

Get in touch with us through mail or socials for any enquiry

HIRE US

Want to start a project with us?

Service

What service do you want? You can select more than one