Hosted by fabrica, "What if?" is an interactive art installations exhibition featuring 12 budding international artists. Child of a deep experimentation process, this expressive microsite with unique interactions and visual identity archives the artists' provocative works on humanity's future.
Team
Aamir Ali
Rhees Kennedy
Samyak Sah
Krista Mcdiarmid
Celebrate the works
As an online archive for the installation art pieces, the microsite intends to encapsulate the physical experience of the exhibition by creating a sense of immersion for visitors. The following are the major design features of the microsite:
1
Priming Unique Interaction Pattern
The landing and introductory section act as primers to get visitors accustomed to our use of distortion to reveal content.
2
Denial & Reward to Encourage Content Discovery
The exhibit selection section reveals just enough information that entices the visitor to investigate more. This is achieved by tight image cropping and the “what if” prompts.
3
Individual Voices for Each Exhibit
Each exhibit page was given its own voice via unique color, font pairing and custom interaction which were inspired by its physical experience.
4
Adaptive Navigation
Visual form of the navigation bar mimics the content layout. As the visitor enters an exhibit, its visual form changes to signify a different viewing mode.
4
Resistive Scroll as Punctuation
On the exhibit page, resistive scrolling connects one exhibition article to another. Working with the user expectation of scrolling on websites, it subtly draws attention to a page turn at the end of an exhibit article
4
Draw to Reveal Artist
Below the exhibit selection page is the artist page, which is an open space where visitors can click & drag anywhere to reveal the name and portrait of all the artists involved in the exhibition.
Experimental approach to art direction
Taking inspiration from Ellen Lupton, Woflgang Weingart and Chris Ashworth, the process began with a thorough investigation of a set of design principles and qualities.
10
Converging from 3 Directions
The approach I responsible for was chosen for its cohesive use of the principles and its versatility across different media.
11
Wrist band
Event wrist band demonstrates the ability of this direction to both remain intact upon, and compliment various shapes
11
Site Map
The application of a large scale site map installation illustrates how th direction adapts in large scale, functional application.
12
Type System with a Purpose
I constructed a typographic system to ensure effortless alignment of cap-height and baseline across multiple type sizes, creating a structured appearance through consistent vertical rhythm.
12
Pairing the Right Mono
With similar proprtions, Akkruat mono letter-form closely imitate Founder Grotesk in comparison to GT America Mono.
Towards an interactive identity
Driven by a process that focuses on creating tangible artifacts, we iteratively explored interaction and motion possibilities.
To begin, we formulate 3 initial lines of investigations to see what the art direction affords us:
I
Distortion as a way to guide visitor attention
II
Denial and reward through high effort interactions
III
Playing with distortion for personal expression
After collecting and curating an extensive list of distortion techniques, hover interactions, animations, navigation, and methods of implementing dynamic grids, three distinct approaches was emerged as a way to surface content through interactivity.
Seeing how they could potentially compliment each other, the three approaches are unified into one in the final microsite.
5
Three Approaches
Three interactions approaches emerged from precedent research and hands-on exploration.
6
My sketch on cursor interaction
7
Hoverstate sketch
8
My AfterEffects sketch on cursor interaction
9
Prototyping with Code
To test out the idea of "drawing to reveal content", I created an isolated study of the interaction on the process to give ourselves a sense of how it feels. This tangible artefact gave our team confidence to further pursue the idea.
