The Dev is in the Details
July 27, 2017 | Marc Williams
Website development, as you’d probably imagine, is constantly evolving. But what might surprise you is that in this ever expanding world, one of the most crucial features is so small, you may not even realize it’s there.
Allow me to introduce you to microinteractions: experiences that help the end user to easily navigate and interact with your website. In other words, these are the small design and functional details that give your users immediate feedback to an action they’ve initiated.
What do I mean what I say “easily navigate” a website? I mean guiding them through a predefined user flow (i.e. – staying on the right path.) But it’s not just helping them – microinteractions track users’ with the help of analytics, and collect data on how people are using your website or widget.
Take a look at the list below and you’ll probably see a few that you’ve experienced yourself while exploring the WWW. I’ve put the dev code in parenthesis next to each one (I can’t help myself, please understand):
- Changing the color of text on a web page to signify a hyperlink. (onHover)
- Changing the border color of a form’s input field either green or red to signify validated content while a user is typing. (onBlur)
- Changing the progress bar as a user completes steps in a multi-step opt-in form. (onSubmit)
- Changing the color or opacity of an icon when a user has liked/favorited an item or product on your site. (onClick)
- Updating the numeric value of an icon to signify how many items you have in your bucket or cart. (onClick)
- Updating a filter to let a user know what they have searched for. (onSubmit)
As you can see, your users can communicate and interact with your website or site widget using many different microinteractions that are connected to the actions they take (or “events” as we call them.) This enables us web developers to help guide users through the site, and allows us to track their interactions using the information they provide us. Remember when I mentioned data collection? The collected information on these interactions is then used to give designers and developers the ability to fine tune user experiences across the website. And we all know that information like this is invaluable to understanding your customers.
[Marc Williams is a web developer at Greenhaus who loves animals, scooters, vegan donuts and oh yeah, web stuff.]