Red Fish Kitchen

Bar, Dinner, eCommerce, Featured, Restaurant Sites, Seafood, Sushi

Status:
Online
Client:
PopMenu
Established:
2025
URL:
theredfishweho.com
Location:
CA, USA
Project Scope:
Bespoke Web Design, Custom SCSS Development, Video Optimization, SEO

Project Overview

Supper Club Glamour in West Hollywood

Evelyn, the owner-operator of The Red Fish, was preparing to unveil a luxury steak and sushi concept in the competitive West Hollywood market. With only one week until the grand opening, she faced a critical problem: the existing website options felt "template-ish" and lacked the bespoke "supper-club glamour" required for a high-ticket dining experience. Famously hard to reach, Evelyn granted a single discovery call to lock in the vision.

The mission was to deliver a high-gloss digital flagship on an accelerated timeline. We needed to push the Popmenu CMS beyond its standard capabilities, using custom code to create an immersive, sleek, and dramatic interface that matched the restaurant's "Black, White, and Deep Red" aesthetic without sacrificing performance.

Challenges & Goals

The Challenges

The "Template Trap": The standard CMS themes felt generic and boxy, clashing with the client's vision of a fluid, high-fashion layout.

Extreme Timeline: We had seven days to design, build, optimize, and launch the site with virtually zero client feedback loops available.

Color Balance: The initial assets leaned too heavily on red, threatening to make the site look like a fast-food chain rather than an upscale steakhouse.

The Goals

Bespoke Typography: Implement a fluid type system using clamp() logic to ensure headlines looked editorial on every screen size.

Visual Discipline: Restrict the palette to Rich Black (#000) for drama, limiting Red (#C21E27) to micro-accents only.

Performance: Deliver a video-heavy hero section without compromising load speeds (target < 2s).

Strategy & Approach

Phase 1: The SCSS "Polish Layer"

To break the template mold, I built a custom SCSS layer on top of the base theme. I overhauled the typography, selecting Italianno for luxury script headings and Tenor Sans/Cormorant Garamond for body text. Using CSS clamp(), I ensured fluid responsiveness (e.g., scaling H1s smoothly from 56px to 28px) rather than relying on endless media queries.

Phase 2: Visual Refinement

We replaced bulky UI elements with refined micro-interactions. Buttons were restyled with gold outlines, uppercase text, and subtle fade-in animations. I inverted the standard Mapbox theme to a custom Charcoal style, allowing it to melt seamlessly into the black background rather than sitting in a stark white box.

Phase 3: Technical Optimization

To handle the "supper club" video hero, I compressed the footage to 1.2 MB (H.265) and lazy-loaded it below the fold. For SEO, I added structured data (Restaurant, Menu, AggregateRating) and optimized meta titles for "Fine-Dining Sushi & Steakhouse," ensuring the site ranked for high-value keywords immediately.

Solutions Delivered

Area	Highlight
Custom Typography	Implemented a sophisticated stack (Italianno, Tenor Sans, Cormorant) with fluid scaling for an editorial look.
Visual Design	Enforced a strict Rich Black (#000) theme, relegating red to micro-accents to achieve "supper club" elegance.
Map Integration	Custom-coded a Charcoal Mapbox theme to eliminate visual jarring and maintain immersion.
Menu UI	Designed a three-column grid with Bodoni titles and hover-reveal wine pairings for a premium browsing experience.
Performance	Optimized H.265 video assets and lazy-loading scripts to achieve a 94/100 Lighthouse Performance score.