Varmply
varmply.vercel.app ↗A creator-brand marketplace for the Nigerian music economy — linking artists to sponsorships with verified performance and escrow payouts.
The brief. Nigerian music is having a global moment. Ayra Starr sells out London. Burna Boy headlines Coachella. But most working artists — the ones with real audiences and real influence — still negotiate brand deals over WhatsApp, with no contracts, no metrics, and no guarantee of payment. Varmply was built to fix that.
Two users, one trust problem. Creators don't get paid until they've already done the work. Brands don't know if they got what they paid for. The design challenge wasn't about making two dashboards — it was about building a system both sides trusted enough to show up to. Escrow holds the funds. Verified metrics hold the proof. The design communicates both.
The approach. I owned design and build from first wireframe to deployed product. The homepage needed to credentialize a new product in a market with no category — so every section is doing persuasion work, not decoration. Real artist names instead of “Creator Name.” Escrow as the headline feature. A phone mockup that shows the actual UI, not a gradient placeholder. The build became part of the portfolio.
Design breakdown
Added the phone mockup after the section felt like a product page, not a product. The dashboard UI inside visualises the experience rather than explaining it.
The escrow framing answers a known real anxiety in the Nigerian creator economy. 'Escrow' does more persuasion work than a feature description — it signals Varmply as the neutral party holding both sides accountable.
Three-column grid of pain points vs Varmply's solution. The contrast between chaotic DMs and structured campaigns needed to land before any feature details.
All three mockups are code-built — CSS and hardcoded data. The goal was to sell the concept of the experience, not document a shipped interface.
Using real artist names (Ayra Starr, Rema, Davido) instead of placeholder content was a mid-build copy pivot. The product didn't change — the framing did.
Scrolling marquee of creator and sponsor quotes. The auto-scroll signals community activity without requiring the user to interact — important for a cold-start product.
GSAP curtain reveal — the footer stays fixed behind the page and reveals as you scroll past the last section. Gives a cinematic close that matches the ambition of the product.
Animated counters and chart previews answer 'but does it work?' before sponsors ask. Numbers are placeholder but the data schema mirrors what will be tracked in production.
Step-by-step escrow flow visualisation. Payment transparency is the primary trust blocker for sponsors — this section addresses it before it becomes an objection.
Three-step flow showing apply → get matched → get paid. The step numbering with connecting lines collapses a multi-week process into something that feels lightweight.
Scrolling reel of creator avatar cards with genre tags. Signals an active community — even pre-launch, showing who else is here reduces the first-mover anxiety for new sign-ups.
GSAP curtain reveal — the footer stays fixed behind the page and reveals as you scroll past the last section. Per-page config tints the footer blue to match the sponsors brand.
Build decisions
Apr 23, 2026
Portfolio embed system — live iframes, not screenshots
The entire section isolation infrastructure was built so the portfolio could embed real live sections rather than static images. CSP frame-ancestors, ?embed=1 mode, ?section= param isolation, ResizeObserver height reporting, Lenis disabled in embed — all of it exists because static screenshots can't demonstrate the animation and interaction quality that's central to the design.
Apr 22, 2026
Waitlist split by audience at the point of conversion
A single email field loses the most valuable signal at signup — who the person is. Splitting /waitlist into two role cards (sponsor vs creator) means outreach and onboarding can be prioritised from day one. A dropdown was considered and rejected: the visual split reinforces the two-audience positioning far more clearly than a collapsed select.
Apr 22, 2026
Sponsors hero: animated campaign prototype over static mockup
A static phone mockup on the sponsor hero wasn't demonstrating the product's core value. The animated prototype cycles through three live campaigns — overview → submissions → video player, with skeleton loaders between transitions. Concrete proof of what running a campaign looks like, not an illustration of the concept.
Apr 16, 2026
All CTAs unified to one ask per page
"Get Early Access", "Learn More", "See How It Works" — three labels on the same page create decision friction. Unifying to "Join the Waitlist" (primary) and "How It Works" (secondary) simplified the conversion path. "Request Access" framing was considered and cut: it felt too gatekeeping for a product trying to build creator trust.