El Faro Restaurant Site

Overview

El Faro is a family-owned Mexican restaurant where I've worked and helped manage operations. The website needed to support both branding and day-to-day realities: customers quickly finding the menu, online ordering links, and basic information like hours and location. This case study focuses on translating a local restaurant brand into a clean, responsive web experience.

Recent improvements (2026 update)

Since the initial launch, I revisited the site to improve performance, navigation clarity, and real-world usability based on how customers actually use restaurant websites.

• Redesigned navigation with a location-based toggle for two restaurants
• Consolidated pages to reduce friction and simplify the user flow
• Interactive, searchable menu with state persistence
• Location-aware UI details and real-time “Open Now” indicators
• Improved perceived load speed through component-level optimization

Goals & constraints

The priorities were clarity and accessibility. Customers often visit restaurant sites on their phones, so I focused on mobile usability, simple navigation, and readable menu layouts. At the same time, the site had to be simple to maintain, since updates to menu items and prices happen regularly.

Tech stack & implementation

The site is built with Next.js, TypeScript, and Tailwind CSS, and deployed on Vercel. I structured the UI into reusable components for menus, location information, and ordering links, allowing the site to scale cleanly as features were added.

Rather than relying on heavy animation libraries, I focused on performance and subtle UI interactions using native browser behavior and lightweight transitions. This approach kept the site fast while still feeling polished and intentional.

Design decisions

I leaned into clean typography, high contrast, and straightforward layout. The primary actions—viewing the menu and accessing online ordering—are visually emphasized. Sections are broken into clear, scannable blocks so customers can quickly find what they need, whether they're on desktop or mobile.

Outcome

The redesigned El Faro site is now live in production and actively used by customers to browse menus, find locations, and order online. The update improved clarity across two restaurant locations while keeping the site fast and easy to maintain.

From a development perspective, this project reinforced the value of iterative improvement, production deployment, and designing UI around real business workflows rather than purely visual goals.