Chroma Awards – Website RecreationFramer Design StudyOverviewChroma Awards is an AI-powered competition for Film, Music Video, and Games that aims to unite creators, communities, and companies. This project was a recreation of their website. I rebuilt it in Framer as a practice exercise to improve my ability to analyze existing designs and recreate them accurately.The GoalStudy a real live website, break down its structure and visual language, and rebuild it from scratch in Framer while following a full design process.

My Process1.
Research & Competitor / Reference Analysis
I carefully studied the original Chroma Awards website (before they updated it). I analyzed the layout structure, section hierarchy, visual style, typography, spacing, and interaction patterns. I noted what worked well (strong category presentation, clear calls-to-action, community focus) and used the original site as the main reference for this recreation.

2. Design System
I extracted and rebuilt a design system based on the original:

• Colors – Matching the original dark, cinematic, and modern palette

• Typography – Recreating the heading styles and hierarchy

• Visual style – Keeping the same clean, competition-focused aesthetic and imagery approach

3. Wireframing
I mapped the full page structure into wireframes:

• Hero / main introduction

• Film, Games, and Music Video category sections

• Awards explanation

• Finalists / Discord / Pre-register CTAs

• Partners section

This helped me understand the information architecture before jumping into high-fidelity design.4. Applying the Design System
I rebuilt the entire page in Framer, applying the design system consistently across all sections to closely match the original look and feel.5. Effects & SEO
I added subtle interactions and transitions to match the original experience as closely as possible. I also structured the page with proper headings and basic SEO best practices.ReflectionThis project was a valuable exercise in reverse-engineering a live website. It improved my eye for spacing, hierarchy, and visual consistency. Even though it started as a copy, the process of breaking down someone else’s design and rebuilding it taught me a lot about structure and attention to detail — skills I now apply to original projects