订货APP的UI和前端界面

痛恨小朋友 发布于 2017/11/06 15:18
阅读 46
收藏 0

设计图尺寸:1080x1920,640x960,640x1136,750x1334,1242x2208,1125 x 2436px

1.   登录页/注册页

I.      登录:输入帐号密码

II.    注册:手机号--验证码--设置密码(最少8位)。

注* 可能有以前的数据库里面的用户,手机号可以通过短信绑定回那个用户的信息。

2.   首页

I.      欢迎页:   广告 / 资讯中心 / 订购/ 底部tab  四模块

A.    底部Tab:

首页 订单 我的
首页 订单 我的
首页 订单 我的
首页 订单 我的
首页 订单 我的

 

B.     点击 订购 进入 选购页 ,选购页有:  搜索栏/分类栏/厂商列表/购物车  四个模块

示例:(下图)

../Library/Containers/com.tencent.xinWeChat/Data/Library/Application%20Support/com.tencent.xinWeChat/2.0b4.0.9/3be4693051cadd136fbac5cbd1cfb276/Message/MessageTemp/7a41e358a666dd16eda9801132d862c4/Image/343991509785213_.pic_hd.jpg

B1. 点击 厂商列表 进入 厂商详情页 ,厂商详情页有:商品分类/商品列表/购物车 三个模块

B2. 商品列表 的商品ABC需弹框选择订购单位(包or件)

示例:(下图)

B3. 购物车 内显示厂商A:商品ABC/厂商B:商品ABC/厂商C:商品ABC

          示例:(下图)

         

II.    购物车内点提交订单,进入 订单确认页

订单确认页 有:送货地址 / 选购的商品列表/ 总价 / 预付金额 / 提交按钮

A.    预付金额选项:10%预付金 / 全额预付 / 其他(自填金额,该项少于10%预付金提示,选择该项的订单需要审核)

III.  支付订单页 有:支付剩余时间 / 需支付金额 /支付方式

A.    支付方式:微信支付 / 支付宝 / 银联/ 线下支付

注* 选择 微信支付 / 支付宝 / 银联 方式支付,先跳到相应APP内完成支付后,跳回到APP的 订单详情页。选择 线下支付 直接跳到 订单详情页

 

3.   订单

I.      订单页 有: 订单分类 / 订单列表

A.    订单分类里有:全部订单 / 待审核 / 待付款 / 已完成

B.    点击订单列表的:订单A / 订单B / 订单C…进入订单详情页

B1.订单详情页有:订单编号(增加一枚订单编号的二维码)/ 订购的商品列表 / 订单状态(支付状态:未支付/部分支付/已支付
   发货状态:待发货/已发货/已收货/退货)

 

4.   我的(个人中心)

I.       个人中心首页 有:个人信息(头像,用户名) 收藏,余额(充值,提现),地址,消息,重置密码,手机解绑,退出登录按钮。

A.   收藏页:收藏列表(收藏厂商)

B.    余额页:有余额显示,及充值提现按钮。

1.    点击充值进入充值页充值金额+支付方式:微信支付 / 支付宝 / 银联】

2.     点击提现进入提现页【提现金额(最低¥100,¥100的整数倍)+提现方式:微信钱包】

C.    地址页:地址列表(每个地址有 默认选项勾选,编辑,删除)以及按钮可添加新地址。

1.    点击添加新地址,进入地址填写页。

D.   消息页:消息列表

E.    重置密码:修改登录密码

F.     更换手机:修改手机号码

加载中
返回顶部
顶部