《众妙之门——网站UI设计之道(修订版)》一第1章 现代网络应用中的用户界面设计1.1 什么是用户界面(UI)?

简介:

本节书摘来自异步社区《众妙之门——网站UI设计之道(修订版)》一书中的第1章,第1.1节,作者【德】Smashing Magazine,更多章节内容可以访问云栖社区“异步社区”公众号查看

第1章 现代网络应用中的用户界面设计

众妙之门——网站UI设计之道(修订版)
Dmitry Fadeyev

什么是用户界面设计?什么是有效的用户界面设计?你打算如何把用户界面设计得更好?这一章,我们就来了解一下现代互联网应用程序中可视用户界面设计的理论演化和技术更新。

1.1 什么是用户界面(UI)?

“在你使用工具完成任务的过程中,你所做的操作以及工具的响应,这些结合起来就构成了界面。”—Jef Raskin

用户在第一次使用一个界面时,仍然能发现某些元素是他们所熟知的。
用户界面设计并不仅仅是考虑如何摆放按钮和菜单,更为重要的是考虑应用程序或设备如何与用户互动;更多时候,还要考虑产品与多个用户之间的互动。这就意味着,用户界面设计不仅要做出好看的产品外观,还要做出好用的产品。这不仅仅是调整一下按钮的位置、给他们选选颜色,而是要为完成一项任务而选择正确的工具。一个特殊的界面,是否需要使用按钮?如果确实需要,那么这些按钮将完成什么样的工作?这个按钮需要如何设计才能让用户了解这个应用程序的工作方式,并且轻松达到用户的目的。

在产品的开发周期中,尽早开始用户界面设计至关重要。正如 Jef Raskin 所说:“对消费者而言,界面就是产品[1]”。用户一直看到和使用的都是用户界面,而不是深藏在应用程序背后的技术体系结构。把界面做好,这将极大地提高用户使用产品时的愉悦感,这也能让其很容易就掌握产品的使用方法。所以,先从界面设计开始,然后再开始应用程序后台引擎的编码,要好于先开始编码,再给它包裹一层界面。

什么因素能成就一个伟大的用户界面?

在我们开始着手设计用户界面之前,首先应该理解什么样的用户界面才是出色的用户界面,我们的设计要具备哪些品质才够得上“出色”。所有伟大的用户界面大都具有下面这8个品质或特点。

1.清晰——通过使用文字、流程图、层级图、图标等元素,避免用户对界面产生困惑。清晰的界面不需要手册,同时还能确保用户在使用的过程中减少犯错。

2.简洁——为了让界面清晰,可以通过在所有元素上添加浮动框说明或者标签这种简单的方法来实现,但这样做会导致界面膨胀臃肿。如果电脑屏幕上同时充斥了太多的东西,找到你想要的东西是非常困难的,用户使用起来就觉得困难乏味。如何让界面同时保持简洁和清晰,这正是设计伟大界面的挑战所在。

3.熟悉——人们总是对之前见过的东西有一种熟悉的感觉,有的界面即使是第一次使用,其中的有些元素我们还是会感觉很熟悉。在设计过程中,使用一些现实生活中公认的意象能够更好地帮助用户理解。例如,文件夹样式的选项卡通常在网站和应用程序中起导航作用,人们很快就能意识到它的导航作用,因为现实生活中,我们也是通过文件夹来分类资料的。

4.响应性——这意味着两件事情。首先,响应必须迅速,一个良好的界面不应该让人感觉反应迟缓。其次,界面应该提醒用户发生了什么事,用户的输入是否成功地处理,让用户了解这些信息反馈。并且明确告诉用户,他的请求已经被成功受理。

5.一致性——在整个应用程序中保持界面一致是非常重要的,这能够让用户识别出使用的模式。一旦用户学会了界面中某个部分的操作,他很快就能知道如何在其他地方或其他特性上进行操作,就好像他们早就知道似的。

6.美学性——尽管你不需要把一个界面做得非常有吸引力,但是有一个好看的界面会让用户工作起来更开心。况且,让用户开心绝对是一件好事。

7.高效性——时间就是金钱,一个伟大的界面应当通过快捷菜单或者良好的设计来帮助用户提高工作效率。毕竟这是科技带给我们的一个最大好处,它允许我们用更少的时间和努力来完成更多的工作。

8.容错性——每个人都会犯错,你的应用程序如何处理用户所犯的错误是对它的总体质量的最好测试。它是否容易撤消操作?是否容易恢复删除的文件?一个好的用户界面不应当因为用户的错误而惩罚用户,而应该总是为用户提供犯错之后的补救方法。

想要设计一个包含所有特性的用户界面非常困难,因为各个特性之间总是相互影响。你在界面中增加的元素越多,用户在使用上所花的努力就越大。当然,反过来亦是如此。没有足够的帮助和支持,用户会茫然不知所措。如何设计既简洁、优雅,又清晰、一致的用户界面,是摆在用户界面设计师面前的最大难题。

