Mara Voss â€” Designer Portfolio

A kinetic, editorial personal portfolio for a senior brand and motion designer. Dark aesthetic with WebGL particles, scroll-triggered animations, and asymmetric grid layouts.

Figma

After Effects

Three.js

CSS

Framer

Design Philosophy

Mara's work sits at the intersection of brand identity and digital experience, building systems that feel alive. Every project begins with a visual language study: what does this brand sound like at 3am? The answer shapes everything from typeface weight to motion timing.

Motion as Medium

After Effects and Three.js are Mara's primary tools for bringing static identities into motion. Her process treats animation not as decoration but as content: each transition carries meaning, each easing curve reflects the brand's personality.

Senior designer / Berlin / refreshed portfolio study

Make the system feel remembered.

Mara Voss now behaves like a living studio dossier: editorial layouts, project filtering, a persistent active case panel, and interaction that turns motion into structure instead of decoration.

Projects

47+

Awards

Countries

Helix Climate Lab2025

Identity System / Launch Toolkit

Helix

A biotech identity scaled from investor decks to public rollout without losing its tension.

Variable markDeck systemLaunch motion

Current lane

Brand Design

The identity had to sound clinical at noon and cinematic at night.

Outcome

A launch framework that reduced ad hoc design requests and tightened every outward-facing touchpoint.

identity systemsmotion directionlaunch kitsdigital art directioneditorial layoutscampaign pacingfounder brandsinterface rhythmidentity systemsmotion directionlaunch kitsdigital art directioneditorial layoutscampaign pacingfounder brandsinterface rhythm

Active dossier

The selected case stays in view.

Instead of treating the grid as a dead archive, the page keeps one project expanded with context, deliverables, and outcome. Clients can scan taste and logic at the same time.

012025

Helix Climate Lab

Helix

Helix needed a brand language that could hold research credibility and media visibility at the same time. The system started with a variable mark, then expanded into deck logic, launch motion, and campaign modules.

Variable markDeck systemLaunch motion

Rollout

12 markets

Launch

+42%

Sprint

4 weeks

Outcome

A launch framework that reduced ad hoc design requests and tightened every outward-facing touchpoint.

Selected work / 05

Editorial cases that still explain the decision behind the image.

Systems

The art direction is sharper now, but the bigger change is structural.

Manifesto

Motion keeps the hierarchy honest.

The old build already hinted at this. The upgrade makes it explicit. The project grid is filterable, the active dossier stays persistent, and the notes section behaves like a live editorial layer instead of a static afterthought.

Avg. sprint

3-4 weeks

Ongoing retainers

Identity Systems

Marks, grids, and launch assets built to stay coherent after the first presentation deck ends.

Naming frames

Variable marks

Launch kit logic

Motion Direction

Animation used as hierarchy, pacing, and emphasis, not as a layer pasted on top at the end.

Reveal rules

Edit rhythm

Cross-platform cutdowns

Digital Surfaces

Portfolio sites, product narratives, and launch pages where the interface still carries the brand voice.

Landing systems

Proof framing

Conversion pacing

Stack and tooling

FigmaAfter EffectsRiveNext.jsType systemsLaunch decks

The functionality is stronger because the system is stronger. The interface now surfaces decisions, not only visuals.

Studio notes

A more artistic build is only useful if it also reads faster.

Active note

Tempo is part of the identity.

Studio Note 01

The older Mara piece had atmosphere, but its story still landed in flat blocks. This rebuild turns tempo into structure: filters change the project field, the active dossier stays persistent, and notes behave like living editorial modules instead of decorative copy.

Movement clarifies hierarchy before it adds style.

A page can feel artistic and still explain itself quickly.

Animation only survives when reduced-motion still reads well.

Cue

Treat interaction as pacing, not garnish.

Contact

Ready to build a brand system with more memory?

The Mara Voss refresh leans harder into contrast, rhythm, and usable structure. The result is more artistic, more readable, and more functional than the original one-track layout.

[email protected]

Availability

Q3 2026 select projects

Brand refreshes, launch systems, and digital art direction.

Best fit

Founders, culture, premium tech

Teams that need more than a one-off homepage veneer.

Base

Berlin / Remote

Workshops in person, production and rollout across time zones.

Mara Voss â€” Designer Portfolio

A kinetic, editorial personal portfolio for a senior brand and motion designer. Dark aesthetic with WebGL particles, scroll-triggered animations, and asymmetric grid layouts.

Figma

After Effects

Three.js

CSS

Framer

Design Philosophy

Motion as Medium

The selected case stays in view.

Instead of treating the grid as a dead archive, the page keeps one project expanded with context, deliverables, and outcome. Clients can scan taste and logic at the same time.

012025

Helix Climate Lab

Helix

Variable markDeck systemLaunch motion

Rollout

12 markets

Launch

+42%

Sprint

4 weeks

Outcome

A launch framework that reduced ad hoc design requests and tightened every outward-facing touchpoint.