hero.png

Scruff

SCRUFF 6.0

In celebration of the 10 year anniversary of the gay dating & hook-up app, we reimagined Scruff to provide a new, data-backed experience.

Role: Project and Product Design Lead, UX/UI • Company: Kettle • Year: 2017

hero.png
 

 

Challenges

 

Too many features with little cohesion.

 

 Throughout the past decade, there have been many features added to the app. From event and party listings to popular LGBT travel destinations, the app has grown to fit into the lifestyle brand ecosystem. Despite all of these great improvements, the app lacks the ability to seamlessly connect these features.

 
Screens from the old experience.

Screens from the old experience.

 

Data doesn't inform the experience.

 

With all of these great features, we knew there was a lot of opportunity to make the app more personalized and unique to each user. Scruff wasn't currently using any of the data they could access to inform the app, which we thought was a big missed opportunity.

To help us understand our possibilities, we listed out all of the ways we can collect data from users, allowing us to map features together in a more informed way.

 
data we know.png
 

Solution

Use data to create a more cohesive experience that helps users identify guys they might like, faster.

 

Crafting a new IA

Concept testing.

 
concepts2.gif
 
 

We created multiple concepts for the app's new feed experience. The main variable in these concepts was the navigation and the way users flow through the app.

Our concepts ranged from completely new IAs to options that kept similar Scruff conventions.

We found that although users liked the more conceptual options, the majority wanted an experience that didn't feel like a complete departure from the app's existing IA.

 
 

Consolidating the nav.

 
nav.png

While there are many great features in the app, they lack the cohesion to naturally flow the user from tab to tab. Additional to the new feed that showcases all features, we simplified the nav and paired features together in a more thoughtful way.

 

 
 
 

Introducing: The Feed

An endless experience to help you connect with more guys that are right for you.

 
 
feed1.gif
 

A new feed that brings all the great Scruff features and data together in a fresh, cohesive experience.

So much time is spent aimlessly browsing the grid of guys. We wanted to create a way to allow users to see their normal Scruff activity in a new, smarter way.

See recommended users based on guys you've talked to in the past, events based on previous events you've attended, suggested destinations based on travel history, and more.

 

 

 
feed2.png
friendintown.gif
feed1.png
 
 

A new way to travel.

Make the most out of your travel with personalized Scruff guides.

Learn about Ambassadors and see which ones are nearby to help.

Get recommended bars and events based on your interests, as well as like-minded local natives.

Always accessible when you need it.

travel.gif
 
 

Reimagining the chat.

 
 

Sharing photos is a large part of the chat experience. However, some photos elicit better responses from other users. Conversely, other users reply better to certain photos. 

We used deep learning AI to understand what photos you send elicit the best responses and suggest those photos. To make it even smarter, the AI takes into account the types of photos the user you're talking to typically replies to.

chat_photo.gif
 
 
 

For all of the new features, we designed what seemed to be endless options, narrowing it down to the designs we felt were the best in both experience and visual appeal.

 
chat_wires.png
 

Keeping new users in mind.

And endless experience to help you connect with more guys that are right for you

onboarding.gif
 
Animation made in collaboration with Matt Brant

Animation made in collaboration with Matt Brant

  • Next Project

    AMEX:
    OPEN Forum