To Make a Service, a COOL UI is Not Everything!

Cover-Photo
 
Hello, this is Jenny, who started working in eureka as a designer assistant intern from April, 2015 to July, 2015, and then joined eureka as a Designer Associate since October 2015.
My degree is not in design, so since beginning in eureka‘s stylish office, I have focused on learning various design details, design rules, and design sense from scratch.

As a designer newbie, I would see a really cool website; or UI and think, “Wow! That’s so cool!! I wanna be a designer who makes that!” However, with the recent purchase of eureka by IAC, which owns Match Group. I started looking at various website and app UI, and realized one thing.
Match, Tinder, and our own app, Pairs, have very distinguish UI and design. One might look much cooler and much more stylish than the other. Yet, in order to make an app, or a service, a cool-looking UI is not all that is needed. What is most important is whether the UI matches the image, concept, idea and function of the app and service.
 


 
image

UI x IMAGE

In this digital era, a cool UI seems to be what makes a good service, website, or an app. However, a stylish or trendy UI design might not match the function or main purpose of a service. Let’s take a look at Pairs, Tinder, and Match as examples. The website of Pairs has many stories about users who found their love through Pairs, and focuses more on the experience of the users. The entire design is soft. It creates a feeling of happiness, and the color aquamarine gives users the feeling of safety and security. Tinder’s website is extremely simple with limited information all displayed on one page, but it uses tabs to separate the information. It looks clean; and the red flame of the Tinder logo gives the website a delightful personality. With only a few words, it conveys the core value of its service, fun and untroubling. On the other hand, Match’s website is in more of a business style which focus on the purpose of the service as well as the functions. It uses a blue that is a little bit lighter than the blue used in Facebook. Blue usually gives the service a reliable credit. If you look carefully, most of the professional firms that require the trust of customers, usually use blue as their brand color, such as: Chase Bank, American Express, LinkedIn, Intel, IBM, BMW, AT&T, and etc. This ocean blue therefore makes Match look more professional and credible.
 


 
concept

UI x CONCEPT

UI not only needs to give an image of your service, it also needs to match the concept and idea of your service.

The core concept and idea of Pairs is to match the users with people that are the most suitable for them, whom they might not be able to meet in their daily life or routine. We create a very friendly environment by using the light aquamarine color, this tells the user that Pairs is a service which they can trust and rely on. In order to increase the interaction among users, as well as further deepen the level of how much they know each other, we created many functions for our service. In order for users to understand all of the functions and be able to utilize them well, we have various images introducing our functions.

Tinder’s idea is to meet anyone around you that you can make connections with without being too stressful about it. It expands your connections immediately. The idea of the app is relatively simple, simply swipe right or left to determine whether you would like to know about the person more. It is easy, less troublesome, and more for fun. Hence, the website does not put a lot of effort in explaining the function, it does not need a lot of images to demonstrate their service.

Match, like Pairs, is also for people who are looking for “the one”. Therefore, the calm blue that Match uses shows that it is a professional agency, and that it takes the user’s business of finding their soulmate seriously. In addition, it is only for users who are as serious as them to use their service, it does not have any introduction of the service in their website, if you want to enter the site and see how the service is like, you need to register first.
 


 
function

UI x FUNCTIONS

If the concept of a service is like the soul of a person, then its functions are like the physical body. What would be more important than matching the UI with the concept is matching the UI with the functions. UI is the gate of the service, a good UI can lead users to where they want to go and further achieve what they want.

The Pairs app, was originally designed for Japanese users, so the design is relatively cuter than both Tinder and Match in order to match with the sensibility of Japanese. In order to find the best match in a short amount of time, more focus on personal details is used to help decide whether a user would like further contact with that person. As a result, the profile on Pairs are extremely detailed, which includes heights, smoking or not, drinking habits, living situation, their willingness to marry, marriage history, whether they have kids or not, and etc., so that users can have an idea of  whether they would be a good fit; or the best match, before contacting with them. This saves users a lot of time by filtering out what they know is absolutely a “no-no” for them based on the condition of the person. Pairs takes the business of finding Mr./Ms. Right that we have ID checks before users can exchange messages with each other.

Tinder, on the contrary, limits its functions as the idea of its app is relatively simple, swipe right to like, swipe left to reject. However, if you want to just pass and move on to check the next person’s profile, it is impossible. No swipe, no new encounter!

Match, similar to Pairs, also has a lot of functions. As Tinder belongs to Match group, Match app also includes Tinder’s feature “swipe to accept or reject”. Yet, other than that, it also has functions to check through the profiles of people who are around the users. Similar to Pairs, Match also has an ID check system, and the profile on Match is very detailed, including occupation, salary, body type, and etc. However, it is different from Tinder in Match allows users to accept, reject, and pass or say “Maybe”.
 


 

CONCLUSION

The appearance of a product is very important to attract consumers. The UI is very crucial in the war of winning users heart.

A good UI should help distinguish a service from other services in the same field, and find its market position in users’ hearts. For instance, if we compare Pairs, Tinder, and Match to the arts, Pairs is like the Waltz, tender and secure; Tinder is like Salsa, lively and playful; Match is like opera, professional and serious.

Pairs provides a safe environment for users who are genuinely looking for a relationship. As a result, the UI of Pairs is more gentle and mild, which generates a friendily and safe atmosphere of the environment. In addition, Pairs allows users to meet people without geographical barrier to find their life-long partner, and protect users privacy by not showing any Facebook friends in the APP, neither will any activity in the APP be posted on Facebook wall.

On the other hand, Tinder is more casual. Its UI is very simple, modern, and stylish. It gives a feeling of untroubling and lightness. Tinder is easy, look at the person’s profile picture and then swipe right to have further contact with the person, and swipe left to reject the person. The information on the profile is extremely limited, and so it is more superficial and more just to have fun. 

Match’s UI is more stiff, which shows that it is both serious about helping users finding their best match, and professional in its attempt to do so. To sum up, “image” is how users look at and think about a service; “concept” is the core value of a service; and “function” is the body of a service. UI needs to match all three to correctly deliver the service to the right target market. For example, Pairs users might feel really insecure with Tinder, while Tinder users might think Pairs is really troublesome.

In a nutshell, a cool UI is not everything, whether it corresponds with the service as a whole is what makes the difference.

  • このエントリーをはてなブックマークに追加

エウレカでは、一緒に働いていただける方を絶賛募集中です。募集中の職種はこちらからご確認ください!皆様のエントリーをお待ちしております!

Recommend

オウンドメディアの古い記事を整理して、トラフィックを約2倍にした話

AWSクラウド環境でよく使うAWS CLIコマンドまとめ