Roam

The Objective:

To design a responsive web app for location-based recommendations that meets the requirements of its users and solves the problems they face with existing location-based recommendation apps.

  • Target Audience: users who need an accessibility-first platform

  • The Problem: creating a responsive web app that caters to diverse travel experiences

  • My Role: UX/UI Designer

  • Solutions: Accessible Color Palette, Familiar Interface, and Robust Accessibility Settings

  • Tools: Figma, Paper Prototyping

User Interviews

After creating my hypothesis, I set up interviews with potential users to get a clearer picture of what was missing from their travel experiences. To start I interviewed three people.

The initial hypothesis was that there would be a desire for an app focused on last-minute travel plans.

Interview Questions:

  • How often do you stick to a pre-arranged travel plan?

  • In the past what were the main causes of disruption to your travel plans?

  • What information do you wish you had readily available while traveling?

  • Have you used travel apps before? Why/Why Not

  • If so, what features do you wish were available?

  • What causes you the most stress when traveling?

  • What causes you the least amount of stress when traveling?

After conducting these interviews I discovered that the primary focus should be accessibility settings, whether that be for physical or financial concerns.

Personas

Based on the user interviews I conducted, I then crafted user personas to focus the scope of the project.

Guiding Questions:

  • User Backgrounds, goals, frustrations, and motivations, as well as what devices they use were all provided

  • The personas guided the design towards physical and financial accessibility

  • These personas acted as the foundation for my design principles.

Project Mood Board

I ended up inspired by bullet journals. Bullet journals have a lot of fun and fresh title blocks and aesthetic styling that make planning fun.

I also went for this orange and blue color palette because it compliments the energy the project was aiming for, as well as is one of the most accessible color palettes.

Wireframes

Low Fidelity Wireframes followed my user flows

  • Methodology: Crazy Eights

  • Paper Prototyping allowed me to create many iterations without getting overly invested in one idea

  • After choosing my favorite iterations they were made into paper prototypes and used for another round of user testing

User Testing

Before heading into more complex designs, I created paper prototypes and did another round of user testing.

  • Aims: To discover any pain points in my current flows

  • Test Subjects: A new round of potential users, with experience needing accessibility settings

  • Methodology: Remote screen sharing and video call

This round of testing was extremely useful. Users uncovered valuable insights relating to pain points, areas that could use more depth, and areas that were working well.

UI Design

After this round of testing, I began working on my responsive designs in Figma.

Visual Style:

  • Fun, engaging, and inspiring

  • Incorporating bullet journal stylings

  • Responsive web app, designed at 4 breakpoints

  • Designs with accessibility in mind

  • Appealing to disabled users without a typical sterile feel most accessible designs lean towards

Project Retrospective

This project was a lot of fun to work on. I enjoyed the challenge of creating a fun, interactive travel app while managing robust accessibility features.

  • One of the largest challenges was making sure to keep as many possible accessibilities catered to as possible. User interviews were invaluable to ensure multiple perspectives were kept in mind.

  • I went through several iterations to balance a fun, engaging design that also didn't distract users from functionality

  • I also incorporated fellow designers' feedback regarding the designs, which helped hone various design elements

More by Jo Goforth

View profile