Website Trends 2016: Microinteractions And The User Experience

Listen To Podcast:

Good morning internet fans, Ryan Perry here with Simple Biz Support. Today is Thursday, therefore it is Internet Marketing Thursday. In fact it’s August 6th, and it’s hard to believe we’re this far into the year so quickly. As usual I do have Virginie Dorn with Business Website Center on the other side, good morning Virginie.

Virginie Dorn: Well, very good morning to you from Petaluma, how you doing?

RP: I’m doing wonderful all the way up here in Rohnert Park, a mere 15 minutes away from you. The weather is beautiful, like I said we’re rolling into August already. It’s hard to believe that 2015’s almost over and we’re already talking about what’s going to be happening in 2016.

VD: Yes, actually a lot of my clients are asking me, “What should I be doing next? I’m thinking redesigning my website.” Maybe it’s been a few years, and so there’s a lot of buzz about what going on in terms of new trends, so you and I are here to help.

RP: Yeah. And, well kind of this new trend that we’re going to be talking about is taking some old, actually stepping back for a moment and then also moving forward with what you’re calling a microinteraction. But the overall feel of the website that you’re talking about is really focusing on the end user interaction, and actually making it easier to use. So why don’t you kind of explain what that is first before we go into the microinteraction.

VD: Recently there’s been a lot of talk about my peers, so over professional web designers, about maybe stepping back and just remembering what’s most important when designing a website is the actual… The websites are being viewed by actual human beings. And although the last few years, thanks to great new coding techniques, we all got a little crazy and made websites quite intricate, sometimes way too complicated for the user experience. Still beautiful, but we’ve lost the sense of what the website was there for. It’s not for Google and Yahoo, it’s actually for human beings like for you and I. So being aware of this, we stepped back and again made the focus all about the visitors of the website. By doing so we’re looking at how do we engage them without overwhelming the user? And that’s when micro-interactions become a popular concept and an industry term that we now use among ourselves. So we’re here today to talk about what those micro-interactions are and how we can really improve a user experience on your particular website.

RP: Okay. So essentially it’s kind of the little kid in a candy store, or a little kid at Christmas, you get a new gift, which is a new code or a new developing and you can do fancy things. You get so excited about that, that you really lose fact of… Or sight of every else that’s going on. And I’ve seen some beautiful websites, but like you said, they’re difficult to navigate, I can’t get home, not able to find the information that I want easily. It seems like they hide… The most frustrating thing, especially when it’s a local business is when they hide information like an address or a phone number, makes the whole user experience, even though the show is beautiful, but the user experience can be very painful at best, and ultimately that’s not going to lead to conversion.

VD: Sometimes it’s so busy and dynamic, again beautiful, but the user end up just being a passive audience. So they just watch, there’s no engagements on their part, therefore we’re not that interested in you, you want the right amount of engagement. So with micro-interactions, micro stand for small, so it’s short interaction. They require the right amount of effort on the part your visitor. It’s just the right amount of effort, it gives you the right amount of results so that that keeps them captivated, interesting, and again engaged without too much work on their part with your website. So you get better results because of it.

RP: Sure. If you can keep people engaged and interesting while still making the experience positive and easy, now we’re getting a good blend between simplicity, being able to find what you want, and then also something that’s visually stimulating that makes you go, “Ooh, this is kinda cool.” From a Google point of view, Google wants people to stay… Wants your users to stay engaged on your website, the longer they do, basically Google is going to reward you by saying, “Look, if people are engaging and staying on your site longer than your competitors, you must be doing a better job, therefore I would much rather promote you in the ranking than your competitors because you’re doing a better job.” And ultimately they want their users to have the best experience possibly.

VD: Oh you’re so correct, I think people forget the length of time your users spend on your website is crucial to your ranking in the algorithm for Google, so it’s one of those key elements. You want not just people to arrive to your website, you want them to stay there as long as possible. So, the micro-interactions they’re some type of algorithm everybody’s using, which is a three part algorithm. The first one is the trigger, the second one is the act, and the third one is the result. And we might all call each phase slightly different, but trigger is what’s going to happen if the user does a specific action? So we’ve discussed sometimes if you have a membership website, or maybe a rating system on your website you might ask a user, “Please choose from one to five stars the rating for this particular company.”

