Responses by Kommigraphics.

Background: Cinematographer Antonis Kounellas’s new website is his online portfolio, highlighting his expertise and artistic talent as a cinematographer through an inventive and “out-of-the-box” navigation. The target audience is the creative community—especially advertising agencies and producers that seek a creative eye and detailed outcomes for their projects.

Design core: From the very first screen, the 16:9 desktop display environment helps the user understand the cinematic concept and scope of the brand, where the introductory information and a preview of the web content details are presented as if they were a movie’s titles. The wow factor and the emotional approach were the two key pillars to attribute the filmmaker’s artistic concern, creativity and differentiation from the competition. Large volumes of typography, dashing typesetting and unexpected elements are part of the details one can see in the filmmaker’s own work.

Challenges: We wanted to create more than just an online portfolio. The main challenge was to be able to tell a story and to capture our client’s creative passion. Wanting to showcase Mr. Kounellas’s specialties, we relied on movement rate, rotation, contrast and directional approaches that a cinematographic shot or end product could bring, delivering all of the above through design, typography and programming.

New lessons: We tested our limits in terms of content architecture and development. We learned that if you dare to be bold and beautiful, you should also be prepared that you need to work really hard to get things done in the most effective way. Digital is full of restrictions but also potential.

Navigation structure: In order to create an online story, the switch between different content is done in a very gentle and orderly way, keeping the user’s interest and navigation alive. Different pages do not seem to load, but the users get the impression that they stay in the same environment and simply move on to another chapter of the website’s online story.

Technology: We used a custom WordPress installation to power the back end. The website is completely custom coded on the front end with lots of custom JavaScript and CSS. For page transitions, we used barba.js.