UI界面中的导航组件的设计所包含内容和设计指南

设计营销   2022-09-16

首先一起看一下什么是导航设计组件?我们在UI用户界面中使用导航组件来帮助用户在应用程序或网站上找到自己的方式,以便他们能够轻松实现目标。

具体导航所包含的组件有:
1、搜索框
2、面包屑
3、翻页
4、标签
5、图标
6、导航菜单

1. 搜索框
搜索框允许用户搜索特定关键词,并应返回与它们最相关的搜索结果。
a.搜索框使用简单明了的设计,不需要额外的只会混淆用户的无用元素。
b.将搜索框放在用户希望找到的位置。

2.面包屑
面包屑允许用户识别他们当前的位置,并为他们提供一个可点击的页面轨迹作为导航。
a.不要用面包屑导航替换部分中的全局导航栏或本地导航。
b.面包屑导航不应显示会话历史记录,而是显示用户在站点层次结构中的当前位置。
c.面包屑导航中的最后一项应该始终是当前页面。
d.确保从面包屑导航中的当前页面中删除链接。
e.对于 1 或 2 级深度的网站,没有必要使用面包屑导航。

3.翻页
翻页元素用于将内容划分为页面,并允许用户根据需要通过跳过来轻松导航它们。
a.对分页组件使用简单明了的布局。
b.使用颜色突出显示当前页面,以区别于其他页面。

4.标签
标签为用户提供了浏览某些类别的内容的可能性。
a.在标签组件中使用相关关键字。
b.将标签放置在它们链接到的内容附近。

5.图标
图标是最直观的符号,尤其对于移动端产品而言,以引导用户更轻松地通过UI界面。它们可以用在按钮上,也可以单独使用,它们应该代表与它们交互后所采取的操作。
a.将图标放在标签的左侧。因为根据用户的浏览视线的路径,是从左侧开始扫描,左侧有一个图标可以帮助他们更轻松地浏览网站或应用程序。
b.不要使用太多的图形细节。
c.默认情况下,图标很小,添加大量元素可能会使用户混淆它们所代表的含义。
d.对于移动设备,请使用至少 16x16 像素的图标,以确保它们易于查看和点击。

6.导航菜单
导航菜单通过提供可随时访问的页面列表来帮助用户轻松浏览应用程序或网站,无论他们在应用程序或网站上的哪个位置。
a.确保为页面使用有代表性的标签。
b.链接到目标页面。
c.对具有复杂IA架构的网站使用下拉导航菜单。
d.对于移动设备的响应能力,导航菜单应转换为汉堡菜单。

最后,导航设计组件是我们帮助用户浏览网站或应用程序的最佳通道。通过使用此处介绍的元素,我们确保我们的目标受众能够通过使用我们的产品有效地实现他们的目标。在为您的产品进行设计时,起到指南的作用。

维好维可-用户体验体验创新设计
合作咨询
+86-21-51115850
© 2010-2024  维好维可 | 用户体验创新设计公司
沪ICP备19006116号-1

联系我们,开启一场关于您项目的讨论会吧。

联系电话:
+86-21-51115850
商务邮箱:
hi@wellworks.cn
复制
公司地址:
上海市松江区茸阳路69号(百原PARK)贰号楼2楼

©2010-2024 维好维可 | 用户体验创新设计公司-版权所有

沪ICP备19006116号-1

需求留言 + 获取方案

提交信息后,我们的专属顾问会在1个工作日内与您联系。

怎么称呼?
您的手机?
您的邮箱?
您的需求?
维好维可-微信二维码