Loading ...

Responses by Nathan Riley, design director, Green Chameleon.

Background: The Nightingale team came to us with the brief of creating a new website to showcase their work and progressive, forward-thinking approach. With this in mind, we knew we had to create a digital experience that really pushed boundaries and would leave a lasting impression with their potential clients.

Favorite details: For us, what makes the site so unique is the use of a very tech-heavy interactive element in the particle system, combined with contemporary typographic choices and layouts to create an experimental but also fashion-conscious aesthetic. We put a lot of effort into the smaller interactions too, such as image transitions and load-in animations to give the site an extra level of polish.

Challenges: The combination of different effects and ideas, and how to bring this together in a performant solution. As with any project that pushes boundaries, there is always a playoff between creative ideas and performance, but we are particularly pleased with the end result given everything that happens on and behind the scenes of the site. For example, we combined multiple WebGL elements, such as the particle system and cylindrical services viewer. We encountered a few challenges with aligning the positions of these elements as they were initially developed independently using different camera set-ups.

We realized when taking the project on that even to deliver a less ambitious site would be pretty tight in terms of timelines, so of course, we decided to make our lives even harder by designing some very experimental features and ideas. But as always in these situations, the hard work paid off, and the client and our team are extremely proud of the result.

New lessons: We learned a lot about the process of going from design to code in terms of WebGL and working in 3-D environments. The original design idea for the particle system was created in Cinema4D and X-Particles. We then had to refine the shape of the wings and animation to figure out how to export this into a format that would play nicely in a WebGL environment. Working with the very talented Edu Prats, we had a lot of back and forth on this and more trial and error than we would have liked, but eventually found a solution that enabled us to retain the rigged model animation in GLB format.

nightingale.world

Browse Projects

Click on an image to view more from each project
X

With a free Commarts account, you can enjoy 50% more free content
Create an Account
Get a subscription and have unlimited access
Subscribe
Already a subscriber or have a Commarts account?
Sign In
X

Get a subscription and have unlimited access
Subscribe
Already a subscriber?
Sign In