Two Degrees

A new, fast-growing social network that connects the world through mutual friends.

CONTEXT 

Client Work
November 2017

CONTRIBUTIONS 

Visual Design
UX Design

COLLABORATORS

N/A

Background

Two Degrees is a new, fast-growing social network that connects the world through mutual friends. Founded on the principal that everyone is connected by two degrees, Two Degrees seeks to connect people through one of the most trusted forms of communication — a friend's introduction.

THE PRODUCT

Two Degrees launched a location-based social networking mobile app that helps users discover potential connections as they pass each other in real life. Leveraging the power of a user's own friend network, the app also reccomends nearby events to make new connections.

TARGET USERS

College students and young adults ages 18-34.

Objectives

I was brought on to the team to do a comprehensive refresh of their product. The primary objectives of this project were:

  1. Redesign the end-to-end experience.
  2. Add a "Hangouts" feature that showcases nearby deals and events.

Objective 1: Redesign Experience

The first objective was to redesign the existing features. The app's core screens were the Discover, Map, Chat, and Profile views. Some problems identified were:

  • Too much variation of colors are used throughout.
  • Unclear that the Discover and Map views are two separate views for the same collection of data.
  • Profile is limited and does not read as a customizable profile.
  • Ambiguous iconography is used without labels, leading to unintuitive buttons.

Objective 1: Final Solution

Discover

To better help users understand the list vs map view, I combined the views into a single Discover tab. Familiar iconography and labels for all tabs and buttons were added to reduce confusion.

Chat

Chat views cleaned up and brought up-to-date with current design patterns. Standard features such as timestamps, online presence, and user avatars were added.

Alerts

The lack of a notification system in the old designs defeated the purpose of the proximity-based "missed connection" feature. By adding this feature, a user can view all their missed connections in one place. This added to the "magic moment" when users realize they were right next to someone from their organization or fraternity.

Profile

The profile section underwent a major overhaul. To promote user engagement, customizable hero images and personal details were added. Details like organizations, interests, or education were used as highlights to show similarities with other users. Recent Hangouts on the platform were also included, adding another way to discover the app's features.

Objective 2: New Hangouts Feature

The second objective of this project was to add a Hangouts feature to the app. I received rough storyboards that showcased Hangouts as an Event Creation and Discovery feature.

INITIAL QUESTIONS
  • Why would people use the Hangouts feature? What differentiates this from something more popular, like Facebook Events?
  • TwoDegrees already pulls friends off contacts and Facebook. Why don't I just create an event on Facebook, which my friends already use?
SCOPE DEFINITION

After discussing with the team, we decided to focus on:

  • The goal of a Hangout is to be an instantaneous event creation, allowing users to drop a pin wherever they are to start a hangout.
  • Discovery is very proximity-based to promote that "magic moment" of stumbling upon a group of people with common interests.
  • Hangouts can be promoted and sponsored by local businesses or organizations to users nearby.

Objective 2: Final Solution

Hangouts List & Map

To maintain the familiar UX present in the Discover tab, the Hangouts tab was given the same treatment of a list vs. map view. To differentiate from users, Hangout icons were treated in squares, and a bottom action bar added to show the Hangout host, mutual friends, and RSVP actions.

New Hangout Flow

To promote the instantaneous nature of Hangouts, the New Hangout Flow is optimized for the user's current location. Users can use their current location and immediately start a Hangout, or choose to add additional details for planned Hangouts.

As a tie-in for the ongoing sponsorship deals with partners, a quick toggle is available for sponsorship accounts to run promotions. While the full sponsorship experience is optimized for desktop, this is a quick and easy way to create flash deals for nearby users.

Next Steps

With my role in this project ending upon internal approval, the next steps would be to conduct user testing. An ideal test case would be on a college campus, targeting the core demographic. Running flash sales or events at a club or fraternity could test the user engagement of Hangouts. This would serve as an excellent proof of concept for expanding their monetization model to local businesses and companies.

If given the opportunity, I would conduct my own user testing to determine if the "instantaneous event" was a large enough factor for users to prefer Hangouts over a widely-used product like Facebook Events.