Project cover image

Crawlr

Mobile app for planning and attending bar crawls

Project Overview

How can event planners plan and coordinate multi-site events? How can attendees easily join multi-site events?

Context

6 weeks execution time
Prototyping and Implementation Course
DePaul University

Teammates

Eric - UX/UI Designer
Kevin - UX Designer/Researcher
Melissa - UX Designer/Researcher
Tim - UX Designer
Zandra - UX Designer/Researcher

Contributions

UX Design
Axure RP Prototyping

Crawlr is a two-channel mobile application that allows users to plan and attend bar crawls.

Multi-site events present a number of challenges to event planners. Not only must event planners put on an amazing event at a great venue, but they must select multiple great venues. Multi-site events can be challenging for the event participants as well. With multiple locations scheduled for different times, it's easy for participants to get lost or confused as to where they should be and when, or vice versa. A classic example of a multi-site event is a bar crawl.

View of the bar details page from the planner user perspective

Enabling planners to coordinate great events

  • Research venues with integration of online reviews
  • Use map functionality to create the perfect crawl route
  • Create cozy private crawls or go all out with public crawls

Keeping participants connected

  • Chat allows event participants to keep each other updated
  • Find the bar crawl by tracking the crawl's location, even if you're late or if the crawl goes off schedule
  • Coordinated GPS location to help keep everyone together throughout the event

View of group chat from the bar crawl participant perspective

Creating a crawl

When creating a crawl, planners can set the privacy level of the crawl, search for venues, and research venues before adding them to their event. The process of creating a crawl is broken down into multiple steps as to not overwhelm the user.

After creating the crawl, the planner can review the details of their crawl.

Task flow for creating a new crawl as a planner.

Screens from the planner's task flow for creating a bar crawl.

Joining a crawl

Participants can view nearby public crawls and join them. As a crawl member, participants can use GPS location to keep track of each other, chat one-on-one, or chat as a group to keep each other informed.

Task flow for joining a crawl as a participant and staying in contact with the other participants.

Screens from the participant's task flow for joining a crawl and staying connected with the other participants.

Design Process

Ideation

We decided to design for a mobile plateform, since mobile devices are equipped with features that could address the user pain points. For example, GPS could be used to help participants keep track of each other during a crawl. Most importantly, a mobile platform would enable planners and participants to stay connected during the event. We held a design charrette to explore potential solutions to our problems and understand the scope of our features for the first design iteration. Everyone on the team contributed and we identified common needs across the different designs.

Early sketches of potential Crawlr interfaces

Some of my sketches from the design charette exploring potential features and flows for joining or planning a bar crawl.

Modelling

We identified two user profiles for our app: planners and participants. We modeled a persona for each profile and based on the personas, we wrote and sketched use scenarios.

Requirements

From our scenarios, we extracted a number of user requirements for each persona.

Planner Persona
Young woman persona

Paula Planner

Bio: 32 year old, tech-savvy blogger, college graduate

Tagline: “There’s no such thing as over preparation.”

Goals: Looking for an easy way to both invite friends to an event and keep them apprised of current location during a multi-venue night out

Frustration/Pain points: Likes to coordinate events like bar crawls, but has a tough time coordinating with all of her friends.

Planner Requirements
  • Create route
  • Find route
  • Schedule times
  • Name route
  • Research pubs, see bar info
  • Send invitations
  • Make crawl public or private
  • Manage crawl membership
  • Save crawls for future
  • Retrieve previous crawls
  • Identify favorite pubs
Participant Persona
Male participant persona

Fred Follower

Bio: 31 year old, high school health teacher, college graduate

Tagline: “Always late, always lost.”

Goals: Wants to know where his friends will be during a pub crawl so he can join in at any point during the night.

Frustration/Pain points: Always running late, and if his friends aren’t answering their phones, he never knows where to meet them.

Participant Requirements
  • Get invitation
  • Accept or decline invitation
  • Communicate with others in crawl group
  • Get directions to crawl in progress for current location
  • See nearby pub crawls
  • Join a public pub crawl
  • Keep track of pub crawl members
  • Receive alerts to stay on schedule

Moodboard

We used a shared moodboard to facilitate discussion as to how the end result UI should look like. The images in the moodboard also served as inspiration for our app.

Moodboard for Crawlr app

Shared moodboard for determining the look and feel of Crawlr and understanding what other analogous app look like.

Design & Prototyping

We iteratively improved our designs for the planner and participant task flows through sketches, modelling, and user-tested prototypes. We divided the work based on the two personas. I was responsible for the planner persona's prototype. The prototypes increased in fidelity from mid- to high-fidelity.

Mid-fidelity prototype screens.

Selected mid-fidelity prototype screens to address the planner's pain points when organizing a bar crawl. Left to right: List of user's upcoming and previous bar crawls; View to create a crawl and name it; Search results for finding matching a query in a geographical area; Detailed view of bar information including reviews.

High-fidelity prototype screens.

Selected high-fidelity prototypes for the planner persona improved from the mid-fidelity prototypes.

Iterative prototyping

High-fidelity prototype from iterating on the mid-fidelity prototypes. The look and feel of the prototypes was developed based on our shared moodboard.

Evaluation

We evaluated our prototypes with think-aloud usability testing. Following a testing protocol, our testers were asked to perform tasks on the prototypes based on the persona's respective use case scenario. Our evaluations were used to improve usability and reduce errors when completing a task.

The prototypes were effective in enabling users to complete their tasks with minimal errors (zero to two errors).

Our prototypes were tested after each iteration, totalling 3 rounds of testing per persona prototype.

Reflections

Overall, I believe that Crawlr is an effective first step to tackling the challenge of coordinating bar crawls. Furthermore, a bar crawl is simple a specific type of multi-site event, so Crawlr can reasonable be extended to other group-oriented multi-site events such as walking tours, weddings, and reunions.

While our user testing revealed flaws and bugs within our prototypes, they do not accurately reflect the intended use scenario since the tests were conducted on a desktop computer. Ideally, the tests should have been conducted on a mobile device to simulate the actual use of the app. Tests on a mobile device could have revealed potential issues with the size and clickability of interactive elements.

Since we worked in a remote team, there were some inconsistencies in the style of the planner and participant prototypes. Communication is essential for prototyping and established a shared understanding of the concept, especially in remote teams.

View related work

LACMA Integrated Experience project cover image

View project

LACMA Integrated Experience

Designing an integrated experience at LACMA