突破平面Photoshop UI界面设计与制作剖析
上QQ阅读APP看书,第一时间看更新

2.2.1 导航的设计规范

APP界面中的导航用来组织信息分层,向用户展示APP的功能要素。信息分层应该简洁明了,易操作,无须用户频繁翻页查找。

在规划导航时,先将最重要、最核心的功能放置在第一层页面,次要功能放置在第二层页面,以此类推,其他内容放置在第三层页面。

导航的类型可以分为标签式导航、列表式导航、宫格式导航以及其他类型的导航。

1.标签式导航

标签式导航是最常见的导航之一。大部分APP使用这种类型的导航,其具有功能清晰、切换快捷等优点。图2-73所示为不同类型的APP运用底部标签式导航的效果。

底部标签导航容纳的图标通常为3~5个,超出5个,会增加用户操作的难度,引起认知上的混乱。假如APP的功能很多,也不需要逐一在导航中展现。可以将其中一部分功能安排在第二层页面,或者设置一个名为“更多”的按钮,点击该按钮,可以显示隐藏的功能。

2.列表式导航

列表式导航符合用户的阅读习惯,信息左对齐,并添加右箭头引导用户进入下一层级。列表式导航帮助用户管理个人信息,常用作第二层页面,广泛用于APP和网页。

图2-74所示为APP个人信息页面中列表式导航的运用效果。

3.宫格式导航

宫格式导航占据页面的较大空间,信息入口独立,相互之间不产生交叉。操作顺序为,点击进入A页面→退出返回主页面→点击进入B页面。

图2‑73

图2‑74

宫格式导航的优点是信息展示清晰,方便用户操作。不足之处是,如果需要频繁切换页面,则需要用户多次返回主页面,无法在多个入口之间灵活跳转。

图2-75所示为在APP中运用宫格式导航的效果。

图2‑75