本文盘点几种常见的移动交互模式(pattern),掌握了这些pattern的特点,有助于选择适合的交互。
导航类
导航好比指路牌,通过它,用户知道了往哪里走。
桌面式
所谓桌面式,菜单入口通常以 MxN 排布在屏幕上。看一眼你的手机主屏就懂了。
导航模式-桌面式
无主次之分:每个区块面积相当
iphone 主屏布局有主次之分:面积越大越醒目
windows phone 主屏布局
Tips
多数情境下,使用桌面式导航,需要考虑给用户留出增删移的自定义空间
列表式
跟桌面式导航以图为主不同,列表式通常是为了容纳长标题(甚至摘要、缩略图等)
导航模式-列表式
Tips
列表式导航往往需要考虑索引及排序的问题
选项卡式
选项卡式就是我们常说的“tab导航”,这个几乎无处不在。
导航模式-选项卡式
Tips
在利用选项卡式时,一定要注意选项卡的“作用域”的问题
图库式
适合承载大面积图片
导航模式-图库式
表单类
表单类属于“用户输入类”交互,常见的组件有:
- 单行输入框
- 多行输入框
- 单选框
- 复选框
- 按钮
- 各类输入控件
- 上传文件
- 选择日期
- ……
引导&反馈类
最后要说的是引导&反馈类的常见交互模式
引导
可以使用明示性质的引导,例如下面是常见的帮助环节的设计模式。
引导模式-“明示”Tips
- 保持引导文案简洁明快
- 注意提示文案消失的机制,例如手指触摸屏幕任意区域时
除了“明示”用户,更多地,应该利用“约定俗成”的规则,给用户以“暗示”,例如下面的例子。
引导模式-“暗示”
反馈
反馈是为了给予用户控制感和确定性。应该随时随地自问,当下的场景是否给了用户足够的反馈,让Ta知道当下发生了什么、到了什么进程、下一步将会是什么。
反馈模式
参考资料
- Neil, Theresa.Mobile Design Pattern Gallery
- Website Flowchart & Sitemap
网友评论