“长智齿了”通过精心收集，向本站投稿了10篇常见的无结果页面的交互设计，以下是小编为大家准备的常见的无结果页面的交互设计，希望对大家有帮助。
篇1：常见的无结果页面的交互设计
接着上个话题“谁为用户买单”聊下去，有一种页面大家都很熟悉，就是当用户使用搜索引擎搜索关键词后，如果数据库没有找到匹配的结果，所提供的反馈提示页面——专业上我们称其为“无结果页面”。
下面举几个常见的无结果页面的例子让大家更了解下这样的交互设计，我们怎样更好地给用户提示。
GOOGLE的无结果页面
BAIDU的无结果页面
首先拿两家专业搜索引擎网站为例,在可用性与用户体验方面,它们都是做的不错的.信息类的搜索引擎,搜索出的结果用户最关心:是否是准确的,是否是很多,是否是快速的.谷歌有条宗旨就是让用户快速找到需要的信息,并快速离开网站.所以他们把无结果页面也做的那么干脆——不好意思没您找的信息,要么快速离开,要么调整关键词,要么使用谷歌推荐关键词.百度的无结果提示貌似前几行和谷歌差不多,只有最后两行:提供搜索帮助链接,希望通过系统帮助的形式为用户解决问题,实在还是不能解决怎么办?请用户自己创造它吧——百度贴吧.
joyo Amazon
篇2：常见UI设计模式交互设计
交互设计师在设计线框图原型时，熟知常见的web设计模式很有帮助，做到“心中有数”才能创造出符合需求，用户易学易用的界面来，所谓“没有必要重复发明轮子”，模式往往容易解决常见问题，正确的模式能帮用户熟悉界面、提高效率。
常见的UI设计模式如下图：
下面分别进行具体分析，遇到不同需求的时候就可以选择合适UI设计模式。
01.主体/细节（Master/Detail）模式
主体/细节模式可以分为横向和纵向两种。如果想让用户在同一页面下，引导他们在类目下高效地切换，这无疑是一种理想的方式。如果主体信息对于用户来说更重要，最好选择横向布局。或是主体部分不仅条目多而且包含信息也多，那也该选择这种横向布局。
举例来说：
Windows窗口属于纵向排布
Mac mail的横向排布
0.2分栏浏览(Column Browse)
分栏浏览也分为横向和纵向两种。用户可以通过它，选择不同的类别点进并逐步引导用户找到需要的信息。
举例：
Outlook采用逐级分栏的界面，用户可以选择进入“收件箱”——>“某封收件”——>“具体邮件内容”
0.3搜索/结果(Search/Result)
搜索屏幕模式对于想快速、直接看到具体结果的用户来说非常便捷。从很简单的到非常复杂的都有。
Gmail采用简单搜索
而对于google学术的用户，高级搜索限定更复杂的搜索条件会提炼出用户更期望得到的信息。
0.4过滤数据组(Filter Dataset)
分为横向和纵向。开始定义一些已知信息，之后通过限定条件对搜索后的结果进行再过滤。
51job用户在使用简单搜索输入所需职位后，纵向布局的左边面板提供诸如“发布时间、薪金”等条件，进一步优化信息
以京东为例，多数电子商务网站在用户初步模糊搜索后，提供进一步优化的过滤条件。上图中，京东采用的是横向排列方式
0.5表单(Forms)
表单类型众多，也是最能体现用户体验是否良好的地方。其中包含很多内容，推荐专门介绍表单的书：《Web Form. Design: Filling in the Blanks》。
注册信息一般使用表单
0.6调色盘/画布(Palette/Canvas)
调色盘/画布虽然不算最常见模式，但它对于创造图形类文档有着不可替代的优势：比如设计线性或非线性图；流程图；页面布局；制定物理大小的设计/图表或控制布局。
对于设计师来说调色盘/画布这种模式并不陌生，常用软件，例如：Axure、ps都是采用这种方式。
0.7仪表盘(Dashboard)
一个设计完善的仪表盘应提供：一目了然的关键信息，实时数据，易读的图形和操作，清晰的入口和浏览。理论上讲，在一个屏幕下展示复杂的数据本身就很难。
之前我用水晶易表为苏宁电器做的实时监控各个地区门店销售系统仪表盘
0.8电子表格(Spreadsheet)
方便用户快速浏览，编辑大板块信息的理想模式，
电脑资料
电子表格需要提供下列功能：标准的表格（诸如分类，隐藏/显示 栏目，重列栏目，分组（如果可以）），全局撤销/重做，增加/插入/删除排，键盘导航，导入和导出。
淘宝购物车选择使用电子表格，可以让用户对已选商品进行快速编辑（增加/减少数量，删除等）
0.9向导(Wizard)
对于复杂的或是不常见的流程，向导/快速启动屏幕模式可以有效地导航。
京东上使用wizard快速引导不熟悉流程的顾客完成付款
0.10.Q&A(Question&Answer)
Q&A模式是指用户通过选取相符条件，从而自主找到适合自己的解决方案。Q&A不同于搜索模式，它通常需要了解用户基础上，通过提问来帮助用户弄清他们缺乏经验的在哪里（比如健康保险，抵押，计划，购买）有哪些可供的选择或建议。
上海移动资费导购系统可以让用户通过回答几个问题，可以建议用户选择哪种话费套餐
0.11.平行面板(Parallel Panels)
平行面板屏幕模式可以收起（一次只显示一个），也可以展开（同时显示全部）。这种模式适合组织大量类似或相互影响的信息，让用户在同一页面更高效的获得信息。最佳应用在：需要申请者需要填写各种没有顺序的类别目录。
国外的火车票在不同情况，票价会随之浮动。The Train.com使用堆叠面板，让用户在同一页面下对不同项目进行编辑，又不会觉得混乱
0.12.交互模型(Interactive Model)
交互模型屏幕模式应用在关键项目（比如日历、地图、图标、画布等）需要进行交互的时候。是用户体验贴近用户心智模型的理想模式。在日历、地图、线状图、预设场景分析（包括计算器），所见即所得编辑器（包括图片处理）时应用效果非常好。
Google的calendar在日历上可以直接编辑提示内容
附加：13.空白状态(Bonus. Blank State)
空白状态指在任何数据输入或进入系统前，应用的自然状态。Getting real 一书曾说空白状态的屏幕使得用户更期待。通过给用户一种预览来降低担心、沮丧和犹豫。空白状态屏幕包括：视频，快速教程，帮助提示，安装后的截图。
Wufoo是一个在线表单设计网站，初始后会引导用户建立表单
14.其他模式
还有两种广泛使用但在企业软件很少使用的模式。
?
- 门户：如果你是市场调研专家，商业需求分析师或是用户反馈调研员，设计门户可以参考“仪表盘”的设计规范和案例。
- Tabs：其实Tab是一种部件，不是一种模式。它为同情境下的数据提供多选一的操作。如果数据结构导致你的设计tab显得过多。有两个小建议：第一，重新考虑信息架构。通过使用卡片分类法（card sorting）或请教一名专业的信息架构师；第二，可以参考“平行面板”的规范和案例。
参考文献：《Designing interfaces》and 《Designing web interfaces》
designingwebinterfaces.com/designing-web-interfaces-12-screen-patterns
出处：www.zhangyq.com
篇3：惊！Google+抄袭Facebook页面？交互设计
Google+在社交媒体里可能还是一个小孩子，但是这并不意味着营销者会忽略这个能够为他们带来利润的地方，他们会不断尝试寻求如何最佳利用这一平台来推销他们的广告，
EyeTrackShop一项新研究显示了用户在浏览Google+和Facebook上的广告时的观看顺序是何种模式。而这一调查结果一定会让那些广告商睁大眼睛，注视着这一结果的产生，因为他们也很想知道用户在浏览这两个网站时他们的关注点是以何种顺序转移的。
这家相对较小的瑞典研究机构在历时两天，研究了54名志愿者后发布了研究报告。在研究期间，该机构利用网络照相机跟踪用户的眼球运动，以此来估计Google+和Facebook网站上那一部分会更加吸引人，
在研究期间，EyeTrackShop发现两个社交网的网站运行模式几乎一样。用户都是首先关注中心区域，也是原创内容的所在，然后人们会从页首开始浏览并从左至右阅读，最后他们会将目光集中在右手边栏部位的广告。
有一点奇怪的是两个网站工作模式很相似，但是谷歌很可能再涉及Google+时大量的借鉴了Facebook，并且学习了Facebook将广告放置于对网页上原创内容影响最小的位置上。
看一看下面的模式，了解一下人们如何浏览Google+和Facebook，以及他们最后如何为广告进行排序：
Facebook视觉关注顺寻
Google+视觉关注顺序
Facebook 注视顺序
Google+注视顺序
篇4：远观页面评估视觉设计交互设计
译文出自：ucdchina.com/post/1531
我发现，当你做Web设计──或者其他任何涉及到排版和界面设计──的项目时，眯着眼睛，或者从一定距离的远处检查你的设计效果会很有帮助，你需要做的，就是眯着眼睛，或者走得远一点，直到你观察到的内容开始变得模糊。
当内容页面变得模糊一片时，你就能看到页面上的空白部分是如何把它们隔离成各个小方块和小组的。现在，你无法看清页面正文，你看到的是各个文本组，以及一些你排版时划分的小方块。
好了...，这就是你想看到的。如果你只看到混沌一片，就表明页面各元素之间的空白没有起到应有的效果。
下面我们通过举例来阐述这一点。这是一个页面空白运用得不好的网站（Listmixer )：
如果你努力地眯起眼睛直到内容开始模糊，我们将看到这样的效果：
两大块文本区域，
说明过多的文本内容被堆到了一块儿。理想情况是，你希望把页面分割成不同的小方块，以方便没耐心的用户快速浏览。当需要阅读太多东西时，
这类用户往往是第一个放弃并选择离开的用户。
下面是一个在Opera浏览器下，较好地利用页面空白的例子：
如果我们眯着眼看：
文本区域被清晰地切分成为若干互相独立的小方块。这里的空白有效地分割了内容块，并分给每一个小方块足够的伸展空间。
有时候，这种方法也可以用于审视一个页面视觉上的美观度──观察设计所传达出的整体感觉。当你的设计在CSS样式库或其它博客文章中以缩略图的形式展示出来的时候，它可能被缩小到很小的尺寸，内容也变得模糊。那个时候它看起来怎么样？当视觉设计变得很模糊时，是否依然会保持其独特的样式、形状、色彩主题？
远观你的设计同样可以让你站在新用户的角度考虑问题。他们尚未阅读文本，并不清楚网站的各个各小方块是什么，文本写的是什么，——他们只看到由各种元素组成的一个大页面。
然后呢，他们将首先关注什么？什么会吸引注意力？我找到了上面这种方法，让你了解到，是什么元素在这个页面突出，以及页面空白如何更好地起到隔离各个小方块的作用。
篇5：互联网用户常见心理特征交互设计
注：本文是我在淘宝的内网中发现的一片文章，作者来自于测试团队的霜波同学，她是我淘宝讲师团队的同事，爱好广泛，去年一年都在研究心理学，哈哈，让我甚是佩服。这篇文章写的是互联网用户的心理学特征，我觉得分析的很到位，感觉这些行为就是每天发生在自己身上一样。我想，这对设计师来说，了解这些用户行为背后的原因是非常重要的。故转发此文，与大家一同分享。
近半年持续关注了一些用户反馈和客服电话，从一些常见问题中总结出了八点互联网用户常见心理特征，在此共享，希望能共同努力提高用户体验。
1：惯性
用户：“你们的排序按钮为什么没有了？”
客服：“亲，我们把它放在右边了，这样更加的明显哦。”
用户：“你们很闲吗？没事弄这个按钮做什么！”
有一个故事，说的是将奶酪放在了迷宫的第三个格子，然后放一只老鼠进入迷宫，第一次的时候，老鼠先找第一个，再找第二个，最后在第三个格子中找到了，很高兴。第二次的时候，先找第一个，再找第二个，又再第三次的格子中找到了，很高兴。第三次的时候，老鼠直接去了第三个格子，找到奶酪。第四次，第五次，奶酪没有动。第六次的时候，奶酪被移入了第一个格子，老鼠看不到奶酪，于是生气，郁闷，焦躁，原地打转，却放弃了继续寻找。
人和老鼠一样，甚至比老鼠更加的具有惯性，更加的善于总结规律，更加的容易感觉生气和不爽。一旦他学会了用一个按钮，第二次一定会去原地按照原来的方法使用。如果位置或者方法和以前不一样，他会很不习惯，并且认为这是一个非常不爽的改变。所以如果产品经理要改变原有的规律一定要三思再三思，即使你知道你是在让原来的过程更加的美观，更加方便，更加的绚丽，也请考虑到原有老用户的习惯。在吸引新用户的同时如果让老用户少去学习是产品经理需要综合考虑的问题。
2：我就是全部
用户：“你们的平台真烂，我商品的显示全部错了。”
客服：“亲，别人的都是好的。是不是你设置错了？”
用户：“别人和我有什么关系，我的商品显示出来就是错的！”
看上去蛮不讲理，但是每个人都是自己世界的国王，他对他自己全部的负责，所以当我们很轻易的说少数人的时候，也应该去体会这少数人的全部世界，他和我们关心自己的kpi，关心自己的晋升一样关心着自己的小店铺，对我们来说的沧海一粟，对他们来说也许是他们最珍惜的珍珠。承认彼此的平等，也正是这些微不足道给出反馈的用户帮助淘宝一而再再而三用户体验的改进，他们是我们最优秀的不取工资还不断帮我们提交bug的用户测试工程师，对于如此无私的行为，我们是应该感谢了？还是感谢呢？还是感谢呢？
3：第一印象很重要
用户：“你们应该提供一个**的功能。”
客服：“亲，我们有了。在**的链接上可以链接进去。”
用户：“我之前用过，一点都不好用。”
客服：“我们改进了，你再试试。”
用户（一段时间之后）：“我就说过不好用，你看看，还有***都不是我想要的。”
第一印象一旦形成，接下来所有的关注力都是为了证明自己的第一印象是正确的，
所以，不要责怪你的用户不够宽容，不够拥抱变化，不能理解你持续的努力，是你在之前没有竭尽全力去给他一个好的体验，一个满意的结果。所有单身的同学注意了，别随便糟蹋自己的形象，很可能在某一个你没有准备好的时刻，你的Mr right就出现了，然后你需要很长很长得时间去重塑你的新形象。
4：相信熟人
用户：“我朋友说你们的这件商品很好，我也要一件。”
这是买一件东西最肯定的理由，经常在人多的地方听到一堆的女生在说这样的对话：“你的衣服很漂亮，在哪儿买的？”“在淘宝。”“快把链接发给我。”每次听到这样的言语都忍住不的微笑，因为成为这家有意义公司的一员而骄傲。感谢这些八卦的女生们，她们用言语证明了淘宝的价值，她们是淘宝最佳的代言人。
5：简单
用户：“能不能不要让我回答这么多问题，填这么多信息。我只是想买一件衣服。”
刚开始的时候我们曾经想做成最简单的产品，随着时间的发展，随着需求的深入，随着问题的展开，我们经常看到的是一个复杂不堪的产品。然后用户望而却步：“知道吗，我对你每一步的迈出和深入都需要勇气和热情。但是在得到真相之前，我不确定的我的这种付出是否值得。”所以，别让潜力用户在漫漫长途中放弃。是我们的重重关卡将他们拒之门外。
6：文字图片结合
用户：“能不能在文字上直接给张图片？看着直观漂亮。”
用户：“能不能在图片旁边写上文字，否则不知道是在卖什么，干什么。”
人的头脑分左脑右脑，右脑喜欢图片、直接感觉；左脑喜欢文字，思考。有人喜欢右脑思维，有人喜欢左脑思维，作为产品的设计者，不用纠结，不用分类，让用户的2块头脑都得到充分的享受和利用吧。图片文字合理完美的结合是对不同用户最好的尊重。
7：金钱安全
用户：“我把钱放在你们这儿安全吗？你确定吗？”
用户：“你确定我的退款能成功吗？我把货退还给他了，钱能拿回来吗？”
金钱永远是让人担心的东西，金钱的安全一定是用户的第一考虑，如果我们不能给他们金钱的安全感，我们就无法留住用户，比金钱更加重要的应该是用户的信任和信心，所以在金钱的安全和保障上付出任何的努力应该都值得。
8：搜索准确
用户：“你们的搜索真差，我找不到我想要得商品。”
客服：“能告诉我你想找什么吗？”
用户：“我就想要自己喜欢的东西。”
客服：“。。。”冷汗直冒中
也许我不知道自己想要什么，但是你们应该知道我想要什么。这是很多用户的心理，我也是。永远不要指责用户的无理取闹，就像不要指责女生的善变。如果你足够把她放在心上，你应该会知道她喜欢什么，想要什么，会买什么。她的每一次浏览，每次点击，每次购买都在告诉你她喜欢什么，想要什么，这些都是她给你的机会，不要浪费。
9：保护私隐
用户：“你们太过分了，你们把 娃让我爸爸接收了，然后，然后。。。他还当场打开了。”
每个人都有自己的私隐和不想让人知道的信息，不可以想当然的将这些信息透露出去，信任的建立很困难，需要很长的时间，信任的失去也许只是一瞬间，一个不小心的安全漏洞，一个不合适的需求，一次不小心的透露，我们就可能摧毁我们和用户之前长时间建立的信任关系。珍惜用户包括珍惜他提供给你的一切信息。
我常想，作为产品我们应该把用户放第一，作为员工我们应该把公司放第一，作为主管我们应该把员工放第一，可是这么多第一，谁是真正的第一？问问自己的良心吧，你能坦然面对你所有的客户、员工、团队成员问心无愧，能堂堂正正说出自己所做所为所思所想，应该就是真正的成功了。
篇6：电子商务网站产品页面设计i模式交互设计
此文主要讨论电子商务网站产品页面设计模式，从产品页面元素、设计理由，解决方案等对产品页面设计进行分析，以客观的思路来探讨如何设计出好用的产品页面
产品页面作用
用于显示在一个电子商务网站中的产品信息，包括商品制造商，品牌，产品说明，价格以及用户评论等。
产品页面元素与解决方案
目前产品页面都会包含以下一些必要元素：
产品名称
产品图片
价格
“添加到购物车”或“购买”按钮
此外，下面的元素也经常出现在产品页面中：
折扣价格（通常为红色，与原价进行区分，原价一般都有横线）
详细的图像（大图片）
产品型号（大小，颜色等）
产品样式图片（不同颜色或图案的产品图片）
库存量
交货时间
“加入收藏”/“收藏夹”按钮
缩放功能
简短说明
更长的描述
产品规格/详细资料
产品标签与关键词（比如“畅销书”，“热销商品”等）
产品ID，
特别优惠（购买此产品可以免运费等）
支持信息 – 包括厂家维修电话号码或电子邮件地址
分享按钮（比如 ，豆瓣等）
产品页面设计目标
产品页面的主要目标就是将感兴趣的访问者转换成付费用户。说服用户作出决定购买一个或更多的产品。
如何增加产品页面转化率
有几个因素可以调整，以增加转换。包括技术和设计模式：
使用高质量的产品照片。照片可以包含的两个功能：（1）设置语音（以语音形式介绍产品的功能与使用范围）和（2）让客户可以从不同角度观看产品图片
篇7：关于“交互设计”交互设计
记录刚才和HEXIAO闲聊中，说到的一席话，
1、以前的”人机交互”更偏向于”机器”。
更多的是考虑”机器”能提供什么给”人”，如何提供。如，戴国忠老师一直在致力研究的”手写输入“。
2、最近两三年我们很欣喜的看到了很好的变化，我们的”人机交互”慢慢更偏向于”人”了。
“人”需要什么，”人”需要”机器”做什么变得越来越重要。因为真正的瓶颈已经不在于”机器”的技术问题了。
3、其实，一直以来在人机交互领域其实都是这么两个流派。
计算机相关学术的人比较偏向于”机器”，心理学相关的都比较偏向于”人”。
我个人相对比较主张：基于人的交互研究可以相对快速的推动社会的发展，也可以更好的推动”机器”的进步。
4、其实我们现在都在解决的问题是”如何让机器更加聪明起来，如何让机器有更多的’思考’能力”。
实际上，我认为”如何更好的让人互动起来，如何更好的提炼人与人的互动信息”反倒比这一切更加的重要。
5、对于”交互设计”，现在有三种层次的认识。
第一种：视觉交互
“有一个提示窗口要弹出来，是从左边弹出来好呢，还是从右边弹出来好? 还是下边？”
我一直认为这应该是视觉设计的范畴，而非”交互设计”的主要工作。
6、第二种：流程设计
现在有”打电话”这个任务，设计一种什么样的流程和互动方式让”打电话”这个任务可以更加方便快捷并符合用户习惯的完成。包括某个按钮要放在什么地方，用按钮还是用链接。
我个人认为：这部分工作是”交互设计”的具体”执行”阶段。
7、第三种：机器应用
“有什么样的处理方式可以使机器与人的交互更加的顺畅和快捷”。
如，ajax就是一个极其有价值的人机交互创新。包括Flash, Java, VC..
8、我认为还有一种：人与人的交互
“如何更好的促进人与人的交互，有什么更多的应用方式”。
比如，设计Digg这种信息的交互方式。
9、实际上现在的搜索引擎都是很初级的很笨的搜索引擎。
我们可以有什么更多的人与人的交互方式、人与机器的交互方式可以创新呢？
…
我们现在很多的”交互设计师”在做着”某个窗口是从下面弹出还是从右边弹出”、”某个功能是用按钮还是用链接”的工作；也有很多”交互设计师”在做着”某个流程先让用户做什么再让用户做什么”；很少有”交互设计师”在思考着”除了ajax以后还有什么更多的技术应用呢？”。
谁在思考”如何在人与人的交互上做更多的创新……”？
做到什么程度”交互设计师”才可能像”产品设计师”一样颠覆一个产业呢？
值得所有”交互设计师”思考…
PS –
HEXIAO语：
交互设计师的关注点是什么?
决定一个Button放在页面的什么位置? 决定哪个流程的设计更合理? 还有更多吗?
事实上在应用层面的思考决定交互设计师同样可以关注架构(Architecture)和产品形态(Ecosystem), 在这个方面也可以展开.
网友评论(17)
子狼手记- 07/05/17 8:53 PM
开阔了眼界，展示了更广阔的前景。
交互设计师任重道远。
青椒土豆丝- 07/05/17 11:13 PM
有启发，三种层次。
为什么我老感觉“交互设计师”做着“产品设计”的东西呢？
yellow- 07/05/18 12:52 AM
感觉自己要学的东西太多太多
GOVO: links for -05-17- 07/05/18 6:23 AM
[…] 白鸦 » 关于“交互设计” 谁在思考”如何在人与人的交互上做更多的创新……”？ 做到什么程度”交互设计师”才可能像”产品设计师”一样颠覆一个产业呢？ (tags: reading) […]
dte- 07/05/18 9:36 AM
上周五在北邮听了戴国忠老师的演讲了呢 确实是围绕他那些个手写输入设备来说的
工业设计出生的确实适合做交互设计…挺赞同人与人交互这点的，是个需要突破创新的点
myspace- 07/05/18 11:18 AM
与青椒土豆丝有同感
范畴的大小，领域促就了职位名称不同
Amy- 07/05/18 11:23 AM
交互是什么，你看我一眼，然后我也看你一眼，这样就交互了，
呵呵，听一个朋友说的，感觉很有意思。
awflasher- 07/05/18 12:22 PM
对了老白，告诉你一个好消息。
你的blog是我见过为数不多的拥有Compete Rank的中文个人blog。
www.awflasher.com/blog/archives/888
Compete Rank here ^_^
千鸟- 07/05/18 1:20 PM
有点不同意见
1. “视觉交互”也应该属于交互设计师的职责，页面内的交互技术含量不比流程低，尤其是现在的ajax技术应用，“视觉设计”不应该涉及行为设计。
2. “交互设计师”从定义上就决定了不可能颠覆一个产业，如果具有了这种实力，并且能够实施，那么他做的事情一定不局限于“交互设计”。
xiaoxiao- 07/05/18 3:38 PM
同意千鸟的第一点，视觉考虑的是更好的呈现产品
第二点是我觉得是一个老总考虑的事了，呵呵。
jaryxie- 07/05/18 7:24 PM
我觉得这都是产品设计里面的角色分工问题,没必要整天在划界线和职责,合作应该是无间和高密度的,不是相互分割的关系,视觉图形设计在产品设计中承担界面的最终呈现,是相当重要和易感知的.是对交互的提炼和理解继承的过程,不是单纯的你管那,我管这,最后凑成一个产品的概念.
交互和信息呈现有很必然的联系,非要以职位来划分,是很可怜的事情.
jaryxie- 07/05/18 7:32 PM
交互设计更多处理交互对象间的关系和逻辑,以及交互的方法,是产品设计中一部分,任何一个角色和职位在产品设计中都不具备颠覆一个产品或者产业,如果非要那样认为,那只能自以为是.
noway- 07/05/18 10:40 PM
“我认为还有一种：人与人的交互
“如何更好的促进人与人的交互，有什么更多的应用方式”。
比如，设计Digg这种信息的交互方式。”
在流程里面，很自然的地，包含人与人之间的信息交流，交互设计中，在设计流程时，本身就很自然需要考虑到人与人之间的交互。
人为进行这种划分，没有什么意义，除了制造一些“错误”的分类。
hexiao- 07/05/21 10:31 AM
建议白老师把交互设计和交互设计师稍做区分…
mihu- 07/06/16 8:04 PM
前段时间，学校有个心理系的去cmu学习交互设计，
当我们谈到交互设计时，国外更多的计算机和心理的在做，
他们不太认同设计作的是交互设计，可能还是归在界面设计师！
现在也不清晰交互设计的定义。
来自：uicom.net/blog/?p=614
篇8：眼动仪研究如何服务于“页面布局”交互设计
一 用户是如何查看网页的
如今大多网页设计让人觉得杂乱，主要原因之一就是“优势点”过多，当只需要突出一两个优势点时还好，但当网站充斥着5个以上的“重要内容”时，用户能留下的印象也只有“杂乱”了。因此设计页面布局需要明确根本目的，一是用户目的，二是网站目的。以及指定网站的页面优势区。
有些时候，用户的目标与企业的商业目标相符，比如一个买了ipod的顾客会很乐意接受你给她推荐的配件并断然购买之；但更多时候用户与企业目标不符，比如看报纸的读者不想看到广告，会竭尽全力避免广告。
根据用户面对网页时的目的不同，浏览模式也大不相同。此文重点分析了几种浏览网页的行为：
1、查找新闻
在此处作者举了3个例子，都是针对特定用户的眼动轨迹注视点进行分析。发现这3个人各有自己的观看特点，有的人看左，有的人看中，有的人看右。【真是令人绝望，这让人怎么总结出模式来嘛！说不定这还是挑的眼动轨迹最清楚中的3人来看的，其他的根据眼动轨迹根本就难以自圆其说。不过从此处也学到了一个描述方法，就是挨个注视眼动轨迹，并找出一堆一堆的，至少，这能说明该用户的关注阶段所对应的关注区。】
2、浏览购物页面
在有购物任务（选择物品并完成购买）的这个案例中，举了较多的用户作为例子。但同样的存在有“百花齐放”的问题——用户的注视模式不尽相同，有的看广告图，有的看上面的水平导航，有的看左边的菜单。不过作者还是想方设法总结出了几个相同点，其实在我看来只有一个相同点，也就是模糊的雪景图片都被大家不约而同地忽略了。然后作者就得出结论说，清晰的图片引人注目，然后又根据看菜单那俩人的情况得出结论说菜单上加粗的选项也有人看。
3、购买特定商品
此行为分析中用了3个例子。因为有要购买商品的任务在身，大家都查看了水平导航。不过每个人还是有不同的模式。有的就专心只看了水平导航，有的盯着搜索框看了好几眼，有的也瞅了一下下方的大广告。然后作者又据此得出一个大白话结论就是如果任务特定，那么人们可能会倾向于查看相同的基本区域，不过区域里面又会有所不同。【这不是明摆着的吗，你测这么几丁人，页面又那么普通，大家的注视点要是如出一辙，那才奇了怪了。小样本测试的悲哀，555】
4、执行特定任务
例子是寻找一个公司的董事会团队。由于任务很有难度，信息深藏不露，大家八仙过海各显神通。有的人察觉到了这个颜色差别，几眼之间就找到了目标物——主菜单，有的人则是闪转腾挪了半天也无果，最后把目光投向了搜索。作者结论是要确保人们看到网站想让他们看到的。因此提出了设计标准之说。
用户期望的设计标准：
显而易见的菜单栏，贯穿页面顶部
网站徽标位于所有页面左上角
搜索输入框位于所有页面右上角
登录、注销位于所有页面右上角
功能导航位于页面顶部或最下面，比主导航略小或视觉感觉略弱。
【一言以蔽之，要符合一般网站的常规，打破用户心理预期是要付出代价滴！除非你做的是专卖店，开超市就要有开超市的样子，不能让人来了找不到东西】
作者还谈了一下企业内部盲目往网站这片“公地”无限制增加东西的现状【看来外国人也未能免俗】，建议解决之道是搞一个“网站设计指南”，简洁高于一切，如果有人再提无理要求就祭出这把大旗，令其知难而退，不了了之。
【收获：
1、学到一种描述方法，总结如下：
“某某先是看了……，然后也向（上/下/左/右）注视了……，随后看向……，也许她觉得（大胆推测之）”
“某某注视了……可能她觉得（大胆推测之），于是她跳过了……，在（底部上部中部）她看到了……（目标物）”
“某某先看的是……看到这里没有啥啥啥（大胆推测之），她的视线就直接向（上下左右），暂停在……，随后她跳过……，看了……，之后她向（上下左右）看去，可能她觉得（大胆推测之）”。
2、注视点轨迹图是用来说明具体观看情况最好的工具，既清晰又具体，根据它也可以描述区域。这篇的副标题可以叫《如何解读轨迹图》
3、我突然意识到一个问题，这些注视点之间的时间距离是等距的吗？是否能根据时间是否等距也琢磨出点什么来呢？不然你凭什么下结论说用户从一个点到另一个点能“只看了一眼就像被火灼烧了一样马上移开了视线”？】
二 组织好页面的秘诀
总结了几个秘诀：
1、简洁的页面
举了3个例子的热力图，从热力分布比较均匀并结合用户事后对此购物体验高度评价的事实，得出结论是“用户想浏览这个网站的整个主页”【莫非这是网站的目的？】而从网页本身的分析来看，其符合常规并重点突出、页面简洁是首要特点，
提供了一些设计tips：
空白区、内容框和色彩有助于用户看到。要勾划出这些区域，不要让内容太杂乱。
信息较多时要呈现一致的格式。
每个版块都要有标题。
举了一个反面例子，菜单重复出现，在页面顶部和左侧，这种浏览方式无法让人感到愉悦。
2、页面内容的多寡对注视点数目的影响有限
测试页面凌乱对用户的影响，引入了页面密度的概念，主要是通过数量来反映的，统计页面上各种元素的数量。作者用密度等级和注视点平均数量来比较。发现页面密度对注视点数目影响不大。【页面密度的概念很有新意，但用注视点数量和它建立相关性是不是太牵强，注视点的多与少能说明什么？有意义吗。我觉得用热点区或用户满意度来建立相关性倒更靠谱一些，毕竟网站设计的初衷不是要人多看几个点吧】
3、优势区
与页面密度相比，设计元素更重要。具有高度一致性的页面，即使充满很多内容也能让用户的浏览顺利愉快。
同2点所讲，页面密度和注视点的关系，在此处得到应用。此处的取向是，因为带有任务，所以在完成任务前注视点越少，说明页面可用性越高。
有两个总结点：
“色彩不经意间就提升了彩色框中内容的重要性。【这确实是个规律】用户体验并没有因为视觉渲染而提高，因为最重要的内容没有出现在用户期望的地方。【这取决于任务。注意设定的需要用户去完成的任务真的是网站的Top任务，不然就会喧宾夺主】”
眼动仪研究可取得数据：（1）用户事后感受，（2）用户对该页面浏览结束时是成功完成状态还是失败放弃状态，（3）完成时所用的时间，（4）判断注视点多是积极的注视（期望查看）还是无奈的寻找（过度查看）。（5）涉及多个页面的切换时，在某个页面注视点多，说明比较相信这个页面能完成任务。
“它让用户在这个标题下面的褐色框内花费了很多注视点，而实际上他们所需的信息并不在那里。”【对这个任务来说显然是沮丧的，但这是否意味着对另一个任务来说，这个页面布局却是非常有效的呢？这是否又落回到页面需要完成多个任务时，到底以谁为最优先，以谁为优势区的初始矛盾？】
首要任务概念。关注首要的任务。
有时铭记设计原则也pk不过用户的惯性行为：找人口数据时，用户对页面右方的目标值视而不见，一头扎进了搜索。
【网站用户的特点：1、惯性行为，2、广告盲】
导致任务失败的因素：
（网站因素）
优势错配：网站布局没有把此任务放到优势区
术语不清晰：用户看了也不知道就是要找的目标
广告盲：形式和位置貌似广告的，被自动忽略了
用户先前的经验：是搜索型还是浏览型用户
惯性行为：钻牛角尖
页面优势区域推荐。通常在水平导航和左边的菜单背景的结合处部分，是最高级别优势区。
4、合理分配版面
“如果把很大一块页面分配给人们并不注视或很少注视的内容，称为屏幕版面误分配。【我情不自禁地想起了网厅那个巨大的、闪烁不止的广告位，除了阻碍人们找到自己真正想找的东西之外，似乎别无它用】如果由于这个问题导致人们跳过一些有用的信息，那问题就比较严重了。【越说越严重了】如果主页呈现的是大量的横幅条幅和没有用的图形，则问题尤为严重。由于用户会把最初25%的时间用于访问网站的主页，因此这是主页设计的大忌。【救救网厅吧！】”
举的那个例子，被作者戏谑地称为“典型的越障训练的例子——页面里充满了用户有意避开查看的特性。”【一幅热力图就能说明问题了——你有滥用优势区的权利，我有无视广告块的自由】
3个例子当中，页面的主要图片都是用户回避的对象。
最糟糕之处就是图片占用了宝贵的优势版面，而让更有用的信息只能显示在页面的下一屏，或者图片传递的信息太微弱或是错误的，用户还要费劲避开。【这说的简直就是。。。】
5、突显最重要的元素
分辨最重要的任务，知道对用户来说页面上哪个东西是最突显的元素。
6、误看元素的代价
突出了你没想突出的。比如在解释说明页面也让一个巨大的Free明摆着来吸引人。太考验用户了！
7、用眼动追踪改善页面布局
建议进行误看元素研究。
任务完成时间
成功率
错误：确实点击走向了错误路径
满意度：对界面的体验评级
（本文内容来自对《用眼动追踪提升网站可用性》一书第三章“页面布局”的强力研读）
（用户因素）
篇9：开心网的页面是最彻底的“F”交互设计
4月，美国长期研究网站可用性的著名网站设计师杰柯柏·尼尔森（Jakob Nielsen）发表了一项《眼球轨迹的研究》报告（原文：F-Shaped Pattern For Reading Web Content），
报告中提出，大多数情况下浏览者都不由自主的以“F”形状的模式阅读网页，这种基本恒定的阅读习惯决定了网页呈现F形的关注热度。分为最热（红色）、较热（黄色）、不热（蓝色）和基本不关注（灰色）4种。
再看开心网的页面，用3条导航在每个页面都构建了一个大“F”。
顶部导航是与“交流”相关的频道，包括好友列表、群组和消息中心，这些都是要与其他用户 的产品。 左侧导航是用户个人操作的产品，包括日记、照片，及其他新增的组件。在频道的页面内，大部分又都有一个相同样式的页卡标签，通常为“我的XX”和“好友的XX”，
这三条导航构成一个巨大的“F”型框架，网站不同页面保持结构一致，使得用户在网站使用过程中的学习成本最低，一次经验，全站通用。同时让用户更愿意尝试开心网上其他产品，因为用户预期中其他产品的使用方法相同，不需要一个重新的学习过程，尝试的成本较低。
而不同产品页面结构各异的网站，用户使用任何一个产品和频道都是一次全新的学习和摸索过程，甚至连找到一个返回链接，都是一次大伤脑筋的走迷宫，这会让用户产生巨大的挫折感，更不愿意去尝试该网站的其他产品，因为用户不知道下一个产品又将是怎样一次令人头痛的探索历程。
从上图中我们可以看到，页面中大部分区域用户都不会去关注，所以在单个页面上，开心网的每个页面内可以操作和点击的链接都非常少，且集中大“F”型热点区域。这向用户传达的信息是：在这里，你只需了解极少的操作就可以使用这个网站。
而那些内容丰富，堆满链接和按钮的网站页面中，也许整个页面只有一个链接对用户是有价值的。但是用户来到这里，既要有足够的智慧和眼力排除所有干扰信息去找到那个唯一有价值的链接，同时还要面对如果我不点击其他的链接是否会错过某些重要信息的困扰和焦虑。
页面中哪些是无效信息，网站工作人员最清楚，但是他们却把排除干扰信息这种复杂的工作交给用户，将用户逼入一种烦躁和焦虑的困境中。这种痛苦的使用体验只会将用户全部赶走。
原文链接：www.niest.net/?p=152
自：认真不是好事 [www.niest.net]
篇10：方便和交互设计
很多设计师都会遇到这样的问题，一个产品会有很多种方式去包装，其中包括很多功能和很多体验。功能越多会被认为越实用，体验越好会被认为越方便。
方便和实用之间到底是什么关系，设计师应该关注的是什么？有两点，一点是技术体验，一种是交互体验。作为一个交互设计师，要去考虑的更多是体验的问题，而并非功能的问题。
举个例子，在一个移动媒体上需要安放日历的插件，设计师会去考虑在基础的日历功能上要不要加上农历，这个对于中国人来讲很实用，然而农历这个功能涉及到了技术的开发，算是一种技术瓶颈。当你发现技术无法完成你的要求时（当然农历这玩意儿对于中国山寨机来讲算是小菜一碟），你的日历插件依然是一个平庸的产品，这说明你没有关注技术体验。但是你换个角度来看，如果把日历上以星期一开头还是以星期天开头作为你设计研究方向的话，你会发现，中国人更习惯于星期一开头，这个在体验上给用户带来更多的价值，而且也不算是一个技术瓶颈，你也满足了技术体验和交互体验的结合，
说到这里，大家应该明白方便比实用更体现设计的价值。
刚才说的山寨机就是把一大堆功能都罗列在里面，虽然很实用但是每个都不好用，种种问题还是让很多人选择了高端的品牌，高端的体验，这就是设计的力量。
作为一个设计师，不要一直依赖自己无法掌控的功能去实现自己的设计，老是天花乱坠的想着各式各样的功能去满足用户，从商业成本和用户满足感去讲都不是一个好的设计。越来越多的交互设计师感觉到自己没有什么作品，那是因为你依赖太多不是自己开发的功能，往往产品中只有你一点想法的影子，产品并没有被你的设计情感化。
实用并非等于方便，但方便一定是实用的。
文章转载自“折折熊de交互论”（www.jojobox.cn）
