Background: Ventiseidieci is a scientific innovation company with a big goal: to improve human performance and quality of life. The purpose of the website is to present Ventiseidieci in its own voice. The company is made by engineers, scientists and creatives, and our goal was to give each of these souls a position on the site.
Ventiseidieci has a double target: on one hand, the other scientists that could be interested in collaborating and working for the company; on the other hand, the consumers of its products. This distinction is visually represented by colors: white for the commercial pages, and black for the institutional ones.
Ventiseidieci’s website is the milestone around which we have built all its other campaign pieces from the corporate materials to the commercial film that we are still producing. Everything is based on a main concept: to show these subjects from a scientist’s point of view. When you look at something really close, colors are brighter, shapes become patterns and even the most common materials become interesting.
Core features: The scientist point of view is the main feature around which the design evolves. It’s a curious, novel and fluid way of watching nature and thinking about technology that we have expressed in every part of the website.
Favorite details: Upon entering, the first thing you will see is a floating solid that represents the atom, the unique and mysterious particle that creates everything around us. By selecting “Explore,” you dive into the solid, entering a cosmic fluid that is the still unknown part of matter. This animation that turns into a wave of energy guides the user through the website—this is what we are most proud of.
Challenges: The website has a scientific and informative purpose, so the most challenging aspect was to match the content with a creative and unconventional design. We maintained a balance between the institutional subject matter and the voice we gave to the website: the interaction design features, for example, must fit in a harmonious way and not overpower the content, as well as the tone of voice that has to be original and distinctive yet clear and trustworthy.
Time constraints: We were lucky enough to work with a customer who knows that you need time to build something of good quality. This enabled us to have time to experiment with the visual effects on the site and finally get a balanced solution.
Divergent paths: The construction of the website was a work in progress. We didn’t have all the materials from the beginning; we had to create and write them down. There are parts of the website that were not even present when we first designed the website architecture. We had to change things and adapt structures instead of starting with a solid scheme. If we could start over with all the content ready, maybe we could have studied the design part better. But it’s something that rarely happens in real life.
Technology: We directed the development of the website. It is based on Wordpress, giving the client freedom to manage the content. The floating solid animation is made using three.js, and for the color changing feature, we used a shader. The other animations are developed in GSAP.