This project is to design the web page and multi-terminal visual system for Xiaomi Mall, aiming to jointly build the brand temperament of the platform with minimalist aesthetic product display and new retail shopping experience.
The design goal is to present the platform’s brand characteristics of “allowing everyone to enjoy the fun of technology” through systematic visual structure and product narrative.
The overall theme is "New Product Launch·Minimalist Shopping", integrating the purity of technology and the convenience of shopping, demonstrating the product layout and user experience value of Xiaomi Mall as Xiaomi's ecological official retail platform.
design challenge
Xiaomi Mall is not only the official sales channel for Xiaomi's ecological products, but also an important display window for the brand's minimalist aesthetics. The design needs to achieve the following balance in the visual language: sense of technology × sense of life: it must not only reflect the technological innovation of Xiaomi products, but also convey the warmth and intimacy of "technology changes life"; sense of minimalism × sense of richness: it must maintain the pure restraint of Xiaomi's design language, but also show the richness and diversity of ecological products; sense of brand × sense of transformation: it must not only continue the visual unity of the Xiaomi brand, but also incorporate the efficient transformation of e-commerce shopping. The core challenge is - how to combine the aesthetics of the brand with the efficiency of the mall, so that Xiaomi Mall has both a minimalist temperament and a shopping experience.
Strategy and philosophy
The project takes "Purity of Products·Pleasure of Shopping" as its core design concept. Visual philosophy: Based on the dual-line logic of "minimalism and richness" as the visual basis, it reflects the aesthetics of the product and the diversity of choices; Structural logic: adopts the brand e-commerce platform typesetting system to organize product information in layers to form a multi-dimensional structure of "new products - categories - ecology - services"; color system: pure white + Xiaomi orange + Technological gray is the main color, supplemented by large pictures of products and price tags, symbolizing purity, vitality and trust; graphic language: integrating product renderings, parameter labels, purchase buttons and ecological matrix to establish a "visual system under product order"; interactive expression: introducing buy now, add to shopping cart and new product reservation, so that the platform has both brand display and shopping conversion. Core concept: Present product aesthetics with visual purity, and extend shopping pleasure with interactive convenience.
Design presentation
Home page design: The main color is a pure white background and large product pictures, reflecting minimalism and product focus; the top uses the new product launch banner and core selling points as the visual focus, supplemented by price information and purchase entrances; the navigation adopts categories such as mobile phones, TVs, notebooks, tablets, wearables, smart homes, and household appliances to convey a full ecological product pattern. Content logic: 1. New product launch; 2. Popular product recommendations; 3. Category selection; 4. Ecological product matrix; 5. Trade-in old for new; 6. Service guarantee.
Multi-terminal design: Responsive structure: The desktop mall and mobile APP are seamlessly connected, forming a "browse × purchase" rhythm; Product design: Present product details with large picture display, core parameters, price comparisons and user reviews; Image language: Use multi-style content presentations of product renderings, scene usage pictures, and detailed close-ups to convey quality and aesthetics; Service page: Introduce official authentic products, nationwide joint guarantee, 7-day no-questions-asked and fast delivery to express the value of shopping guarantee. Technology and experience: Intelligent recommendation + shopping cart synchronization + order tracking are adopted; the multi-terminal account system is unified to ensure the seamless connection of cross-device shopping. The overall style reflects "the simplicity of the product × the convenience of shopping × the joy of experience".
Achievements and Impact
As the official visual system of the platform, this design is widely used in user engagement on the official website, APP and new product releases. Through the integration of product logic × e-commerce narrative × brand order, the design has successfully created a visual image of Xiaomi Mall that combines minimalist aesthetics and shopping efficiency. The project is considered by the platform to be "one of the e-commerce visual systems with the most brand consistency and user experience" and has become the core blueprint for the multi-terminal experience design of Xiaomi Mall.