Inspiring Interactive Infographics & Microsites

Single-page microsites are a great way to create interactive and informative infographics. By encouraging users to physically engage with your site, you are more likely to interest them in your content and effectively convey your message. Infographics in the form of microsites can highlight a specific element of your brand and provide more detailed information than a full website might have space for.

Effective microsites strike a balance between being straightforward and clear in their purpose, and providing engaging and creative aesthetics. Microsites offer more freedom than full websites, which must follow certain conventions in order to be successful, in that designers can take more risky creative directions. Many wow viewers with innovative scrolling, animation and hidden navigation menus, while still driving their message home.

On the other hand, single-page infographics don’t have to be complex to be impressive. Like in this ipod capacity visualization or this landlord guide, a more simplistic approach is often more beneficial in representing a brand’s identity and retaining focus on the content or goal of the page.

Before beginning the process of designing your own microsite, find inspiration in this compilation of impressive single-page sites.

Mac Pro

This promotional page for the coming release of Apple’s Mac Pro is as sleek as the brand it represents. Take a realistic, illustrated tour of the structure of this product while learning all the concise information about what it has to offer. As you scroll, you watch the product reveal each area of importance, which is then explained through clear copy.

SimpliSafe Home Security Guide

The stylistic graphics and parallax scrolling that animate this security guide make it exceptionally engaging and informative. As you scroll through the different rooms of a home and learn how you can protect each one to make your house as secure as a castle, you’re easily persuaded while being entertained – without even realizing it.

inTacto

To launch the illustrated history of this company, simply click the start button and watch the rocket take off through the years. The page’s movement encourages the viewer to keep their eyes glued to the screen to prevent missing out on anything. The details that accompany the information make an otherwise possibly boring timeline into quite an enjoyable and amusing experience.

Quechua

This site is more visually based to portray its information. Meant to present a slideshow of an adventure, the unique layout and parallax scrolling provides illustrative and typographical embellishments that add to the interactive experience, as well as help the user to create a personal connection to the images.

Intangible Assets Guide

The highly functional icons and design elements that move throughout this page provide visual interest to draw the user in, and they also call attention to important information, which is the main purpose. An overall balanced page, the hierarchical layout and functional diagrams complement the fun and purely aesthetic graphics.

Dangers of Fracking Guide

Learn all the facts about hydraulic fracturing by journeying as a fluid drop through the process of fracking. As you scroll, you gain quality information while enjoying continuous interaction with detailed graphic elements and parallax scrolling that illustrate the life and effects of this type of drilling.

Take the techniques of these successful infographic microsites into account when creating your own. While you should feel free to let your creativity fly, don’t get too focused on just the aesthetics. Remember to put thought into the functional aspects of your site, like succinct content, brand identity, hierarchical layouts and understandable navigation systems.

Luke Clum

Luke Clum is a graphic designer and web developer from Seattle. He loves UI design, alpine climbing and the soothing splash of earl grey. You can follow him on Twitter @lukeclum.

Share this post!

Tags: , ,

  • Share
  • Stumbleupon Cre8ive Commando
    • Share

  1. Nobody's made a comment yet. Why don't you be the first?



Have your say!