The masthead image conforms to the width of the viewing device, perfectly matching the full bleed cover of the document the website is modeled after.
The main content of the report is broken into sections punctuated by student quotes, rendered to emphasize their importance.
The two column layout seen on desktop computers collapses into a single column on smaller screens.
On October 29, 2011, the Business Innovation Factory facilitated a day-long design charrette on the topic of students (re)designing the experience of higher education. The companion piece to a printed report containing the findings of the meeting, this website features videos, images and a link to the original document. The goal of the visual design was to reflect student engagement; here, the thoughts and actions of the students at the workshop. This is introduced boldly, at the top of the page, with a full-bleed masthead image and quotes from the students that introduce each section of text. Using responsive web design techniques, the site layout, and, in particular, the masthead image, conforms to the device used, from mobile phone to tablet to desktop.
Graphic/Web Design, Layout, Front-end Development.
Content by Christine Flanagan. Layout based on companion book layout by Samantha Kowalczyk. Photographs and video by James Hamar and Samantha Kowalczyk.