All Projects, Experience Design, Visual Design

Design
Ramble Mobile

Ramble hero image

Overview
Ramble is a mobile application that makes walking safety a social effort through conversation, education, and allyship.

My Activities
  • Research
  • Ix design
  • Product design
  • Visual design
  • Evaluation

Class

Capstone Studio, MHCI+D, University of Washington

PREVIOUS RESEARCH

Our research and concept development phase explored the nuance of the walking experience, competing products in the space, and led to the generation and refinement of many compelling product ideas. Review that work here.

The Opportunity

We created Ramble to address aspects of the walking experience that the many personal safety applications and devices missed. This is largely because current products ignore the every-day experience, and instead focus on crisis moments. Few products adequately understand or are willing to take on the entire complex problem of feeling afraid while walking alone.

MODELLING THE EXPERIENCE

THE CRISIS MOMENT

Products on the market address user needs once people experience a high-intensity or traumatic situation.journey map

THE EVERY-DAY EXPERIENCE

Products miss the most common needs of users because most people’s experiences do not rise to a crisis level.normal journey mapFirst of all, though people often want to reach out to friends or family via their mobile devices when they feel afraid, they are often too embarrassed or ashamed, or simply don’t want to worry others. Fearful walkers don’t want to burden their relationships with their every-day fears. Perpetuating this problem is the lack of conversation about feeling afraid on the street. Very few applications encourage people to break this silence and share their fears.

Secondly, environmental factors like lighting and overgrown bushes impact how safe people feel at night. There are no products that link the experience of walking with city planning or crime prevention through environmental design.

Lastly, our subject matter experts and literature review revealed that simple behavior changes like posture and not wearing headphones can decrease the risk of victimization. No products on the market effectively help people learn techniques for protecting themselves.

Our final solution, Ramble, addresses these opportunity areas by:

 

Helping people feel “ok” about telling others they are afraid

Collecting data to share with environmental safety advocates

Helping people assess and respond to risk

Key Features

The Ramble application consists of three parts:

 

walking icon

Paired Walking

news icon

News Feed

tips icon

Educational Tips

View our final product video for a quick introduction to the concept:

 

 

PART ONE
walking icon

Paired Walking

 

Ramble connects walkers to anonymously monitor each others’ walk home. By connecting strangers, who don’t know each others’ location, Ramble eliminates the burden that single walkers feel they place on loved ones.

Additionally, walkers can communicate their unease to each other through the volume button. Ramble attempts to lower the threshold for communication of unease by allowing users to signal this feeling through discreet haptic feedback to their partner on button press.

Pressing the volume button also captures GPS coordinates, enabling the collection of location data that can be qualitatively enhanced through a prompt. Finally, a rapid multi-press can act as a panic button.

connect with partner

Connect with a partner before the walk.

Press volume button

Press the volume button when feeling uneasy, escalate by pressing rapidly

report experiences

Report what made you feel uneasy when you get home.

Paired Walking Key Features

PART TWO
news icon

News Feed

 

view news feed

Ramble encourages users to share their experiences with their local community via the news feed. This channel helps normalize discussion as well as disseminate information.

Our concept prototype evaluation revealed a social media wariness. Participants didn’t want casual content nor a stream of scary incidents. We decided to shape the tone of the content by combining user and system generated content, upvoting only, and value agnostic tagging language, to influence the feed towards actionable information and more low-key language. System generated content would take the form of safety tips and interactive questions and polls.

We believe that a combination of relevant local information and conversation, as well as educational content, strikes the right balance between social and actionable.

 

News Feed Key Features

PART THREE
tips icon

Educational Tips

 

Our primary research surfaced participants’ lack of confidence in their ability to effectively assess or respond to risks.

viewing relevant tipsThe third aspect of our application is an education component: Safety Tips –  brief, casual, and relatable tidbits grounded in research.

Tips promote things like an awareness of one’s surroundings, the importance of paying attention to intuition, how to carry oneself in order to reduce the chances of being targeted, and ways to respond to assailants.

 

Paired Walkingramble-connect-progress-500w

News Feednewsfeed animation

Educational Tipstip screen animation

 

Evaluation

1ST EVALUATION: CONCEPT PROTOTYPE


Prototyping questions


Test plan

Paired Walking Concept Prototype

We created a walking experience intended to simulate real feelings of unease to determine whether or not reaching out to another individual via a button press would be comforting. Testers who participated in both the scenario simulation and subsequent interview told us that being able to reach out to their partner when they felt uneasy was comforting.

Social Media and Tips Concept Prototype

In the interview part of our concept evaluation we showed participants paper prototypes of four different types of posts, varying in tone in an effort to determine what type of content they would be interested in. Our participants widely preferred posts containing actionable information over ones that were solely emotional because they saw them as an opportunity to make informed choices for future walks.

2ND EVALUATION: USABILITY TEST

user test

Using a wireframe interactive prototype created using InVision, I tested the application’s usability and desirability by having participants complete activities such as search for safety tips, reply to a report, and take us through a think-aloud exploration of the walking experience. This revealed small improvements that could be made to the UI like overlays but we found that the interface was generally understandable.

 

 

 

Design

INTERACTION DESIGN

System Model

sys-model-carousel-425

This model shows how Ramble works at a high level. Walkers are paired and can signal their unease to each other through a haptic pulse. They can report incidents that made them feel unsafe to News, and also access Tips. Meanwhile, data from using the walking feature is aggregated for reports that can be sent to city planners or other authorities.

User Flow Diagram

user flow

This diagram shows how Ramble works at a more detailed, step-by-step level. It describes a user’s possible paths through the Ramble application. The three main application sections of News, Paired Walking, and Tips are highlighted in yellow.

Wireframes

ramble wireframes

Process Photos

 

VISUAL DESIGN

Our visual design thus far used typefaces and colors that were bright, bold, and confident emphasizing caution and safety. In order to arrive at a consensus for the look and feel of the Ramble interface, we needed to do some quick brand work. I led the visual design development through a collaborative process involving a shared mood board, individual design rounds, discussion around brand attributes and directions. Below is a selection of pages from our style guide.

posterConcurrent with the interface design phase, I began using the brand attributes to create a product poster for our final presentation.

Iterating on the messaging and layout for two weeks, the final poster spotlights the intended experience of using the product and its benefits to our core user, while employing our brand’s visual language.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Credits: While all team members contributed to our collaborative process, Sarah O’Connor worked with me on the overall visual and interaction design, as well as photographing all the stages of our project. Kiyana Salkeld created our UI animations and interactions, facilitated the concept evaluation process, and generally project managed. Sara Al Mughairy produced our product video and contributed to our models, presentations, and storytelling efforts.
rei logo
This project was my final project for the Master in Human-Computer Interaction and Design (MHCI+D) degree. The project was sponsored by REI and advised by Tom Iurino.

 

 

Tags: , , , , , ,