Disrupting the Dating Scene

.
twine app icon
twine canvas app icon

Background

About 40 million Americans today use online dating - and it’s working. According to industry reports, about 5% of all Americans currently married or in a long-term relationship met their partner online. Among couples together for ten years or less, 11% met online. But the digital world of dating inevitably comes with real-world problems that singles need to navigate.

Dozens of dating apps compete for users, but the vast majority have a photo-centric approach that emphasise physical appearance. In 2013, Spoonjuice, a repeat client, asked Sourcebits to build a new dating app that would innovate the space.

It started with a simple question...

Spoonjuice asked Sourcebits:

How can a dating app help people meet better matches?

twine app twine canvas app

Our answers - twine & twine canvas

Client Requirements

  • Create a unique personality-first experience to connect interesting strangers.
  • Help people overcome the hurdle of starting new conversations.
  • Generate global interest at launch and beyond to drive downloads.
  • Create a second app with more visual content that allows users to self-select interesting matches.
Ice Feature suggestions displayed to a user

Sourcebits Solutions

  • Strategy

    We flipped the old “meat market” model on its head to focus on personality first and improving in-app conversations.

  • Development

    Our agile development process and close collaboration with design allowed for rapid prototyping and iteration.

  • Analytics

    We built a rich data analysis platform for user behaviors and marketing acquisition. Data has driven the product roadmap.

  • Design

    We designed both app interfaces to be visually rich and fun, with an intense focus on delightful user experiences.

  • Launch Marketing

    From user acquisition and web design to media outreach and email marketing, we covered the launch spectrum.

  • Monetization

    Based on user feedback and competitive analysis, Sourcebits identified an in-app purchase opportunity for twine.

A tale of Two Twines

Spoonjuice launched twine (the first intellectual flirting app) for iOS and Android in July 2013.

The App Store featured twine at launch in the “What’s New” category. A flurry of media attention and user acquisition efforts resulted in 200,000+ downloads. Users reported having more interesting conversations and meeting cool people. Spoonjuice then decided to expand its matchmaking portfolio.

twine app screenshot twine canvas app screenshot

After Sourcebits conducted extensive user testing and analyzed app data, Spoonjuice asked us to build another dating app in less than 3 months.

The goal: focus still on personality, but create a more engaging, interactive and visual experience - like Instagram. Spoonjuice launched twine canvas (express yourself to meet interesting people) for iOS in January 2014.

twine

    How twine works

  • Sign in through Facebook.
  • Set gender, age and location filters.
  • Twine algorithm connects local matches based on similar interests.
  • People see a blurry profile image along with interests while chatting.
  • Users stay anonymous until they choose to reveal their pictures.

    Key features

  • No profile creation necessary, just sign into Facebook.
  • Matching algorithm based on interests and proximity.
  • Icebreaker provides conversation starters based on interests.
  • In-app purchase to get more than 3 matches within a set time period.
  • Available on iOS and Android.
twine app screenshot: accepting a twine

Designing Twine

The home screen has just 5 elements, with a clear information hierarchy and super-simple user experience.

an image of an elephant in a bright yellow field against a dark blue sky
iphone blueprint with twine homepage screenshot

Twine’s logo features prominently on the home screen to enforce branding. It also serves as a “portal” to meet matches. When loading, it turns into a radar detector, then briefly spins to pull the user in to reveal a match. By placing it like a sun rising on the color horizon line of the background, it feels like a source of energy.

The "Find New Twine" button doubles as a progress bar. Similar to energy/life meters in gaming, the button starts completely filled with blue and depletes with each match made during a session. This lends a subtle playfulness and urgency to the experience - get a good match before the bar runs out.

In addition to clicking on the profile button, a swipe from the home screen reveals the profile screen for easy editing.

The chat button turns yellow when a user has new matches or messages. A left-swipe from the homescreen reveals the “My Twines” screen.

  1. flag
    Mar 2013
    Project Kickoff
  2. rocket ship
    July 2013
    Launch1.0
  3. chat bubble
    Nov 2013
    Improved Chat1.3
  4. twine canvas logo
    Jan 2014
    Twine Canvas
  5. piggy bank
    Apr 2014
    New Color Palette Monetization1.4

Engineering Challenges & Wins

  • Chat requires many pieces: push notifications, real-time chat, tracking delivery and tracking read. We built Twine’s chat with the XMPP Chat solution from Process One.
  • ICE, a patent-pending solution developed by Sourcebits, analyzes profile interests to generate real-language conversation starters.
  • To ensure privacy, Twine encrypts all images and private user information. Sourcebits used OAuth and SSL to protect network transmissions.
  • Every element of the app has been tested and optimized for speed and fidelity to enhance the user experience.
  • Sourcebits developed, tested and optimized a unique matching algorithm - the primary feature of Twine.

twine canvas

    How twine canvas works

  • Swipe to browse the gallery of personality canvases.
  • Sign in with Facebook to like interesting canvases.
  • Express yourself by creating a 5- image canvas reflecting interests.
  • When two people like each other’s canvases, the app reveals names and profile photos to connect them.
  • Start chatting with people you find mutually interesting and attractive.

    Key features

  • Simple photo collage creation to express personality.
  • Left-right swiping to browse through “cards” in the gallery; swipe down to like, swipe up to hide.
  • Social sharing of personality canvases, including a Twitter card.
  • Easy invitations to join across social network accounts.
  • Supports iOS6 and iOS7.
