Responses by Gusto IDS
Background: Part of a wider design refresh of Colombian interior designer Camilo Alvarez’s identity, the site is a digital platform where Alvarez showcases his studio, promoting his own research activities and sharing his completed interior projects.
Highlights: The concept is minimalistic and gravitates towards the pictures that the client had at his disposal. We developed a photo slider to organize the site and provided an extremely sophisticated visual. The result immediately won our hearts and Alvarez’s too. But above all, the slider really enhances the experience of reading about his projects.
Challenges: Though the interface is pretty minimalistic, we wanted to create 3-D features and incorporate micro-animations and transitions between the different sections. For example, the slider itself starts from a real Three.js library that we customized. It was also quite difficult to balance the site performance and aesthetic together.
Navigational structure: The navigation is really linear. The UI consists of pictures and typography and it is easy to understand where to find all the available paths. The Interiors section includes a selection of projects, which can be shown as either a list or a grid. Every project included in the Interiors section has a photographic follow-up page where users can find more details about the working processes and a general photo gallery. All the other sections implement a one-page scrolling template, which is similar to the editorial style of an online blog.
Time constraints: We started working on the project in the middle of September and we finished it at the end of November. We definitely reached our goal considering the time we where given.
Technical features: All of our projects use Wordpress for the content management. We strongly believe it is a consistent platform and is also accessible to all our clients. It has also been two years since Gusto IDS started using REACT JS as a development platform, which enabled us to optimize the resources, taking all acquired information to the next project. On the homepage, we used the WebGL Shader, which emulates a displacement of the images using the Three.js material as the image itself. That is why the result feels like the images are morphing. We also added a soft camera movement to enhance the feeling of a 3-D site space.