美妆商城

案例背景

这是一款面向女性的美妆时尚购物店铺小程序，致力打造-个定向的美妆店铺。集中收集各类女性感兴趣的商品，便捷且针对性的帮助用户选择和获取相关内容。

案例设计理念

背景

a.了解女性用户画像及需求

b.了解产品定位，明确解決什么问题c.了解设计目标及解决方法

架构层:做好分类查看，快速搜寻产品

视觉层:和入品牌感，采用大圆角，让界面呈现品质威。

架构层:轻量化设计语言，融入愉动效，使用户操作更入按说的交互流畅舒适

用户画像

关键词:便捷，优惠，便宜

王蒙蒙，22岁，大学生

用户场景:购物能力较低，但是有日常购物需求，寻找便宜实惠的商品。

产品需求:希皇有个专门的店铺，有每日福利，会员积分等，满足低购买力女性的需求。

关键词:

安心，便捷，可靠

陈雪儿，28岁，时尚白领

用户场景:收入稳定，喜欢时尚好用的美妆产品，不喜欢复杂的生活琐事，想快速了解热卖产品

产品需求:希望能有一款能获取热门商品，解决女生日常的美妆和护肤需求

转换逻辑

商城有限时抢购，红包专区等特惠活动页面，用来吸引新用户，新用户注册会员后，会自动累计积分，积分可以抵扣现金，以此更好的吸引用户、留存用户、沉淀用户进而裂变更多潜在用户。

设计目标

打造一款专门面向女性的美妆商城店铺

支持快速浏览、收藏和购买商品

解決无目标性用户消磨时间、有目标性用户快速搜寻商品

通过精准的分类和会员优惠券机制快速吸引消费者(有目标性和无目标性用户)

累积流量池，从而达到用户沉浸式的浏览商品

界面展示

首页分为banner、 金刚区、海外购、热卖爆款、限时抢购、精选瀑布流引导用户进入想要的功能入口。海外购位于金刚区下方方便新用户进入首页后第一时间领取，引导用户进入核心板块。首页整体颜色为紫粉色，简约时尚用图形和排版来表现女性的品质感。自营商品列表整体统一采用灰底图，价格采用主题色，使得页面统美观、简洁，用户能够更清晰直观的查看商品，同时采用”标，为不同商品打上标签使页面灵动有活动感。

购物车

购物车展示产品图片、标题、数量、价格，刪除商品，加减可删减商品

分类

作为一款平台自营的小程序，分类内容展示更为清晰，以产品品类进行归类，并采用干净的白底使页面更加干净简约。我们还推出了海外购的服务，可由主页和分类页进入，通过国家分类即可选择商品。进入分类页面就能看到分类选项(如上)，下饭后还可以通过右上角的筛选按钮进行细致选择，有类别、评分和价格区间。

限时抢购商品详情

进入限时秒杀商品后将出现活动时间，渲染整体活动氛围，时间条由主题色与辅助色搭配而成，背景元素融入圆角矩形色块及辅助色包裹的商品图。由各个区域进入商品详情页，页面由商品、商品信息和收藏加购组成，加入购物车后按钮自动变成进入购物车。页面下滑可查看评论和商品信息详情(此处省略)。

确认订单全部页面

用户下单后进入确认订单页面，以抽屉式的布局展现，从上到下依次是收件人信息，商品订单，支付配送信息，优惠情况，订单信息。全部订单分为:全部、待付款、待发货、待收货、已完成五大板块，点任意订单即可进入订单详情页面。

缺省页

以主色调紫粉为主，青黄为辅，打造优雅清新高端的品质感插画，内容分别是星球配云彩，购物车配流水，购物袋配植物，确定品牌调性和增强界面的美观程度。