Little Lemon Website

Frontend Dev & Feature-led UX

Desktop and mobile displays showing homepage and hero section. Live Demo

Little Lemon is a growing Mediterranean restaurant serving home-style, healthy meals. The challenge was a lack of online presence and no reservation system, which made it difficult for the business to manage clients and caused lost opportunities.

My goal was to implement the homepage from the existing high-fidelity design and design and develop a fully responsive, accessible reservation page that would simplify the booking process for users and modernize the restaurant’s digital experience.

Role

Frontend Developer

UX/UI Designer

Timeline

Meta Capstone Project

(~ 100 hours)

I began by analyzing the existing homepage prototype and designing tablet and mobile layouts to preserve visual hierarchy and usability across devices.

Throughout the process, I kept the target users in mind: frequent diners, local visitors, and busy professionals seeking an easy, reliable way to book homemade meals. Every design decision centered on creating an interface that felt intuitive, accessible, and aligned with their needs.

The reservation page was designed with the minimum required inputs to reduce cognitive load and streamline the booking flow.

Using the restaurant’s design system, I maintained consistent typography, colors, and component styling while reflecting the brand’s warm, home-like atmosphere.

On the development side, I implemented the project with React and TypeScript, organized components by pages and used styled-components for a theme-based, modular styling system.

I focused on accessibility throughout, using semantic HTML, clear contrast, keyboard navigation support, and explicit form feedback. Custom hooks and unit tests supported maintainable, predictable, and reliable code.

Planned future enhancements include Redux for global state management, and online menu with filters, a cart and an ordering flow.

The final experience feels clear, warm, and easy to use, exactly what the restaurant needed. The reservation flow is now fast, intuitive, and accessible across devices, and the interface finally reflects the brand’s home-cooked, welcoming personality. On the development side, the codebase is clean, scalable, and ready for future features without becoming a maintenance headache.

This project reminded me how much I love the balance between thoughtful UX and solid engineering. Seeing everything come together: the design decisions, the responsiveness, the accessibility work, the organized architecture, felt incredibly rewarding. And yes, I left the codebase in a state that any developer could step into without swearing at me. Always a win.