恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
被误用了的组件?提升思考深度
0.0°
2016-07-29 自译外文 教程 原作者: Zoltan Kollin 举报 1487 2 7 0

本文是对成熟组件的一些思考,借此希望能鼓励同学们多多去探索下现在一些常用组件设计之初的设计原则和适应场景等,撬动你对设计样式的思考。

作为一个用户体验设计师,套用成熟的设计样式是司空见惯的事。这样的组件是经过市场检验的,再者说使用这些样式打造的界面是继承了用户习惯的,可以降低学习成本,提高易学性。

然有些同学会认为这种方式会抹杀创造力,最终所有的应用界面同质化。但是作为一个用户体验设计师我还看到了一个不一样的问题。当你习惯了“拿来主义”的方式以后,会让你对你常用的这些应用,比如谷歌、脸书、instagram产生依赖,甚至盲目相信,从而失去自己的思考。下文中提及了一些我们常用的一些组件的不一样角度的分析,希望在你阅读完之后能够撬动你的思考。


1、隐藏的导航

网上有成千上万的文章提及或描绘汉堡图标,大多数都是来自我们设计师的。如果你没看过,可以选择一到两篇阅读就能知道大概。当然,文章不是对图标的讨论,而是汉堡图标背后的导航方式的分析。

我们可以看到汉堡图标的导航方式对于设计师其实是具有较大的吸引力的,它给设计师带来便利,有了这样利器,在设计的时候再也不用为屏幕仅有的方寸面积发愁,你可以把整个导航放到左侧或右侧上下滚动的界面中,等着用户滑动去发现。

但是其实我们发现Youtube已经偷偷的把之前的汉堡图标去掉,取而代之的是把用户特别关心的菜单直接提到主界面上,此后他用户量,用户满意度,甚至是收入都增加了。现在很多大牌应用已经开始从汉堡图标中撤离,转而去把用户最关心的菜单放在主界面上。隐藏的方式不一定能带来好的体验,试试采用优先级的方式去呈现菜单。


2、无处不在的图标

因为屏幕的方寸空间限制,所以不假思索认为要尽可能使用图标去替代文字。诚然,图标确实能节省空间,亦能省去翻译的麻烦(国际化的工作量不小,其他的应用也是这么做得。)那我们有没有反问我们自己用户真的熟悉这些图标吗?

带着这样的疑问我们回忆下我们使用过或设计过的应用,你仅通过图标就能知道某个图标代表的功能吗?我们常常天然认为用户也和我们一样理解图标背后的含义,而且用户是非常愿意花时间去研究和探索的,但是其实事实经常和我们的yy不符。当然这并不是说我们就不要使用图标了。生活中有些图标已经有既定含义了,这些你可以去使用,比如搜索,视频播放,邮件,设置,电话等等。对于复杂功能,最好是使用图标+文字,这样的组合方式能让用户更快的发现,带来好的点击感受,同时增加了个性。


3、手势操作

2007随苹果手机应运而生,从此多点触控技术成为了触摸屏的主角,通过此技术用户不仅仅可以点,拍,而且还能使滑、捏、拉等操作方式。因为能节省屏幕空间,所以与隐藏导航、图标的隐藏类似,手势也是设计师们乐此不疲的利器。比如,用左滑或者右滑取代了之前的删除按钮。

让我们再对手势做个分析,首先手势其实是一类隐藏技,需要用户去记住它,所以类似汉堡图标,如果你隐藏了它,很少人会去挖掘使用;其次,类似于图标一样,大多数用户知道点击,放大,滚动,但是其余的一些操作对于不同的应用有不同的功能,这个对于用户负担很大。所以在此强调下,手势设计是隐藏类的操作,所以需要用户花精力努力去记住它们。


4、入驻时的模态教程

入驻的模态教程红极一时,一般出现在用户在使用应用之前,一般的教程都会给用户带来界面的注解。那为什么我们说这个解决方案有问题呢?观察周围,你会发现在使用它时,选择的是直接跳过,他们想尽快的使用应用。试问你买回手机的时候会看说明书吗?就算有的真就是看过了,他们一会也就忘记了。俗话说的好“ A user interface is like a joke, if you have to explain it,  it's not that good.”

其实入驻后的使用说明可以做得更为融合。比如Slack采用的方式,在首屏幕的时候会聚焦介绍下应用会给用户带来哪些益处。当然还有更好的,一种互动性更强的,方法就是逐步带入应用增强技能。Duolingo的带入就没有在如何使用应用出“说明书“,它鼓励用户单刀直入去做语言选择和测试,这个步骤不用注册就可开始,因为最好的说明方式其实是融合在使用过程中的,这样的方式可以提前让用户知道应用给他带来的价值,毕竟说的不如做得来的印象深刻。所以当你在一个半透明层上设计使用教程的时候,先思考下用户首次使用的时候的场景,以更好的方式来欢迎我们的用户。


5、多提问题

上面提及的内容不代表周边的设计样式不值得我们参考,只是在用之前,我们可以更深入的去了解它们设计之初的含义,一些样式可能在A应用取得了成功,但其实并不一定适用B应用。同学们需要多思考,多做自己的设计,多做设计的研究。如果你的设计更适合不用担心与规范的冲突。

更新:2016-07-29

收藏

2人已收藏

  • 11

    作品

  • 4

    粉丝

  • 6

    关注

  • 提升B端客服体验设计的思考
  • 如何建立与运作用户反馈体系
  • 如何理性去做用户想要的产品
  • 如何快速展现用户反馈
相关标签

    猜你喜欢

      2016-07-29 自译外文 教程 原作者: Zoltan Kollin 举报 1487 2 7 0

      被误用了的组件?提升思考深度

      0.0°

      你确定要举报被误用了的组件?提升思考深度

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2016年07月28日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      7
      2
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录