Context
Adolescents and young adults are looking for ways to becoming more involved with events/ activities in their communities, learning new skills, and meeting new people but in a way that is safe, convenient, and fun. The Xtracurricular application is intended to satisfy these needs of young adults by providing them with an application that informs them of activities in their communities that they can become involved in. By becoming more involved, young adults can make new friends and become active participants in their communities.
Solution
-
Create an application where young adults can become connected with local events and activities in both their school and local communities.
-
Create an application that provides young adults the opportunity to learn new skills based off their specific interests. The application provides learning modules and skill development videos for users to learn at their own pace.
-
Create an application that connects young adults of similar interests and provides opportunities for them to become involved with activities that are in line with their interests.
Project Goals
-
Gather user insights - needs, wants, expectations.
-
Develop a user responsive phone application which allows users to find local events/activities to take part in, learn new skills, and connect with new people.
My Role
-
Market Research (User Profile / Competitor Analysis)
-
User Research - Screener Survey / User Flows
-
Low Fidelity / Mid Fidelity
-
Visual Design - High Fidelity Wireframes
-
Usability Testing of Prototype
-
Deliverable - Interactive HiFi Prototype
Understanding the Problem
Market and User Research
Competitor Analysis
-
When initially searching for direct competitors for my application, I wasn’t able to find an app that provided all the features I had planned to include. However, I took the approach of reviewing the competitors that I felt provided individual features that I wanted include in the extracurricular application.
-
Competitors: Eventbrite / Skillshare / Meetup
Screener Survey
Developed an initial Screener Survey to first determine whether there would be a market need and interest in an application that provides the features of the Extracurricular App.
Design of the Solution
Design Process Overview
Interview Questions
I conducted potential user interviews and presented them with 10 questions to gauge their interest in the product I intended to design. Here are a few of the key questions asked:
​
-
Do you participate in extracurricular activities?
-
Do you currently utilize tutoring services or have you in the past?
-
How do you go about learning a new skill or find out more about a potential hobby?
-
Do you enjoy meeting up with friends?
-
Do you enjoy learning new things?
-
Do you like making new friends?
Design of the Solution
Decisions & Wireframes
Design Decisions
For the design of this product, the intentions were to create an interface that is visually appealing and intuitive for the user. When users utilize the app, there would be no confusion on where to find key information and make decisive decisons as the user. The product design began with flushing out the essential user flows. The most important Red Routes were evaluated and constructed with the idea of making a seamless process for the users. From there, the low/mid/high fidelity wireframes were evaluated and flushed out over multiple iterations.
Red Route Sketches
Using Procreate on the iPad, three of the most essential Red Routes were sketched out and planned. Taking time to methodically consider the best approach to each Red Route helped to ensure an efficient product for the user.
Design of the Solution
Design Process Overview
Low/Mid Fidelity Wireframes
My intentions when designing the wireframes of the Extracurricular App were to create a clean, clear, and concise user interface that would appeal to a younger audience with the integration of familiar features from many popular platforms they currently use (ie. Tik Tok, Instagram, etc.).
The “Friends” page design included a familiar friends menu bar, that allows for quick access to friends posts within the application and the ability to “add” a friend.
The design features of the application show a clean and concise interface, that causes no confusion for the user. The design clearly lists the available activities with the ability to like and register for an event.
Final Design
High Fidelity Wireframes & Prototype
Design Approach
The approach when designing the Final Prototype Design and Hi Fidelity Wireframes was a to create a product that would be visually appealing to the adolescent users and bring a sense of engagement. The use of bright vibrant colors was a deliberate choice in the design that gives a sense of happiness/excitement to inspire users to become active participants in the application.
“Bright”, “energetic”, and “fun” were the adjectives used as inspiration for the design of the opening pages of the application. When users arrive inside the application, the interface should bring about a feeling of engagement and excitement for the opportunities that lie within.
Clean, crisp design features were the focus of this application interface. Cohesion throughout the design of the application was essential, while at the same time, giving each page a differentiating look was the goal when designing the user interface.
Final Design
The final design produced a product that meets the expectations of the end user. The Activities Page provides a great resource for discovering events to participate in that are happening in your local community. The Friends Feed Page serves as a great way to connect users and allow them to learn about others learning experiences and activity involvement. The feed provides familiarity with other popular feeds currently on the market for other applications. The color palette consisted of a neon green, navy blue, hot pink, and powder blue. The chosen font was an Avenir Next of different sizes and thickness.
Testing The Solution
User Testing & Feedback
Usability Testing
I conducted a Usability Test on 5 participants using an Interactive Prototype in hopes of uncovering any user issues or design flaws. With feedback from the testing I was able to make updates and further improvements to my application design.
Test Scenarios
Scenario 1 “Sign Up”: Assume you’ve just downloaded the application and are opening it for the first time. Please sign-up for the app.
Scenario 2 “Add a Profile Photo”: You want to change you profile picture. Please change your profile picture.
Scenario 3 “Register for an Activity ”: Please register for an activity you’re interested in attending.
Scenario 4 “Add a friend ”: You’ve recently attended an activity and met some cool people that you’d like to add as friends. Please add a friend to your list of friends.
Scenario 5 “ View Your Activities Calendar ”: You’ve registered for an activity and added it to your calendar. Now view your activities calendar.
Scenario 6 “Send a Message ”: You meet Ashley Reyes at a volunteer event the other day. You’ve already become friends on the app. Send Ashley Reyes a message.
Improvements
-
Add Registration or Activity details when clicking on the image
-
Include notifications of when someone likes one of your posts to the friends feed
-
Addition of the Calendar to the Profile Page
-
Ability to add ‘Skills’ to follow from the ‘Skills’ page
Results
This project was a great opportunity to design a product that doesn’t currently exist on the market that’s geared towards the adolescent age group. Ultimately, the product provides a platform for younger people to easily find activities of interest to become involved with. While at the same time, providing a platform to share their experiences with current and potential friends. The Extracurricular App serves as a learning source and networking platform for the youth who are very much interested in an application of this sort.
​
This project was a great opportunity for me to grow as a designer and gain further experience in the User Experience Design process.