Labwor STEM Hub
← Back to main
Design Review

Homepage Mockups

Three distinct design approaches for hub.labwor.com -- each targeting a different aspect of the Labwor STEM Hub's audience and communication strategy.

All mockups share the same design system (Clash Display / Source Sans 3, Teal + Dark palette), the same data, and the same content structure. The difference is in tone, layout, and visual strategy.

01

"Blueprint"

Data-Driven Pitch

Technical pitch deck aesthetic with a data dashboard feel. Stats panels, pricing-table comparison for partnership tiers, progress bars on milestones, benchmark comparison table. Designed to appeal to institutional funders and program officers who evaluate investments analytically.

Style: Y Combinator proposal site
Hero: Dark teal with bold stat hook and metrics panel
Details: Monospaced labels, grid patterns, progress indicators
View Mockup A
A
Blueprint

Data-Driven Pitch

02

"Launchpad"

Community Story

Human, community-driven, and story-led. Opens with a full-width landscape photograph, tells the vision through narrative prose blocks, features a photo collage, map section, and warm community feel. Designed to appeal to individual donors and CSR programs who respond to human stories.

Style: NGO campaign site with editorial warmth
Hero: Full-width photo of Northern Uganda with text overlay
Details: Photography, narrative blocks, colorful program cards
View Mockup B
B
Launchpad

Community Story

03

"Impact Report"

Cinematic Scroll

Full-screen sections with one idea per viewport. Massive typography, bold contrasts, generous whitespace. Flows from Problem to Solution to Programs to Impact to Roadmap to Partnership. Designed for high-impact first impressions and presentations where the site is walked through on screen.

Style: Interactive annual report / editorial
Hero: Massive typography on dark background, minimal elements
Details: Full-viewport sections, oversized numbers, editorial flow
View Mockup C
C
Impact Report

Cinematic Scroll

Side-by-side comparison

Attribute A: Blueprint B: Launchpad C: Impact Report
Tone Analytical, technical Warm, narrative-driven Editorial, cinematic
Primary audience Institutional funders, program officers Individual donors, CSR, NGOs Presentations, high-level briefings
Hero approach Stats as headline, metrics panel Full-width photo, human story Massive typography, minimal
Programs display Data table with columns Colorful icon cards Numbered list, full-width rows
Partnership tiers Pricing-table comparison Stacked cards with benefits Large cards with descriptions
Timeline Horizontal with progress bars Vertical with status icons Vertical with circle indicators
Unique sections Benchmark comparison table Photo collage, map, narrative Full-viewport scroll, large numbers