在网页设计中兼顾所有用户和场景的3个技巧

用户可能是新手、专家或介于两者之间,要根据用户情况设计界面。△ 使用适当的新人引导(四种主要的新人引导策略)


尽可能兼顾不同用户的知识和技能水平

用户可能是新手、专家或介于两者之间,要根据用户情况设计界面。

在网页设计中兼顾所有用户和场景的3个技巧

△ 使用适当的新人引导(四种主要的新人引导策略)

这四种用法刚好可以用一个2*2的矩阵来表示。根据下方图示选择最适合你界面的方式:

在网页设计中兼顾所有用户和场景的3个技巧 在网页设计中兼顾所有用户和场景的3个技巧

△ 为新手用户添加提示而不干扰专家用户

在网页设计中兼顾所有用户和场景的3个技巧

△ 使用卡片分类构建信息架构

若你想了解用户如何确定或概念化菜单分类,使用开放式卡片分类;

若你想了解用户如何将现有元素归类到预制分类,使用封闭式卡片分类;

尽可能适应用户的操作流程

用户会有不同的需求,根据不同操作流程调整界面设计。

在网页设计中兼顾所有用户和场景的3个技巧

△ 让用户控制数据的呈现方式

在网页设计中兼顾所有用户和场景的3个技巧

△ 让用户控制数据的排序方式

其他排序标准包括:

  • 按字母顺序
  • 按可用性
  • 按分类
  • 按日期
  • 按距离
  • 按热门程度
  • 按价格
  • 按相关性
  • 按大小

在网页设计中兼顾所有用户和场景的3个技巧

△ 让用户控制数据显示的数量

在网页设计中兼顾所有用户和场景的3个技巧

△ 构建用户画像以区分具体操作流程

在网页设计中兼顾所有用户和场景的3个技巧

△ 让用户通过新标签页打开页面

很多用户习惯先打开页面,后续再去浏览。

尽可能提高网页的可及性

让残疾人群也可以访问使用你的界面。这不仅是好的做法,还可以避免法律后果(看你做的是什么产品)

在网页设计中兼顾所有用户和场景的3个技巧

△ 在HTML5中使用语义标签

在网页设计中兼顾所有用户和场景的3个技巧

△ 使用多种提示来沟通反馈信息

大约8%的男性是色盲(Chan, Goh, & Tan, 2014)。不要单独通过颜色来传达信息,提供多种提示。

尽可能兼容各种输入和极端个例

应该允许用户输入各种信息而无后顾之忧。

在网页设计中兼顾所有用户和场景的3个技巧

△ 解决自动生成信息带来的不好结果

(译者注:上图客户旅游目的地是奥斯威辛,通过模板消息“<目的地名称>玩得开心”,会生成“奥斯威辛玩得开心”的提示,但奥斯威辛集中营是个负面的联想,“奥斯威辛集中营玩得开心”,会让用户不爽。保险起见,改成提示“旅途愉快”)

在网页设计中兼顾所有用户和场景的3个技巧

△ 使用支持多种输入格式的表单元素

在网页设计中兼顾所有用户和场景的3个技巧

△ 显示能解决搜索者需求的结果

在网页设计中兼顾所有用户和场景的3个技巧

△ 使用能处理错别字、同义词或变体词的搜索

尽可能兼容所有媒介

界面需要在各种环境都能运作(如不同设备、浏览器等)

在网页设计中兼顾所有用户和场景的3个技巧

△ 根据用户浏览器定制不同的操作指引

在网页设计中兼顾所有用户和场景的3个技巧

△ 在小型设备上使用单窗口深入的方式

未完待续…

 

原文地址:nickkolenda

译文来自:@企业官网设计精选

 

【系列文章回顾】戳下面链接快速到达:

1)在网页设计中帮助用户实现目标

2)在网页设计中如何引导用户的注意力

3)在网页设计中如何少让用户费脑筋,保持操作流畅

4)在网页设计中兼顾所有用户和场景的3个技巧

5)当用户操作错误时,如何在不影响用户体验的情况下快速处理好

 

 

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/29269/

(0)
CatherineCatherine
上一篇 2017-05-23 17:22
下一篇 2017-05-23 19:03

