Case Study
Designing Flexina's Website:
A Clear and Scalable Digital Presence
01, Project Overview
The full picture
Flexina is an invoicing and billing SaaS platform designed for freelancers and small businesses, giving them a simple, accessible way to create, send, and track invoices from any device. They needed a website that would introduce the product clearly and convert visitors into users.
Flexina came to me with a clear product but no website to match its ambition. The platform allows users to manage invoices, quotes, and client data from desktop, tablet, or mobile, a key differentiator the website needed to communicate front and centre.
My role was to design the full UI of their marketing website, from initial UX thinking through to a high-fidelity Adobe XD prototype ready for development handoff. Every section needed to be intuitive, conversion-focused, and reflect the product's clean, modern identity.
02, The Challenge
What needed to be solved
Flexina had a genuinely useful product, but no web presence to prove it. The challenge was to create a site that could explain a technical SaaS product simply, build trust quickly, and drive free trial sign-ups from cold traffic.
Four design problems to crack
Through conversations with the Flexina team and review of comparable products, four core challenges shaped the design brief:
- Explain a technical product, invoicing software, in a way that's immediately clear to non-technical users
- Demonstrate cross-device availability (mobile, tablet, desktop) as a primary value differentiator
- Build credibility and trust fast for a brand-new SaaS product with no existing user base
- Drive a single clear conversion action, free trial sign-up, without overwhelming visitors with features
- Create a scalable design system that the product team could extend as the platform grows
Competitive Benchmarking
03, UX Research & Insights
Understanding the users
Flexina's target audience is freelancers and small business owners, busy, often non-technical people who need to invoice quickly and track payments easily. Research focused on their mental models around billing and what builds product trust.
Target User Definition
Competitor Benchmarking
User Flow Mapping
Mobile-first Analysis
Target user persona
Competitive benchmarking
Simplicity is the product
Freelancers abandon invoicing tools that feel complex. If the website itself felt hard to navigate, users would assume the product did too. Clarity had to come before features.
Mobile is the primary use case
Freelancers often invoice on the go, between meetings, on-site with clients. The "available everywhere" message needed to be shown, not just told, with strong device mockups up front.
Trust = proof + simplicity
For a new product with no reviews, trust had to come from design quality itself, clean layouts, confident typography, and a clear free trial offer that reduced the cost of trying.
User journey, landing page to first invoice
04, UX Strategy
Turning insights into a plan
A tight strategy built around one core idea: show the product in action, as fast as possible, on every device, with a single clear path to trying it for free.
Hero section does the heavy lifting
Lead immediately with product value, device mockups showing all screen sizes, and a bold free-trial CTA. Zero ambiguity about what Flexina does in the first 5 seconds.
Feature sections use "show, don't tell"
Each key feature, invoice creation, template library, cloud sync, client management, shown with a real product screenshot, not a bullet point list.
Reinforce the multi-device promise
Three dedicated device showcase moments across the page, desktop, tablet, and mobile, to drill home the "access anywhere" differentiator that competitors don't offer as clearly.
One CTA, repeated consistently
"Essai Gratuit" (Free Trial) appears at every scroll checkpoint, hero, mid-page, feature sections, and footer, so there's always a frictionless conversion path within reach.
Page architecture
Conversion funnel mapping
06, UI & Branding
Building a design system
Flexina's visual identity needed to signal clarity, modernity, and approachability, the antithesis of old, complicated accounting software. Clean whites, a confident blue primary, and soft supporting tones set the tone.
Flexina Brand Colours
#049BD6
Primary
#DEE7ED
Light
#1C3C75
Deep
#F8FAFC
White
#1A1A1A
Slate
A clean blue-anchored palette: confident primary for CTAs and highlights, white for breathing room, deep slate for text. The palette communicates professional reliability without feeling corporate or cold.
Typography System
Clean, geometric, highly legible at all sizes. Used for body copy, UI labels, CTAs, and nav. The weight range provides all the hierarchy needed without adding a third typeface.
07, Results
Impact that matters
A clean, scalable design that gave Flexina a digital presence as modern as their product, and a prototype ready to hand straight to development.
Visit the prototype