MINDFULNESS APP

Final project for my Mobile Web Technology course. Using the jQuery Mobile Framework, this app has a responsive, mobile first design. The goal of the Mindfulness App is to be an accessible resource for users new to meditation and mindfulness.

There are a number of different exercises organized by type and by time. For example, exercises that take approximately one minute can be found under the “1 min” category while walking meditations can be found under “walking.” There’s also a “Tips” section for new users who need some extra help and encouragement.

Screenshots

IDEATION

Target audience will consist of young professionals, between 18 to 35 years old who use apps frequently and are interested in health, the environment, and have some knowledge of mediation.

Wireframe Sketches
Wireframe Sketches

WIREFRAMES

Refined Wireframes

LOGO SKETCH

Logo Sketches

PROTOTYPE

Built a prototype with HTML, CSS and the jQuery Mobile Framework.

USER TESTING

Testing was performed on the navigation and task flow. For first time users, it was important to see if individuals could quickly and easily navigate through the app to find specific information.

Task 1 - Find 1 minute exercises

Observations: Users immediately found “1 min” exercises without any problems.

Task 2 - How would you setup the timer?

Observations: Users found timer by clicking “timer” but majority felt it should be a countdown clock where they can set the length of time and they’ll know exactly when to end their meditation.

Task 3 - Where would you find general information about meditation?

Observations: Users clicked either “info”, “benefits”, or “tips” section.

SCREENSHOTS

Screenshots

Modifications: Based on the testing results, the timer was changed to a countdown clock where users can set the time and have an alert go off once their time was up.

Technology

HTML, CSS, JavaScript
Illustrator, Photoshop, Brackets
User Research, UI/UX Design, User Testing, Front-End Development