Flutter Furniture App UI

Overview

This Furniture App UI is a polished e-commerce design concept built in Flutter, demonstrating how a premium furniture shopping experience could work on mobile. The app features a home screen with curated collections and trending items, a category browser with filtering and sorting, detailed product pages with image galleries and 360-degree view placeholders, a favorites system, and a cart/checkout flow mockup. The focus of this project is on micro-interactions and transitions: items animate into the cart with a flying widget effect, product images smoothly expand from grid thumbnails to full-screen views using Hero animations, and pull-to-refresh uses a custom spring physics simulation. The warm, minimal color palette and generous whitespace reflect the aesthetic standards of high-end furniture retail.

Stack

Flutter · Dart · UI/UX Design · Animation

Challenges

• Creating the "add to cart" flying animation that smoothly moves the product image from its grid position to the cart icon in the app bar
• Building a product image gallery with pinch-to-zoom, swipe navigation, and smooth Hero transitions from the grid view

Solutions

• Implemented a custom Overlay widget that captures the product's global position, creates a temporary clone, and animates it along a curved path to the cart icon using a CurvedAnimation with a custom Cubic bezier curve
• Combined InteractiveViewer for pinch-to-zoom with PageView for swipe navigation, coordinated through a custom gesture arena to prevent gesture conflicts, wrapped in Hero widgets for seamless grid-to-detail transitions

Outcome

E-commerce UI with smooth animations and transitions