COO datng app header image

Overview

A location based, limited match, bird themed app that will find your matches based around your current GPS location in real time. With the extra incentive of discounts, users could be more likely to make quicker or more frequent connections.

Problem

Most dating apps give you unlimited options of potential dates but lack the means to motivate you to meet in person.

Solution

Coo limits users options and offers immediate date options with discounts in your immediate area (within 1-2 miles).

Typography

A swash display type is used for the logo and on specific headers throughout the app. This typeface brings a playful and sing-song feel to the design.

All of typography is styled in the humanist sans, Seravek, which was chosen for ease of readability and its hand written qualities.

coo typeface choice coo typeface choice

Oleo Script Swash Caps

coo typeface choice coo typeface choice

Seravek

coo typeface choice

A/B testers preferred Oleo Script Swash Caps over another type choice.

Color Palette

Coo takes its visual inspiration straight from the Love Bird. Each color is pulled from their feathers or a tinted variation of one of those colors. Neutral tones were used for the background and text so that they would not distract from the overall design.

coo color choices

Icon Sets

Two seperate sets of icons are used throughout the app. The grey icons assist in distinguishing the types of establishments located on the map. Bright orange icons are used in the user profiles to show interests or hobbies.

Coo App building icons Coo App interst icons
A/B Test: user prefer to see icons A/B Test: user prefer to see icons

Invision App Mockup

Check out the COO app for yourself through the invision prototype. You will be able to see your matches, set a date, message, edit your profile and view your settings.

The COO

Mating call will come from a variety of birds and will be loud and distinct enough to hear above any crowd. It will shut off automatically when you are within 5 feet of your match.

Screen layer

Give It a Shake

Only one coo can be sent out every hour and matches will refresh when the phone is shaken if you do not find anyone that you click with. You will be able to shake your screen to refresh once in a 24-hour period. Which will max out your matches to 6 people for the entire day in just your immediate area. So, save your refreshes!

24hr timer Coo App shake refresh feature
Coo Mobile Design Process
A/B Test: user prefer to see icons A/B Test: user prefer to see icons

Design Process

When designing Coo, I drew inspiration from birds and the different ways that they attract and find a mate. Mating calls were chosen because they are loud and destinct, so keep in mind that this app is not for the easily embarrassed.

This video intro will give you a quick and basic walkthrough of the entire application and a sample of a bird call that would be used.

How It Works

A location-based dating app where the female user is given control of the who, when, and where of every date. She will only show up on a male user’s screen if she first sends out a coo; a call that alerts a local male that she is interested in meeting him in person. Male users will always be active and will only see matches that have sent him a coo.

If you are interested in the same sex all potential matches will be visible to both parties and both will have the option to send a coo.

coo multiple mobile screens

Full App

App Flow

Click below to see a larger view of the entire web flow.

coo app user flow
Header - Sellfy
Multi-Screen - Good Mockups
Process Multi - Graphics Fuel
Footer Response - Codepen
Typefaces - Google Fonts
Footer Column - w3 School