Start with an idea visitors can understand
“Too Many Tabs” gives the website a recognisable point of view. Floating windows suggest the way a creative mind moves between music, typography, images and unfinished possibilities. The cream, charcoal, lime and cobalt palette ties those different elements together. The opening establishes that world before the selected projects take over.
The mascot is an expression of that idea. Its soft charcoal shape and oversized eyes create a friendly centre for a page filled with sharper frames and expressive type. It appears across the portfolio, giving the visitor something familiar as the visual setting changes.
Make each transition introduce the next chapter
The tab stack clears as campaign, typography and photography cards arrive around Milo. That change connects the introduction to the work instead of leaving the opening as an isolated animation. Later, an illustrated water entrance introduces the About chapter and a touch-controlled rope swing points toward the Studio.
The same principle applies to smaller interactions. The ball travels from the mascot’s hand into the “o” in the Milo logo. Its destination makes the movement understandable. Decorative motion has a stronger role when it completes a small story or reveals what the visitor can explore next.
Keep the portfolio useful between the surprises
Selected work appears early and can be filtered by discipline. Offbeat leads the digital studies, with Softspot, Daydream and Oddly showing different visual directions. Each project opens into a contained paper-and-envelope view with the brief, design decisions and an interactive example.
The Studio gives campaigns, editorial artwork, image treatments and a ceramics film their own space. This separation lets a visitor choose between digital experiences and visual work without having to follow every animation. Descriptive project copy and direct links give the work a readable structure.
Let the sketchbook show the thinking
The notebook sequence uses the actual pencilled frames as image containers. Campaign pictures fill those frames, then handwriting appears along the drawn lines as the visitor scrolls. It turns a process image into a demonstration of how visual ideas are assembled.
Stage buttons also let visitors inspect the sketch, pasted images and completed notes. A useful process section should explain a decision or show a change. Here, the transformation from empty pencil boxes to a finished page is the subject of the interaction.
Give visitors control over the experience
The site includes a motion toggle, an intro skip control and reduced-motion behaviour. Draggable windows and the rope swing include keyboard controls alongside pointer and touch interaction. These choices give people ways to explore the same idea at different speeds.
Milo is a self-initiated portfolio concept, not a commissioned client website. Its value as a design study is the relationship between character, content and interaction. The lesson is to build a clear route through the work, then use the playful details to make that route memorable.
This article discusses fictional portfolio concepts. Project images include AI-assisted visual-direction studies; the Studio film uses licensed footage. Read the media credits.
