oollee
A bold website for oollee, a drinking water provider
case
Digital thinkers conf.
Digital thinkers conf. is a New York conference by Awwwards, a respected international award platform.
task
To make a site that wouldn’t just talk about the conference, but would impress the design community, as the users are the leaders of the digital crowd. The conference is to take place in New York, and the main condition was to create a direct association with the city.
client
Awwwards
industry
Events
year
2018
deliverables
Front-end development
Design
3D
Key idea
To recapture the atmosphere of New York through 3D models of American fast food: hot dogs and pigs in the blanket.
Main page
Every section has its own dedicated object, where the main page got 3D model of a hot dog — one of the unspoken symbols of New York. Being monochromatic while just being opened, the object responds to the hold of mouse button: it changes textures and colors, while the whole page gets bright colored.
The colored highlight on the ‘click and hold’ button gives users a hint that they can play with the site.
Cursor with a bonus
The gemstone of the site is as follows: you can mess with the best known web designers and get away with it. On any image cursor becomes a bottle. You click, the bottle squeezes and the speck of color comes out of it right on the faces of the speakers. Every color theme has its own color of the ‘sauce’.
Adaptive site
Whatever you have — a desktop computer, a smartphone or a tablet — we took care that the site opens well and is easy to use on any modern device. Wherever they are — either on the subway or on an airplane in any place in the world — the participants are able to anticipate one of the most ambitious events of the industry with comfort.
It’s the first project with the new identity for Awwwards. We thought it all through to broadcast the brand in the right way: from the dots before the words and up to the ketchup-written WWW. on one of the sausages.
Browser animation
Whole site is based on WebGL, a modern technology. Algorithms for the 3D models were written from scratch specifically for this task: we’ve calculated the tangential, normal and binormal spaces. Made the site the fastest it can be by compressing the 3D objects without losing in quality on the way.
Five symbols of the conference.
We’ve found great metaphors for the sausages. The main page was given hot dog as the most known american fastfood. French hot dog that looks like a microphone went into the speakers section. Sausage coil on a stick looks like a pin, so it went to the ‘venue’ page. The party section got a balloon dog that is made out of sausages.
For 3D objects to look realistic we gathered half a hundred of files with light and materials — leather, steel, velvet and silver.
Bright digital world
The design here is built on a contrast: you jump from monochromatic colors into electric craziness just by a click of your mouse. We created several color schemes and even more object textures.
technologies
vanilla JS
JavaScript
Three.js
webGL
reviews
We are writing to show our appreciation for your work on the very unique New York Conference 2018 website. You have approached the brief in a professional manner and shown good understanding and planning. Whilst implementing our own specifications, you’ve contributed innovative and creative ideas. All issues have been solved in a timely and easy manner. It has been a pleasure for us to collaborate and work together.
see also
let us know
we craft award-winning digital experiences that reach both minds and hearts of people
8
65
13
4
36
8
