Via-Glasses Reading
How do you turn a simple concept into something that an audience will want to engage with time and time again? Well, in reality, there are a few ways you can design an appealing website. However, one of the best ways of keeping viewers fixed on a page is to offer some form of animation or imagery.
Indeed, if you click here and read our guide to creating an original looking site, you’ll notice that the blink test is a crucial component of the design process. Put simply, if a user looks at the page for more than three to five seconds, they’re likely to stick around for longer. The theory here is that if someone can’t find what they’re searching for or feel engaged in the blink of an eye, they’ll simply move on. Because of this, animations are often a great way to steal someone’s gaze.
Now, when you survey cyberspace, there are plenty of animations. In fact, the term is actually quite broad. For example, you could have full-screen animations that are the main feature of a page or you could have an intricate animation such as a hover effect when you scroll over a link. Depending on what you’ve created, your animation will typically be saved in one of the following formats: GIF, CSS, SVG, WebGL or video. However, and this is the important point, you need to have a plan.
Online Casino Games Need an Animated Lift
Using animations is great, but using too few or too many can be a disaster. In practice, it’s all about context and aim. For instance, when you look at the online casino world, animations are clearly a big thing. Because developers are tasked with bringing a physical game to life on the screen, they need to be big and bold with their animations. Video poker is a classic example as you’ll discover here. According to industry insiders, video poker is actually quite a simple game in the fact that you have a deck of cards, make two moves and have to create the best five-card hand.
Making this look appealing on the screen isn’t easy, which is why almost every element of the page in a standard online game feature some form of animation. When a player clicks the deal button, the cards flutter down as if a person was handing them out. The hold brings up border around the chosen cards. When a player wins, the prize counter runs up/down at the same time as sound effects play. Put simply, when it comes to casino games such as video poker, you can’t have enough animations.
Business Sites Don’t Need Jazzing Up
In contrast to casino games where it’s assumed the player knows the basics, websites where the user is trying to learn about something require fewer animations. For example, if you wanted to learn about a business that sells bikes, you don’t want a lot of animations distracting you on the homepage. To put it another way, every homepage is like a shop window and if you’ve filled yours with strobe lighting, people won’t be able to see what you’re selling.
According to this take on animations from Google, “one-shot” transitions, such as bringing a menu to life, should be CSS animations. Because you want the feature to be as simple and subtle as possible, it makes sense to use this coding over JavaScript. Once you know that, you can start to think about where the animations really need to be. A good rule of thumb here is to err on the side of caution and use things sparingly. In essence, if you’re trying to keep people on your homepage, you need to do two things: capture their attention and tell them what you do in a few seconds. The latter half of the equation is where text and images come into play.
However, when it comes to the former, you basically want enough flashes of action to make people stop what they’re doing. This could be a few boxouts popping into life or some rollovers. Adding things such as a video that plays before everything else loads is overkill and could actually cause people to close the site. The lesson here is a simple one: use animations accordingly. If you have a simple concept that doesn’t require a lot of explaining and could use some sparkle, go crazy like a video poker designer. If, however, informing visitors is paramount, make sure you sprinkle your site with a few little tricks that won’t detract from your overall message.
