Base2Lab
A marketing site built around a structured visual system.
- Role
- UX/UI Design
- Type
- Marketing site
- Focus
- Hierarchy · System · Typography
- Year
- 2024
About
A marketing site where the design focus was clarity of hierarchy and a cohesive visual system, not visual extravagance.
Base2Lab needed a marketing site that could present a complex proposition clearly — one that worked across multiple service areas without feeling fragmented.
The work covered the full site: navigation structure, page templates, component patterns, and the underlying visual system that ties them together. The focus was on legibility and structure — a clear typographic hierarchy, restrained colour, and consistent layout rhythm carrying the brand without the design needing to shout.
Get the underlying patterns right once, and let the surface composition follow.
Outcomes
The structured, system-led approach translated into stronger engagement and more valuable inbound.
+45%
Average session duration
Visitors stayed longer, moving deeper into the site.
+35%
Returning visitors
More people came back after a first visit.
+60%
Partner & recruitment enquiries
A measurable lift in high-value inbound interest.
Phase one · The brief
One proposition, many pages.
Goals
- Communicate clearly
- Scale across pages
- Extensible system
- Considered — not templated
The brief was to design a marketing site that communicates Base2Lab's offering clearly to a non-technical audience, scales cleanly across multiple service and product pages without each one feeling like a new design, and establishes a visual system the client can extend internally as the company grows.
Above all, it had to read as considered and structured — not template-driven.
Phase two · The people
Who the site is for.
The site had to speak to three very different audiences at once — the emerging developer looking for a way in, the gamer championing local talent, and the partner assessing whether Base2Lab is worth backing. One structure, three jobs to do.
Thabo Mokoena
Aspiring Game Developer
Thabo is passionate about creating games. He's looking for opportunities to learn from industry professionals, gain real-world experience, and publish his first mobile game.
What they need
An accessible platform offering mentorship, collaboration opportunities, and resources to help him grow and break into the gaming industry.
Lwazi Khumalo
Gamer & Community Member
Lwazi loves discovering new games made by African developers and showcasing them on his channel. He's motivated by community engagement, local representation, and supporting African creative talent.
What they need
An easy way to browse, play, and share Base2Lab's published games directly online.
Sarah Daniels
Partner / Investor
Sarah is seeking credible, high-potential African start-ups to support and invest in. She wants to understand Base2Lab's vision, business model, and impact on the local gaming ecosystem.
What they need
Transparency, professional presentation, and a clear demonstration of growth potential before committing to partnerships or funding.
Phase three · Problems & solutions
Three pain points, three fixes.
- 01
Pain point
Lack of clear pathways for users
The previous design made it unclear how aspiring developers, partners, or gamers could actually engage with Base2Lab.
Solution
Distinct pathways by user type
Redesigned navigation and information architecture gave each user type its own pathway — join the team, partner with the company, or play published games — with intuitive access to the key action.
- 02
Pain point
Limited brand presence and storytelling
The site needed to communicate Base2Lab's mission, values, and African-focused vision — and the existing presence fell short.
Solution
A playful, mission-led system
A visually engaging design system with modern, playful elements drawn from gaming culture — foregrounding the company's identity while showcasing its impact on the South African gaming ecosystem.
- 03
Pain point
Poor engagement with online games
Visitors struggled to discover and play games directly on the website.
Solution
An interactive game showcase
An interactive showcase with easy-to-use filters and responsive design lets visitors browse and play seamlessly across devices — lifting engagement and reinforcing Base2Lab's value as a platform for local game development.
Phase four · Approach
Structure before surface.
The work started with structural decisions rather than visual ones. Page-level information architecture came first — what each template needed to carry, how content blocks would compose, and how the site would scale to deeper service detail pages without losing coherence.
From there, a small set of foundational components — type ramp, spacing scale, container widths, button patterns — became the vocabulary. Each page was then composed from that vocabulary rather than designed in isolation, so the system stayed consistent across the whole experience.
Phase five · Design system
A small vocabulary, applied everywhere.
A tight, deliberate system tuned to support a multi-section marketing site. Typography, hierarchy, and a small set of reusable section patterns carry the brand across every page — restraint over decoration.
- Typography — a focused two-typeface pairing, display sizes for headlines and a readable body weight for long-form copy
- Colour — a restrained palette with a single accent doing the heavy lifting; the rest reads in neutrals
- Layout — consistent container width and spacing rhythm across pages, no perceptible design seam between sections
- Components — a small vocabulary of reusable section patterns (hero, feature grid, content + media, FAQ, CTA) that compose every page
Phase six · Selected screens
Selected screens.
The key surfaces at a glance.
Base2Lab homepage
Homepage — hero and intro. Primary value proposition framed against the rest of the marketing site.
Base2Lab was an exercise in restraint — trusting a small, consistent system to carry a wider story. That structural sensibility maps directly onto how I approach product systems now.
— Reflections
More case studies