twine canvas screenshot

Designing Twine Canvas

Creating a personality canvas might be intimidating for users, so Sourcebits made it very simple and predictable. We built collage editing tools with well-known actions within the iOS ecosystem: 2 fingers to rotate, pinch to shrink/expand, tap and hold to drag and tap to bring images forward/back. Because it speaks to the user’s muscle memory, the intuitive experience doesn’t require a tutorial and people get instant gratification.

the twine canvas logo: a pink background with a white womans silhouette
iphone blueprint with twine homepage screenshot

The stack shows there’s more to discover. Layers have a vertical orientation to create a sense of “hanging” on a wall - like a gallery.

The app automatically adds a subtle shadow to the images, which enhances the visual appeal and depth to the canvases.

Collages use a limit of 5 images to avoid overloading the system and to keep creation simple. The app encourages users to keep their faces out of the collage.

The gallery is very flat and white to frame the canvases and keep visual focus on user generated content.

  1. silhouette of head and brain
    Oct 2013
    Analysis of Twine reveals opportunity for new UX
  2. flag
    Nov 2013
    Project Kickoff
  3. rocket ship
    Jan 2014
    Launch1.0
  4. chat bubble
    Mar 2014
    Improve Chat Faster Canvas Loadtime1.1.1

Engineering Challenges & Wins

  • Valentine’s Day was a big timing factor for Spoonjuice marketing. To get Twine Canvas into the App Store in time, Sourcebits had just 6 weeks to develop the new iOS app. While cache and chat ported from Twine, everything else was built from scratch.
  • To ensure users have a seamless experience and don’t get a “loading” message, Twine Canvas calculates how quickly a user is swiping through the gallery images to determine how many canvases should be pre-loaded.
  • The canvas creation tools built upon an existing library of common interactions to provide an intuitive experience. The magic wand tool required building a set of pre-defined canvas layouts based on the number, size and orientation of images.
  • The analytics platform Sourcebits built combines services from Omniata and HasOffers. With 19 user attributes, 72 events and 174 parameters, the app data provides tremendous context and flexibility for user segmentation and detailed product analysis.

Launch Strategy

Branding & Marketing

When it comes to mobile marketing, user acquisition is essential. That’s where we laser- focused most of our efforts for twine and twine canvas, handling all the email marketing, paid acquisition planning, web content, social media, app branding, user analytics and testing, public relations, and App Store Optimization.

Promotional Website

For this project, our team pulled out the big guns in our extensive web design arsenal. We used a combination of SCSS + Compass, & HTML5. Some nifty jQuery delivers the site’s beautiful parallax scrolling. We also ensured image optimization and a responsive, smooth site across all devices.

App Store Optimization

We optimized twine for Google Play and the iOS App Store, and twine canvas for the iOS App Store. We targeted specific keywords, changing the app title and updating the app description. It significantly improved the app rankings.

How well did our ASO do?
twine

#2 app for "flirting" and "flirting app"

Our ASO efforts after launch took twine out of obscurity in the app stores. On the Google Play Store, twine moved from not ranking in search results at all to ranking in every targeted category.

twine canvas

#1 for "flirting" and #4 for "dating app"

Thanks to ASO by Sourcebits, twine canvas also went from #12 for "online dating" to #2. The app launched at 2, 4, and 12 for the keywords “matchmaking”, “flirting, and “online dating” respectively.

Public Relations

Sourcebits handled the Public Relations efforts for twine and twine canvas around their launches, generating buzz on social media channels and through ongoing targeted email marketing.

For twine, Sourcebits also organized a launch party in San Francisco attended by 200+ people, with the app download a requirement for entry.

Both apps have been covered in top publications like Mashable, TechCrunch, ReadWrite, GigaOm, MSN Living and TrendHunter. For Valentine’s Day 2014, Apple featured twine canvas on the App Store homepage. In April 2014, Twine Canvas had a media surge with a 5-minute TV segment on Fox News and coverage in BuzzFeed, Metro (UK) and the Daily Mail.

Media Quotes

“For people who might be turned off by the superficialness of the Tinder app, there’s Twine Canvas, a dating app for iOS that connects users with people based on their interests.”

Engagor

“The app highlights the increasing importance of simple interfaces and visual cues in app design. Although Twine Canvas challenges the “instant attraction” strategy of rival dating apps such as Tinder, the app’s interface replicates the successful swipe-on-the-go format pioneered by Tinder, and the image-heavy aesthetic of sites such as Instagram and Pinterest.”

Stylus

“Meet Twine, the dating app that doesn’t care how hot you are.”

GigaOm

“Twine Canvas has kept the same “personality first” stance as Twine, but has a different functionality - now working like a cross between Tinder and Instagram.”

Global Dating Insights

“Not so forward? Check out Twine Canvas, a way to meet a match via an app, but with the focus on personality and interests.”

The Modern Connection