Prototyping

#4 Tinder – Prototyping the most popular apps!

September 3, 2014

Proto.io “Prototyping the most popular apps” is a series of videos where we recreate popular UI’s and interactions with Proto.io.

From the instructor (Constantinos Demetriadis):
Tinder has a unique UI which calls for an extensive use of variables. The cards in the UI can be dragged left and right which in part trigger the LIKE/NOPE labels, but also set a few variables which decide what happens to card once a user let’s go.

The card can either return to its’ original position, exit to the left or exit to the right. Finally, we also add the actions button which control the cards “externally”. All in all, this is an advanced tutorial, but it will also help you get a grip of how variables can be used in extreme situations.

Note: If you haven’t been exposed to variables in Proto.io, you should watch the introductory video beforehand and consult the relevant article in Documentation.





View the live prototype

Author