移动端产品设计（02）-移动APP产品结构

目录

 

一、移动APP产品结构

二、状态栏

三、一级页面顶部导航栏怎么设计？

四、次级页面顶部导航栏怎么设计？

五、顶部导航的交互

六、标签栏（底部标签栏）

6、案例-马蜂窝

七、底部标签栏的交互方式

八、（内容区）页面设计

1、页面设计包括列表页和详情页

A、列表页

B、转发、分享的区别

C、详情页

D、怎么来详细设计移动端产品？——流程

九、案例-资讯APP详情页（首页和资讯详情怎么设计？）

十、案例-资讯列表页

十一、案例-话题详情页

十二、做App考虑的流程

十三、适配

十四、IMEI手机机器码——*#06#   

十五、H5页面

十六、空置图

十七、案例-水杯详情页

---

一、移动APP产品结构

1、标签式（淘宝、微信、QQ音乐）

2、抽屉式（唯品会、QQ音乐、网易云）

3、平铺式（手机桌面、美图秀秀）

二、状态栏

1、颜色：与导航栏同色/黑色

2、功能：返回/消息提示/刷新状态提示

 

三、一级页面顶部导航栏怎么设计？

1、产品定位

2、页面特性

3、独立功能

 

四、次级页面顶部导航栏怎么设计？

1、返回

2、更多

3、页面特点

次级页面顶部导航栏一般放：

五、顶部导航的交互

1、固定

2、默认显示，上滑收起部分（保留核心需求功能）下滑又出现

3、默认显示，但不明显，上滑凸显

六、标签栏（底部标签栏）

1、标签栏：3～5个

2、显示：icon  

         icon+文字

         文字

3、默认选中位置：第一个、中间。特殊功能：中间

4、重要的独立模块：社交、商城、资讯、消息、购物车、通讯录、分类、订单、搜索、专题、会员、等等

5、标签栏承载的功能：

     切换该频道

     刷新

     快速定位