Let’s start with an example of a customer service interaction. Imagine you ask a question to a customer service rep. They make eye contact, have a little smile on their face and reply to you with the information you need. Subconsciously, that eye contact and smile gives you the acknowledgement and information to make an impression of the person’s confidence and control of that situation. Maybe you also felt that you are dealing with a good place that hires good people.
I’m going to say that the person has impressed upon you a perception of quality.
In the above example there were 2 levels of feedback – one with the smile and eye contact and two, with the proper answer. When working with computers, the feedback also happens at 2 levels – one from the object of interaction and next from the expected result of the interaction. For example, you press a button to start your phone. The button itself gives a click (feel and sound) and the phone turns on (an outcome of that interaction). This is normal expected behaviour. Could the phone have done anything more to raise your perception of its quality?
In this blog, we will discover how adding motion can elevate the user experience, create engagement, show the status of a process and bring some delight to the users.
One of the earliest uses of motion was to convey wait time – loading. When Microsoft Windows made the hourglass turn it was extremely valuable information. You knew Windows was not hung, which it did very often. There was also the progress bar. Instead of showing just numbers, it showed a bar moving towards the 100% mark. Both of these elements are still in use and you can find them in hundreds of variations.
Touch screens add another layer of complication where you don’t get the first level of feedback. Tapping the button on the screen does nothing*. It’s not a physical button. You have to wait for the actual action to happen to know that your tap worked. To compensate, designers can use micro interactions. Micro interactions are small animations or visual cues that are triggered by a user’s interaction with a website or app. These interactions help to make the user experience more intuitive, dynamic, and enjoyable. For example, a micro interaction might be a button that changes colour or size when the user hovers over it with their mouse, or a piece of text that animates when it’s clicked/tapped on. These small animations help to create a sense of feedback and interactivity, and can make the overall experience feel more polished and professional. (*Haptics can provide some feedback if available.)
By creating a more intuitive and engaging experience, micro interactions can reduce frustration and confusion, and help users to complete tasks more easily and efficiently. Another benefit is that micro interactions can be used to reinforce branding and create a unique, memorable experience for users. Designers can use motion design techniques to create custom animations and visual effects that reflect the brand’s values, personality, and style. This can help to make the brand stand out from its competitors, and create a strong and memorable impression on the user. Small animations also help in drawing attention to the right spots. A CTA that jumps out just a bit makes it very easy to notice.
Bringing a bit of motion on the website we get covered on –
– acknowledgement & wait times ✔️
– branding ✔️
– delight ✔️
We can now take it a level further. Add in another dimension. 3D technology revolutionises the way we shop online. In e-commerce, 3D technology provides a more immersive and engaging shopping experience for customers. 3D helps businesses to create a more realistic representation of their products, which improves customer engagement, increases sales and reduces returns.
Using 3d on product detail pages allows customers to view products from all angles and get a better sense of their size, shape, and overall appearance. This is particularly useful for products such as clothing, furniture, and home decor, which can be difficult to visualise based on traditional 2D images. Combine 3d with Augmented Reality and users can preview your products in their own spaces. With 3D technology, customers can rotate, zoom in, and even try on virtual clothing items, helping them to make more informed purchasing decisions.
All things considered, 3D models are less expensive than traditional photoshoots. Once you have the 3d models, their previews can simply get better with improvement in 3d technology. Any investment in this area is going to pay off well. With companies like Meta and Apple investing billions of dollars in 3d technology, it is going to become the norm very soon.
If you haven’t yet, you must consider using motion on your website or app. It levels up user engagement on your website, delivers product knowledge seamlessly and makes for a beautiful user experience that delivers a perception of your brand’s quality digitally.
