Redesigning Personal Marketing Website by Franco VidalRedesigning Personal Marketing Website by Franco Vidal

Redesigning Personal Marketing Website

Franco Vidal

Franco Vidal

Rebuilding My Own Website From Scratch

A growth marketer's portfolio, designed as a funnel instead of a business card

I spend my days telling brands that their marketing does not have a content problem, it has a plan problem. Then I looked at my own website and realised it was exactly that: a decent looking page that did nothing.
It told people what I did. It gave them no reason to stay, and no obvious next step other than sending me an email. Anyone who was curious but not ready to talk just left, and I never heard from them again.
So I rebuilt it from zero.

What I wanted to fix

Three things were wrong, and only one of them was visual.
The site was static. You scrolled, things sat there, you left. Nothing about the experience suggested that the person behind it cared about craft.
It had a single conversion path, and it was the highest friction one available: write me an email. There was nothing for the person who wanted to look around first.
And it looked like a template. Which is a problem when your whole pitch is that you do custom strategy instead of recycled advice.

The design direction

I went editorial instead of agency. Warm paper background rather than plain white, near black text instead of pure black, and a single purple doing all the accent work.
Typography carries the whole thing. Geist for everything structural, and Instrument Serif in italic for the moments that matter. Every section headline breaks into two halves: the setup in sans, the payoff in purple italic. "Projects that moved the needle." "Services built for growth." Once you see it in the hero, you recognise it everywhere else.
That one rule does more for the identity than any logo would have.
Typography
Typography

Making it feel alive

This is where most of the work went. My rule was that motion had to mean something. If an effect was only there to look clever, it came out.
The hero headline reads "Most brands post. Few actually grow." and the last word cycles through grow, scale, convert, sell. It reframes the same promise four different ways while you are still reading.
Behind it there is a soft purple aurora that drifts with your cursor, so the first screen is never completely still.
The work section is the part I am happiest with. Each project row pulls its animated cover straight from my Contra project, and it plays on hover while the thumbnail follows your cursor along the row. The rows also react to scroll position: whichever one is closest to the centre of your screen sharpens and lifts slightly, and the rest sit back. It makes browsing feel like the page is paying attention to you.
The services grid scales up as it enters the viewport, and hovering one card lifts it while the others dim, with a soft light that follows your pointer inside the card.
Smaller things that add up: the stats count up from zero when they reach you, a purple progress bar tracks how far down the page you are, the nav underlines whichever section you are currently in, buttons drift towards your cursor when you get close, my portrait tilts in 3D as you move over it, the process section draws a progress line as you scroll through the three steps, and there is a fine grain over everything so it reads more like print than a screen.
There is also a custom cursor that grows over anything interactive and shows a label when you are over a project.
Live projects
Live projects

Why I built it in code

The entire site is four custom React components inside Framer rather than stacked layers.
That decision was about control. All the motion above needs real event handling and scroll maths, one shared CSS system keeps every section consistent, and both languages live in a single source of truth. The site is fully bilingual with a toggle in the nav, because I am based in Buenos Aires and work in English and Spanish.

Turning it into a funnel

Design was half the job. The other half was giving people somewhere to go.
There is an availability badge in the hero, so you know immediately whether I am taking work.
You can book a call without leaving the site. The calendar is embedded inline and styled to match, so choosing a time takes about ten seconds. Sending people off to another platform was costing me the ones who were ready right now.
For everyone who is interested but not ready, I wrote a free Social Media Audit Template. Six sections, thirty three checkpoints, a scoring system and a thirty day action plan. It is the same framework I use on paid audits. It is delivered automatically through Kit, which means the site now builds my list while I sleep instead of just displaying my email address.
And every project links out to the full case on Contra, so the site works as a front door rather than a dead end.

The details nobody notices until they are missing

A custom favicon using the same italic serif as the site, so the browser tab is on brand. A proper social share card, so the link looks designed when someone posts it. My own domain, migrated over with the DNS moved and SSL sorted.
I also rewrote every line of copy. The old text was technically fine and completely lifeless, full of the kind of phrasing that reads like it came out of a generator. Now it sounds like me.

Where it stands

It is live at franvimarketing.com.
What I can say is that the site now does the three things it could not do before: it holds attention, it explains how I think, and it gives people a way to act on that in one click.
If you want something similar for your own brand, the calendar is right there on the site.
Like this project

Posted Sep 9, 2026

Rebuilt my own portfolio from scratch. Editorial design, custom-coded motion in Framer, and a booking flow that turns visitors into calls.

Likes

0

Views

1

Timeline

Sep 1, 2026 - Sep 8, 2026