HV Delights

D
01 November 2015

In the 2.5 years I worked with the people at Hinderling Volkart I had the chance to work on interesting projects and components, large and small. Below is an overview of the results I'm most proud of.

Thanks HV

To say thank you to the amazing people at Hinderling Volkart for the time we worked together I created a microsite with a thank you message and a firework animation containing the portrait photos of all my colleagues.

Address
Timespan
March 2018
Location
Zürich
Highlights
Randomized Firework Particle Animation
Technology
HTML Canvas
JavaScript
anime.js

50 Jahre Hitparade

For this interactive experience I created an intro animation. The experience was created to celebrate the 50th birthday of the Swiss Music Charts. Every song that ever made it into the charts can be discovered in this three-dimensional web experience through the last 50 years of music.

Timespan
January 2018
Location
Zürich

Swiss Youth Hostels

On the website of the Swiss Youth Hostels I created an animation for switching out the hostel results based on the applied filter.

Address
Timespan
Oct. 2017 - Mar. 2018
Location
Zürich

Schweizer Paraplegiker-Stiftung

For this website I developed a special kind of 404 error page. To ease the frustration of arriving at a dead end hearts start floating upwards. They can be interacted with and by clicking open into a text box encouraging you to donate to the organisation's purpose.

Address
Timespan
Oct. - Nov. 2017
Location
Zürich
Highlights
Randomized hearts animation Shape morphing animation
Technology
SVG
JavaScript

Schweiz Tourismus - MySwitzerland.com

For the website of Switzerland Tourism I created different components and pages, from micro-interactions to content reveal animations to scroll-based parallax effects.

Timespan
Mar. - Nov. 2017
Location
Zürich

Edelweiss

I created a component called Item Expander for the Edelweiss website. The component allows for a list of items to each have an expanded state that when activated uses the whole list space. By applying a morphing animation to the white box the user understands the relation of information better. On the site it's used to add or edit booked baggage items for the flight.

Timespan
Jan. - Mar. 2017
Location
Zürich

PostFinance

I created a card component for the financial institution PostFinance. The component was teased as the website's biggest innovation. It combines static illustrations, animated illustrations and further information in the form of text and call to action elements in a small appealing element, that can be placed everywhere. The different elements on the card get animated on hover. The directional animations are randomized with a little bit of intelligence so the same direction can't be chosen right after the previous animation had the same one.

Address
Timespan
Jul. - Aug. 2016
Location
Zürich

Bonosera

I created a website prototype for the Zurich based band Bonosera. The vision was that concert visitors could upload their selfmade photos and videos on the website and they would automatically be synced with the main video and audio of the concert. Then when visiting the website people could switch between different source materials instantaniously. For this I created a highly interactive video player.

Address
Timespan
Jun. - Aug. 2016
Location
Zürich

IWC Connect

One of my first projects I worked on for Hinderling Volkart was for the swiss watchmaker IWC Schaffhausen. To counteract the rise of smartwatches they developed a small device that could be attached to a classic watch of theirs and thsu would add smart functionalites. Interactions would then happen via a simple tap gestures on the device or via the app on a smartphone. The microsite I developed was a showcase for that smart device called IWC Connect. The site bridges the gap between a physical product and a digital presentation in a few delightful ways.

Address
Never went online due to a failing product
Timespan
Dec. 2015 - Jan. 2016
Location
Zürich

Sunrise

For the Sunrise website I created a network animation to make the loading time less annoying. Although it's based in two dimensions it creates a three-dimensional effect nonetheless.

Address
Timespan
Decembre 2015
Location
Zürich
Highlights
Randomized network animation
Technology
HTML Canvas
JavaScript

HV Selection

I created this microsite for Hinderling Volkart as a Christmas surprise for clients and partners. Every employee would put a personal gift onto the site and clients could then choose one. First come first serve. Special elements on the site are the 'Pixel Snow' and the 'Typewriter' text area.

Address
Not online anymore
Timespan
November 2015
Location
Zürich