Planer

  • Home
  • Chapters
    • 01: Introduction
    • 02: Visual Ethics
    • 03: Research
    • 04: Design
    • 05: Visualization
    • 06: Maps
    • 07: Diagrams
    • 08: Motion
    • 09: Case Studies
  • Examples
    • Maps
    • Charts
    • Diagrams
    • Data Visualization
    • Interactive Graphics
    • Motion Graphics
  • Resources & Exercises
  • Expert Interviews
  • Tutorials
    • Illustration
    • Motion graphics
    • Data visualization
    • GIS
    • JavaScript
Home 08: Motion

08: Motion

As information graphics move from print to digital, animation and interactivity fundamentally change presentation strategies, and consequently, the user experience. Audiences consume and navigate information graphics differently, depending on what form they take, from print, to online, to broadcast.

Of course, all graphics – whether print or digital – should adhere to many of the same fundamental principles. They should always be visually and textually accurate, overly researched, well written, and enhance understanding. However, graphics reporters must be able to develop graphics for multiple platforms, and knowing the different software programs is only half the battle. Even more important is understanding the differences in reader engagement and how those differences affect the way a graphic comes together.

This chapter explores how two powerful concepts – interactivity and motion –affect how readers engage with and navigate digital graphics. We’ll also explore how interactivity and motion can enhance storytelling, as well as the challenges they present for graphics reporters.

Topics Covered

Interaction Design: When it comes to information graphics, we often think of a design as an exercise in aesthetics or a strategy for organizing information. However, as graphics migrate to the web, our understanding and application of design must expand. Interaction design – the practice of designing interactive digital products – provides us with a framework for doing just that.

  • Dimension One- Words: The words we use as designers and storytellers to characterize how users will interact with a graphic are extremely important, both as we communicate with one another and within the graphics themselves.
  • Dimension Two- Visual representations: Buttons, input boxes, and other interactive visuals are examples of visual representations. Each carries with it perceived affordances – how the user thinks the navigation might work based on its design.
  • Dimension Three- Physical objects or space: This dimension refers to the tangible mechanisms viewers use to control interaction and the spaces in which interaction occurs.
  • Dimension Four- Time: Content that changes over time-such as sound, video, or animation-must be carefully panned. Storyboarding- a technique rooted in video and film production- has become a common approach to planning motion graphics, as well.

 

Motion graphics: Print graphics often fall short when movement, action, and progression are central to storytelling. When the medium is inanimate, graphics can only imply motion with arrows, numbers, lines, or other directional elements. However, motion graphics – also called narrative graphics – combine video, animation, 3D, photos, illustrations, and/or typography with sound and narrative voiceovers. This multimedia approach can be very powerful because good motion graphics often explain phenomena

Interactive graphics: Interactive graphics are similar to print graphics in that they generally come in the form of diagrams, charts, maps, etc. However, online graphics can engage readers in a more interactive experience and support the presentation of a greater amount of information in a single interactive space. Interactive graphics may also be nonlinear and promote exploration rather than passive consumption. In fact, the most effective digital graphics promote interactivity while also observing a clear and logical organization of information.

Mar 22, 2016 jennpal
Recent Posts
  • Interactive Map: Sierra Nevadas
  • Data Visualization: Plotting Emotion
  • Information Graphic: What Time Will the Polls Close?
  • Data Visualization: The Complete History Of The NFL
  • Aortic Stenosis
Recent Comments
  • Mr WordPress on Hello world!
Archives
  • April 2017
  • January 2017
  • November 2016
  • October 2016
  • September 2016
  • March 2016
  • May 2015
Categories
  • Charts
  • Data visualization
  • Data Visualization
  • Diagrams
  • Examples
  • Exercises & Resources
  • Expert Interviews
  • Featured
  • GIS
  • Illustration
  • Interactive Graphics
  • JavaScript
  • Maps
  • Motion Graphics
  • Motion graphics
  • Tutorials
  • Uncategorized
Meta
  • Log in
  • Entries feed
  • Comments feed
  • WordPress.org
Footer Sidebar 1

Drop a widget on "Footer Sidebar 1" sidebar at Appearance > Widgets page.

Footer Sidebar 2

Drop a widget on "Footer Sidebar 2" sidebar at Appearance > Widgets page.

Footer Sidebar 3

Drop a widget on "Footer Sidebar 3" sidebar at Appearance > Widgets page.

2016
Planer theme by Dankov