CLIENT

FROM BARLEY TO BEER

ABOUT

The majority of the world’s barley harvest is destined for beer production, including 96 percent of the barley grown in North Dakota. This infographic explores the relationship between barley production and the growing craft brewing scene in ND. This infographic was designed with an interactive approach. My layout is inspired by data visualization dashboards, where a lot of information is graphically represented through a range of graph styles.

I designed this project in illustrator and XD, where I was able to prototype some of the interactions I envision this infographic would contain if it were ever developed to work on the web. I have included screenshots of the intended user experience below the prototype.

User Interaction Highlights

These screenshots of the intended user experience explain the intentions of the prototype if it were to be fully developed.

 

When you hover over one of the brewery-location pins, a pop-up window appears giving the user more information about the location. In a fully-developed design, these pop-ups would be included for all pins.
Going along with the dashboard-feel, there are sections of the infographic which include horizontal and vertical scrolling experiences.
In the lower left of this map, there is a zoom in/zoom out feature that helps the user navigate the pins easier.

Social Graphics

Once I established the branding of “Barley to Beer” by creating the infographic I was able to start creating social graphics and advertisements that could be placed on Instagram and Facebook.

 

For the Facebook ad I created a carousel-sponsored post with four frames. The same type-lockups are used to convey the “more barley for your buck” message used in the infographic. You can slide through these graphics in the gallery below.

For a social post example, I created a simple animation that utilizes an amber color beer background video to provide interest and depth on the feed.

Video by Engin Akyurt from Pexels.

Here’s an example of a static social post that utilizes a graph from the infographic by delivering it to the audience in a bit-size chunk of content.

+ See more design work