Responses by Craig Boldy, lead developer; Damien Fisher, founder and managing director; and Ola Tambor, head of digital, Fishtank.
Background: “The purpose of this site was to visualize the approach Orange Design Studio (ODS) has in all the architectural projects it manages,” says Ola Tambor. “The site is focused on communicating the design studio’s creativity and relaying across its sublime level of care and professionalism. The site’s launch was part of its rebrand launch campaign, further supporting the vibrant identity we conceived for ODS and enabling the company to refocus its content efforts and social strategy.”
Design core: “The main goal of the design was to enable the projects to reflect the services delivered by ODS,” says Damien Fisher. “In order to achieve the best results, we kept the gestures and microtransitions subtle and simple throughout the site, while also maximizing the graphic real estate across all screen sizes.”
Favorite details: “We are definitely most proud of the clean, simple design, which incorporates a seamless navigation system as well as an impactful brand consistency,” says Fisher.
Challenges: “Keeping the color palette of the brand down to no more than three,” says Fisher. “This was particularly important to enable the project photos to be the focal point of the site. All other elements had to remain secondary.”
New lessons: “We learn from every project, whether it’s a lesson in development, customer service or project management,” notes Tambor. “This was a lesson in humility: not everything we imagined would be perfect for our client will actually be liked by them in that exact form. Both brand and website designs have to be flexible and leave room for the feedback of the most important stakeholders in this process—the client and the end user. And if that means that sometimes we have to place the logo in a different location, remove the smart icon we so proudly designed or modify the scroll mechanism, we have to let it be. We are not oracles. We’re partners.”
Navigation structure: “We wanted to stick to the client brief, which was to make it simple, stripped back and very focused on the key areas of the site,” says Tambor. “The naming structure and look of the on-state menu—a sleek minipage in itself—were a big part of that. Projects are there to inspire and users can refer back to the sketch to read ODS’s expert content.
“Our goal for the user journey was to simplify and remove unnecessary distractions. The aforementioned look of the menu, which fills most of the screen and gives users a clear map of the site’s content, was a great choice for ODS. It’s impactful when clicked but nicely sits to the left of the site when hidden away, encouraging more engagement with the site’s content.”
Technology: “We built the site using Wordpress,” says Craig Boldy. “Beyond using PHP, HTML, SCSS, CSS and JavaScript to create the site, we also used Gulp as a build tool as well as GSAP for all the animations throughout the site.”
Special features: “We’re especially impressed with how we brought the custom mouse to life,” says Boldy. “ODS is at the forefront of design and development, which is why it was so important to portray its edge throughout its platform. The small orange circular mouse design not only complements the brand but also enables ODS to stand out from the competition.”