Click this! Key components of a successful interactive design

Our brains are primed for interactive content. Studies have found that the inclusion of interactivity on a website led to viewers responding more positively to the content — and they learned more, too. Interactive content converts well about 70% of the time, compared to just 36% of the time for static content. But it’s crucial to understand the medium before diving in.

As any non-developer who’s worked alongside developers can tell you, coding requires very specific expertise to comprehend and properly execute. We spoke with Killer’s Senior Developer Eric Weinberger to find out more about what goes into successful interactive design.

Content

Interactive content might have the same types of information as other forms of visual content. Data sets, definitions, timelines, narrative flow — all of these things are common to visual communication. However, interactivity offers the ability to parse out this content in different ways, letting users define their own experience. Through tool tips (generally, pop-ups that appear upon clicking or hovering), buttons, sliders, and more, developers can set up an experience that lets users choose which information to focus on and which to leave hidden.

In general, you’ll start with the information typed out in a document or spreadsheet well before design begins. Because of this, make sure your content is logically divided into segments with the end goal in mind. To do this well, even though design hasn’t started, you should know some key information about intended layout and functionality — basically, the scope of the work. That way, your content document or spreadsheet will be laid out intuitively, without confusion on order or relationship. According to Eric, “Information Architecture is a hot topic for user experience with design and development for robust web or mobile applications. That said, it’s just as important with infographics.”

Our interactive map for the American Academy of Pediatrics required a highly organized content document from the outset.

Planning Your Functionality

Depending on your interactive medium (email templates, widgets, microsites), you will face different restrictions on capabilities. These restrictions may be minimal, or pretty limiting and templatized. Where you’ll host is the first key consideration in determining what functionality you can provide.

Your target audience can also help you determine this. Some functionalities are intuitive for most users, like a click-and-drag or a simple button, while others are reserved for more tech-savvy, digital-native audiences like Millennials and Gen Z. Just as you adjust your word choice for different audiences, so too should you consider what’s intuitive when it comes to web functionality.

But perhaps most importantly, your interactions should never be superfluous — a.k.a. “fluff.” Your users don’t want a button that leads to nowhere, or a parallax scroll effect for just 3 stats. If, in the concepting phase, you find yourself really reaching for what interactions you can include, it’s time to reevaluate whether interactive content is truly the best medium for your information.

“It might be tempting to pull out all the stops and dazzle users,” says Eric, “but effects and interactions should be grounded in the context of the content and the story that it tells.”

When navigating interactive modules for Boeing Employees Credit Union, the info was complex — intuitive functionality was key.

Layout & Responsive Design

The layout of your text, visual content, and interactive elements can help create hierarchy, determining where a wandering eye will land. Since most website visitors only skim what they see, a smart layout places key information and visuals where they will be noticed, prioritizing the main takeaways. It should also consider adaptability, not only for diverse browsers, but devices.

Responsive design ensures that mobile users have a comparable experience to that of viewers using full screens. Globally, it’s been estimated that 24% of all digital media usage in 2018 is on mobile. That may not sound high, but it’s a nearly 4x increase from 2011, when it was just 5%. With that in mind, designing for mobile is no longer optional.

Eric feels that planning for responsive, multi-device experiences at the beginning of a project is one of the most important considerations you can make. “Reaching any user on any device with a high-quality experience is a top priority — users don’t want to settle for a stifled mobile experience with only limited functionality and simplified design in 2018, so account for scaling a design across mobile, tablet, and desktop screen sizes from the outset of a project.”

For Forbes, responsive design was essential to ensure access on all devices with their Top Market Events timeline.

Ultimately, if a trusted developer plays a big role in conceptualizing your interactive content from the beginning, you’re far more set up for success than trying to plan without that expertise.

Lucy Todd

Author Lucy Todd

Lucy Todd is the Chief Process Officer at Killer Visual Strategies. She is a Seattle native and Western Washington University graduate. Her degree in Creative Writing and her customer service background both inform her work daily. A Killer employee since 2011 and executive since 2014, Lucy has researched for, written, and/or project-managed over 4,000 projects for the company, affording her key insight into our processes and projects. This experience is invaluable in allowing her to lead and empower Killer’s content and project management teams to success. Lucy enjoys managing the day-to-day at the office, offering a unique perspective when a team or colleague feels stuck, and learning from her peers and clients each day.

More posts by Lucy Todd

Leave a Reply