相关推荐

  • 4款视频app交互设计浅析

    作者对腾讯视频、爱奇艺、搜狐视频和芒果TV进行界面的整体对比,希望能给各位带来一些收获和启发。

    2017-05-10
  • 这样学Axure,效果更好,面试更容易拿高薪|1433人的经验贴

    众所周知,Axure是产品经理必备的工作软件。但为什么要学好Axure,仅仅是因为它是必备的软件?为了不错过更好的发展机会BAT对于产品工作2-3年的面试者,均要求熟练使用Axure。别等要用时,才发现自己没有!别让Axure阻碍你的高薪产品路。怎样学Axure,效果更好?想学好Axure,不让Axure阻碍自己的发展,却苦于这些问题?没人监督指导,自学还没到一个周,就想放弃按教程操作,却出不了效果,又不知错在哪里难的知识内容看着费劲,...

    2018-04-20
  • 交互设计:给新人设计师的交互设计知识体系

    一篇完整阐述系统交互设计知识体系的文章,希望能够对新人设计师建立的设计知识体系有帮助。

    2017-05-14
  • 超实用!比较重要的设计方法论大整理

    @戴小维Saki :设计方法论,顾名思义是当设计师在进行设计活动时可从理论和方法上所提出的实际性意见。当进行不同设计需求时,可为设计师提供明确的步骤与框架。众所周知设计方案要做到有理有据,富有说服力,所以设计方法论也是设计师进行产品设计时的一大利器。虽然会在创新上有所限制,但却能为设计师在没有灵感时候,提供一个有依据的可重复操作流程,进行自己的设计思考,从而输出自己的设计方案。其实资深设计师基本都会形成一套自己的设计方法论。尤其在常常需要进行汇报提案时,这更是方案汇报时的重要方法。

    2017-11-06
  • 交互设计中的心理学

    整理认知心理学中对交互设计(用户研究)有所启发的一些知识点(参考《认知与设计——理解UI设计准则》)包括:中央凹与边界视野——如何呈现信息以获取注意力格式塔原理——如何处理不同界面元素的关系时间感知——如何让…

  • 长大的用户体验不好,想退货了

    来都说:本周,小编的桌上多了一盆仙人球,世界各地还发生了这些小事情:钻石兄弟情、无声面包店、「自杀式」教学、午夜「决斗」、从天而降的小女孩、我明白得有些晚、长大的用户体验……01钻石兄弟情近日,美国印第安纳波利斯市一处停车场内,一位 80 岁的老爷爷遭遇抢劫。由于行动不便,拄拐杖的老爷爷只能任凭灰帽衫劫匪的摆布……这时,一个身影冲过来,朝着劫匪的后背就是一拳,劫匪被打得踉跄了几步,脑袋也有点蒙了。这个身影是 80 岁老爷爷的哥哥,今...

    2018-04-13
  • 案例分析|社交网络产品LOGO设计系统

    在SNG(腾讯社交网络事业群)品牌系统语言里,LOGO系统承载品牌视觉的最核心容器,是整个品牌视觉系统的灵魂,是品牌的精神文化理念、信誉、服务等特点的浓缩表现,直接影响着社交网络品牌的发展。本文核心剖析社交网络产品LOGO设计系统。

    2017-05-09
  • 交互设计牛校排行榜 | 卡内基梅隆

    创艺典国际艺术教育之院校介绍有一位老大哥是高校里的老大哥他在艺术、工业、计算机专业非常强势除此之外它还拥有全美顶尖对顶尖的计算机学院和戏剧学院他就是Carnegie Mellon UniversityCMU卡耐基梅隆大学这些看上去毫不相干但都那么强势的学科结合在一起岂不是成了飞机中的战斗机赛车中的四驱兄弟?卡梅这位老大哥还真这么干了他们开设了一个项目那就是——人机交互交互设计中应用最广泛的学科分支卡内基梅隆的人机交互项目是全球的交互项目...

    2018-04-26
  • 从用户体验的视角评析《CSR赛车》手游

    我最近一直在玩《CSR赛车(CSR Racing)》和《CSR赛车:经典(CSR Classics)》,在近期的游戏中我发现,Natural Motion在该系列的核心玩法、货币体系、社交机制和盈利模式中都引入了许多新的花样和用户体验功能,这些新元素的加入为游戏的某些方面带来了更好、更流畅的玩家体验。CSR系列专为手游玩家设计,会话时间极短(10-15秒),玩家们可以在忙碌的间隙进行一场快速竞赛,这是一个非常好的设计。在《CSR赛车》中...

    2018-03-07
  • 设计干货|聊聊设计师玩转Sketch的那些事儿

    点击蓝字关注GOMEOS用户体验设计1调整组内图层父级变换属性新的调整大小选项可以帮助我们更灵活地调整对象与子层之间的响应:1. 默认属性下的成组放大缩小变化,内部的图标跟随组的缩放比例进行变化.2. 锁定图标的固定宽度&固定高度,成组的缩放比例不会影响到图标的比例与尺寸.3. 当锁定上部及右部间距时,成组缩放比例时,图标距离组内上部及右部的距离保持不变.2嵌套样式这个十分强大的功能使得symbols的复用更加的强大,可以同一内容复用多...

    2018-04-04