相关文章
|
9天前
|
存储 JavaScript 开发者
探索鸿蒙新世界:ArkUI框架实战指南,解锁HarmonyOS应用UI设计的无限可能!
【10月更文挑战第19天】ArkUI框架是华为鸿蒙系统中用于开发用户界面的核心工具,支持ArkTS和eTS两种开发语言。本文介绍了ArkUI的基本概念、组件使用、布局管理和状态管理,通过示例代码帮助开发者轻松构建美观、高效的跨设备UI。
37 3
|
11天前
|
机器学习/深度学习 人工智能 运维
企业内训|LLM大模型在服务器和IT网络运维中的应用-某日企IT运维部门
本课程是为某在华日资企业集团的IT运维部门专门定制开发的企业培训课程,本课程旨在深入探讨大型语言模型(LLM)在服务器及IT网络运维中的应用,结合当前技术趋势与行业需求,帮助学员掌握LLM如何为运维工作赋能。通过系统的理论讲解与实践操作,学员将了解LLM的基本知识、模型架构及其在实际运维场景中的应用,如日志分析、故障诊断、网络安全与性能优化等。
34 2
|
22天前
|
机器学习/深度学习 数据采集 存储
时间序列预测新突破:深入解析循环神经网络(RNN)在金融数据分析中的应用
【10月更文挑战第7天】时间序列预测是数据科学领域的一个重要课题,特别是在金融行业中。准确的时间序列预测能够帮助投资者做出更明智的决策,比如股票价格预测、汇率变动预测等。近年来,随着深度学习技术的发展,尤其是循环神经网络(Recurrent Neural Networks, RNNs)及其变体如长短期记忆网络(LSTM)和门控循环单元(GRU),在处理时间序列数据方面展现出了巨大的潜力。本文将探讨RNN的基本概念,并通过具体的代码示例展示如何使用这些模型来进行金融数据分析。
143 2
|
1天前
|
数据采集 监控 数据可视化
Fortran 在单位网络监控软件数据处理中的应用
在数字化办公环境中,Fortran 语言凭借其高效性和强大的数值计算能力,在单位网络监控软件的数据处理中展现出独特优势。本文介绍了 Fortran 在数据采集、预处理和分析可视化三个阶段的应用,展示了其在保障网络安全稳定运行和有效管理方面的价值。
20 10
|
2天前
|
数据采集 存储 JSON
Python网络爬虫:Scrapy框架的实战应用与技巧分享
【10月更文挑战第27天】本文介绍了Python网络爬虫Scrapy框架的实战应用与技巧。首先讲解了如何创建Scrapy项目、定义爬虫、处理JSON响应、设置User-Agent和代理,以及存储爬取的数据。通过具体示例,帮助读者掌握Scrapy的核心功能和使用方法,提升数据采集效率。
19 6
|
3天前
|
数据采集 前端开发 中间件
Python网络爬虫:Scrapy框架的实战应用与技巧分享
【10月更文挑战第26天】Python是一种强大的编程语言,在数据抓取和网络爬虫领域应用广泛。Scrapy作为高效灵活的爬虫框架,为开发者提供了强大的工具集。本文通过实战案例,详细解析Scrapy框架的应用与技巧,并附上示例代码。文章介绍了Scrapy的基本概念、创建项目、编写简单爬虫、高级特性和技巧等内容。
17 4
|
4天前
|
机器学习/深度学习 存储 运维
图神经网络在复杂系统中的应用
图神经网络(Graph Neural Networks, GNNs)是一类专门处理图结构数据的深度学习模型,近年来在复杂系统的研究和应用中展现了强大的潜力。复杂系统通常涉及多个相互关联的组件,其行为和特性难以通过传统方法进行建模和分析。
19 3
|
8天前
|
缓存 监控 前端开发
优化网络应用的性能
【10月更文挑战第21天】优化网络应用的性能
8 2
|
8天前
|
监控 安全 关系型数据库
如何设计高效网络应用?
【10月更文挑战第21天】如何设计高效网络应用?
9 2
|
8天前
|
机器学习/深度学习 人工智能 自动驾驶
深度学习中的卷积神经网络(CNN)及其应用
【10月更文挑战第21天】本文旨在深入探讨深度学习领域的核心组成部分——卷积神经网络(CNN)。通过分析CNN的基本结构、工作原理以及在图像识别、语音处理等领域的广泛应用,我们不仅能够理解其背后的技术原理,还能把握其在现实世界问题解决中的强大能力。文章将用浅显的语言和生动的例子带领读者一步步走进CNN的世界,揭示这一技术如何改变我们的生活和工作方式。