Mindful UX Micro Interaction Design for SaaS, a Figma Prototype
Designing a mindful micro-interaction using Figma’s prototyping tool.
The Monobloom app imagines a free trial concept, common in SaaS, where a person might come across an error message in a critical part of their journey.
Instead of a generic error message and a jumpy UI and UX, we greet the person with a hyper local error message.
Alertness is high, but the tone and the language aim to be friendly and understandable. The message is rich and informative rather than short and dry. It highlights the error and unambiguous text at the exact time and place the error occurred.
If the person proceeds to their journey, the credit card field reveals itself again. Regain focus and calming down the user is key at this moment. An animation quirk aims to achieve that. The cursor animates in two modes: attention mode and mindful UX mode.
The attention mode aims to trigger central vision and recapture focus. The cursor blinks and does so intensely, but only for a moment.
The mindful mode aims to reduce stress and reassure. The cursor pulsates instead of blinking, matching the average resting heart rate of a person at about 60 beats per minute.
#figma #prototype #design #ux #userexperience #ui #mindful