drag

we craft award-winning digital experiences that reach both minds and hearts of people

7
45
11
3
35
5

case

oollee

Drinking water provider.

en.oollee.com
task

To present a service new for the market, and to tell people about the quality of water and benefits of the service.

client

oollee

type

Services

year

2018

worklog

Front-end development
Design

honors

CSS Design Awards
Website of the Day, 21 марта 2018
Awwwards
Site of the Day, 23 марта 2018
Key idea

3D aquaman that reminds of how much water is important for a human. Elaboration of the matching details and a step-by-step explanation of the new type of service.

Logo

Apart from the website, we’ve designed the logo as well. «Oollee» sounds like улей [ulej], «hive» in Russian. So, the symbol of the company was formed from three water drops resembling a bee. You can see it become a preloader when you open the site, and see it go up the screen when the site’s fully loaded.

The prototype of the 3D water model and of its every pose and movement, is an actual human.

Content

We didn’t merely fill the site with texts explaining the philosophy of water intake, but also made those texts visually attractive: the buttons got a ripple effect, and water is running over the letters — that completes the image and immerges into the atmosphere.

To increase the impression on mobile, we involved the gyro sensor and added vibro response.

Technologies

We focused on the animations: every button and every cursor movement, transitions, hovers and drags — everything works towards the brand’s image. For the site’s reliable work we’ve used PixiJS, WebGL и GSAP.

Gentle melody, sound of rain and waterfall — all enhances the impression and aids the engagement.

testimonials

vanilla JS

GSAP

Pixi.js

JavaScript

webpack

SCSS

webGL

see also

Volt for drive

A tech savvy website for a service for EV charging stations facility management

Sally

A website with 3D elements for Sally, a company that offers vehicles to drivers

Digital thinkers conf.

A bright & advanced site for the leaders of digital community

let us know

Have an idea in mind?

We’re Red Collar. And what’s your name? We actually need your e-mail to get in touch Wow, this load is way too heavy for us. Files larger than 10 MB can be sent to hello@redcollar.ru You made a mistake, but it’s fine. We all do. Enter a valid e-mail, please

By submitting this form you agree to our privacy policy.