Challenge
Even though we designed for micro-interactions to be included in development, due to time constraints, interactions and animations were downscoped from a project. Our developers were mostly back-end focused and were unsure how to implement them, so provided high effort estimates on developing micro-interactions.
Proof of Concept
As part of a collaborative effort to add delight to our products and educate the dev team on small efforts that can make a big impact on user experience, I created this proof of concept. The goal was to create a quick POC using CSS that the team could use directly in development to make this quick enhancement.
Click the "Next" button to toggle the progress bar animation.
See the Pen Progress bar step animation by Samantha Howes (@dusterbed) on CodePen.