Back to Portfolio
More Projects

UX 101

UX Design: Mobile app for design students

by Julia E. Durall
UX 101 Mockups

For this UX design project, my challenge was to create an app that would help a UX Design student such as myself to improve his/her daily life.

Understanding the User

UX 101 Empathy Map & Persona

The user, Amelia Allen, is a blend of myself and my classmates, all of whom were older students with prior degrees and work experience in other creative fields. Amelia needs an app that can help her manage her time and keep her engaged in learning about design. Her goals are to succeed in all her classes and get a great job as a designer after she graduates. Through design thinking, I was able to quantify where the biggest pain points were in a design student’s life, depicted in the empathy map, persona, and storyboard shown above.

Sketches & Wireframes

UX 101 Sketches and Wireframes

One of Amelia’s core problems is finding time in her schedule to learn about current best practices in design, so I’ve designed an app to make this easier for her. The app would not only synchronize with her personal calendar to find open time periods, but also gather design-related articles to read and local events to go to in her available time. She can also enable a customized rewards system to help keep her on track.

User Flow

UX 101 Workflow

For the purpose of this project, I only fleshed out a selection of the potential features this app would have. The various settings would be created during a registration process, and are designed to inform the content of the other screens. The these wireframes were designed with Adobe Photoshop CC, and were made into an interactive prototype using InVision app.

Visual Design

UX 101 hero image

To show how Amelia would use the app in context, I created this photograph.

Edits made during mockup design included:
Adding icons to the home screen, and improving their arrangement
Adding photos and article titles to the "Articles" screen based on additional online research to find real-world articles
Redesigning the layout of the "Articles" screen to accommodate titles by implementing current best practices
Conserve screen space on "Events" screen by using a link instead of full text
Creation of timer icons for "Reminders" screen using Adobe Illustrator
Adding content to "Reminders" screen to flesh out the concept and add visual interest