how-tinder-design-hooks-you-up

Vitaly Dulenko

Being a huge fan of behavioral psychology I like to analyze popular apps design to see what techniques they use to attract and engage users. Today you will learn how Tinder onboards new users, creates habit loops, drives our behavior and hooks us up to keep using the app. Get on board! ?

Tinder offers you only the login option at first. If your credentials aren’t already in their database you will proceed to the registration flow. Otherwise, you will log in to the app. Pretty convenient. Tinder gives you two ways to log in — with Facebook or phone number. You also have another option — ’Log In With Email’. But this one hides behind the ‘Trouble Logging in?’ link.

That’s the first example of how Tinder builds the choice architecture for users. They don’t give you all the possible login methods at once because they know — the more choices people have the harder it’s for them to select one. Tinder limits the choices putting the preferred ones onward as defaults.

Note how they reassure you to use your Facebook account for the login stating that Tinder will not post anything to Facebook. Let’s select the ‘Log in with Phone Number’ option and see what will we get.

Smart! The app automatically gets my phone number from my phone and offers me to use it. What’s so smart in it? Tinder knows the core of people’s motivation:

If you want people to do something, make it as easy as possible.

That’s the core of the behavioral theory by BJ Fogg. You need three things to nudge a person to do something — Motivation, Ability, and Trigger. Together they create an easy formula of human’s behavior. To do something people need the desire, ability to do this and a trigger that will nudge you to act. It’s hard to manage people’s motivation, but you can make the ability to do something as easy as possible.

Remember how many time you walked the office kitchen and grab a cookie? You don’t even want a cookie, you were going to drink water or so. But the cookies lay right before you, it’s so easy to get one that we keep taking cookies even when we didn’t want them.

Tinder uses any possibility to reduce the numbers of interactions required from the user. I don’t even have to recall and then type my phone number with my fingers — I need to make one tap. The country code is already prefilled based on the location settings of my phone so I don’t have to search for it from the long list.

Look at this screen. It’s not overwhelmed with UI elements keeping me focused on one task per time. User’s attention is a limited resource as well as the user’s time. You want to consider this when designing products for people.

The registration forms usually contain several fields to fill in. That’s when people drop off — we are lazy and don’t want to make extra efforts. You can help users in this case by splitting the complicated task into smaller ones. As BJ Fogg says:

Helping people take small steps you can lead them anywhere.

The big bright button is available right above the keyboard. Remember, the easier is something to perform, the more people tend to do it. This button is large enough to tap and don’t misclick. Compare it if the button would be in the top right corner of the screen as a small icon or link — what’s easier to reach and tap?

The input field is autofocused so I don’t need to tap it first to get the keyboard. Limiting the number of elements on the screen Tinder also avoids scrolling as an extra interaction. It amazing — I needed to make one tap and Tinder does everything next. Will I proceed next? Hell yeah, it’s so easy!

The next step is to verify your phone number. Tinder immediately sends you the code via SMS and — wait, wait, the magic comes again! — I don’t even have to go to my messages, copy or remember the code, go back to the app and type it. Tinder does it for me! The app automatically retrieves the code and proceeds me next. My respect, Tinder! You’re masters in reducing the interaction cost for your users. As I don’t have a Tinder account the app checks it with my phone number and sends me to the registration flow. Why not! ?

The registration process consists of several steps. Tinder is consistent in offering you one task per step (I’m not saying that this method works well in all cases, it depends on the context). The main input field is autofocus, keyboard available, a prominent button is easy to reach.

Also, Tinder uses an active wording here — ‘My first name is…’ This method creates some kind of conversation with the user. And it’s written from the user’s perspective — not ‘Your first name is’ but ‘My first name is’. This gives me a feeling of control when creating my account.

By the way, take a look at the cool progress bar at the top of the screen.

It performs a pretty important role — it indicates how long the whole process will take, gives feedback about my current status, and keep me motivated as it provides immediate feedback about my progress. The indicator also acts as a reminder of how much time I have already invested in the flow. When you see that you’re one or two steps away from your goal, you’re more likely to complete the task. It’s already pre-filled making me believe that my progress is 1/5 completed.

One big respect for not sending me the ‘Verify email address’ email now. That’s the right way to distract your users and lead them away losing motivation and concentration.

Note that Tinder uses there a numeric keyboard and input with a mask for date of birth. There are different ways to do this — split it into 3 separate fields, use dropdowns or spinners.

It can work great for selecting a date you don’t remember well. But every person knows their date of birth. It’s something personal and significant for us as our names are. And it’s much easier to type the date you remember so well instead of scrolling the spinners or dropdowns. Hey, I’m halfway from my goal now! ?

