Back to Home
Chocs
A front-end UI/UX website designed for a popular, fast-growing chocolate shop with 3 branches to expand its brand presence.
HTMLCSSJavaScriptFrontend Development
Project Overview
Chocs is an immersive front-end web application developed for a rapidly growing chocolate business. The website is styled and structured to reflect the premium identity of the shop, providing an interactive showcase of its brand and products to help capture new customers.
The application is fully developed using clean, semantic HTML5, custom CSS layout techniques, and modern vanilla JavaScript for dynamic components and UI responsiveness.
Layout & Pages
The application is structured into 5 core sections:
- Home / Landing Page: Features the brand value, promotional banners, and high-impact hero displays highlighting top products.
- Products: A detailed product browser where customers can explore various chocolate categories and individual items.
- Purchase: A functional check-out interface simulating cart checkout flow for selected products.
- About Us: Background details, mission statement, and quality standards of the chocolate shop.
- Locations: An interactive directory showcasing the shop’s three physical branches and contact details.
Technical Scope
- Responsive Design: Utilizes responsive CSS grid and flexbox properties for cross-device support (desktop, tablet, and mobile).
- Vanilla JS Interactivity: Implements state management for the product list, cart updates, and interactive components.
- Visual Mockup Focus: Designed to establish a visually appealing UX framework prior to integration with backend database/API servers.