用户体验(UX)和用户界面(UI)设计可以追溯到最早的发明——当史前人类第一次将石头固定在棍子上时,他们使得石头更容易摆动(希望能在这个过程中能获得提升)。然而,作为一个连贯的学科,用户界面设计是在1970年代由施乐等公司制定的,并在90年代随着家用电脑的普及而广泛传播。
自那以后,用户界面设计不断演变,适应新技术和设备。你可以通过遵循一些指导方针,在电子商务网站上进行用户界面设计。以下是开始的步骤。
什么是UI设计?
UI设计是创建软件、应用程序、网站或任何用户交互的数字界面的视觉布局和外观的过程。UI组件的例子包括页面上按钮的排列、指导你通过创建用户名和密码账户步骤的文本,以及引导你完成购物体验的图标。UI设计的目标是创建简单、美观且功能性强的界面,帮助用户完成操作。
UI设计为什么重要?
优秀的设计不仅仅是好看——它可以改善你的盈利能力。一项广泛引用的研究跟踪了许多以设计驱动的公司的表现,发现它们在十年内的表现超越了美国证券交易所上市的500家最大公司219%。强调设计最直接的方式之一就是通过你网站的用户界面。
UI设计与UX设计的区别
UI设计师通常与用户体验设计师密切合作,虽然UI和UX是紧密相关的,但它们是不同的学科。UI设计关注产品的视觉和交互元素,如布局、排版、颜色、图标和按钮,而UX设计则关注整体用户体验,包括产品的总体目的和用户的感受。这两者对于成功的结果至关重要:良好的UI设计支持基础的UX策略。
想象一下电话的演变。最初,你需要告诉人工接线员你想与谁通话。后来出现了旋转拨号,消除了对人工接线员的需求,但增加了一个耗时的旋转机制。最终,引入了数字键盘,其按钮布局不仅延续了传统电话的设计,还成为了手机的标准。快速拨号、联系人列表和语音助手进一步简化了这个过程。
这种演变反映了电话的用户界面:我们与其互动的按钮和方式。另一方面,其用户体验不仅包括设备的UI,还包括它执行的操作、我们对其功能的理解、使用后的满意度等。例如,你在共享出行应用上预约乘车的体验满意度,不仅受到应用界面的影响,还受到找司机的便利性、预计到达时间和司机在行程中的表现的影响。
七个重要的UI设计原则
在过去几十年中,出现了一些UI设计的黄金法则。以下是你应该牢记的七个原则:
1. 让用户感到舒适
这里的用户是你的客户。为了提升他们的浏览体验,在你的网站上创建一个友好的环境至关重要。以下是使导航更直观和用户友好的方法:
- 少即是多。无论你对艺术的品味如何,极简主义是UI设计的核心。良好的用户界面设计要求去除页面上任何不必要的元素。华丽的字体、不必要的信息和过于冗长的文本都是罪魁祸首。
- 保持视觉层次清晰。Fitt定律指出,较大的目标比较小、较远的目标更容易和更快地被点击。换句话说,确保重要元素如购买按钮显眼且易于注意,关键照片和信息自然吸引眼球。
- 保持简单。优秀的UI使用简单的语言、易读的字体和简化的配色方案。页面上的负空间(或白色空间)也是理想的。
- 保持一致性。UI设计元素如按钮、微文案、页面布局和配色方案应在整个网站中保持统一。遵循一般设计惯例,例如将菜单放在页面顶部。
- 避免行话。通过使用不令人畏惧且没有不必要技术术语的措辞,让你的访客在你的网站上感到舒适。
换句话说,你的目标是创造一个干净、吸引人的设计,具有目的明确的视觉元素,在需要时为用户提供所需的信息。
2. 让用户控制体验
UI设计也是了解受众的机会。通过市场研究,甚至通过社交媒体账户获取的人口统计信息,你可以深入了解他们的需求和兴趣。通过同理心与用户互动,绘制出他们访问你网站的动机。用户希望在前面看到哪些按钮和视觉信息?更有经验的用户可能希望哪些内容被隐藏得更深?通过优先考虑你的受众,让他们的需求决定界面。
让用户控制体验的另一种方式是允许他们在没有负面后果的情况下撤销操作。这使得浏览网站的过程感觉更可及和安全,因为他们知道如果遇到繁琐的数据输入流程,可以随时回退并稍后返回。所谓的面包屑路径可以帮助用户了解他们的去向和来处,帮助他们更容易找到信息。(考虑一下本文标题上方的面包屑路径,显示为“首页 > Shopify博客 > UI设计原则”。)
3. 使其直观
良好的用户界面是直观的,一切都在用户预期的位置。即使是最“颠覆性”的品牌也不会在其UI设计中打破用户的期望。相反,目标应该是创造无缝的用户体验。
熟悉的模式、模板、字体选择和页面布局减少了访客的认知负担。这也意味着你不必浪费时间做无用功或解释每一个设计决策。每个应用顶部的小三行菜单之所以有效,是因为我们知道它们的功能。
4. 确保可访问性
色盲影响着全球约5%的成年男性和0.5%的女性。世界卫生组织报告称,有2.53亿人存在某种形式的失明或视力障碍,4.66亿人有听力损失,另外2亿人有智力障碍。
设计一个优秀的网站意味着为每个人设计一个优秀的网站。WCAG网络可访问性倡议为UI设计师提供了详细的指导方针。一个经验法则是不要依赖单一元素进行所有沟通。两个标记为“是”和“否”的按钮也可以分别带有一个勾和一个叉。将它们分别设计成绿色和红色可以增加另一层沟通,确保色盲或阅读能力不会成为阻碍用户导航网站的因素。
前一个原则——“使其直观”——在这里也很有帮助。标准符号和短语使每个人都能保持统一认知。像购物车图标、美元符号和勾选标记这样的图标广为人知,使各种类型的用户能够轻松导航。
5. 让用户知道事情正在进行……
用户喜欢知道事情正在进行。考虑在按钮被点击时添加轻微的动画以确认操作,成功交易或表单完成后的感谢页面,或者如果某个功能需要时间加载,则显示进度条,或者在尝试创建密码时,逐渐变绿的一系列要求。这些都能让你的访客感受到完成的熟悉愉悦。
6. ……但要考虑到它们不工作时的情况
我们都经历过这种情况:当网站或软件未按预期工作时,感到愤怒地点击。良好的UI通过提供即时且信息丰富的反馈来缓解这种情况。
计划好当事情未按预期进行时的应对措施。设计良好的错误信息和404页面应清晰且有帮助,引导用户转向其他内容。这些细节向客户表明他们处于一个功能正常、值得信赖的购物环境中:它们传达的信息是,“别担心。我们知道,我们正在处理。”(想想Twitter的掉败鲸——那只被一群鸟抬起的欢快白鲸——在平台经历服务中断时曾经出现过。(掉败鲸在2013年夏季退出历史舞台,但仍然是Twitter早期的怀旧象征,当时它难以应对高流量。)
7. 拥抱迭代
将设计过程视为一个没有真正终点的迭代循环。它进行重复步骤以改进。在部署后,花点时间观察你的设计如何运作,然后评估数据并进行调整。
拥抱迭代可以采取多种形式;也许是倾听客户反馈,雇用用户测试网站,或深入分析以查看哪些页面的跳出率高或转化率低。例如,对结账页面的小改动可以修复漏掉的销售漏斗。
所有用户和所有企业都是不同的,因此进行一些试错是可以预期的。通过一点小调整,良好的UI设计可以使你的网站更美观、更用户友好,并提高盈利能力。
UI设计原则——常见问题
主要的UI设计原则是什么?
关键的UI设计原则包括:
- 让用户感到舒适
- 让用户控制体验
- 使其直观
- 确保可访问性
- 让用户知道事情正在进行……
- ……但要考虑到它们不工作时的情况
- 拥抱迭代
UI设计的阶段是什么?
UI设计的六个阶段包括:分析(确定用户和业务的目标和期望)、设计(草图、线框图和原型实际用户在网站上的流程)、开发(将设计转化为可用的网络产品)、部署(测试错误并发布)、评估(通过用户测试、反馈和分析测量UI设计的有效性)和迭代(利用评估结果来微调设计)。
什么样的UI设计是好的?
好的UI应有效推动关键绩效指标(KPI),并且在美观、用户直观性和广泛可访问性方面表现良好。