Responses by Quentin Hocdé, creative developer and Frédéric Marchand, president/ creative director, Locomotive
Background: Home Société hosts a curated selection of distinct furniture and accessories for home and garden, carefully chosen for their beauty, quality and versatility—tailored to reflect Toronto’s singular sense of style. The website speaks mostly to distributors, but will also appeal to direct customers. The main purpose is to create a single online destination to showcase the whole line of furniture brands from Home Société.
Highlights: Design and navigation. A horizontal scrolling effect brings a new dimension to an interface that relies heavily on typography and animation to browse through brand content.
Challenges: Managing horizontal scrolling behaviors. We needed to adapt many concepts, such as parallax, sticky elements and viewport detection. We also needed a vertical version for mobile devices. So, we had to establish and validate all design elements before beginning the prototype.
Navigational structure: An editorial-inspired layout using a horizontal navigation to deliver a single message to the site’s audience, mostly all in one big scroll experience. It was fun to work with a magazine-style layout and motion design that helped guide the front-end development animations.
Time constraints: We already know that lowering the scope of work on a project is always better than sacrificing quality and user experience in order to meet tight deadlines. We kept it simple and developed a single-page website with high standards in only four weeks, from brief to launch.
Anything new: We used version 2.0 of our locomotive-scroll for the first time. It is fully homemade—no other scroll library is being used—so it’s more flexible and performs better. It’s currently a work in progress, but we have an “almost” stable version. It is open-source, so users are free to use it and give some feedback. We also used our locomotive-boilerplate, which we are currently rewriting with some new cool features.