Joshua Porter谈优秀的UI设计原则
界面清晰最重要
界面清晰是UI设计过程的第一步,也是最重要的工作。要想你设计的UI被人喜欢,首先必须让用户能够认可它,让用户知道为什么使用它。比如当用户使用时,能够预期发生什么,并方便地与它交互。
界面是为促进交互而存在的
界面的存在,促进了用户和世界之间的互动。优秀的界面不但能够让我们做事有效率,还能够激发、唤起和加强我们与这个世界的联系。
全力维护用户的注意力
我们生活在被打扰的时代,比如阅读的时候,总是会有事物分散我们的注意力。因此,在进行界面设计的时候,能够吸引用户的注意力是很关键的,所以千万不要将应用的周围设计得乱七八糟,谨记屏幕整洁能够吸引注意力的重要性。如果你非要显示广告,那么请在用户阅读完毕之后再显示。
让界面处于用户的掌控之中
人类往往对能够掌控自己和周围的环境感到很舒服心。不考虑用户感受的软件往往会让这种舒适感消失,迫使用户不得不进行额外的交互,这会让用户很不舒服。保证界面处于用户的掌控之中,让用户自己感受系统状态。
直接操作的感觉最好
当能够直接操作物体时,用户的感觉是最棒的,但这并不太容易实现,因为在界面设计时,我们增加的图标往往并不是必需的,比如我们过多的使用按钮、选项等等其他繁琐的东西以便我们最终操纵UI元素而不是重要的事情。理想情况下,界面设计要简洁,让用户有一个直接操作的感觉。
每个屏幕只提供一个操作主题
我们设计的每一个画面都应该有单一的主题,这样不仅能够让用户使用到它真正的价值,也使得上手容易,使用起来也更方便,在必要的时候更容易进行修改。如果一个屏幕支持两个或两个以上的主题,立马会让整个界面看起来混乱不堪。正如文章应该有一个单一的主题以及强有力的论点,我们的界面设计也应该如此,这也是界面存在的理由。
过渡自然
界面的交互都是关联的,所以要认真地考虑到下一步的交互是怎样的,并且通过设计将其实现。这就好比我们的日常谈话,要为进一步交谈提供途径。当用户已经完成该做的步骤,不要让他们不知所措,给他们自然而然继续下去的方法,以达成目标。
表里如一
人总是对符合期望的行为最感舒适。当其他人、动物、事物或者软件的行为始终符合我们的期望时,我们会感到与之关系良好。这也是与人打交道的设计应该做到的。在实践中,这意味着用户只要看一眼就可以知道接下来将会有什么的动作发生,如果它看上去像个按钮,那么它就应该具备按钮的功能。设计师不应该在基本的交互问题上耍小聪明,要在更高层次的问题上发挥创造力。
区别对待一致性
如果屏幕元素各自的功能不同,那么它们的外观也理应不同。反之,如果功能相同或相近,那么它们看起来就应该是一样的。为了保持一致性,菜鸟设计师往往对应该加以区分的元素采用相同的视觉处理效果,其实采用不同的视觉效果才是合适的。
强烈的视觉层次感
强烈的视觉层次感是通过屏幕上视觉元素提供的清晰浏览顺序来实现的。也就是说,用户每次都能按照同一个顺序浏览同一些元素。弱化的视觉层次没有给用户提供如何浏览的线索,用户会感到困惑和混乱。在变化巨大的视觉环境中,难以维护强烈的视觉层次,因为视觉权重是相对的:当一切都是粗体时,就显示不出粗体的效果了。
恰当的组织UI能够降低认知难度
正如John Maeda在他的书中所说,对屏幕元素的恰当组织能够使页面显得简洁。这能够帮助大家更容易并且更快地理解你的界面。把元素组织起来,通过位置和方向来展示自然的关系。
颜色可以起到提醒的作用,但不是决定性因素
物体的颜色会随着光线的变化而变化。在现实世界中,颜色是一个变化的性质,不应该在界面上起决定性作用。它可以用于提醒,但是不应该是唯一的区别成分。
渐进展示
在每个屏幕上只显示必要的内容。如果用户在做选择,那么给他们显示足够的选项信息,然后在各自的页面上展示详情。避免过度解释或者一次显示所有细节。
适当的帮助信息
在理想情况下,帮助信息是不必要的,因为界面能够让用户理解和使用。但现实情况下,很难做到这一点,所以帮助信息应该是上下文相关的,只有在它需要出现的时间和位置才应该出现,在其他位置就应该隐藏在幕后。要求用户打开帮助文档寻找答案是在推卸设计师的责任。
关键时刻:零状态
第一次访问见面是最重要的时刻,但经常被设计者忽视。为了帮助用户适应,最好从零状态开始设计,也就是在一切都没发生的情况下。这种状态不应该是空白界面......应该提供启动的方向和指导。
现有问题最值得重视
用户总是为已有的问题寻找答案,而不是潜在的问题或者未来的问题。因此,坚持为已知问题创建界面,观察现有行为。
出色的设计是无形的
出色设计的关键特质是它经常无形的施加于用户上。如果设计是成功的,那么用户可以只关注自己的目的,而不是界面...当他们完成目标之后,不会在依赖于界面。这对设计师来说是困难的,因为设计出色时,没有多少掌声。
依赖其他的设计规则
视觉设计、排版等都是界面设计的一部分。不要看不起这些规则,根据自己的情况来使用这些规则,同时从其他领域,如编程、印刷等领域寻找可以借鉴的经验。
界面是被人使用的
在这么多设计规则中,请记住只有用户使用你设计的界面时,你才是成功的。如果一把椅子很漂亮,但是做起来不舒服,那么设计是失败的。
更多有关的内容请查看原文,也欢迎读者朋友发表自己对设计方面的意见。
Joshua Porter谈优秀的UI设计原则相关推荐
- Joshua Porter 20条UI设计原则
原文链接地址: http://www.niushe.com/news/show-3683.html,转载请注明出处,侵权必究,谢谢! 设计师Joshua Porter发表了一篇文章--<P ...
- 优秀设计师应了解的UI设计原则!
没了解UI设计之前你是不是也曾经这么误解过UI设计师:为什么UI设计师的工资可以那么高?明明只是对着交互界面画色块跟线条吗?其实,真正优秀的UI设计师,是能够站在用户的角度做产品设计的,能力可是胜于美 ...
- 麓言信息 优秀的UI设计师必须了解UI设计原则
UI设计是指在考虑用户体验和交互设计的前提下,对用户界面进行的美化设计,涉及移动端.PC端.多媒体终端等各个领域.在实际生活中,一个优秀的UI设计师不仅需要对界面进行美化,还需要对界面中的一些元素 ...
- php 如何设计索引_Mysql学习浅谈mysql的索引设计原则以及常见索引的区别
<Mysql学习浅谈mysql的索引设计原则以及常见索引的区别>要点: 本文介绍了Mysql学习浅谈mysql的索引设计原则以及常见索引的区别,希望对您有用.如果有疑问,可以联系我们. 索 ...
- 25个优秀的UI设计资源下载
25个优秀的UI设计资源下载 2015-12-11 标签:UI设计UI资源 http://sc.chinaz.com/info/151211512498.htm 下面分享一组优秀的UI设计资源, ...
- [Vue][面试]谈一谈对vue的设计原则的理解
谈一谈对vue的设计原则的理解 思路: 在vue官网上写着大大的定义和特点: -渐进式JavaScript框架 -易用.灵活和高效 渐进式JavaScript框架: 与其它大型框架不同的是,Vue被设 ...
- 前端 UI 设计原则(基于Ant-design)
前端 UI 设计原则(基于Ant-design) 本文摘录自:AntDesign官网 1. 设计原则 1.1 亲密性纵向关系:三种间隔横向关系:栅格布局 1.2 对齐 Law of Continuit ...
- APP的UI设计原则及UI界面适配步骤
本文转载自http://www.cyzone.cn/a/20140619/259323.html 从最初的AppStore仅有不到500个APP,到现在,据统计APP近几年增加的数量已经超过3000, ...
- 软件工程·UI设计原则专题
由于UI设计原则很多而且微妙复杂,再加上自己本身对概念的理解也不是很充分,所以写这篇博客专门复习一下,因为有很多感觉都是其他原则的一个具体案例,所以详细程度是不一样的 一.设计原则(UI design ...
最新文章
- 双列集合,往treeMap里添加元素的时候注意的事项
- R语言使用pie函数可视化饼图(pie chart)、为饼图添加百分比信息、使用plotrix包可视化3D饼图、使用plotrix包可视化扇形饼图
- Dubbo服务降级配置
- content_scripts css,chrome 扩展开发 中 content_scripts 配置的 文件没有执行?
- JBI与SCA的区别
- 在虚拟机中的Ubuntu搭建java开发环境
- 用纸筒做机器人_365天,每天都可以玩出新花样,卷纸筒就是这么牛的神器!
- C语言 数组定义和使用 - C语言零基础入门教程
- parent.window php,javascript中的window.self、window.top、window.parent和window.opener详解
- 使用 Android PreferenceScreen 偏好显示类(android.preference.PreferenceScreen)
- MySql常用语句汇总
- Ubuntu16.04火狐浏览器问题汇总
- VB.NET2010 编程实现Word双面打印
- html百分比设置高度的原理,css height百分比 css高度百分比使用教程
- (精华2020年5月12日更新) vue实战篇 axio.js封装和环境配置
- 十年深圳人,是真的吗?
- Can't open /dev/sdb1 exclusively. Mounted files
- Java程序员都是青春饭吗?
- 连续七年 领跑未来丨山石网科入选Gartner 2020网络防火墙魔力象限
- 上传下载Linux系统指定目录的文件
热门文章
- jackson 空值转成空串输出
- Golang并发模型:轻松入门流水线FAN模式
- go iris 源码思路分析
- 计算机二级vp是什么意思,国家计算机二级VP笔试真题.doc
- python四瓣花图形_Python竟能画这么漂亮的花,帅呆了(代码分享)
- linux 格式工厂,在Deepin 20系统下安装格式工厂deb包后字体很小的解决方案
- 茶饮行业舆情管理方案
- Model-Agnostic Meta-Learning for Fast Adaptation of Deep Networks(MAML)简析
- Android电池功耗BatteryHistorian数据分析
- 22个高级Python知识点总结,干货!