Ithaca Transit Local Guide redesigns how people discover Ithaca hidden gems.

 

Contribution

I proposed and took ownership of Ithaca Transit’s new feature, Discover Ithaca.

Duration

April 2019 - May 2019

Role/ Skills

Lead Product Designer / Product Thinking, Interaction Design, Visual Design

Platform

iOS

 
 

Overview

Team Cornell AppDev

Designer Mind Apivessa

Since our launch in April 2018, the team has been focusing on building the core components necessary to get users from point A to point B as reliably and seamlessly as possible. A challenge we face was as people become familiar with the area and their frequent routes, they find less value from the app, resulting in a low retention rate among upperclassmen and local Ithaca people. In addition, Tompkins Consolidated Area Transit (TCAT),our business partner, also asked us to prioritize increasing the usage of general Ithaca community alongside retaining students who are our main user group. 

We are introducing “Discover Ithaca” feature, a local guide where users can get recommendations on new places to visit in Ithaca. We hypothesized that locally-sourced and carefully-curated list of recommendations that can’t be found elsewhere would increase the retention rate. 

 
Local Guide1.png
 

Expected Impact / Metrics

Increase in-app user retention: by offering unique, trustworthy, and personalized recommendations, we will be able to increase the value that users find in using our app. They won’t only come to us for reliable bus schedule information, but also for suggestions on where to go provided by those who live or have lived in Ithaca.

Increase growth through user-ID analytics: with more data on where each user like to visit, we can potentially provide an even more personalized list of recommendations and retain them. For example, if they visit one specific place at certain hours frequently, we could offer them a suggestion on new things to see in those areas. 

Increase in adoption rate: by offering new and valuable content, we expect to expand our user base and see an increase in the adoption rate of the app.

 

 
 

Define

 
 
How might we enable users to better explore and appreciate Cornell and Ithaca through Ithaca Transit?

We hypothesized that locally-sourced and carefully-curated list of recommendations that can’t be found elsewhere would increase the retention rate. Due to time constraint, I broke the design and development process into three steps: MVP, birthday cake, and wedding cake. 

New feature team brainstorm

New feature team brainstorm

Roadmap

Roadmap

This case study will focus on the design process of the MVP version, which will be launched this upcoming fall.

Develop

Information Architecture

Differentiation is key. We determined two differentiating aspects — unique source of recommendations and action-oriented content — that served as our guidelines throughout the design process.

  1. Unique source of recommendations: As a local organization, we have access to the local community like no one else. I sent out questionnaires to these three main groups: students, faculty and Ithaca locals, and alumni. For students, we focused on asking questions that will help us gain information on what are popular among students during different times of the week and year. Since the majority of our users are students and our goal is to improve retention, their recommendations are essentials. For alumni, we focused on asking questions about what they wish they have done and what their favorite things to do. Most alumni we talked to knew about things to do often realize or start looking for new things to do right before graduation and end up not having enough time to go through the entire checklist. Lastly, the locals can offer information on the real Ithaca gems on what to do in Ithaca since they spend the majority of their lives there. 

    From 118 questionnaires, we curated a list of use-case- based recommendations. For the MVP version, the recommendations are hand-picked. For future iterations, we will pursue a data-driven approach to content curation. 

  2. Action-oriented content: Another key differentiating factor is action-oriented content. We don’t want the local guide to simply be a list of places to go. We want to make the feature our users’ travel companion, highlighting the human aspect of travel guides. We are achieving this through using action-oriented copy and story-based presentation of content. For example, instead of ratings and exhausting list of reviews, we will showcase carefully-curated and genuine stories from local people in later versions. For the MVP version, we focused on conversation-like and action-oriented copy for the use case. The diagrams below show the information architecture for the MVP version, a snapshot of copy explorations for different use cases, and a snapshot of copy explorations for recommendations. 

Information architecture for the MVP version

Information architecture for the MVP version

A snapshot of copy for use cases explorations

A snapshot of copy for use cases explorations

Copy for recommendations explorations

Copy for recommendations explorations

Interaction Explorations

Entry point

The discoverability of the entry point to the feature is very essential to its success. I initially placed the entry point under the “about” section. User would have to enter about and then tap “Discover Ithaca” to access it. 

Local Guide- Entry Point Explorations.png

While this option maintains navigation, which is the primary function of the app, it taking an extra step leads to very poor discoverability. Therefore, I set a constraint that user has to be able to land on the feature page through no more than one tap. 

Local Guide- Entry Point Constraint.png

The diagram below shows the key explorations I went through. A trade-off I had to make here is between clarity and visual load. Option A adds playfulness to mode-changing. Inspired by Airbnb’s host and guest mode-switching interaction, once user taps “Switch to Discover Ithaca”, the search card will flip and user enters the “Discover Ithaca” mode, where whatever they search will show recommendations as results, not routes. This does not work well because having two “result-directories” confuses user. Option C employs the use of floating button. While the visual load of this is low as it does not add the the height of the search card like the other two options, without an accompanying text, it’s unclear, especially for first-time user, what to expect after tapping the button. Option B, the entry point I moved forward with, sets clear expectations of what would happen after tapping the button. Similar to when user tap a favorite destination on the search card, “Discover Ithaca” feed will overlay the homepage once the entry point is tapped. 

Local Guide- Entry Point Explorations.png

Visual Explorations

Because I wanted to display recommendations under different use cases so that user can see all of the options without having to take an additional step, I employed horizontal scrolls. Key visual exploration I did are card content and CTA.

Card content

One information I added in later after talking to user is categories. User finds labelling activity by categories such as food and drinks helpful in skimming through the recommendations. Another key decision was whether to show both actual opening hours and the suggested opening hours. There are many recommendations that take place where there are no opening hours e.g. Beebe Lake, thus the actual opening hours would be 24/7. However, it’s not recommended that user goes during certain hours due to safety issues. After going through several visual explorations, I decided to go with Option B, where it only displays either actual or suggested hours, and where the category is placed right at the top of the text. Showing only one does not increase unnecessary visual load.

Local Guide- Card Explorations.png

CTA 

The CTA of each recommendation is “see routes”, where user will be taken to route results screen once they tap the CTA. Four variables I explored here are text vs. icon, filled vs. not-filled, side vs. full-width, and brand color vs. accent color. I moved forward with Option B —the combination of text, not-filled, side, and brand color. Because the CTA applies to all cards, using filled button (indicating the primary action of the page) is too repetitive and adds too much visual load. Using text instead of icon ensures clarity. Placing the button on the side instead of spanning it full-width makes better use of vertical real estate. Using TCAT blue instead of accent colors maintains the visual consistency. 

Local Guide- CTA Explorations.png

Deliver

With this new feature, Ithaca gems are at user’s fingertips. User can get a direction to a place they want to discover in Ithaca in exactly 3 taps. 

Local Guide- Final.png
 
 
 
 

Info

I’m currently a Product Design Intern at Facebook, helping 80 million business owners better leverage Facebook business tools. I’m also building Alcove, a space for people to reconnect with their values and unlock their potential. Previously, I’ve helped build products and learning experiences for IBM, Thai Airways, and Enpeo Consulting.

As an advocate for collaborative learning, I’ve contributed to building a learning culture within teams I’ve worked with. I also co-founded Design Picnic, where I collaborate with Thai designers around the world to create a resource hub for human-centered design for the Thai community.

When I’m not nerding on design and education, I can be found supporting projects by my creative friends and dancing to 80s asian pop music.