Keeping it Real, Warm and Elegant – eHarmony’s Newest Design Challenge

September 19, 2011

By

This time last year, we were knee-deep in development for our mobile applications on iPhone, iPad, iPod Touch, and Android. Those applications launched in late Q3 2010 and since then we’ve seen incredible adoption and usage rates – over 1 million members have downloaded our applications to date. Currently nearly half a million eHarmony profiles are viewed on our mobile applications each day! We’re completely blown away by how mobile has transformed our business, and we know it’s only going to continue growing.
Over the past year, we’ve evolved our applications, rolling out feature after feature, and at this time, an iPod, iPad, or Android customer can register, complete the eHarmony Relationship Questionnaire, edit their profile, view matches, subscribe, send communications to matches, and even receive push notifications when their matches send them communications (don’t worry push notifications are coming for Android soon – we promise).ipad blog phone1 155x300 Keeping it Real, Warm and Elegant – eHarmony’s Newest Design Challenge

As we looked at the version 1 releases for our mobile products, we saw them as providing our customers with a solid, functional experience. You could complete any of the critical onsite actions that you needed to, now on the go.

However, as we were nearing the end of our planning for the 1.0 wave, the product and design teams wanted to take a step back and really think about what a next generation eHarmony experience might look like on mobile. This became especially important as Apple had released the first generation of the iPad and it shattered all expectations about mobile and tablet computing.

So we asked ourselves, “What if we completely re-imagined what our service looked like from a visual ID and interaction perspective?”

We set about answering that question during the creation of our new eHarmony HD iPad application.
We started by reexamining the core of what eHarmony is, and what people all over the world see in our brand. Looking back over the years, through all the customer research and success couple interviews, there were a few terms that kept coming up over and over again — Warm, Real, and Elegant. We felt that those particular adjectives represented the core of what our eHarmony web experience strives to be, and these were terms that had the ability to illicit strong feelings in our customers.

So our design and product teams partnered with an outside design shop called JacksonFishMarket, and we wrestled with these basic questions: How do you build an experience that makes our customers actually feel something when they use it? How can you build an eHarmony experience that is Warm, Real and Elegant?

ipad blog bucks21 Keeping it Real, Warm and Elegant – eHarmony’s Newest Design Challenge

When we thought about “warm” experiences outside of software, one experience jumped to mind – Starbucks. Beyond being a place where countless couples go on their first dates, Starbucks has created an incredibly warm and inviting environment, no matter the store, no matter the country. When you enter a store, you are surrounded by warm colors and great lighting; the baristas always greet you with a smile and are sure to learn your name before making your drink. And when they make you your drink, they will literally make you whatever you want. In short, you feel great and welcome while you’re there.

ipad blog my name is Keeping it Real, Warm and Elegant – eHarmony’s Newest Design Challenge

In our experience, we tried to capture the same feeling through our color choices, fonts and voice. In a sea of blue dating sites, we opted to go with a color palette that used natural or earth tones. Where possible, we used handwritten fonts and our tone/voice is more informal – making you feel like we’re having a conversation with you and you alone. We also made sure to be there whenever our customers need assistance, while remaining unobtrusive for our more experienced customers. For instance, a new user will notice how we gently inform and remind them of the importance of a complete profile throughout their first week on the service. We don’t constantly harass them, but every few logins, we’ll ask them to complete one bite-sized element of their profile.

For our next value, “real”, we thought it would be a bit easier to translate into a software experience. The idea of being real or authentic is at the core of all of our creative and brand imagery. We use real success couples in our ads and even strive for a straightforward tone in the voiceover talent we use. So, our team made a design choice to use real items throughout the experience, because real items are things that people ascribe value to versus just pixels on a screen. So in our new iPad HD experience, you’ll see things like Polaroids, folders, and ink throughout. All of these items are found on a natural, comfortable desktop experience; one in which hope our customers would feel right at home.

ipad bluebook Keeping it Real, Warm and Elegant – eHarmony’s Newest Design Challenge

The form factor also comes into play here. It’s no secret that the iPad is a wonderful device for consuming digital books. It feels natural to swipe through the pages of book when reading an iBook on the device. And so, we transformed core elements of the user experience, the Relationship Questionnaire and the Personality Profile, into a digital “book” experience. As you use those two features, you’re literally turning pages of a digital book, but it all feels incredibly realistic because it’s all second-nature when you’re using an iPad.

ipad polaroids Keeping it Real, Warm and Elegant – eHarmony’s Newest Design Challenge

Finally, there are lots of elegant or premium software experiences out there. Companies like Apple or Tiffany’s come to mind when you ask people about elegant web experiences. Those experiences tend to be clean and simple and make use of high end materials in their interfaces like metal, glass or chrome. Trouble is, being elegant or high end can often lead to experiences that feel cold and clinical – doesn’t exactly put you in the right mood to find love. But, many times, very personalized or handcrafted experiences can also be thought of as elegant and high end. For example, think about how receiving a handwritten letter makes you feel versus receiving an email. One’s obviously more personal and more elegant than the other.

So with our final design goal, we set about making this application feel like a very personalized, very simple experience versus a run-of-the-mill-dating search and browse experience. We started by using materials in the interface that would really convey personalization — parchment paper, bamboo, handwritten notes and script fonts. We added a layer of sound effects and animation to help members comprehend key action points. We then simplified and cut down the experience to its most minimal incarnation so that everything was easy to find and easy to use. And of course, we made it all look fantastic! The experience features big, beautiful photos of your matches and one of the most stunning layouts of a user profile in our industry.

ipad letter Keeping it Real, Warm and Elegant – eHarmony’s Newest Design Challenge

So now that you understand the rationale behind our design choices. In our next post, we’ll show you why this version of eHarmony is our best experience yet. Stay tuned to see what we built!

more blog posts

By posting a comment, I agree to the Community Standards.
Need help with eHarmony.com?