There is no better way to engage your audience than with a fully responsive online infographic.

Embed videos, hover or click to open additional info, trigger actions — basically use all the best practices of rich media.

Explore the online infographic page below about honey bees. It’s fully responsive and interactive.

---

 

 Honey Bee
(Apis mellifera)

Click the dots to learn more

---

Adult Members of the hive

 

---

10 crops that would disappear without bees

 source: Fox News

Download timeline PDF

When launching a major project like St. Paul’s new hospital it’s helpful to remind people of your major milestones. You can use a timeline design to do just that.

Our timeline design celebrated St. Paul’s 125th and touched on several of their firsts — state-of-the-art equipment; break-through medical procedures; pioneering AIDS treatments and stem cell firsts.

Their vision for the future will yield many more. How? Your financial support is key and reinforcing their track record motivates donors to open their wallets.

Various teams at St. Paul’s Foundation have worked with Far & Wide on a number of different projects, and in every case we have not been disappointed. Great ideas, great creative, and easy to work with on timelines that are not always so forgiving. Truly appreciate the level of professionalism and expertise that Kelly and her colleagues bring to every project we have shared. 

—Nadine Nickull
Manager, Annual & Online Giving 
St. Paul’s Foundation

Infographic PDF

University appeals raise billions annually for universities across North America. In 2014, Canadians gave $18.5 billion to the university appeal of their choice. In 2015 U.S. colleges raised $40.3 billion. The UBC Blue & Gold university appeal is the most extensive fundraising campaign for students in UBC’s 104-year history.

Our infographic for this UBC appeal campaign was a snapshot of where your donations went and what they accomplished. And those are no small accomplishments — $202.73 million last year which created 113 new scholarships; provided financial support to 5,752 UBC students; and funded 282 new research projects.

UBC sent us a list of numbers and turned us loose.

Result? An infographic that’s a super-quick read and shows you where the money goes; who it’s benefited; and the contributions UBC students have made to the world. Nice. And concise.

Students are at the heart of what we do. Ultimately, we want to ensure that more students get access to the best possible education without overwhelming financial concerns. Our Blue & Gold Campaign for Students goes a long way to helping achieve this and demonstrates the positive impact donor support has on our community.

— Santa J. Ono, UBC President and Vice-Chancellor

Infographic letter PDF

Poster A4 PDF

The Southern Resident Killer Whales (SRKW) are an iconic piece of our Pacific Northwest identity. We care about the well-being of these endangered killer whales.

Take a ferry trip from Vancouver to Victoria and you may be lucky enough to see them cruising through their critical habitat in search of the 1,400 Chinook salmon this pod needs to find each and every day.

These endangered killer whales have been in these waters forever. Now they need our help.

We were approached by the Galiano Island Conservancy to design, illustrate and produce this info-graphic communications piece. They wanted to cover all the key take-away points and keep the copy brief. We assisted with the research, edited their supplied copy and augmented the narrative with some additional, engaging story-telling.

The challenge with these info-graphics is keeping text and detail to a minimum while touching on all the salient points.

When this piece was produced in the fall of 2019 the SRKW numbered 73. As of late January 2020 their numbers dropped by one with the apparent loss of L41 – a large bull, believed to be born in 1977.

Please download our info-graphic to learn more about these magnificent threatened marine mammals and find out what you can do to help.

We have been very happy with the services Ian and Kelly and the info-graphics team have provided. The end result is very eye-catching, and serves our purposes perfectly. The production process was collaborative throughout, and they have been very responsive to our input and requests for edits. We have every intention of using their services again for future info-graphics!

— Chessi Miltner, Executive Director, Galiano Conservancy

Infographic letter PDF

Our ACT NOW infographic was part of the 2019 gala fundraiser hospital campaign which reached an incredible milestone of $43,680,000 towards the ACT NOW campaign. This level of financial support represents 87% of the hospital campaign’s $50 million goal.

This infographic was given to high-value donors in one-on-one appeals for their support. It gave them a concise snap shot of the reasons the new Acute Care Tower (ACT) was needed. Reasons like seismic instability (a real challenge when living on the fault line), obsolete and deficient infrastructure, and increasing pressure on service levels because of the aging demographic in the community.

Richmond Hospital could have gone into extensive detail about all of these issues. Instead they opted for this concise, illustrated, short-copy alternative because it’s easier to comprehend. And once you have that understanding, it’s easier to open your wallets and provide support.

In addition to the infographic we also created the ACT NOW branding.

We’ve worked on Richmond Hospital’s fundraising campaigns since 2012. During that time we’ve helped them achieve some other record-setting donation levels like the $1.3 million gala fundraiser in 2015.

Earthcycle PDF

Hemptown PDF

Scott Paper PDF

So your products are better than the competition’s. How much better? Based on verifiable data, these calculator wheels show you exactly how much better.

Our calculator wheels for Scott Paper calculates the reduction in energy use, landfill waste, water pollution, and greenhouse gas emissions for 5 of Scott Paper’s EcoLogo certified tissue products compared to industry standard products. UL Environmental Services provided the research data for this project. The back of the calculator also details the rewards to purchasers through environmental stewardship programs such as LEED, BOMA, EPA and Green Hotel Association.

See the reduction in environmental impacts of hemp garments compared to conventionally grown cotton (arguably the most environmentally damaging crop in the world). Or calculate the reduction in the solid waste stream for compostable produce trays compared to conventional PET plastic produce trays.

I am so impressed with this piece, I think we should have it on the hemptown.com “marketing resources” page. I was proud to include it in the package to Logotex yesterday. Scott felt pretty good about it too. Thanks again. The stuff looks great.

– Jerry Kroll, (past CEO), Hemptown Clothing

Responsive design delivers content that’s correctly formatted for your screen size.

Usually this means that page content reflows to fill the available screen width. Inline images shuffle position as the text line lengths change.

Using a Single Image Can be Great

Occasionally you may want to compose your page content as a single image. This can be great for maximum layout control because you nail down the fonts, the composition, the image size — every aspect of the infographic. In short, you create an image for your page.

Using a Single Image Can be Bad

There’s a potential trade-off when using images. You can run into problems with images because your text and layout are all built to a fixed size. This means content can’t reflow to fill the various screen widths nicely. The benefits described above can become a liability because the image can’t take advantage of responsive design.

Here’s the Problem with Many Infographics

If you’ve spent any time looking at infographics created as images, you’ve probably noticed the problem with many of them.

When you create the image for a phone screen and view it in your desktop browser it will either display as a narrow vertical strip or scale up to fill your browser window with crazy large text sizes and very coarse resolution.

Create the image for a big, desktop browser and view it on your phone screen it will be scaled down to fit the phone. If that happens it’s illegible on your phone.

Neither option works.

Our responsive design script solves that problem.

Here’s how it works. We prepare Small, Medium, and Large (S, M, L) versions for each image and our responsive design script detects your screen size and loads the right version. The examples below are the top portions of three files explaining the volume of crops pollinated by honey bees in the USA. All three are the same resolution, but made to the right widths for each screen size — phones, tablets, and desktop.

---

Check out our honey bee example below on different devices to see what we mean. Or scale your desktop browser window from wide to narrow to see how the images change for each screen width.