游客

标题:丰富直观的设计 用户体验设计中的巧妙过渡
正文:
HTML5和CSS3的兴旺，带给用户更炫更好的体验，一些网站不仅在内容，可用性，设计，功能等方面，让人耳目一新；交互设计细节和动画更是与众不同。我们将分享一些模型的经验，分析一下这些简单的模式为什么效果很好。当我们设计数码产品时，我们一般使用 Photoshop 和 Sketch 此类软件。大多数有数年行业经验的人显然明白设计不仅仅是视觉传达。尽管如此，有些人还是继续做静态设计。Steve Jobs 如此描述设计：“It’s not just what it looks like and feels like. Design is how it works.“ “设计不仅仅是看起来和感受到的样子。设计是如何工作。”我们对于产品的体验和印象来源于诸多因素的集合，交互扮演一个根基的角色。我们无法想象用户界面是静态设计，随后再添加交互魔法。相反，我们需要在早期加入交互特性，把它当成天然的组成部分。让我们看看一些巧妙的交互，它们是一些微妙的动画，优雅地改善了用户体验。动画滚动超链接总是褒贬不一，当点击一个链接时，可以生硬地跳转，结果是丢失上下文。对网站而言，特别是长网站，加一个线性滚动动画，可以改善用户体验：对比下面看看：对比下默认行为和动画行为，跳过内容不再是无意识的行为；它是一个决定。实际上，《简单的变换完全改变了图标的意义。这个小细节比让用户猜测接下来发生什么，以及理解图标是什么意思容易多了。这个切换对用户非常友好。此外，加号旋转总是跟内容保持一个方向，加强了信息的流动。要点：让网站元素的每个状态都可理解。渐进呈现表单和评论许多博客和新闻网站的评论表单不是很友好，当你准备发表评论时，你只想输入评论而不是干别的，典型的问题是，它会询问你各种其它的事情，好烦人呐。为了激发用户的评论热情，我们可以仅显示最重要的元素：评论框。当用户点击输入区域时，展开相应的表单。真实世界渐进展现的例子，可以看纽约时报的 beta 网站：你可以更进一步，当评论框获得焦点时展开表单。这么做有个问题，交互设计的基本原则提到：an action should always happen close to where the interaction occurs （一个行为总是发生在离交互点最近的地方）（关注焦点附近）。我们可以再进一步，给评
[<<][[1]][2][3][>>]

查看评论(0)
发表评论



首页