当前位置:网站首页 -> 网页设计

网页设计中那些“深藏不露”的导航

发布日期:2017/11/27 8:22:44  点击数:2218

或许有人会说太依附于设计标准并且抄来抄去的,完整抹杀了发明力,并且最终,一切的使用都长成一样了。但是从体验的角度来说,我看到了别的一个成绩。习气于复用那些罕见的UI组件会让你渐渐堕入一个误区,你会以为Google、Facebook、Instagram等你爱好的使用老是对的,他们的设计意图和你的设法主意分歧,你会完整忘了带着质疑的立场来看他们的设计。这里我罗列一些UI组件,他们被以为(或是已经被以为)长短常好的设计,但是他们或许并没有那么好。

1.“深藏不露”的导航

过来一段工夫,有有数关于汉堡菜单的文章,大局部设计师都在抵抗运用他。假如你没有读过,随意看两篇吧——汉堡菜单声讨文一、汉堡菜单声讨文二,但是这件事的实质并非是图标的错,而是将导航隐蔽在图标之下的成绩。

这种设计计划关于设计师来说特殊省事,基本不必担忧无限的屏幕巨细,只需求将你一切的菜单项排个序然后放进这个可滚动的浮层中,藏在汉堡菜单里。

但是理论证实,运用可视化的菜单项会进步用户的介入度、称心度乃至是贸易好处。这也是为什么如今主流的使用都从汉堡菜单改成底部导航的可见菜单设计。


那些应当根绝滥用的设计,你中枪了吗?


Youtube的菜单设计退化-Luke

小结:假如你的菜单许多很复杂,将他们隐蔽起来并不会进步敌对度, 信息重组偏重排优先级才是邪道。

2. “遍地开花”的图标

照样由于无限的屏幕空间,似乎尽能够运用图标替代文字来节俭空间是个无需思索的真谛。图形显然占用更少的空间,他们疏忽多言语,并且用户很很习气,不是么?简直一切使用多是这么做的。


TerryFan


有了如许的想象后,设计师经常会选择将功用隐蔽在哪怕是可辨认性特殊低的图标之下。例如Instagram,你能想到你可以经过点击这个图标直接发送音讯么?


TerryFan


还有,假如你历来都没有效过谷歌翻译,你以为点击这个鬼画符似的图标会发作什么呢?

假定用户熟知那些笼统化的图标或是以为用户会花过剩的工夫探究而且进修图标的功用,是一个罕见的设计毛病。


Bloom.fm里神奇的菜单栏


Bloom.fm里神奇的菜单栏

假如你以为在界面中给图标供给一个弹出式的标注可以进步可用性,那你就错了。即便是在Foursquare里(译者注:一款在国外超著名的签到使用,街旁的原型)你的用户总归会去进修而且记住他,也不代表如许设计是对的。


Bloom.fm里神奇的菜单栏


Swarm使用里的图标指导

但这并不料味着不克不及运用图标,有很多曾经构成广泛用户认知,像那些代表惯例功用的图标,例如搜刮、视频播放、邮件、设置等等。(然则用户依然有能够不太肯定,比方,点击一个心形的图标详细会发作什么)


Bloom.fm里神奇的菜单栏


这些多是用户熟知,可以被普遍运用的图标

关于复杂的功用,应当一直配有适宜的文字。在这种状况下,图标依然很有效,由于图形可以进步菜单的可发现性,可以在界面中构成一个适宜的触摸区域,而且可以添加使用的特性。


Bloom.fm里神奇的菜单栏


某图片编纂工具的菜单

小结:根底功用可以用图标来替代,复杂的功用需求有文字(假如你非要运用图标,请停止可用性测试。)

3.基于手势的菜单

当2007年苹果推出iPhone时,多点触控技巧逐渐成为主流,用户也逐渐认知到操作不是只要点击那么单一的,他们还可以停止缩放、滑动等。

手势在设计中也逐渐遭到喜爱,有很多使用多是纯手势驱动设计。


Bloom.fm里神奇的菜单栏


Clear的手势操作

就好像藏起菜单项和运用图标替代文字一样,手势有时可以协助设计师节俭屏幕空间。(“这里应当有个删除按钮,可以左划调出,或许右划,我们可以定一下。”)

关于手势,你需求晓得的第一件事就是它老是隐蔽的,需求用户去记。就像汉堡菜单的状况:假如你把某个选项藏起来,运用它的人将会变少。

还有,手势有着图标异样的成绩:有一些用户熟知的手势操作,比方点击、缩放和滚动,异样在分歧的使用中都有需求用户本人去发现而且进修的手势操作。

不幸的是,大局部的手势都不是规范界说的,在分歧使用中的功用也能够分歧——这依然是触屏界面设计中很新的一块范畴。即便是想在邮件上滑动如许复杂的操作,在分歧的邮箱使用中,都邑天差地别。


Bloom.fm里神奇的菜单栏


在Apple Mail里,邮件上右划调出”标志为已读”


Bloom.fm里神奇的菜单栏


异样的手势在Mailbox里确是”将邮件存档”

还有,“摇一摇”或许有分歧的功用,iOS里是撤销,Google Maps里是发送反应。(译者注:真应当让作者来尝尝我大天朝的各大使用…)

小结:别忘了手势也是隐蔽操作,是需求用户破费精神去记住的器械。假设是在Tinder(译者注:美国版陌陌),你或许可以去教会全部世界右划会发作什么——然则也仅限于手势是你使用理念的主要构成局部。

4.一翻开使用就是引诱

引诱页,是出去很炽热的UX话题,指的是用户与使用的初次相逢。在大多半状况下,引诱页就是给用户显示一些老手指引,说明界面:


Bloom.fm里神奇的菜单栏


dcovery使用的引诱

为什么说这是一个蹩脚的设计呢?由于很多用户都邑跳过这种引见,他们就是想立时开端运用。就算他们留意到你的引诱,他们也会很快在关失落之后就忘得一尘不染。(特别是界面里塞得满满的多是信息。)并且最初并且异样主要的是:界面中参加引诱并纷歧定能让用户更易上手,记住:


Bloom.fm里神奇的菜单栏


用户界面就像讲笑话,假如需求去说明笑点,那么你懂的

引诱流程有很多其他设计的能够,也会更好用。比方Slack,经过第一屏的交互给用户发明一些情境。 复杂地引见本人,聚焦在给用户带来的益处而不是引见界面和功用。


Bloom.fm里神奇的菜单栏


Slake的引见页

更无效的办法是添加和用户的互动,运用步调化的引诱。Duolingo并没有去说明使用:他们鼓舞用户参加做一个复杂的测试题(即便在未登录形态),由于实操才是最好的进修。并且这是一个更无效的展现使用益处的方法。

关闭窗口
Copyright © 2008-2022 上海纯点网络科技有限公司(www.cdsheji.com). All Rights Reserved
地址:上海市嘉定区金沙江西路1075号万达广场5写字号楼203室 24小时客服热线:400-670-5808 电话:021-60482289
沪ICP备10218526号-1 | 沪ICP备10218526号-2
QQ客服

沪公网安备 31011402002273号