Compass: Spontaneous Adventures in ATL

RE-DESIGN EXTEND. Emory CS 485: HCI

Noah Okada
10 min readApr 25, 2022

--

“The designer does not begin with some preconcieved idea. Rather, the idea is the result of careful study and observation, and the design a product of that idea.”

— Paul Rand

To effectively design a product for users, designers must carefully evaluate the needs and goals of their target demographic. As designers, we must acknowledge that no product will perfectly fit every user, and thus must tailor our designs to address the subset of problems we identify as most important to our users. This process of optimizing a design for a specific audience requires robust evaluation and iteration to create a refined design.

In this design sprint, my group and I revisited our design from Design Sprint 1: Design for Others to re-design and extend our MARTA website to better serve Georgia State University students. Over the course of two weeks, we successfully user evaluations of our product, designed new solutions to optimize the product and created a tangible prototype to extend our website.

Evaluate

To begin this process of redesigning our website, we revisited the initial design that we had developed in the Design for Others Sprint.

Our design was a mobile website for the MARTA transit system targeted at GSU students. We developed our design with an emphasis on three features.

  1. Planning a trip from one destination to the next.
  2. Exploring Atlanta by searching curated events in the area
  3. Staying up to date with the transit info

Based on our initial user research we felt that these features best captured the needs of Georgia State students. However, we wanted to conduct additional user testing and evaluation of the interface to understand two key questions:

  • How usable is the layout and structure of the current design?
  • How do college student users interact with this type of platform? What key features do they want?

the experiment:

Usability Study Design

We designed a usability study to evaluate the usability and strengths of the features on our platform. We selected 8 participants to evaluate our initial designs based on several objectives. Participants were college students at Emory University, an approximation of our GSU target audience.

To conduct the study, we subdivided participants into groups of 2 and asked them to utilize the platform to accomplish one of four objectives. This division allowed us to evaluate the usability of all features on our platform, and to better understand how users would approach the platform in different settings.

The listed user objectives were:

  • Plan a trip from GSU to the High Museum (Plan a trip feature)
  • Find out about the MARTA running times (MARTA info page)
  • Find a spontaneous activity to do in the city (Explore ATL function)
  • Discover something new that you have never seen/done before (Any of the functions)

During the evaluation, we utilized the thinking-out-loud method to better understand how participants were making choices while using the platform. After the user accomplished the goal we asked them to share their experience using the platform and discuss the key features that they liked/disliked.

The evaluations were conducted in person, with one member of our team present during the process to assist users and take notes.

the results:

Afer conducting these usability studies we categorized the results by user-objective and feature. We then summarized the user feedback into key points of evaluation for each objective.

Results from users tasked with objective 1

When users were instructed to plan a trip from GSU to the High Museum, we found that they easily followed the UI to navigate to the Plan a Trip page. They then appreciated the fact that the home page was easy to navigate as they found clearly specified routes and were able to locate their destination.

However, the users felt that they could not specify a favorite route or engage with information about specific details of the route. They also asked for the inclusion of more social features.

Results from users tasked with objective 2

When users were instructed to find out about the MARTA running times, we found that they navigated to the Info page. The users felt that it was easy to find the information page, however, they struggled to find the exact information they were looking for.

They claimed that “it takes too many steps to find the desired information.”

Results from users tasked with objective 3

When users were instructed to find a spontaneous activity to do in the city, we found that they navigated to the Explore ATL page. The users found this page very helpful for finding out about the events occurring in the area, and claimed that they would use this feature as college students.

They did, however, want more ways to engage with information about the activities. They also heavily requested social features be integrated with the platform.

Results from users tasked with objective 4

When users were instructed to discover something new that they have never done before, we found that they most commonly navigated to the Explore ATL page or the Info page. The users claimed that these two pages allowed them to find new experiences or information that supported their exploration of MARTA.

However, the users claimed that there were not enough options for “new” things to do on the website, and thus they felt that they would not use this functionality. The users also felt that there were not enough activities that encouraged “group hangouts” and wanted more options to encourage spontaneous exploration.

Iterate

After analyzing all of the results from the usability study we reflected on the findings and considered their implications for our next design.

Summary of Findings from Usability Study

From our study, we found that the feature that was most appreciated by users was the Explore ATL feature. Furthermore, we found that this feature was give the most amount of suggestions for improvement by users. The robustness of data surrounding this feature led us to place heavy emphasis on investigating the options for iteration upon this feature.

We discussed many methods by which to improve this design, however, two key points stood out in our reflection and discussion of the feedback.

Point 1: Improving the Social Functionality of the Interface

As college students, users told us that they are primarily accessing public transit for social and academic-related activities. They requested that we improve the “Explore ATL” function to better meet the needs of these social settings.

One user put it this way:

As a college student, when I first enter college I want to explore my new city. But I don’t want to do that alone. If this MARTA app allowed me to connect with others as I go on adventures, it would be really useful to me!

