helping a videomaker and artist to introduce his work

when a videographer, painter and friend asked me to build a website to represent him, the main challenge was to tell the many facets of his work.
from the concept to the actual experience, visuals, micro-interactions and micro-copy, the portfolio site became a window into his world.

about the project

timing:

1 year, from the concept to the release

role:

UX/UI designer, no-code web developer

competitive analysis

wireframing

visual design

prototyping

no-code web development

designing a multi-disciplinary portfolio

Every professional who wants to tell the story of their experience, especially in the creative field, knows that structuring a portfolio of projects is a complex activity.

Showing not only the projects, but also personality and vision in an authentic but effective way requires synthesis skills, but also great honesty and clarity of purpose.

If then work and interests range between videomaking, painting and writing, synthesis and clarity become complex but crucial.

To achieve these goals, Carlo Maria Rabai asked me to design and create a website that would be a showcase for his work and a window into his professional and artistic vision.

"I would like something beautiful, lively, artistic, even animated, something professional but also maritime, something reminiscent of a Sicilian fish market."

Carlo Maria Rabai

how to integrate profession and passion in an authentic way

Carlo, a professional videomaker, was initially thinking to build a site to collect and publicize his painting and drawing work, anyway soon we realized that the website could also be an opportunity to collect and showcase his work as a videomaker for important cultural institutions and become an actual professional portfolio.

Carlo is also passionate about writing, especially about movies in specialized publications such as Birdmen Magazine, so this third element also had to be present.

For these reasons, the purpose of the site became to tell Carlo's story in a 360-degree way, not only showing the quality of his work but also giving a glimpse of his personality.

To resolve these issues, it was essential to listen carefully to Carlo's requests and needs, and then to begin research to understand how others have solved similar problems.

landscape analysis: looking for the best references

Although Carlo's mix of experiences and demands required dedicated planning, the problem of portfolio construction has been faced by many professionals around the world. The first step, therefore, was to set up a landscape analysis, tracking down the most interesting cases.

To do this, I conducted a search of numerous portfolio sites in the art and videomaking fields, identifying the most interesting ones, ranking them, and isolating the best solutions.

For Carlo's activities I identified 4-5 interesting examples and put them into a matrix, identifying why they are so good in what they do, but also trying to do something different.

focus on media and content

For art, we identified the gallery design pattern as the most widely used and at the same time the most effective to show a selection of works.

For writing, we decided to accompany each painting with a short story about the history of the character depicted.

For videomaking, we focused on video previews of films when you hover the mouse over the card, also respecting the original format of the videos in the gallery. This also provides an interesting interaction, which I've noticed is often missing from other portfolios.

While defining the content, structure and navigation experience of the site, the work of defining the UI and visual design, also a synthesis of the various souls of Carlo's work, was important.

The most frequent subjects of Carlo's paintings are a fictitious family of Lampedusa fishermen, the Svalbards, so the visual design had to evoke the sea and colors of Sicily, while remaining clean and elegant.

a maritime touch for visual design

We started thinking about a minimal layout with a navigation bar in the left sidebar, where I aimed to make very clear what Carlo does.

For the primary color, after many attempts we chose a Celtic Blue, but we reused the other colors tried in the hover state of the navigation links.

I devoted particular care in the design of the video gallery, to make sure that the overall result showed the unity and coherence of Carlo's style, even in the complexity and diversity of his work, and in the navigation, which aims to always put Carlo's work at the center to tell his full personality.

The synthesis of this work can be found on the homepage, which presents a video editing of his different works as a videomaker surrounded by elements taken from his activity as an artist, an ideal anticipation to the whole navigation.

takeaways

Before the launch of the site, the site was preview tested with 10 users, chosen from Carlo's media and film acquaintances, to gather feedback and correct any errors.

The feedback gathered was very positive, especially regarding the way the video works are displayed and the clarity of the navigation and especially the way Carlo's personality is showcased in the portfolio site.

Very nice work on content placement, these video previews give a sense of the whole and the individual.
You can see the balance between the various contents and you enjoy the product in its individual format.

user#3

sounds interesting?

let’s connect!

I'm ready for new adventures or a side project...
If you want to talk, I’m just a message away!

matteo negri

UX/UI designer

© 2024 - all rights reserved

sounds interesting?

let’s connect!

I'm ready for new adventures or a side project...
If you want to talk, I’m just a message away!

matteo negri

UX/UI designer

© 2024 - all rights reserved

sounds interesting?

let’s connect!

I'm ready for new adventures or a side project...
If you want to talk, I’m just a message away!

matteo negri

UX/UI designer

© 2024 - all rights reserved

sounds interesting?

let’s connect!

I'm ready for new adventures or a side project...
If you want to talk, I’m just a message away!

matteo negri

UX/UI designer

© 2024 - all rights reserved