发布时间：2022-1-31 分类： 行业动态
我今天与大家分享的是网页界面《瞬间之美》的设计如何让用户感到兴奋？
这本书分为七个部分。第三部分到第三部分讨论了用户在进入网站前30秒内所做的事情;第四部分到第六部分讨论用户在深入网站时想要做什么;第七部分着重于用户离开。该网站，无论是临时出发还是永久离境。
第一部分：指引用户
一、如何给网站布局
这不是你去页面布局，但内容决定了布局。布局是内容组织的必然结果。考虑到页面的所有需求，页面的布局自然会形成。将页面的所有页面都放入页面，然后四处移动并进行调整。
在连续调整过程中，需要支持以下几点：
完全理解页面的不同组件并区分主要和次要。
布局指导用户的视线，以了解用户在浏览网页时的使用习惯。例如，当用户浏览网站时，它们用于自上而下，从左到右，左上角是第一个视线，右下角是最后一个着陆点，右上角和左下角是视觉盲点，所以你可以在设计时比较它们。重要内容放在左上角和右下角。
用颜色来吸引注意力。关键部分的颜色应该突出。例如，左上角的徽标和右下角的按钮是最重要的部分。要强调这两个部分，您可以使用网站上的颜色。它没有在其他地方使用，所以它形成了对比并突出了它。
二、统一设计风格
本书中提到的统一设计风格只提到了一点，即使用符号统一设计风格，顾名思义，符号可以是品牌标识或网站的整体图标风格。
在关于界面统一性的章节中，作者没有多少介绍，只有三页纸被接管，并且界面设计中一致性的重要性非常高。在这里我想用《交互设计精髓4》中的统一介绍和我对统一的理解，主要归纳为以下两点：
1. 统一性的益处
统一意味着软件产品的不同模块具有相似的外观，感觉和行为。
统一性提高了易用性和易学性，降低了用户学习成本，并降低了客户培训和技术支持的成本。
增加设计和代码重用，减少开发时间和精力。
统一可以创造一个井井有条的感觉，让用户感到舒适。
为了给用户提供统一和统一的印象，用户更容易认识到产品开发人员的专业性，从而增强用户对产品的信任。
2. 如何做到统一
建立关系：经常一起使用的元素在空间上组织起来以减少鼠标移动;具有相似功能的元素在视觉上被组织，即视觉元素和行为元素是一致的。
将视觉元素与网格系统对齐：这是设计师帮助用户以有组织和系统的方式体验产品的重要方式。
一致的空间：如果屏幕上的两个区域需要几乎相同的空间，请将它们设置为完全相同;如果这两个区域需要不同的大小，则明确区别，如果不完全一致，则增加差异，因为微妙的差异会使用户感到不稳定。
一致的间距和定位：如果屏幕的标题部分始终完全出现在同一位置，则用户无需考虑或浏览界面。一致的间距和定位可以帮助人们的内部视觉处理机制，这可以大大提高屏幕的可读性。性别。
重用元素：因此用户只需要学习一次。
三、如何设计导航
人们通常被引导的方式是粗略地看一下页面，看看他们有什么选择，并快速筛选出与他们无关的内容。
在设计导航时，让用户感觉他是主人。使用动词对象设计导航，例如“创建页面”，这使用户感觉他们正在指导软件。他们是领导者，而不是领导者。
四、创建链接
许多网站上都有各种链接。这些链接按时间，相关性，点击率等顺序排列。许多网站的排列方式很少，很少有细节。作者给出了一个例子：
△这是公司内部网主页上的新闻列表。目的是让公司的员工按时间顺序了解最新事件。
作者重新设计如下：
设计思维：这些链接中的最新事件通常是最重要的;如何让用户看到链接按时间顺序排列;
使用的设计方法：让环境提示成为指导线索，就像日本平台将在火车即将进入车站时播放独特音乐一样。这种独特的音乐可以有效地吸引乘客的注意力，并准备提前下车。作者试图将环境线索的概念应用于链接列表。
首先改变字体大小，从大到小的字体大小变化，链接优先级非常好;更深更浅的色彩营造出时间感，让用户非常清楚地了解什么是最重要的。
作者从火车到车站播放音乐的灵感应用于设计，所以我们通常应该外出散步，观察生活，开阔视野，看看有什么令人兴奋的设计。
第二部分：学习
本节重点介绍如何与用户进行更清晰的沟通。首先，两个例子讨论如何修改文本以传达更多含义。第三个例子讨论了当文本不能胜任时如何使用视频来弥补。
1. 网站文字描述
用户通常不会阅读网站上的文字。他们只是扫描。如果它们是很长的介绍性文本，它们往往会直接忽略它们。短文可能会引起注意。对于用户来说，短句比大段文本更有意义。重要的不是提供了多少信息，而是它是否能够为他们提供他们真正需要的信息。
2. 视频的应用
当您无法用文字描述某些内容时，请学会使用视频。
第三部分：搜索
这部分主要讨论三个部分，即：搜索本身，搜索结果列表，以及精确的搜索条件，以获得最有效的结果。
1. 采用自动完成搜索
优点：自动完成搜索意味着系统可以尝试猜测用户输入的文本并动态搜索适应的结构，然后将其推荐给用户以帮助他们输入。这可以防止用户输入拼写错误，确保搜索更有效，同时避免用户搜索数据库中存在的词汇之外的新命名。
△作者示例：在DTRT的情况下，这个自动完成搜索输入框一方面可以防止用户输入拼写错误，同时避免用户添加各种新名称。
限制：自动完成功能可能会诱使用户放弃自己正确的想法，并选择网站推荐的搜索词汇，但实际上效率较低，这样我们就可以在输入的字符数足以使推荐词有意义。显示推荐的单词并将字符限制为3~4。
2. 高级搜索要简洁
什么是高级搜索：许多网站都有快速搜索按钮，并且有一个高级搜索选项可以满足用户需求，如下面的谷歌浏览器浏览器所示（现在谷歌浏览器已经简化设计，下面的图片是作者编辑的时候书籍版）：
△非常复杂，点击高级搜索并跳出很多选项，一些选项用户根本不需要它。那些需要高级搜索的人实际上只需要几个选项，用户的行为模式告诉我们不需要一次性放置所有选项。全部显示，最好只在必要时添加选项。
作者采用逐行显示的设计方法，根据实际需要逐步显示控件。以下图片是作者的设计：
主要做了一些改变：
单击“高级搜索”以仅添加一个搜索条件。如有必要，请单击“添加”按钮以添加其他搜索条件。这将避免用户可能不会使用的大量搜索条件的突然出现。
使用高级搜索时，将禁用简单搜索按钮，以便用户不会被两个搜索按钮混淆。
第四部分：深入
1. 如何设计视频播放器
使按钮更易于用户操作。
此外，作者的改进是：
通过将较长的视频分成小章节，用户可以选择播放他想要观看的部分。例如，根据不同的主题将人的语音视频分成不同的部分，以便用户可以容易地选择他想要看的章节，而不必阅读所有的视频。
添加视频标题，让用户知道他们正在观看的视频的大致内容。
2. 如何设计表单
使用单列布局时，左列和右列的布局将减慢用户的浏览速度。
使“确定，取消”按钮更完美，将“确定”按钮对齐到页面左侧，首先对齐左边，使所有元素依赖于左侧，从窗体的顶部到底部形成一条漂亮的线条，这是一种美学选择。其次，将OK按钮放在左侧的原因是使用tab键首先切换输入字段的是左侧的按钮，如下所示：
按钮上的文本“确定，取消”将替换为更生动，更准确的文本。如下图所示：
以上是作者的观点，我不同意按钮的放置和对齐方式。在日常交互设计中，我们经常遇到这样的问题，例如“OK”按钮是放在左边还是右边？如何对齐？是否显示或隐藏了禁用状态的按钮？ “确定”按钮的优先级为高或“取消”按钮具有高优先级。按钮的形状设计为矩形矩形或圆角矩形或其他形状。在这次分享中，这部分内容不会过多讨论。
3. Wizard 向导
有时我们填写表格，点击完成页面上的表格，下一步将加载新页面，然后继续填写，将出现另一个表格，这将导致用户混淆并失去耐心，如图所示下面：
如何消除用户的挫败感？我们需要事先告诉他们有多少步骤，并告诉他们他们去过哪里，现在在哪里以及将来去哪里。
首先，为每个步骤添加描述标题栏，向用户显示所有步骤名称，并且可以编辑正在进行的步骤。后续步骤不可点击，因此用户不能随意错误订单并完成上一步骤。下一步将进行。作者的计划如下：
上述解决方案的局限性在于网页的水平空间有限，如果步数太多，则会出现水平滚动条。用户操作水平滚动条非常麻烦，但网页的垂直方向是无限的，所以改进是：
4. 有字符数限制的输入框的设计
首先，在用户开始输入之前，提示用户限制只能输入的字符数;在用户输入过程中，为了避免用户可以输入的字数，需要设置一个随字数变化的计数器;颜色数（颜色，厚度，大小）提醒用户可输入的字符数用完。计划如下：
第五部分：参与
在这部分内容中，我分享了我认为最好的内容，并且不会重复对许多细节的描述。
评分系统的设计
评级页面一般分为两个部分，一个是显示布局，告诉用户已经有评估结果，另一个是编辑布局，用户可以得分。有些网站在设计时只需要点击某颗恒星，只不过星星会从白色变为黄色而无法获得其他反馈，这会让用户对是否成功得分感到困惑。虽然这种交互过程很简单，但用户体验并不好，我们不能简单明了。良好的互动不是让用户以最少的步骤完成任务，而是为了从每一步获得用户的反馈，效率不是所有问题的答案，比效率更明显更重要。
作者给出的解决方案如下：
第六部分：管理信息
1. 自定义标签
每个人都有不同的看法，标签是不同的，不同的人可能会创建标签的多个版本，所以我们需要一些方法来检测类似的标签，并让用户想要标记内容选择现有的标签。
第一种方法是网站应提供像谷歌这样的自动完成功能（我们已在上面说过）。
第二种方法是在用户输入标签后，系统搜索近似标签，然后在下一页上显示。页面可以使用文本向用户解释他可以将新标签与其他人已经创建的标签相匹配。
2. 启发式的设计
启发式设计允许用户提高效率并保持从一个界面到下一个界面的一致性和一致性，而设计元素使交互更容易学习并重复相同的交互。每次交互的每一步都需要尽可能简单明了，特别是在“操作”状态下。
3. 为改变(更新)而设计
为新版本的发布设置一个明确的时间，提前给用户提供准确的信息，而不是新版本的突然发布，给用户带来麻烦，通过向用户发送消息，那些活跃的用户将有一个新版本非常感兴趣，然后告诉更多的朋友;普通用户会得到足够的警告;那些已经注册并放弃但尚未删除该帐户的人将被提醒再次访问我们的网站。
第七部分 ：离开
用户退出后，动员用户再次登录
用户退出后，再次返回登录页面，重新登录登录页面，并鼓励用户通过添加营销推广网站的内容再次登录，而不是使出口变得复杂，将用户拖离其中。
欢迎关注作者的公开号码：“宴会”