VD: So that’s when the person’s like, “Oh, that’s easy. I can click on star number one or two or do five stars and that gives them a five star rating.” Very easy interaction on the part of the user, very clear and understandable right away. You don’t have to explain it too much. So that’s the trigger. The act, so now the user is doing that and be like, “I love ABC Company, I’m going to give them a five star”. So they click again, in microsecond, they click on the first star and it becomes a five stars. And maybe the action, it’s kind of cool, maybe the stars start migrating in front, in the center of your page, and start shining brightly. That’s kind of the dynamic event. So the client is like, ” Oh, cool. Look at that.

VD: I clicked on five and now the star is in the middle of the page and it looks kind of cool, and I just applied a five star rating to ABC Company.” So that’s phase two. And then the third one is for results. We like to kind of write the loop, like we say it. Maybe like, “Thank you for your input. We really find it very valuable and without people like you participating in our website, we would not be that successful.” So again as a user you’re like, “Cool. I just did that little click based on how I felt about this company. I got this cool little star flowing into the page and now they are thanking me for it”. It’s very short interaction, very powerful, it requires again very little efforts on the part of the user and it has a positive impact on how they feel about the website.

VD: Yeah. I think the key thing that you said there is that positive impact. One of the things I am thinking more and more about my business is the actual user experience, not just on my website, but that’s materials, the way I communicate with them, the way I follow up with my clients and what is that user experience because if you can take something that typically in business is very dry and add a little pizazz and make people feel good so now there’s an emotional connection by clicking the five stars, maybe they all circled around or did something shiny, kind of like, “oh, that was kind of cool.” Made them feel good, now they have a positive rapport/interaction, they already gave you five stars, so you’re just boosting that up. And then to follow that up with a little welcome note, or excuse me, a thank you note that says, “Hey. We really appreciate the fact that you took the time to leave a review. Thank you very much.” It’s like, “oh, that’s the personal little note”. It’s automated, it doesn’t take a lot of time or energy. Once it’s done, it’s done, and it can be repeated a million times over without a problem. But now subconsciously and emotionally you have a very positive experience with that user. And that can pay huge dividends for repeat orders, saying something. They are going to be more apt to promote you and goodwill.

RP: Yes. Microinteraction is actually part of the bigger concept which is called microsociology, which again focus on the human aspect of every interactions. So, we just have to remember the websites we design are not for Google, they’re for your customers which are in the flesh, real people, making decision and most importantly having feelings about every interactions they had throughout their day, so we want to microinteraction very short and easy for them and painless and very positive. And you talked about dividends. Every efforts you place into thinking about the right design for your website and your business, it’s going to give you those positive dividends by making sure the user is super happy about being on your site, therefore more inclined to buying your services or your products. It’s all human factors and again, as in my industry we had to take a step back this year and start remembering that people are the one making the purchases at the end of the day.

VD: Right. And it almost, for some reason, it dawned on me, the old rollover effect. You know back, I don’t know how many years that goes back, 10 years. 15 years, whatever. But, if you highlight your mouse over something it might pop up or change colors. That was kind of, I guess, the original microexpression, if you will. Can you think of some other examples of microexpressions or how they can be used in a web design?

RP: Yes. One frequently asked questions, over the last year. Drop-down when you have… Let’s say you have a fairly large resource center with perhaps some 100 questions answered. Oftentimes those would be categorized in categories but there is a toggle effect when you click on the questions and there will be some sort of toggle effect, which is almost like a Drop-down where the answer appear. So that is a form of a microinteraction where as a client I’m looking, “Oh yes. I want the answer to that question.” I click on the question, right away I see the answer. So I am slightly engaged with again minimal effort on my part, but by being engaged, it makes me more interesting in reading the answer. So anything like this, that’s microinteraction.

VD: Yeah, and I love that for FAQs, simply because it makes the page so much cleaner, especially the more… If you only have five questions or five Q and A’s, it’s pretty simple depending on the length of everything, you’d probably fit it all on one page. But as things get longer and longer it just looks complicated, it’s messy. It’s like, “ugh, how am I going to find it?” but if you just have 10 questions, boom, boom, boom, that are all in a row. Visually it makes people more accepting of, “Okay. I will stop and I will look through these 10 items.”

