移动应用UI设计模式 笔记整理

在大学的时候，对交互设计和UI设计的理解只局限于手机上的APP，网站之类的不在其中。理由很简单，网站页面设计早就有了，而且之前大家都把网页设计师叫做美工（心里很抵触这种叫称呼）。而UI设计和交互设计好像是伴随智能手机出现的。之前的这种理解肯定是错的，不过我的心中埋下了想设计手机APP的种子。《移动应用UI设计模式》是一本快速了解手机应用的工具书。它把手机应用的归类；拆分成十个部件，再详细介绍每个部件。

以下是整理笔记：

1.1-选项卡式-Tab Munu：选项卡式的导航在很多机型里都有不同的体现，这里只列举IOS和Android作为案例；优点：这是一种常见的导航，倘若应用要用户在不同分页里频繁切换，就用这类导航缺点：是会占用一定高度的空间。Android的这个形式看上去很熟悉，因为模仿了网页导航模式，是PC端遗留的产物。这种方式不利于大屏手机单手切换操作

案例：IOS - App Store，Faebook , 微信

案例：Android - 主题商店和应用商店

看出IOS与Android的区别了么？

1.2-舵式导航：本书里没有介绍，自行添加的。舵式导航应该属于标签卡式导航的一种延伸。中间的标签作为重要且操作频繁的入口，一般都用图形或颜色凸显出来

案例：微博，Path，Instagram

1.3-列表菜单式 List Menu：这种导航有很多种变化形式，包括个性化列表菜单，分组列表，和增强列表（Enhanced List）等。增强列表是在简单的列表菜单之上增加搜索、浏览或过滤之类的功能后形成的。列表菜单合适显示较长或拥有次级文字的标题

案例：小米手环，VPN，iPhone手机系统设置

1.4-跳板导航 Sringboard:跳板式导航对操作系统并没有特殊要求，在各种设备上都有良好表现。有时也被称为“快速启动板”（Launchpad）。跳板式导航的特征是，登录界面中的菜单选项就是进入各个应用的起点

案例：支付宝，爱奇艺

可进行位置上自定义，看案例中的橙色与蓝色的分布就是自定义的结果。对比一下自己的手机看看

1.5-陈列式 Gallery：陈列馆式的设计通过在平面上显示各个内容项来实现导航，主要用来显示一些文章、菜谱、照片、产品等，可以布局成轮盘、网格或用幻灯片演示

案例：厨房的故事，Dribbbler,Pinterest

1.6-仪表式-Dashboard：仪表式提供关于一种度量KPI（关键绩效指标）是否达到要求的方法。主要应用：商业应用，分析工具，销售，和市场应用

案列：AT，Overiew

1.7-隐喻式：用页面模仿应用的隐喻对象。主要用于游戏，同时在帮助人们组织事物（如日记、书籍、红酒等），对其进行分类的应用中也会用到。随着扁平化的流行，隐喻这种偏向拟物的设计渐渐成为过往，锤子的手机应该会有很多案例

案列：印象笔记，DailyCost

1.8-超级菜单：在选择导航模式之前，先确定信息架构。如果导航对象只有少数内容，就可以使用选项卡之类的导航模式

案列：RipCurl

1.9-抽屉式 :抽屉导航特点是菜单隐藏在当前页面之后，只要点击入口就能将它拉出来，此类导航好处是节省页面展示空间，有利于用户注意力在当前页面聚集，可以应用在不需要频繁切换内容的应用上，以对设置、内容进行隐藏。此类导航设计务必提供菜单画出的过渡动画

案例：知乎，亚马逊

『谢谢阅读：马赞赞』

后续更新：表单设计，表格设计