PROJECT

Dravo

A sophisticated e-commerce platform for premium furniture featuring minimalist design, interactive product showcases, curated collections, and immersive shopping experiences with modern web technologies.

TypeE-commerce Platform
RoleFrontend Developer
Timeline2024-2025
StatusIn Development
Next.js 16.1.1React 19.2.0TypeScript 5Tailwind CSS 3.4.0Framer Motion 12.23.24Swiper.js 12.0.3Lenis Smooth ScrollLottie AnimationsLucide React Icons
01

Project Overview

Dravo is a premium furniture e-commerce platform built with Next.js 16 and React 19, showcasing modern luxury furniture through an immersive digital experience. The platform features sophisticated product categorization across 10 categories, 6 curated collections, and over 30 premium furniture pieces. Built with a minimalist luxury design philosophy, it incorporates advanced animations, smooth scrolling, and responsive design optimized for both desktop and mobile experiences.

Target Audience

Interior design enthusiasts, luxury furniture buyers, home decorators, architects, and design professionals seeking premium furniture pieces for residential and commercial spaces.

Business Goal

To create an elegant digital showroom that captures the essence of modern luxury furniture while providing seamless browsing and shopping experiences that convert visitors into customers through sophisticated design and user experience.

02

Key Features

🏠

Curated Furniture Collections

Six distinct collections including Minimalist Luxe, Raw & Earthy, Dark Academy, Coastal Serenity, Urban Industrial, and Scandinavian Pure, each with unique design philosophies and carefully selected pieces.

🛋️

Comprehensive Product Catalog

Over 30 premium furniture pieces across 10 categories including Sofas, Tables, Chairs, Storage, Rugs, Lamps, Beds, Outdoor furniture, and Decor with detailed specifications and high-quality imagery.

🎨

Luxury Design System

Sophisticated color palette with travertine, warm obsidian, and aged bronze tones, custom typography using Hammersmith One and Playfair Display fonts, and architectural design elements throughout.

📱

Interactive Mobile Experience

Mobile-first responsive design with touch-friendly interfaces, swipeable offer cards, stacked card interactions, and optimized navigation for seamless mobile shopping experiences.

✨

Advanced Animations & Interactions

Smooth scroll implementation with Lenis, Framer Motion animations, Lottie integrations, hover effects, and cinematic transitions that enhance the luxury shopping experience.

🔍

Product Discovery Features

Advanced filtering by categories and collections, product search functionality, wishlist capabilities, quick add features, and curated product recommendations for enhanced discovery.

🛒

Modern Shopping Experience

Streamlined product cards with hover effects, quick add functionality, collection-based browsing, and intuitive navigation designed for luxury furniture shopping.

⚡

Performance Optimized

Next.js 16 App Router architecture, optimized images with Next.js Image component, code splitting, lazy loading, and fast loading times for superior user experience.

03

Technology Stack

Frontend

Next.js 16.1.1 (App Router)React 19.2.0 (Latest)TypeScript 5Tailwind CSS 3.4.0Framer Motion 12.23.24Swiper.js 12.0.3Lenis 1.3.17 (Smooth Scroll)

Ui_libraries

@lottiefiles/dotlottie-react 0.17.7Lucide React 0.554.0clsx 2.1.1tailwind-merge 3.4.0

Development

ESLint 9PostCSS 8.4.32Autoprefixer 10.4.16TypeScript ESLint

Fonts

Hammersmith One (Primary)Playfair Display (Secondary)Google Fonts Integration

Assets

Unsplash Image IntegrationCustom Hero ImagesOptimized Image Delivery