‘My School Name’ is an optional step. Tinder wants us to make an extra step and placed it between the required ones. It looks the same as the required ones — only light grey link button ‘Skip’ in the right top corner makes it stand out. This button is hard to notice and tap — my fingers are too short and lazy for it! And after completing previous screens it’s so easy to complete this one as well.

Add photos

Next step is to upload some photos of me. It’s the important one — that’s how my possible matches will perceive me, let’s use some really good photos of me.

To upload photos Tinder needs permission to access my photos. Before displaying the standard ‘Allow something’ dialog, they show me one more screen. There they explain why they need the permission I will be asked to allow in the next step. Why add the extra screen? Why not no just display the dialog, you may ask? It’s a very suitable psychological technique called Priming.

It refers to activating particular representations or associations in memory just before carrying out an action or task. For example, a person who sees the word red will be slightly faster to recognize the word apple. Using this technique Tinder stimulates users to perform the next action. Good job!

Enable location

The button ‘Done’ on the previous step made me believe that it was the last one. But wait, there is another one — ‘Enable Location’. That’s the sense of Tinder — find the right matches nearby. They also used the priming technique displaying me an explanatory screen before the permission dialog.

Note the wording — first, the text says that enabling the location is required to use the app. But there is also a grey button ‘Tell me more’ that leads you to the other screen. There Tinder explains why you should enable the location in terms of your benefits — that’s how you will see matches nearby. Interesting way to get permission, let’s allow it!

Diddly Doodly!

And I’m here! After a very quick tutorial, the first thing I see is a card of my first potential match. Most of the card’s place takes the person’s photo. That’s the right way to attract any person’s attention. People evolutionally tend to notice and recognize other peoples faces.

The match card design is pretty simple — photo, name, age, one-line description and/or distance from you. Tinder limits the number of information about the person reducing the cognitive load to make the first move.

When you tap the card you see the next tutorial — how to interact with the card. Nice timing to show it — right when I would need it.

The main screen is very important as that’s how Tinder hooks you up. You see one match and you’re curious who will be the next. You keep swiping getting more and more cards. It’s the swiping brother of the infinite scroll used by Facebook or Instagram. Also, when you open the app you don’t know how many likes have you got, how many new matches await you. And this forces you to keep checking the app looking for the reward. And the desire to know it forces you to open the app more and more, creating the habit loop:

receive a trigger → perform an action → get a reward → invest more.

You receive a notification from Tinder that someone has liked you (external trigger) or you feel this itching desire to check if someone likes you (internal trigger). This trigger makes you get your phone and open the app (action). Right after that, you get the reward — new likes, matches, messages. You check the new picks, swipe cards, replay to messages investing more your time and attention in your account. I make this investment hoping to get more rewards in the future. And the loop repeats.

What’s more important the reward we get is variable, it changes every time you open the app. It stimulates you to open the app more and more as you don’t know what you will get next.

You can share the match profile with your friend to know their opinion. Very interesting idea — when making a decision people are more likely to look for help from others. Also, it’s a good way to get your users to promote your app with their friends. Instead of asking ‘How would you like to recommend us to your friends?’ Tinder combines the invitations with a user’s need.

Hey, while I was swiping through potential matches I’ve got 9 likes! (Mom, I’m popular ?). Note how the notification element is combined with the switcher and grabs your attention. Do I want to know how others liked me? You bet!

Whoa! To see these people I have to upgrade to the Gold account. Smooth. Tinder uses the nature of people’s interest in what other people think about us to tease. In our social life, we use different types of signals we send and receive. That’s how we select potential partners for relations, business and so on. Everybody wants to know who likes me, but upgrade first, please. Pretty logically, let’s try it.

Nice screen! And a very important one — that’s where you convert your free users into paying ones. Tinder uses the right accent on the benefits for me to upgrade — they show me the number of people who liked me to keep me motivated.

Subscription plans are displayed in an interesting order — starting from the most expensive to the cheapest one. The first plan is used as the anchor the user will use to compare with the other ones. 12 months sounds too much but looks cheaper than others. 1 month is the latest to notice and the most expensive one. The 6 month looks the most appropriate in this case — not so long as 12 months and looks cheaper than the 1-month plan.

The plans are calculated for the monthly payment that’s why the ‘1-month plan’ looks the most expensive comparing to others. But the other plans will be charged for 6 and 12 months at once accordingly, so the final price will be higher than the one-month payment. But to compare these prices you have to open the calculator and do some math. People are lazy, very few of them will do this, especially when the ‘6 months’ plan looks cheaper, saves me 37% and is already preselected.

I believe that’s the Tinder’s most popular plan. Hey, they already told me about this with the prominent badge ‘Most popular’. Very wise — when making a decision people tend to choose the most common/popular option — a dish of the day, friends recommendations and so on. So that’s a great way to reassure me that this plan is the best of all the perspectives.

We have dealt with the people who liked me and look — there are some Top Picks. Let’s try it.

