Interconnect

•

Interconnect Project

Connecting smart homes, buildings, and grids.

Interconnect is a project that gathers 50 European entities to develop and demonstrate advanced solutions for connecting and converging digital homes and buildings with the electricity sector. After having already worked with us, Interconnect tasked us with creating a website that could unobtrusively give the interface a sense of innovation.

Preparing For a Connected Future.

Inspired by two connected puzzle pieces that form a circle, Interconnect's branding had already been created. The web design needed to be aligned with the entire brand identity to perform consistently across all brand properties. However, we made some branding adjustments, so it could fit the increasingly complex and ever-evolving digital world.

Web design: Turn off the lights.

We used a darker theme as it is more aesthetically pleasing, and it gives users a sense of minimalism, sophistication, and professionalism. Using the dark background and their main color, yellow, offered the website the needed amount of contrast.

We also kept the circle, network-inspired theme in the heart of the screen as it bursts personality and charisma.

Connectivity as constant.

The website meets its visitors with a dynamic welcome section that embraces Interconnect's innovative and connective side. The professionally crafted particle animations are displayed in a series of vibrant, moving dots that interact with the mouse cursor to draw users into the project. It produces a cutting-edge impression and saves it from looking boring.

Using WebGL and, of course, a little bit of magic of our front-end developer, the particles were created based on the pixels of an image.

Bridging design & development.

Since working with a design system speeds up the wireframes phase, we made a proper UX research to develop key features and components that could be easily automated. With a well-structured component-based system, we save up our kick-ass development and design’s team time during the product development process, while promoting a shared understanding of the effort it takes to build interfaces.