Responses by Marcin Paściak, creative director and partner, Hopa Studio; and Kuba Przyborowski, chief technical officer, Owls Department.
Background: Fashion show choreographer and design firm Choreograffiti contracted us because its website was outdated—still based on Flash technology. As a design studio focused on working for new and existing brands, we created a whole new image for Choreograffiti. While creating a new website, we kept new elements in mind that could translate to the real world.
Choreograffiti hadn’t needed any advertising for a long time as its work for the biggest and best fashion houses is highly exclusive. The client wanted to gather its legacy and present it in an attractive, readable form. The brief was short: the site needed to be fashionable, creative and contemporary. With a commission from the creative industry and a client who trusted our vision, this was a very comfortable situation.
Design core: The most crucial aspect of the project was presenting the client’s work. We wanted to present as much of the choreographer’s portfolio in the most straightforward way. From the beginning, we knew we wanted a “light” website without any aggravating effects.
We’re proud of how smooth the work during the project went. We’ve managed to achieve an attractive, randomly generated graphic element while keeping a light website structure. This was our idea: strong, fashionable typography and generated effects referring to the client’s name and activity.
Divergent paths: We asked Choreograffiti to prepare materials from its portfolio from the very beginning, but in the end, it turned out that there was much more content than we expected. We’d advised against using specific pictures in the site’s presentation, so culling the selection resulted in a longer time spent on this project.
Navigation structure: We wanted a simple structure that’s very standard for portfolio websites. The only thing Choreograffiti wanted was to keep the clear division between the categories of events it designs: Fashion Shows, Commercials and Mass Events. Thanks to that, we knew which navigation elements we should highlight on the website.
Technology: The most interesting part of the design is the organic effect of the “growing green mold”—as we’ve named it. Initially invisible, it unexpectedly begins to cover the page as the user interacts with the site. To achieve it, we used PixiJS with its great WebGL filters and GSAP for smooth animations. To further enhance the experience, we’ve built custom-page transitions that utilize asynchronous calls to the server.