The Mavenrick homepage was redesigned and rebuilt as a working demonstration of the agency’s design and strategy ability. Instead of describing what Mavenrick does, the page shows it: dark editorial design, an animated grid background, cycling hero text, a crawling marquee and a magenta and cyan dual-accent system.

Project Overview

Type: Website design for my own agency brand. Scope: homepage layout, visual design, motion and interaction design, and mobile responsiveness. Status: live.

An agency homepage has one job above all others: convince a stranger within a few seconds that the people behind it are worth a conversation. This project treated the homepage itself as the portfolio piece.

The Challenge

Agency websites all look the same: white backgrounds, stock photography and a generic list of services. A visitor can swap the logo and nobody would notice.

The Mavenrick site needed to feel like proof of the brand’s design and strategy ability, not a brochure about it.

The Approach

Atmosphere. An animated dot-grid background signals technology without resorting to literal tech imagery. It sets the tone as soon as the page loads.

Voice. Cormorant Garamond italics bring an editorial, strategic voice to key phrases. Pairing a classic serif italic with a technical grid is deliberate: it says “thoughtful” and “technical” at the same time.

Message delivery. Cycling hero phrases let the page make several points in the space of one headline, and the marquee adds a steady sense of movement without crowding the layout.

Interaction. A custom cursor and scroll-triggered fade-ups give the page a distinct feel and pace the reading, so each section arrives as the visitor reaches it. Motion is treated as one animation system with shared behaviour rather than a collection of one-off effects.

Narrative. Every section is written and laid out to tell one piece of the story. The aim was a page that moves a reader forward, not one that lists services side by side.

Designing for Every Screen

The site is fully mobile responsive. Desktop-only touches such as the custom cursor are treated as enhancements, and the layout is built to work properly on smaller screens.

The Results

The page is live as the front door of the Mavenrick brand. As a project for my own agency, the outcome is the design itself: a homepage that carries the brand’s positioning through layout, typography and motion. I do not attach conversion figures to it because the point of this piece is craft and brand expression.

What I Took From It

A website is the cheapest and most persuasive place to prove design judgement. Restraint matters as much as effects: each animation earns its place by supporting the story, not by showing off.

Live
Active site
Animated
Grid background
Custom
Cursor & UX
Cycling
Hero phrases
Full
Animation system
Mobile
Responsive
Skills Applied
Agency Website Dark Design CSS Animation Editorial Layout Custom Cursor Own Brand
Work Together
Want results like this for your brand?
Start with a diagnosis: we find what is actually holding growth back before talking about solutions.