RP: Because it’s clean, it’s neat, it’s organized. The brain doesn’t go into overdrive and what’s really cool is like Virginie was saying, you click on it, boom. The answer pops down. And if you click on a question again, it’ll collapse. Or if you click on another question, this one will collapse and the other one opens, which I think is really neat. And again, it just improves the user experience so now that they’re actually going to engage, because the longer people engage with your website, the more credibility that you’re building with them and the more likely that they’re going to take the next action, which could be to fill out a form. It could be to make a phone call. But ultimately your website should have one purpose and that is to drive users to take an action.

VD: Yes. You said it right and I hope people are really paying attention to that and don’t ask their webmasters to do too many crazy things on their website and take a step back and just think about what you just said. ‘Cause it can change the success of your website dramatically by scoping it down.

RP: Yeah, and if you’re ever in doubt, go to some large websites. They’re not always the best examples. I think for me, I always look at Apple. Apple has always been clean, very consistent. They have some great user interaction. The one I love right now is on their Retina display, one of their computers. And when you land on the screen, it’s just this picture and it’s these two people at a water fall and as you scroll down, the screen actually shrinks. The picture shrinks and what you see is that you’re actually looking at a computer screen, which the first time I saw that I was like mind blown. It was beautiful. Actually, I think I told you about it. I was like, ” Virginie, you’ve got to look at this thing. Look how it goes. It’s cool and you can scroll down the page and they got all this other cool stuff.” But it was very simple. On my mouse, all I had to do was scroll down. Or if you’re on your phone, you just simply scroll down and as I did that, I saw changes happening very, very powerful.

VD: Yeah and scrolling down is a form of microinteraction as long as it doesn’t require too much scrolling, again, just by doing the action of going to different section, the user is doing the action, therefore it’s an interaction. And then they get a result, which is the visual effect you were talking about.

RP: Yeah. Alright, perfect. Well that is it for today’s show. I think the two key takeaways are number one, take some time if it’s been a while since you’ve looked at your website, re-evaluate your website. Don’t look at it from a business owner. You have to remember, you understand your business intimately. What may make total night and day simple… Ugh! This is simple, easy, no big deal, to a lay person who doesn’t understand your business, they could be scratching their head because they don’t have the same concepts and history and everything else that you know, they have none of that. So I always like to dumb things down to a second grade level, if you will, and get an outside perspective and go, “Okay, am I doing too many things? Is my website a distraction? How can we simplify things? Make it clean, make it simple, make sure that user interaction… ” I just… I cannot think of it. I just went to a website the other day, I couldn’t get back home.

RP: The only way I could get back to their homepage was going into the URL bar and actually typing in their website again, which was extremely frustrating. And then the question is, “Okay, well how do we still keep people engaged?” And that’s where Virginie is talking about these microinteractions. There’s a lot more than what we talked about and that’s where you need to talk to a web developer such as Virginie, about what are the possibilities and the different ways that you can take your current concept or even a new concept to the next level. So with that, Virginie, unless you have any last second thoughts?

VD: No, just feel free to contact me directly if you have any questions on microinteractions. I’m happy to give you free input and opinion based on my experience.

RP: Alright, perfect.

VD: Have a great day.

RP: Your web address is down below in the description bar. So feel free to scroll down and find that. That is it for this episode of Internet Marketing Thursday. As always, Virginie, I always appreciate the time and energy that you put into our episodes and I will see you next week.

VD: Take care, bye bye.

RP: Alright, everybody, take care and by the way, next week we’re going to be continuing the website trends. We’re going to be grabbing a different piece of website trends going into 2016, so you can improve your visibility online.


About the Author:

Ryan Perry is the founder and CEO of Simple Biz Support, Inc. Ryan started video blogging in 2009 as an alternative to written blogs to create visibility and credibility online. During the workweek, he enjoys helping small business owners harness the power of video to grow their companies. On the weekends, he enjoys hiking and searching out waterfalls throughout the state of California.

One Comment

  1. […] « Website Trends 2016: Microinteractions And The User Experience […]

Leave A Comment