Vola

Top 10 Finalist @ Amazon + Adobe Creative Jams

Focus

UX Design and Problem Solving

Timeline

2 Weeks: Nov 2021

Tools

Adobe XD

Vola is an app prototype that centers on accessibility; it provides an inclusive and equitable experience for all high school students searching for volunteering opportunities and personalizes each user’s experience towards their needs.

See Prototype

Problem

Inspired by Amazon’s initiative, your challenge is to design an inclusive experience in a third-party mobile app for high school students looking for opportunities to fulfill community service hours or volunteer to help their local community, no matter what their background or ability.

Defining Key Problems

Identifying Solutions

User Persona/Empathize

Jane (She/Her)

The Proactive High School Student

Jane is a 16 year old high school student at Bloor Collegiate Institute who is seeking more ways to contribute to her community through volunteering. She loves spending time in nature and helping supporting other students in school. However, Jane was born with retinitis pigmentosa, which is a genetic condition that causes blindness. As a result, she requires visual assistance and relies primarily on auditory tools to complete tasks. For that reason, she wants to find an easy way to discover and sign up for volunteer activities near her that also take into her personal needs.

Pain Points

  1. Scarcity in accessible and personalized volunteer opportunities Personalize experience
  2. Difficulty to discover local opportunities Prioritize location
  3. Lack of equitable design in existing platforms Accessible design

Research

We conducted both primary and secondary research. In terms of secondary research, we learned from online research articles and publications. We also referenced existing applications and identified potential areas of improvement and ideas we could apply to our prototype.

My Selfless Act

Strengths

  • Variety of filters of wide range of opportunities
  • Inspiring community pages
  • Ability to search by location (city name)

Improvements

  • Small and difficult to read font
  • No personalized filter options for different accessibility needs
  • No voice integration

MyImpactPage

Strengths

  • Volunteer hour tracking organized by time
  • Option to display by category
  • Strong contrast and colour scheme

Improvements

  • Inconsistent layout and spacing
  • Lack of information hierarchy
  • Overcluttered information in one space

Ideation

User Flow

Solution

Key Features

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

See Prototype

Visual Design

Iterations

During the first week of the Creative Jam, we had a consultation with an Amazon Product Designer regarding our app design and from this coaching session, we made 2 main alterations:

Change #1: Changing the Color Palette

We decided to change our black buttons to dark green and dark gray. This change reduces the contrast on the eyes and creates a warmer light with the green. On the other hand, we altered the original lighter green buttons to darker green buttons to increase contrast; for individuals with visual impairments, contrast is more significant than color. Thus a darker green would help contrast the white text better on top of buttons.

Change #2: Adjusting Buttons

We adjusted the locations of buttons and other interactive areas of our prototype towards the thumb to improve the usability. We also increased emphasis on areas that users need to interact with, such as creating a shadow behind the login area to draw the users attention towards action items.

Design System

Palette

To ensure accessibility, we avoided the use of color as identifying tool and primarily used monochromatic tones to assist users with colorblindness and/or other visual impairments. We also decided to use green as the highlight color since it is scientifically proven to be the easiest color on the eyes.

Typography

We decided to use simple sans-serif typography since it is more legible compared to over-formatted text, which can be difficult for users with dyslexia and/or visual impairments.

Iconography

We used a variety of icons to make the design more intuitive, user-friendly, and reduce the need for words.

Reflection

Feedback

After I presented our prototype during the Final Ceremony of the Creative Jam, we received invaluable feedback from the judges, which included both successful areas and areas of improvement:

Strengths

  • Excellent solution that addresses primary user pain points and the challenge problem statement
  • Strong emphasis on accessibility during onboarding
  • Effective and creative use of voice commands a
  • Accessible colour scheme and contrast

Improvements

  • Text sizing was too small and made the design interface difficult to see
  • Prototype was not as intuitive to the user story and the walkthrough was needed to better present the user experience

My Learnings

The critique on our design opened my eyes to the many areas of improvement and growth points of our submitted product. However, I was not satisfied with simply receiving feedback and to reflect my learnings after the Creative Jam was finished, I implemented the feedback we received into the updated prototype you now see.

If I were to work on this design challenge again, I would focus on establishing more structure in the design system, such as including margins to simplify formatting. I would also focus on creating a more concrete user story through the prototype to reduce the ambiguity of the prototype itself.

Beyond learning and improving my design skills significantly, working on this project taught me a lot about partnership. This project was my partners first Adobe Creative Jam and first time using Adobe XD. Thus, I tried my best to help my partner and teach her my knowledge of Adobe XD and the Creative Jam design process. However, to help balance the workload with respect to the tight timeline, I had to take on the majority of the workload, including the research, ideation, designing, and prototyping, as well as the Finalist presentation for the Judges and consultation with a Product Designer at Amazon. Nevertheless, taking the lead on this project and working with my partner was an incredible learning experience that taught me a lot about design and the importance of teamwork!

See Prototype