As we reflected on this feedback we realized that our next iteration needed to center around the spontaneity and adventure of exploring a new city. We wanted to develop an interface that encouraged new friendships through exploration.

This concept became the backbone of our ideation phase.

Point 2: Improving the Number of Options Displayed to Users

The next complaint we received was that there was not enough options displayed on the Explore ATL page. With rotating images that only displayed four options, our initial design didn’t fully represent the diversity of interests that our users brought to the table. Therefore, we discussed the possibility of including more options that were driven by information stored on websites such as Yelp and Google Maps. We concluded that our next iteration could allow the users to choose a category, and then be given a list of suggestions based on that category.

Extend

After reflecting on these points, we proceeded to begin designing our redesigned interface that was extended for tangible interactions. We utilized the 5-design sheet methodology to ideate several designs. We then prototyped our design using paper, cardboard, and finally, a mid-fidelity 3D printed design.

DESIGN SHEETS:

Design Sheets 1–2

Using our first design sheet attempted to explore all options in the design space of tangible exploration devices. We discussed the possibility of wearable devices such as bracelets and rings, as well as other devices such as compasses and pocket-watches. All of these ideas centered around the idea of social exploration devices.

Design Sheets 3 and 4

With our next design sheet, we sought to better outline the functionality of our design. We explored how our users could use the interface to find different activities throughout Atlanta. We outlined designs where users could however over objects to find new locations to visit or use a pop-up to develop spontaneous trips “without a plan.” These designs informed our conceptualization of the functionality of the device.

Design Sheet 5

In our final design sheet, we integrated the best components of design sheets 1 through 4 to create an optimized design. This design focused on the tangibility outlined in sheets 1 and 2 by focusing the attention on a physical interface that the user would hold. Because of the theme of “adventure” that we wanted to highlight in our design, we chose to use an analogy of a compass when designing the interface. To maintain the functionalities discussed during the iteration phase we optimized this design to have two faces, one that would showcase categories of activities (food, culture, music, sports), and one to allow users to select their activity based on their time constraints.

We also extended this design to better fit with the theme of MARTA, by enabling the compass to function as a Breeze card so that users could simply carry this device during their adventures through Atlanta.

TOOLS:

We developed this prototype in three phases to model the development for both low, mid, and high-fidelity prototypes.

Low fidelity prototype, and high fidelity prototype development using 3D printing

For our low fidelity prototype, we used cardboard to build the structure of the compass. We used a simple screw and nut to bind the pieces together so that the user could functionally hold and spin the compass.

Mid-fidelity prototype

For our mid-fidelity prototype, we used paper and cardboard to create a larger model of the device. This device was designed to fit into the user’s hand and weighted to feel comfortable for a user to carry around during the trip. We primarily conducted user testing using this device.

High-fidelity prototype

For our high-fidelity prototype, we 3D printed a model of the compass to create a realistic and usable model of the device. Although we wanted to integrate the Breeze card and web-interactivity functionality using NFC tags, we were not able to access these technologies. Instead, we used a wizard-of-oz MVP model while testing this device.

RE-EVALUATE:

Once the mid-fidelity design was developed, we conducted an initial user evaluation for three users. All participants were Emory University college students who had used MARTA for transit at some point during the past year. Our goal was to determine how MARTA users felt about carrying a compass instead of a breeze card, and to also understand how college students would interact with the social aspect of the interface.

In this user test, we asked each user to use the compass to find a nearby activity to engage in with friends. We used a wizard-of-oz MVP strategy to conduct this user test, where participants would choose a category using the compass and then tap the experimenter’s phone which would display the Figma design with options for restaurants and activities in the area.

Results:

Feedback Initial User-Test

All users were very excited about the device and provided positive feedback on the interactivity. The users felt that the multiple recommendations to choose from based on the compass categories gave them the freedom to explore the area based on their interests.

However, some users felt confused by the dual-sided nature of the prototype. They suggested that the device be modified to have both time and categories listed on a single face of the compass.

We evaluated this feedback and modified our high-fidelity design to be a single-sided compass.

Demo

Finally, we created a demo video to showcase our design process and illustrate the functionality of our prototype. This demo was presented in our CS 485 class and we were given feedback on our design and implementation.

We also created a modified Figma to display how our final web interface would interact with the physical prototype. This Figma kept elements from our initial design while also extending the features to allow for integration with the compass-based recommendations.

Conclusion

In summary, my team’s work creating a robust evaluation and iterating on the insights from this evaluation enabled us to create a refined design. This exercise of redesigning our platform allowed us to explore the design process of tangible interfaces while also refining our ability to design for others. By effectively leveraging the insights from carefully designed usability studies we were able to develop a socially driven compass for the MARTA transit system. This compass enables users to find connections while exploring Atlanta.

--

--