Hmm, upgrade to Gold again ?. Nicely done, however — making choice is one of the hardest things in our life. Providing users a set of already selected matches will drive them to make the move. Especially if you limit the number of top picks and their time availability.

This is a ‘Scarcity’ effect — we value things more when they are hard to get. And people also link availability to quality. If something is so rare it should be worth it. The limited-time availability uses people’s fear of missing out. This tactic is often used with some perceived benefit for acting fast, like a reduced price or some additional bonus items.

As we saw Tinder know people’s nature very well. They effectively use different psychological techniques and behavioral principles to onboard and engage users. Well done!

That’s all for today! Stay in touch to get new articles about product design, behavioral psychology, and other cool stuff. Cheers! ?

BTW, all images and trademarks belong to their respective owners.

102 comments

  1. I always emailed this weblog post page to all my
    friends, because if like to read it afterward my links will too.

  2. It’s awesome to visit this website and reading the views
    of all mates concerning this paragraph, while I
    am also eager of getting experience.

  3. Greetings from Carolina! I’m bored at work so I decided to
    check out your site on my iphone during lunch break.
    I love the knowledge you present here and can’t wait to take a look when I get home.
    I’m amazed at how quick your blog loaded on my mobile ..
    I’m not even using WIFI, just 3G .. Anyhow, amazing blog!

  4. I’m curious to find out what blog system you happen to be using?
    I’m having some minor security problems with my latest site and I’d like to find something more safe.
    Do you have any suggestions?

  5. Heya i’m for the first time here. I came across this board and I to find It truly helpful &
    it helped me out much. I hope to provide one
    thing again and aid others like you aided me.

  6. I do not know whether it’s just me or if perhaps everyone else encountering problems with your website.
    It seems like some of the written text in your content are running off the screen. Can someone else please
    provide feedback and let me know if this is happening to them as well?

    This could be a issue with my internet browser because I’ve had this happen previously.
    Kudos

  7. Howdy! Do you know if they make any plugins to assist with SEO?
    I’m trying to get my blog to rank for some targeted keywords but I’m not
    seeing very good results. If you know of any please share.

    Many thanks!

  8. You actually make it seem so easy with your presentation but I find this topic to be actually
    something that I think I would never understand. It seems too complicated and very broad for me.

    I’m looking forward for your next post, I will try to get the hang of
    it!

  9. I like the valuable information you provide in your articles.
    I’ll bookmark your weblog and check again here frequently.

    I’m quite certain I’ll learn plenty of new stuff right here!

    Best of luck for the next!

  10. First of all I would like to say excellent blog! I
    had a quick question in which I’d like to ask if you don’t mind.

    I was interested to know how you center yourself and clear your mind before writing.
    I have had a tough time clearing my mind in getting my thoughts out.

    I do take pleasure in writing but it just seems like the first 10 to 15 minutes are
    generally lost simply just trying to figure out how to
    begin. Any suggestions or tips? Many thanks!

  11. I really like your blog.. very nice colors &
    theme. Did you create this website yourself or did you hire someone to
    do it for you? Plz answer back as I’m looking to design my own blog and would like to
    know where u got this from. appreciate it

  12. I was more than happy to discover this website. I want to to thank you for your time due to this
    wonderful read!! I definitely loved every part of it and I have you saved to fav to look at new stuff in your
    website.

  13. Terrific work! That is the kind of information that should be shared across the
    web. Shame on the search engines for not positioning this post upper!
    Come on over and visit my website . Thanks =)

  14. Thank you for another informative site. The place else may just I get that
    kind of information written in such an ideal manner?
    I have a undertaking that I am just now running on, and I’ve been on the look out for such info.

  15. It’s remarkable to visit this website and reading the views of all friends concerning this article, while I am also eager of getting familiarity.

  16. This design is wicked! You certainly know how to keep a reader amused.
    Between your wit and your videos, I was almost moved to start
    my own blog (well, almost…HaHa!) Great job. I really enjoyed what you had to say, and more
    than that, how you presented it. Too cool!

  17. Hello there, I discovered your blog by way of Google even as looking
    for a related matter, your site came up, it seems to be good.
    I’ve bookmarked it in my google bookmarks.
    Hello there, simply become aware of your weblog thru Google, and found that it’s really informative.
    I’m gonna be careful for brussels. I will appreciate in the event you
    continue this in future. Many other people
    can be benefited from your writing. Cheers!

  18. Your style is really unique in comparison to other folks
    I have read stuff from. Many thanks for posting when you’ve got the opportunity, Guess I’ll
    just bookmark this web site.

  19. Hello there, You’ve done an excellent job. I’ll certainly digg
    it and personally suggest to my friends. I’m confident they will be benefited from this site.

  20. Ahaa, its fastidious discussion concerning this
    paragraph at this place at this weblog, I have read all that, so now me also commenting here.

  21. whoah this weblog is magnificent i really like studying your posts.
    Keep up the great work! You know, a lot of people are hunting round for this information, you
    could aid them greatly.

  22. Hiya! Quick question that’s entirely off topic.
    Do you know how to make your site mobile friendly? My weblog
    looks weird when viewing from my iphone4. I’m trying to find a theme or plugin that
    might be able to fix this problem. If you have any recommendations, please share.

    Appreciate it!

  23. Wonderful post however I was wondering if you could write a
    litte more on this subject? I’d be very grateful if you could elaborate a
    little bit more. Appreciate it!

  24. Simply want to say your article is as amazing. The clearness in your post is just cool and i can assume you’re an expert on this subject.
    Well with your permission allow me to grab your RSS feed to keep updated with forthcoming post.
    Thanks a million and please continue the gratifying
    work.

  25. After looking over a number of the articles on your blog, I
    honestly appreciate your technique of blogging.
    I saved as a favorite it to my bookmark website list and will be
    checking back in the near future. Take a look at my website as well and
    tell me how you feel.

  26. I don’t even know how I ended up here, but I thought this post
    was good. I do not know who you are but definitely you’re going to a famous blogger if you aren’t already 😉 Cheers!

  27. Hi, i believe that i saw you visited my weblog thus i got here to go back the desire?.I’m trying to to find issues to improve my web site!I suppose its good enough to make use of a few of your ideas!!

  28. I am now not positive the place you are getting your information, but great topic.
    I must spend a while finding out more or working out more.

    Thanks for excellent info I used to be on the lookout for this
    info for my mission.

  29. Hi! I could have sworn I’ve been to this blog before but after
    reading through some of the post I realized it’s
    new to me. Anyhow, I’m definitely delighted I found it
    and I’ll be bookmarking and checking back frequently!

  30. Wow, wonderful blog format! How long have you been running a blog for?
    you made running a blog look easy. The entire look of your
    website is excellent, as well as the content!

  31. I do agree with all of the ideas you have introduced for your post.

    They’re very convincing and can definitely work.
    Nonetheless, the posts are very short for beginners. Could you please lengthen them a bit
    from next time? Thank you for the post.

  32. Pretty portion of content. I just stumbled upon your weblog
    and in accession capital to claim that I acquire
    actually loved account your weblog posts. Any way I will be subscribing in your augment
    or even I achievement you get right of entry to constantly rapidly.

  33. Howdy! Quick question that’s completely off topic.
    Do you know how to make your site mobile friendly? My website looks weird
    when browsing from my iphone4. I’m trying to find a template or plugin that might be able to fix
    this issue. If you have any suggestions, please share.
    Thank you!

  34. Just wish to say your article is as astonishing. The clarity in your post is just cool and i can assume you are an expert on this subject.

    Well with your permission let me to grab your RSS feed to keep updated with forthcoming post.
    Thanks a million and please continue the enjoyable work.

  35. It’s actually a great and helpful piece of
    information. I am satisfied that you just shared this helpful information with us.
    Please keep us informed like this. Thanks for sharing.

  36. It’s actually a cool and helpful piece of information. I’m happy that you simply shared this useful info with us.

    Please stay us up to date like this. Thank you for sharing.

  37. You’re so interesting! I don’t suppose I have read through a single thing like that before.
    So great to discover another person with unique thoughts on this issue.
    Seriously.. thanks for starting this up.
    This web site is something that is needed on the web, someone with a
    little originality!

  38. Howdy, There’s no doubt that your website could possibly be having web browser compatibility issues.
    When I look at your blog in Safari, it looks fine however, if
    opening in IE, it’s got some overlapping issues. I merely wanted to give
    you a quick heads up! Aside from that, great site!

  39. Please let me know if you’re looking for a writer for your blog.

    You have some really great articles and I think I would be a good asset.
    If you ever want to take some of the load off, I’d absolutely love to write some content for your blog in exchange for a link back to mine.

    Please shoot me an e-mail if interested. Regards!

  40. This is the right website for anybody who wishes to find out
    about this topic. You know so much its almost hard to argue with you (not that I really will need to…HaHa).
    You certainly put a fresh spin on a subject that’s been written about for a long
    time. Wonderful stuff, just great!

  41. Asking questions are really fastidious thing if you are not
    understanding something completely, except this article gives good understanding even.

  42. Hey I am so thrilled I found your website, I really found you by mistake, while I
    was looking on Google for something else, Regardless I am here
    now and would just like to say many thanks for a incredible post and a all round exciting
    blog (I also love the theme/design), I don’t have time to go through it
    all at the moment but I have saved it and also
    added your RSS feeds, so when I have time I will be back to
    read more, Please do keep up the fantastic job.

Leave a Reply

Your email address will not be published.