Background: The purpose of this brand new portfolio site for visual designer and art director Xavier Cussó is to showcase Xavier’s ten years of global work experience and to give him more visibility, now that he is a fulltime freelancer. The site targets advertising and digital production agencies who might want to hire him.
Highlights: The variety and execution of the work shown in the project pages. At the same time, it was also important for us to figure out the right animations and transitions to enhance the overall experience. We paid special attention to creating an animated split-screen design for the homepage, a “work overview menu” and an “About page.” As for the design style, it’s a bold and colorful portfolio, with a branded pre-loader, big imagery and full-width titles.
Challenges: Actually making it happen! Both of us were fully employed and barely had time to focus on it consistently—what could have been a couple of months work turned into a scattered one and a half year’s worth of work. On the design side, it was finding and composing the right images for the project covers on the homepage, bearing in mind that they’d become full viewport images on a seamless transition to the project page.
Favorite details: There is a yellow ribbon on the “About page” calling for the freedom of Catalan politicians held in Spanish prisons or in exile for peacefully organizing a referendum. While this detail might prevent some people in Spain from hiring me, I still stand for my beliefs; denouncing such unfair situations is more important than business.
Time constraints: Since my portfolio is a self-initiated project, we never had a strict deadline. It was turning into a never-ending story, so we decided in late 2017 to do a last sprint and finish it up as soon as we could. Since the site design, animation and performance were good on desktop and mobile for all browsers, we figured it was time to put it online.
Alternative approach: We would have used Vue js, but probably through Nuxt, which allows server-side rendering.