Dating Like-Button

Redesign of a conventional button · Interaction Design Concept

Goal

Redesign a conventional button, creating three different versions: basic, exaggerated, and unexpected. Only using existing elements of the button.

Duration

2 weeks sprint

Tools

Figma · Jitter

Story & Narrative

We chose the online-dating context as the scenario for our buttons, where the action of liking and unliking is the core feature. The liking action expresses the positive emotions related to love and excitement. The un-liking action expresses negative emotions related to heartbreak and disappointment.
We created three distinct versions of the button to explore different levels of emotional expression:

Basic Button
Expressed emotions through color (Gray: sadness, solitude / Red: love, passion).
Exaggerated Button
Expressed emotions through motion (Liking: excited, jumpy / Un-liking: violent, brutal).
Unexpected Button
Expressed emotions through metaphors (Liking: Cupid’s arrow, gently inserted / Un-liking: Cupid’s arrow, violently removed).