Project Info

Team: Dana Chen (Me), Elliott Baker, Keith Rimmer

My Role: Project Manager, Heuristic Evaluation, Comparative & Competitive Analysis, Affinity Mapping, Journey map, Design Studio, User Flow, Task Analysis,  Logo Design, Site Mapping, Sketching, High Fidelity Design.

Tools: Adobe XD, Excel, Keynotes, Illustrator, Photoshop, Lucid Chart

Platform: iOS App

Timeline: 1 week of research, 1 week of design ideation and prototyping at General Assembly

UX Process - Double Diamond

In this project we were able to complete the UX process and iterate after in-house testing.

Step 1: Research

Comparative & Competitive Analysis

By comparing current e-learning apps out there, it gave us insights that allow us to see what the current standards are. We noticed that other companies in the e-learning space have the following: ability to login.create an account, learning videos, a functional search engine, and the ability to download videos for on the go.

We also realized that this was a great opportunity for YMCA to create an app because of the gap in the market for life skills in the form of e-learning app.

Interviews

We created a qualifying survey to target gen-z and millennials. From those who qualified, we interviewed 7 candidates then proceeded to affinity map value statements to see trends and patterns in a visual way.

We were able to further understand their lives, their habits, and to see what they deemed as valuable/important in an e-learning life skills app. It unsurfaced problems with current e-learning apps which informed us as to what to stay away from in our development of the app.

After gathering the data from those interviews, we were able to create an affinity map and group their thoughts into categories that helped show what we should prioritize and to craft our persona.

Persona

With the data that we gathered, we compiled a persona that exemplifies the motivations and frustrations of our users. 

Step 2: Design

Feature Prioritization

The affinity map also allowed us to categorize what users wanted and how to prioritize their needs. This led us to create a guideline of features that users wanted in an e-learning app. We concentrated on the following features: the ability to download videos for offline viewing, full lesson pages, a section to discuss what they’ve learned, a search function, YMCA event page, and a way to seek out mentors.


Style Guide / Moodboard

YMCA uses more than words to bring our cause to life. Its basic elements such as logo, areas of focus, color palette, imagery, font and benefit statements— are the building blocks for consistently and effectively communicating who we are and our impact.

Since YMCA already has an official color palette to represent the organization. The use of color helps express that we are as vibrant as the communities we serve, and it is important to be consistent and use only the colors that YMCA has chosen as part of the brand guide.

The welcoming and caring feel of the organization is also found in the “form” of our words. Typography is the element that gives our words a distinctive look and feel even before someone reads the text. We wanted to use a keen eye to keep the overall layout organized yet dynamic. Cachet and Verdana are the only two fonts ever to be used for YMCA collateral.

Based on the existing brand, we created a mood board using the current brand guidelines and style guide. Our mood board included a sense of creativity and playfulness. Doing so helped us gather ideas and inspirations that would inform the design of the app.

This helped us stay within the YMCA’s style, visually representing what the YMCA wants helps our team stay on the same page during the design process.

Logo Design

Using the style guide we wanted to create a unique logo for the adult life skills application. This logo uses a calming blue and prestigious purple to usher in a new era of the YMCA. The YMCA’s logo with the added YALS acronym synchronize to create a new path for young adults to learn needed life skills. 

Tagline

Using the newly designed blue and purple YMCA logo, we wanted to inform users that the Y has the How in terms of guiding their life path and knowledge of life skills. Pushing the physical boundaries of your local YMCA into the digital realm where you can learn the skills you want at your own pace and time.

Sketching

Before we got into sketching, we had a design studio session where we were able to explore a wide set of ideas and create a shared vision to move forward within a short amount of time. It incorporates brainstorming, critique, and prioritizations into a condensed session. 

Taking all the ideas from the design studio, we began our hand sketches. Once sketching was done, we conducted usability testing to see if users encountered any problems. After usability testing, we were ready to make more iterations to ensure the user had a smooth and enjoyable experience. We were then ready to continue designing by applying the brand’s style guide with contemporary design techniques to create a minimum viable product.

Next Steps

The current iteration of the prototype can always be expanded and continue to grow. With more resources, we would like to create even more functionality within the app. 

First, Expanding upon the lesson page discussion and creating a full fledged networking function would allow even more user to user connection and viewpoints to enhance the learning experience. 

Secondly, Partnering with other companies to continue the apps growth while also being able to add new lessons and workshops would be mutually beneficial to their brand and the YMCA’s. 

And lastly, users like to feel accomplished in their learning. By creating lesson specific games and an achievement system, users would feel even further accomplished and reinforce their learning.