Oprafin Homepage Revamp | Air Studios
Helping Dorxata with base design setup
Overview
Project: Homepage Design
Studio Partner: Dorxata
Role: Setting up the base for Oprafin's website revamp (Air Studios)
Scope: Custom homepage structure, UX flow, high-fidelity visual design
Goal: Create a credible, scalable, and conversion-focused homepage
Design Process Summary
We followed a structured design methodology:
Moodboarding – Visual alignment on tone and direction
Low-Fidelity Wireframing – Functional layout sketching
Hero Iterations – 50+ versions exploring tone, structure, and storytelling
High-Fidelity Wireframing – Design system in full fidelity
Final UI Design – Delivering polished, scalable output
Moodboarding
Moodboard directions created
Focused on modern minimal SaaS, Web3, and VC-brand inspirations
Used to lock visual style, tone, and grid rhythm
Outcome: Clear visual compass to move confidently into wireframing.
Website Moodboard by Air Studios
Low-Fidelity/Relume Wireframe
Wireframes structured around content strategy and scroll logic
Layouts tested for hierarchy, clarity, and narrative flow
Clean structure helped with fast iteration
Hero Section Exploration
Started with using branding elements
Created over 30+ Hero Section variations
Played with layout, tone of voice, media, and interaction
Used Hero design to set the brand tone for the entire site
Outcome: Strong visual & copy identity foundation
Hero section wireframe
High-Fidelity Wireframes
Applied final brand choices: typography, spacing, visual cues
Responsive-first, dev-friendly design
Modular components built with scale in mind
Final Design
Delivered 5 to 6 homepage variants
Included 3 additional supporting sections based on content
Optimised for future scalability & developer handoff
Note: All design work done by Air Studios, delivered via Dorxata
Deliverables
Moodboards
Wireframes (Low & High Fidelity)
30+ Hero Section Explorations
5+ Full Homepage Design Variants
Dev-ready assets and naming conventions
0 likes · 25 views · Jun 27, 2025
Designed variations by moodboarding, creating a sitemap, wireframing, and finalising the user interface design.
