AFROSZN
A culture-first media experience blending editorial storytelling and commerce.
- Year
- 2023
- Role
- Design Engineer
- Platform
- Web
The Problem
AFROSZN had a distinct voice in African youth culture but a digital presence stuck in 2018. The site was slow, visually inconsistent, and unable to convert readers into customers. The rebrand needed to honour cultural authenticity while building a commerce infrastructure that could scale.
Process
Brand Archaeology
Audited 3 years of content, social analytics, and community feedback to extract the core visual and verbal identity. Distilled findings into a 12-page brand DNA document that guided all downstream design decisions.
Editorial System
Designed a flexible editorial grid that handles long-form written pieces, photo essays, and short-form video — all within one coherent layout language. Established typographic hierarchy using Syne Display + DM Sans.
Commerce Integration
Built product listing and checkout flows that feel native to the editorial experience rather than bolted on. Products surface inside relevant editorial content rather than a siloed shop section.
Development & Launch
Engineered the full site in Next.js with a Sanity CMS backend. Achieved a Lighthouse performance score of 96. Launched to 14,000 newsletter subscribers with zero critical bugs on day one.
Screens
AI Workflow
AI-driven content strategy and visual ideation
The brand audit was completed in 2 days instead of 2 weeks using Claude to process and synthesise 3 years of content. Midjourney produced 200+ visual directions in a single afternoon, directly informing the final photography art direction.
Business Impact
96
Lighthouse Performance Score
+180%
Organic Traffic (6 mo. post-launch)
3.2×
Editorial to Commerce Conversion
14k
Day-1 Newsletter Launch Audience
Next Project
Barbr App
A booking and discovery experience built for barbers and clients.