Portfoilio for film & visual art
 



Identity Portfolio
 website 




Designing a split-audience experience for a filmmaker
and multimedia artist.

Key deliverables: audience-driven IA, responsive exploration patterns and a reusable content system for adding projects safely.


Role: UX architecture, web design
Scope: IA, interaction design, usability testing, design system.


Context
My role & approach
Users
Problem
Insights
Solution
Validation
Results






CONTEXT

Double sided portfolio
Vladimir works as both a filmmaker and a visual artist. 
The portfolio had to serve two very different audiences without splitting into two websites.

The design goal was clarity in the first seconds: who he is, which path or where to start.




Film industry viewers needed fast access to films, showreel, roles, and behind-the-scenes breakdowns. Art-world viewers needed curated artworks, categories, and context.

The portfolio should not only be a gallery, but also a means to attract employers, clients and the art environment.

Starting point


The old portfolio showed everything, but didn’t answer the first question: “Where do I start for my needs?”
Navigation followed internal file categories, so visitors had to decode the structure before exploring.

So I validated the structure and entry points first, before iterating on visuals.







Before: navigation mixed content formats
and forced visitors to interpret where to start.




The biggest UX challenge was making the dual identity legible in seconds and the archive feel curated.




MY APPROUCH

How I worked

I led product and UX design for the redesign and reframed the structure from format-based categories to audience-driven routing.















Goals and success criteria  

 Success meant: the right first click without guidance, faster access to proof and confident deep exploration without losing orientation.

Without analytics, I used think-aloud usability tasks to validate:
• Can people choose Film vs Art without hints?
• Can they find a specific project fast?
• Do they stay oriented after scrolling and spot contact links?
With audiences defined, discovery focused on testing whether the existing structure helped each group reach proof quickly.



USERS

Target audience
Vladimir’s work spans film and visual art, so visitors arrive with different evaluation goals and time budgets.

I mapped three core evaluation intents (hire, collect, curate) and used four role models to make structure decisions testable: routing, navigation density, and how much context belongs above the fold.




Different audiences needed different entry points — but one shared rule: route first, then reveal depth.

Next are the findings that shaped the final interaction model and page templates.




    

Discovery

Research


I joined after the initial visual direction was set, so the first step was validating whether the structure matched real evaluation tasks.

I mapped audience intents and ran quick, iterative checks to see where people hesitated, what they clicked first, and what made them leave.





Reference moodboard (inspiration only; not part of final deliverables).

Methods used:
• Moodboards to align visual tone
• Lo-fi wireframes to test structure before polish
• Quick usability checks to see what users scan, click or ignore

First structural hypothesis: a folder-style “file system” structure (projects as categories), mirroring how Vladimir organizes his work.



I treated the early “file system” layout as a structural test: could a creator-facing organization also work as a viewer-facing evaluation flow?









When tested against real evaluation scenarios, four failure modes repeated across audiences.

It aligned with the client’s mental model and created a strong identity — but in real evaluation tasks, visitors worked too hard to find the right path and the strongest proof.



PROBLEMS

What broke when I pushed this structure further
When tested against real evaluation scenarios, four failure modes repeated across audiences:


No clear first choice
Visitors had to guess where to start (Film vs Art) and sift through the wrong categories.


Decision fatigue
Long lists felt like a spreadsheet — exploration dropped after a few items.
No clear editorial hierarchy
Everything looked equal, so the strongest work didn’t stand out.


Weak story on the homepage
Text-heavy hero didn’t establish what to click first or why.



INSIGHTS &  FRAMING

Reframing the problem

The early “file system” concept was a helpful hypothesis, but evaluation behavior was different.

Visitors were trying to answer a specific question fast, so the portfolio needed to route by intent first, then reveal depth progressively — with stable orientation and curated choices.

What I decided 
to build
stakeholder interview · audience mapping · think-aloud checks · quick structure tests








Hypotheses



H1 Routing:
Clear Film/Art entry reduces hesitation and increases correct-path selection.


H2 Navigation stability:
Fixed navigation while content scrolls increases depth of exploration without losing orientation.
H3 Curation
Short visible lists increase clicks vs long equal-weight lists.



H4 Visual pacingLarge anchors and controlled rhythm reduce overwhelm in dense grids.


SOLUTION

How I worked — Phase 2Design the interaction model (TO-BE) 


I designed the site as a two-track evaluation flow. The homepage becomes a routing decision (Film vs Art). 

After that, each track uses the same interaction rule - stable navigation and structured story, so visitors always know where they are and what to do next.




Template hierarchy
The structure is intentionally simple: one page template, one navigation model, repeatable content sections — adding new projects shouldn’t require redesigning layouts.







Lo-Fi Wireframes

validating mechanics before visual polish







After the first full prototype pass, I tightened the rules: curation thresholds, text pacing, template constraints — so the system stays stable as new projects are added.




VALIDATION &  ITERATION

How I worked — Phase 3


Once the structure worked in lo‑fi, I moved to high‑fidelity to validate scanning, hierarchy and pacing with real content.

Without analytics, I used lightweight think‑aloud tasks and tracked observable signals: first‑click confidence, time to find the showreel, backtracking, and whether people could switch tracks without getting lost.







What broke
and how I fixed it



Sidebar list still felt heavycapped the visible set and grouped the rest as “Everything else”

Copy was too dense
kept scannable intros and moved depth below

Spacing drifted across pageslocked rhythm tokens and enforced components

Media grids competed for attentionreduced simultaneous thumbnails and used stronger anchors











NEW design

Turns the portfolio into an evaluation tool: clear Film/Art entry, stable navigation and a predictable story template for every project.







Baseline layout: navigation stays fixed on the left, while the story scrolls in a consistent sequence on the right.

I validated it through short repeated checks:
first‑click accuracy, list‑length tolerance and whether project switching stayed effortless without losing context.





    








RESULTS

Project wrap-upThe final result is a portfolio that supports two industries without splitting the brand into separate sites. It routes visitors quickly, keeps orientation stable, and scales as new projects are added because the layout is component-driven and documented.



The Human Side of Scale






The hardest part for me

Was earning enough trust to change the structure under a strong existing aesthetic.

Clarity didn’t dilute personality - it made the work easier to judge fairly.



What I loved most


Was the collaboration also: turning subjective creative material into testable decisions.

Once those were aligned, the rest became craft — pacing, templates, and small rules that keep the system stable as it grows.





Let’s talk