GALLERY
Inspirational sites
GSAP, JQUERY, CIRCLETYPE.JSIAD LAB
https://iad-lab.chThe International Design Lab, or IAD Lab, is a
biennial event for interaction designers and
developers. The 2019 event took place in Bern,
Switzerland and this preview site revealed keynote
itineraries and a roster of invited speakers.
The content in that respect is traditional but
the site’s defining single feature is its navigation
and how elements are revealed. A single-page
structure places emphasis on vertical exploration,
giving visitors a meandering pathway of cells to
unveil. On wider viewports these macaroni-shaped
hotspots snake pipe-like from header to footer,
displaying associated imagery on rollover. Although
neatly separated to contain different nuggets
of information, they also flow connectively to
activate on scroll and flip the oversized typographic
description in the top left. Clicking any of these
shows a simple pink overlay <div> detailing things
like IAD schedules and external links.
Designed by leading Swiss agency Hinderling
Volkart, the site’s unique format also translates
rather effectively on smaller screens to keep
things consistent. Here the pipe-like cells simply
responsively stack full-width and inline while still
maintaining the same animated transitions that
made the desktop version pop.