Apr 10, 2017work, digital

Westminster SU impact report

While at Westminster Students’ Union, I was tasked with making an online version of the organisation’s annual impact report, which is normally distributed in print format.

The report is divided into scrollable sections, with a strong branded colour scheme.

I took the content from the print version of the report, rewriting copy for a web audience where needed, teasing out key statistics and drawing simple icons and vector illustrations to accompany the stats. After assembling the content, I moved onto wireframes and sketch mockups.

Then, I coded the concept from the ground-up, incorporating SVG animations, Javascript-driven interactivity, pie and bar charts.

I began, as always, with content, followed by wireframes and mockups.

The interactive, animated graphs were developed for the report using the popular D3.js (Data Driven Documents) library. These respond to the user’s cursor or touch interaction and are fully mobile-friendly.