胖东来线上商城App UIUE全流程设计

发表于:

线上商城 | 界面设计 | UI设计 | 电商设计 | APP设计

01

项目背景

胖东来门店场景与品牌氛围展示图

胖东来自 1995 年创立,深耕民生零售三十余年,秉持自由・爱核心企业文化,对标全球一流产品标准,依托自有中央厨房、自研全链路供应链,打造生鲜、茶饮、粮油、日用百货全品类自营商品,线下积累海量忠实客群。线上消费常态化之下,品牌搭建数字化线上渠道,打破线下地域限制,完善线上自营售卖、品牌文化传播、会员精细化运营能力。

胖东来商品陈列与供应链示意图

兰亭妙微设计胖东来商城 APP 概念方案,依据门店经营模式、品牌手册、自有产品资料分析,梳理线上购物痛点与功能需求;对标无印良品、得物交互逻辑,提取简约温和设计语言,贴合品牌温暖质朴、以人为本调性,统筹 APP 整体设计策略与全页视觉交互。方案搭载完整电商交易模块,增设品牌文化展示区,输出APP策划与 UI 设计成果。

02

项目概述

产品定位

集线上商品选购、品牌文化传播、会员服务、社群互动于一体的品牌私域零售平台。一方面依托品牌自研供应链,全线上架全品类自营好物,实现线上下单、同城配送、到店自提多模式履约;另一方面展示企业经营理念、东来讲堂、企业书籍、工厂溯源内容,是胖东来数字化落地、品牌价值对外输出的核心载体。

目标用户

常年光顾胖东来线下门店的忠实顾客,注重品牌口碑与消费体验,需要足不出户选购门店同款自营好物; 认可胖东来企业文化的爱好者,通过 APP 了解品牌书籍、团辅课程、企业发展历程。线上被品牌口碑吸引的异地消费者,通过 APP 了解品牌、初次尝试选购胖东来自营产品。

设计风格

整体采用温润简约新中式质感设计,以品牌标志性红色与米白原木色为主视觉配色,搭配浅肌理纸张质感背景,契合胖东来质朴、务实、以人为本的品牌气质;版式留白充足、层级干净利落。商品展示写实直观、文化板块文艺雅致,兼顾电商页面的实用性与品牌页面的人文温度,实现购物功能与企业文化氛围自然融合。

胖东来APP首页视觉设计大图 - 展示配色、排版与风格

03

设计亮点

双架构页面规划,购物与文化内容分区落地

商品详情页与交互示意图 - 展示商品卡片与下单流程设计

04

首页其他风格欣赏

首页风格示例 - 商品轮播与品牌文化结合的布局示意图
商品详情页面示例图 - 规格、价格与产品信息展示
商品展示列表示例图 - 网格卡片与筛选展示设计
购物车与结算流程示例图 - 订单确认与配送选项界面