_让网站的用户界面(UI)更像是收集精心安排的漂亮图像, 同时,这些网站是创新和执行良好的设计工作的主要例子,设计者应用了设计原则,因此他们也在那里学习,一些要点——或好处——供你们学习,这是UI或UX(用户经验)类型的亲爱的设计者。
在这部视频中,艾伦·迪克斯, "畅销书"的作者_人与计算机互动_和斯旺西大学计算创始人主任,解释情感如何影响伟大的UI设计. 他向大家展示了这种平衡感觉和功能的界面如何既能令用户高兴,又能增强可用性,使得总体经验更具有接触性和可记忆性.
显示隐藏视频记录
- 转写装入...
- 目录
□ □ □ □ 大网络用户界面设计实例的力量是什么?
首先,把它们看做解决问题的解决方案,这是因为一个网站的UI例子中值得一提的每一个要素——从按钮到颜色选择到布局决定——都是设计者设计的目的。 仔细研究这些,你就能了解这些设计决定背后的思想过程,此外,你可以找到新的方法来应对你自己的设计挑战。 从别人如何做起,你可能会发现一种处理导航的新方式,或者一种显示信息的发明方法。
第二, 设计趋势 与技术和其他数字世界一样,在不断演变,所以你必须 跟上趋势,如果你要与你的数字产品用户和客户相关的话,那么为什么经常回来审查UI网站的例子就是一个好主意。
另一个大的好处是,你如何从成功和失败中汲取教训? 由此可见,从其他设计师的所做所为中可以产生什么效果 — — 把它们作为成功的策略(但在这里不要说“复制猫” ) — — 避免做那些(当然)行不通的事情。 设计师可以获得一个**创造力源点火 并且从看别人如何应对设计挑战中感受到刺激。
最后,但并非最不重要的是,作为设计者,你是如何利用从看到伟大实例获得的教训,在自己的数字设计和界面中,** 改进用户的经验——即用户易于使用、参与和满意的经验。
□ □ □ □ 特殊网络用户界面设计的关键要素是什么?
1. 可使用性和直观导航
任何网络用户界面中最重要的组成部分之一, 即一个顶尖的组件, 是它的可用性和导航性, 因此,你想要做的是做到好,确保用户能够轻松地找到他们想要的东西,并着手完成他们想要完成的任务,而不会感到困惑或沮丧地抬起他们的头,破坏应该是一个美好的经历。 而这个“魔力”发生的关键在于你,亲爱的设计师, 设置清晰的标签、逻辑路径和熟悉的模式,
“让每一页或屏幕不言自明,就像在商店里有良好的照明:它只是让一切看起来更好。”
史蒂夫·克鲁格,《不要让我思考》的作者_
2. 彩色调色板的颜色理论和战略用途
互动设计基金会,CC BY-SA 4.0
颜色比可能与眼睛相遇(请注意,这与颜色从光的波长中涌出这一点无关 ) , 而这里所到之处是,颜色激发情绪, 并且能够影响用户的感知和行动, 甚至达到交易中断的水平, 这就是为什么理解颜色理论让设计者使用颜色—— 战略性的—— 这样他们就可以强调关键要素, 创造期望的情绪, 并引导用户的行为。 此外,网站或应用程序不同部分的调色板的一致性也有助于统一、和谐的用户体验,用户也可以更享受。
在这部视频中,主要色彩顾问和作者乔安和艾丽尔·埃克斯图特给出了6个提示,帮助设计师选择色彩.
显示隐藏视频记录
- 转写装入...
- 第3页。 视觉等级和有效布局
如何首先引导用户的目光到最关键的元素, 你可以操控大小、颜色、对比度和位置来达到这个目标,
四. 类型和字体选择
以及正确的字体选择可以增强读者的可读性、表达情绪、增强品牌的个性, 因此,要注意字体大小,行间距,并与背景对比,以确保文本易于阅读.
在这段视频中,肯塔基大学艺术工作室和数字设计副教授米娅·西内利(Mia Cinelli)解释了Gestalt原理如何适用于打字,展示了对齐和流对可读性的影响.
显示隐藏视频记录
- 转写装入...
5⁄4 ̄ ̧漯B 无障碍因素
再者, 无障碍是网络用户界面设计中一个关键考虑因素, 而无障碍设计是严肃的生意, 这意味着你所做的就是为有意义的图像提供替代文本(alt text,简称),确保良好的颜色对比,并使您的界面能够用键盘导航那些不能使用鼠标的用户。
六. 交互设计和直观用户反馈
交互设计与它听起来非常相似, 是关于在您的界面和它的用户之间创建对话, 这意味着如何设计您的界面对用户动作的反应; 当按钮被点击时, 或当用户提交消息后显示确认消息的表格时, 它可能像按钮改变颜色一样简单。 有效的交互设计让用户知道每一次行动发生的情况, 从而帮助用户了解系统如何反应,
观看这段视频可以更多地了解互动设计是什么以及互动设计者的角色.
显示隐藏视频记录
- 转写装入...
- □ 6 探索网络用户界面设计趋势很重要的理由
1. 最小化和清洁接口
在网络用户界面设计中, 最小化(minialism in web UI design) —— 完全可以反映你对房屋中房间的看法, 这相当符合“少则多”的口号, 它剃光了认知负载, 同时也给UX一个简单和功能良好的助推,
2. 微互动和小动画
现在,我们开始进行微观互动和“现实”——而模拟互动则是小巧的动画或设计元素,对用户的行为作出反应。 或像装填动画一样复杂, 或至少是在等待内容上载时,
微互动提供反馈、引导用户、增加用户体验的乐趣,
3⁄4 ̄ ̧漯B 暗模式和替代颜色方案
** 暗色模式** 不仅仅是一个潮流特征或“屏幕时尚”的偏好——这是一个实用的设计选择,在低光条件下减轻眼压,甚至可以节省OLED屏幕上的电池寿命,当然,其他的颜色方案通过他们的美学吸引力和更多,为用户提供个性化体验,这样他们就可以定制界面如何需要或想要.
四. 三维元素和深度效应
科技进步的最大好处之一 — — 从未出现停滞的迹象! 一个工具是3D设计,它可以(类似于它的3D电影对应器)在web UI中加入深度和现实主义. 三维网络设计只是指沿x轴,y轴,z轴的定位对象的艺术——所以,三维网络设计——并因此增加了深度和运动,从而创造了更具接触性的用户体验. 这在虚拟和增强现实的兴起中发挥了很大作用, 3D元素几乎肯定会变得更加普遍。
五. 记忆中的经验和故事讲述
在网络设计中讲故事与书籍、电影、口语或你所描述的一样重要, 这意味着通过视觉、文字和互动来创造叙事, 让用户参与, 想想网站如何使用动画和互动元素来引导用户通过一个故事,
六. 反应和适应性设计技术
对于现代网络设计, 以及现代网络用户界面设计, 由于人们使用许多设备——从桌面到智能手机和智能手表——这些技术确保网站看起来很好,在任何设备上运作良好。 适应性设计适应不同的屏幕大小,而适应性设计则对每个设备使用特定的布局——所以,这些设计是巨大的考虑因素,可以让网站更方便用户,更方便用户访问,让你在设定UI时思考.
□ 什么激励网络用户界面设计实例?
1. 最小设计: 名称
- 名称、公平使用
@Notion**是2016年推出的多功能生产力应用软件, 包括项目管理、任务跟踪、记录和文件存储等功能, 逗号确实有很多库多的特性, 这里最精巧的是这些元素如何在方便用户的界面中很好地聚集在一起, 让用户根据自己的特定需求来调整应用。
** 关键特征和设计要点* 页:1
- ** 简单:** Notion有一个简单、干净和直观的设计, 如何方便地格式化页面和内容、参考页面,
- ** 可控性:** 用户可以快速添加媒体、表格和甘特图表等元素, 用户可以个性化地处理笔记、文件和导航结构, 意味着他们可以享受高度定制的用户体验。
- ** 实际性:** 名称可以取代各种工具, 从Trello的Kanban板到Google Docs的文本编辑能力,
** 协作性:** 也因为实时合作是Notion的强项之一, 让多个用户在单一的文档上工作,
- ** 模板:** 逗号为各种任务提供了广泛的模板,它通过放松新用户的学习曲线和加快每个人的任务完成过程来做一个考虑周到的事情。
2. 注重字型 设计: 中
中、公平使用
Medium是一个在线出版平台(成立于2012年),它在这里所展示的就是数字内容产业中注重打字的设计. 平台因其最小的美学而获得认可, 将读者的可读性和用户参与优先,
** 关键特征和设计要点* 页:1
- 以字典为中心:** 中文本组设计的主要内容是其排版,中文本组使用干净、清晰和清晰易懂的打字机来增强阅读经验,而且----更重要的是----比例、行距和字体的选择使文本能够令人愉快和舒适地阅读。
- ** 列表布局:** 除此之外,Medium还拥有一种最小化的,无杂乱的设计,这种设计方法让用户专注于内容而不会分散对不必要的设计元素的注意力,最小化方面的另一个大优点是慷慨使用白色空间——它进一步提高了读者的可读性和集中性.
互动设计基金会,CC BY-SA 4.0
3⁄4 ̄ ̧漯B 动画设计: 吉特
• 慢跑、公平使用
Jitter将它标记为一种基于浏览器的综合工具来创建动画运动设计,而这个工具在它如何体现其设计上的简单性方面,在它的平台如何提供直观的界面,使得快速高效的工作成为一件容易进行的工作方面,非常巧妙. Jitter被赞为“动画设计图”,
该工具的直截了当和直观的设计,加上其强大的特点,使它在设计工具的景观中占有一个独特的位置,这是一种细微的区别,即: