用户 布局 功能 前言随着产品不断迭代，产品功能会逐渐丰富全面，但对于用户来说，是不是齐全的功能就等同于好的体验呢？本文将以“腾讯会议设置布局”交互优化为例，结合《设计心理学 2》的相关理论，分享关于简化复杂任务的设计心得。腾讯往期案例：如何构建科学有效的色彩系统？来看腾讯文档的实战案例！“色彩是我们感知世界的重要媒介，对于信息传达有着重要的作用，能使人们能够更有效的感知设计的意图和内涵，使传达更高效。阅读文章 > 一、为何要“简化”任务一款产品是不是功能越齐全多样就意味着越好的产品体验呢？对于专家用户来说，当然是功能越全面越能满足自己的需求，但对于新手用户来说，全面的功能未必等同最佳的体验，过多操作挤在同一任务中，可能会让用户感到不知所措，难以上手。因此设计师应尽可能帮助用户简化任务，避免用户因为界面复杂而放弃任务。专业类软件的核心用户通常是掌握某项技能的专家用户，他们在使用前，已经有预期需要先系统学习整个软件的操作，因此它们的复杂和全面是符合专家用户要求的。即便如此，近年来，Figma 之类的软件也在持续打磨易用性，降低用户使用门槛。专业图形建模类软件操作界面作为一款面向普通大众、以高效协同为第一初衷的产品，腾讯会议更需要不断简化复杂操作，让大多数用户都能快速上手，流畅地主持或参与一场会议。下面我将结合腾讯会议设置布局的交互优化案例，来分享关于简化复杂任务的一点点心得。会议场景矩阵相比线下会议，线上开会不免缺乏临场感，因此在腾讯会议里，主持人常常需要通过设置布局来让成员关注重要的视频画面。在无特殊需求的普通会议中，官方提供的两种默认布局就能满足常见的会议场景：腾讯会议默认布局实际上，真实的会议场景需求多种多样。例如，企业汇报更关注发言人，而小组讨论则更侧重轻松的沟通，如何在同一个界面里满足不同的诉求成为难点。为此，腾讯会议在默认布局的基础上，推出了“自定义布局”和“会聚模式”功能，来提供更丰富的会议布局选择。丰富的布局模式因概念陌生，且需要设置成员顺序、位置以及画面比例，对于普通用户来说，这两个功能有一定的使用门槛。在该功能推出一段时间后，我们发现：用户普遍找不到设置布局的入口，在具体设置过程中也遇到较多困难，认为设置布局是“高阶”而“复杂”的功能而不愿尝试。要让用户能把布局能力真正用起来，简化布局的设置过程就显得尤为重要。布局操作路径为了探究具体是什么原因让用户觉得功能复杂，我们开展了易用性测试，得出以下几个交互层面的具体问题，包括：1）入口难找；2）操作难理解；3）流程任务多；4）效果无预期。因此简化任务流程是当下急需解决的问题。具体问题二、复杂任务的“简化”原则那么如何才能把任务变得简单呢？依照诺曼的《设计心理学 2—如何管理复杂》一书中所说，系统复杂性的总量是恒定的，想要用户操作变简单，那隐藏在幕后的复杂性就要增加，在管理复杂时，可以从以下角度出发：良好的概念模型易懂的语义符号自动化、模块化的配置鼓励和系统默认组织结构学习的辅助工具如何管理复杂“概念模型”存储在用户脑中，也被叫做心理模型，它能帮助我们快速理解事物运作的背后逻辑。若我们的界面没有准确地传达出概念模型，用户就需要通过不断地摸索和猜测来尝试，最终很有可能因为不理解其含义而失去耐心。设计师应当通过浅显易懂的语义符号，帮助用户构建合适的概念模型，以帮助他们更好地理解产品功能和操作逻辑。像 iphone 的”开锁“提示、微信的”漂流瓶“、深泽直人的 CD 机，都是通过用户生活中熟悉的物理模型，让用户快速联想到熟悉的事物，从而更好地理解接下来需要与产品互动的操作。概念模型案例“自动化”选项和默认配置，则能帮助用户摆脱繁琐的选项和步骤。我们可以基于对场景和用户习惯的了解，提供常见的选择或智能配置。例如在表单设置页内提供默认的模板和样式，能够让用户更轻松地理解产品功能和效果。相比起手动添加内容，可以大大减少理解成本，帮助用户更轻松地完成设置过程。通过“自动化”简化用户操作“组织结构”是指把集中在同一个页面的任务进行结构重组，拆分成易于操作的小步骤，并保证每个模块都简单易学，容易理解。用户在进入一个铺满选项和操作的页面时，通常会不知所措，不知道从哪一部分先开始。或许本身设置的难度并不大，但复杂的设置项也会在心理上给用户带来巨大的压力，从本能上抗拒和排斥。好比完成一场马拉松可以把每 5km 作为一个里程碑去逐个击破，倘若我们能将原本用户觉得困难的大目标拆解成一个个简单的小目标，明确每个步骤应该做什么，并在完成每个步骤后都给予充分的鼓励和反馈，用户就会有持续去完成设置的耐心和动力。拆解关键步骤“学习的辅助工具”是指在合适的时机给予用户有效的帮助指引和提示，对于 Saas 类产品来说，在用户需要的时候及时提供帮助和指导，能给用户充分的安全感，缓解用户操作时的不安和紧张。关于操作的提示，我们不能只是告知用户哪里出错了，更重要的是给出原因并提供解决方案。提前引导而非指责，将能大大提升用户持续操作和探索的信心。另外需要注意的是，用户很可能第一次遇到时未必能记住所有指引的内容，因此对于复杂的操作任务，还需要提供稳定常驻的帮助入口，便于用户二次查阅。辅助学习三、产品“简化”的设计策略有了设计原则的指导，我们的设计目标也会更加清晰。在具体的方案设计层面，我们需要结合设计对象的特点，将理论指导转化成可落地的设计方案。布局设置一般由主持人在会议中统一设置，因此在场景上，具有“设置时间紧张”、“自定义程度高”、“生效范围广”、“角色复杂”等特点。结合前文梳理的设计理论原则及业务场景特点，我们将设计理论转化成了具体可落地的设计策略。设计策略具体包括以下四点：1. 简化入口，及时帮助通过便捷的入口和及时的引导，让功能在合适的时机曝光，保证用户在需要时轻松地找到功能。针对“入口深”这个问题，我们将原本不稳定的入口改为常驻入口，待用户选择布局后再提示相应条件，及时引导用户在使用前先打开摄像头。同时在移动端和应用面板也都增加入口，降低用户寻找的门槛。增加入口另一方面，我们将原本需从客户端跳转到 Web 页面的操作，都简化至客户端内，减少用户跨端操作，避免因为过多的窗口跳转让用户感到迷惑。同时精简了高级功展示，在会议的客户端只保留核心操作，这样用户就不需要在多个页面之间来回跳转，完成设置项后，也可以在会议的客户端立即生效。缩短路径，减少跳转考虑到新手用户并不一定能理解“布局”、“轮询”等功能的作用，我们在页面顶部增加“新手指引”常驻入口，用户可以通过步骤引导图来详细了解每一步操作。对于用户比较陌生的高级功能，也在功能的启用选项旁提供 GIF 动图，帮助用户全面、直观地了解功能。通过新手指引快速学习2. 自动配置，提供模板“系统默认”具体落地到设计方案，即可以根据用户的使用频率，自动设置常用选项，同时提供默认模板，减少用户的决策压力和理解成本。例如，用户在进入设置页时，可能不太理解“布局”、“视图”、“背景图”及“模式”等陌生的概念名词之间的区别，也不知道这些布局样式适用的场景，因此，我们通过提供默认模板和效果示意，帮助用户快速理解概念之间的区别和不同的效果。常见模板及官方背景图同时考虑到自主设置有一定操作门槛，我们把常用的样式增加到默认列表中，用户选中后就可以直接使用（左图，L 布局）。对于座位设置功能，我们也提供了“自动填充”的默认选项，新手用户可直接选择自动排序，快速使用布局功能，而专家用户若有特定的排座诉求，则可以切换到“手动模式”来进行更高级的设置（右图，设置座位）。提供多种模式，满足不同诉求3. 拆解任务，分解流程“简化复杂页面”非常重要的一个方面是重组页面结构，把聚合在一个页面的任务根据先后顺序拆解成不同的步骤，让用户不再迷失于平铺了多个功能的庞大页面。拆解步骤拆解成小步骤后，可以通过增加步骤条导航和引导提示，让用户更明确每个子环节的“小目标”和当前所处的进度阶段。通过导航降低用户心理门槛除了将一个页面拆解成多个步骤，还可以通过收起/隐藏侧边栏目录，让用户更聚焦在某一具体的内容，免除其他元素的干扰，这样用户能更专注于布局画面本身的编辑。4. 效果预览，建立联想新手用户初次设置布局时，可能缺乏安全感，不知道应用范围是自己还是全部成员。为此，在设计客户端的设置流程时，我们提供了“场景示意图”和“效果预览区”，让用户在编辑的过程中也能快捷地联想到应用后的效果，实现所见即所得。除了官方提供的场景图模板，用户还可以根据自己的诉求在编辑器内 DIY 创作自己的场景图。考虑到对于新手用户来说，场景图编辑器的功能有一定使用门槛，在进入编辑器时，我们都会提示用户，可以通过调整模板场景图来快速上手，理解创作后的效果。通过效果图构建联想对于设置了座位、但未开启摄像头的成员，我们通过“铭牌”的概念模型，让用户能够联想到线下会议室里的“座位牌”，从而更好地理解这个座位已被主持人提前预留给了重要的成员。通过概念模型映射，帮助用户理解抽象概念可以看到，无论是场景效果“示意图”还是“名牌”的概念模型，都是通过真实世界里的元素，唤起用户在真实世界的心智，从而帮助用户更快地理解软件界面的功能逻辑。总结与回顾经过持续半年的方案打磨和研发落地，上文提及的改版方案已全部上线，会聚模式和自定义布局的渗透率都有了非常大的提升。通过该项目我们知道，在面对场景复杂多样的产品时，我们需要遵循一些通用的简化设计策略，综合考虑不同用户的认知门槛，尽可能降低上手难度。具体策略包括“简化功能入口”、“提供默认设置”、“拆解复杂流程”、“构建联想概念”等。为用户打造更简易的使用流程，一步步简化用户设置任务的操作，才能从根本上提升用户使用产品的效率。欢迎关注作者微信公众号：「腾讯设计族」本篇来源：优设网原文地址：https://www.uisdc.com/simplify-user-tasks
收藏 收藏夹 用户 几乎所有 C 端产品中都会有收藏功能，也是为用户提供对喜欢的内容进行个性化保存、分类和管理的空间。同时也方便用户再次消费某个内容时，减少再次记忆和查找的成本。比如我喜欢做菜，但是年纪大了记性不好，每次做一道菜我都会打开我的某音收藏夹里找到视频教程。更多收藏夹设计教程：从“去我的收藏夹吃灰”聊起，如何从产品角度解决信息过载问题？有了互联网以后，大家都会发现信息的获取越来越方便，但同时也会发现，信息过载的问题更加严重。阅读文章 > 一、收藏夹要解决用户什么问题两个关键词：1.管理 2.分类管理，就是我们所说的增删改查。“增”，我们需要在用户浏览信息时给该信息提供收藏功能，这里要注意的是收藏信息的颗粒度，什么信息可以收藏，一段话？一篇文章？一个用户发布的完整内容？还是一张图片？产品对收藏最小单位的定义要明确，因为会影响到对收藏内容的分类。例如微信可收藏的最小单位很多，有链接（包含文章）、文件、图片/视频、音乐、语音、聊天记录、笔记、位置，而像饿了么只能关注店铺，对任何菜品、用户评论等等都无法进行收藏。B站你可以收藏视频、漫画、商品，但不能是他人的动态。删没什么好说的，再来说一下改和查。因为他俩会涉及到收藏的流程。我们知道不同产品的收藏流程是不同的，例如马蜂窝、闲鱼等产品，用户收藏内容后只给出收藏成功的 toast/提示栏提示，并告知收藏到了哪里；而腾讯视频、抖音、携程则是当用户进行收藏后除了给出成功提示还会给出收藏列表的入口；最后，像知乎、豆瓣在点击收藏后直接给出滑出操作框让用户选择收藏夹或创建收藏夹以及是否要转发。二、3 种流程的区别前两种我认为区别并不大，是否要在提示框里给用户进入收藏列表的入口，更多还是取决于产品是否想让用户离开这个场景，还是让用户继续浏览。之前我们提到过闭环，但是闭环一般针对任务而言，但是收藏严格来说不算是“任务”，而是用户的一种“行为”，感知起来区别还是很大的，因为任务是有明确目标的，比如给用户安排一个任务，让他对某个商品进行分类收藏，那么用户会根据这个分类收藏的目标去进行操作，任务结束后给用户相关的引导和出口。但是在用户自然的浏览场景中，对内容的收藏并没有具体目标，所以要不要给用户在点击收藏后引导进入收藏列表要具体情况具体分析。其次是知乎、豆瓣，在用户点击收藏后给予是否要创建收藏夹的功能，相比于前两种，对信息内容的管理，更加明显了。首先为什么他们和前两种不同呢，像知乎用户是有 KOL 效应的，个人的收藏夹可以公开，他人可以查看他人的收藏夹，有点类似于花瓣的画板，同时对于这类知识、内容类的应用，对于分类的要求和需求更高更多，本身知识的维度就很多，颗粒度很小，所以在用户进行收藏行为时主动提醒用户可以创建收藏夹。那淘宝是怎么做的，它在用户收藏的时候也给出一个菜单，用户可以选择收入到某个收藏夹，也可以默认不放入，还可以去创建并放入，这就是更个性化了。但是咱们说前两种没有给在收藏时给创建功能的就不个性化了吗？也不是，个性化也要根据产品定位和用户需求来的，比如马蜂窝的一些机票车票、旅游产品，做一个收藏夹创建，好像没必要，因为可收藏的类型不多，个性化标签也不明显，显然是没必要的。腾讯视频、闲鱼显然也是。那我们再来聊一个细节。知乎在点击收藏某个回答的时候，页面会唤起收藏模块，让用户选择你要收藏到哪里，但这里的体验不是很好，因为用户想要收藏某个内容必须先选择收藏夹，如果不选择则无法收藏成功？无论你当前是否创建了收藏夹，都必须选择或点击完成，如果有创建过，那就需要经历：1. 点击收藏图标 2. 点击要收入的收藏夹 3. 点击完成，如果没有创建过那么默认会创建一个收藏夹。而淘宝则不是，无论你是否创建收藏夹，只要点击收藏图表那就已经收藏成功，在这个前提下，你可以选择是否要收入到某个收藏夹还是新创建一个。所以知乎、豆瓣的收藏单位大多以回答、帖子为主，这样的内容系统无法帮助生成标签，所以需要用户自己创建分类，在收藏时给予创建功能是合理的，但我认为知乎这样的设计还是不够人性化，但是站在业务角度看，就是想引导用户去创建分类，也是能理解的，虽然在体验和效率上并不是最优。创建、分类、搜索都是帮助用户再次进入收藏空间时能够更好的查找想要的内容。同时不同产品会有不同的筛选标签，比如微信阅读，收藏其实就是书架，哦，应该说，书架就是收藏。筛选维度分为：更新、进度、购买、分类。所以我们在设计收藏功能的时候，要根据用户的筛选场景和内容来制定合理的筛选维度。三、收藏和点赞还有加入购物车的区别收藏的属性就是收纳、管理和分类，但是和点赞、购物车不同，点赞意味着认同，具有社交属性，同时也为了帮助产品记录用户个偏好用作研究，而收藏则是用户想对该内容进行收集，比如我正在准备一个辩论赛，我抽了一个反方观点，虽然我本身并不喜欢这个观点，但是为了准备辩论的素材和题目我会对这个内容进行收藏，但不会点赞，虽然收藏大部分时候也有对内容的认可，但不完全是。所以收藏更多的是用户个人对信息的单方面管理，点赞则一个即时互动。收藏和购物车也是一样的，购物车承载的是更多消费、商品营销的表达、算价以及凑单活动，购物车和直接消费强关联，而收藏夹多关注与对商品的存储管理、搜索查找，虽然也有一部分需求重合，但用处、和场景还是有很大区别的。最后，总结一下，设计收藏夹时，我们首先得根据产品定位和用户需求以及内容的维度来选择好收藏夹的颗粒度或最小单位，其次，根据业务或用户需求设定好收藏夹的收藏逻辑和流程，最后，做好用户对收藏内容的查找以及分类筛选的体验。欢迎关注作者的微信公众号：「应谋鬼计」本篇来源：优设网原文地址：https://www.uisdc.com/collect-design
用户 设计师 视觉 学习任何东西，最好都能重头开始，本文阅读时长大约 5 分钟。内容仅代表个人观点，欢迎各位探讨...我身边有不少的同事或朋友转型交互设计的经历，他们的原职位有些是产品经理、销售或设计师。而我本人也是一名交互设计从业者，在对交互设计的不断探索及日常工作经验的总结中，发现了一些交互设计中常见的误区。写到文章中分享给大家，希望能对即将步入交互设计领域的伙伴们有帮助！更多交互干货：大厂出品！写给UI设计师的交互自学指南编者按：本文从启蒙、基础、强化、进阶4个方面，列举了UI设计师学习交互的路径和方法。阅读文章 > 误区 1-交互设计门槛很高交互设计介于产品经理与 UI 设计师之间。是为了顺应时代发展划分出来的岗位需求，虽然已经出现了很多年，但目前来看，交互设计在一些中小型公司仍然是比较模糊的领域。甚至很多从业者把交互设计交给产品经理或 UI 设计师来实现。这种想法非常浅显，而且容易带来系列的体验问题。很多人在步入新领域的时候，都会寻找对应领域所需要的知识结构、能力模型...我和身边的朋友经常会聊到这些，试图从中总结出一个好的交互设计需要满足哪些特质。沟通能力、人机科学、心理学、认知科学...但很多初学者看到这些就放弃了，它给人一种学习曲线很陡峭的感觉。在我看来，交互设计师的专业程度很大一部分取决于对用户的了解深度，而非是专业知识。所以，对于初学者来说，只需要具备一个必要的入门特质——同理心（empathy），这是一种理解或者感受他人（用户）的能力。在生活中，如果你觉得自己是一个比较能站在对方角度思考的人，那么恭喜你，你已经具备交互设计师的特质了。但是同理心并不是一件很容易的事情，你需要它贯彻交互工作的始终，“以用户为中心进行设计”并不是一句slogan，始终站在用户角度思考问题，这非常重要！！！误区 2-交互设计工作是画原型图原型图和流程图是交互设计师的主要产出文档之一，但是交互设计需要做的不仅仅是产出这些文档，甚至很多时候，交互仅仅需要提供建议。UX 设计指的是设计用户体验的过程。核心的焦点在于设计用户行为，用户行为不仅仅体现在原型图上点击或滑动某个地方，而是尝试引导用户诱发或者推动响应。很多从业者错误的认为交互设计就是画原型图和流程图，这种想法往往会把注意力集中在用户要完成的任务上，而忽略了体验过程中是否有足够的关注。完整的用户行为，应该包括预知、反馈、返回三个阶段，交互之前有预知，交互之中有反馈，交互之后有返回，这三点支撑起交互基本的可用性。1. 交互之前有预知用户在使用产品进行交互前，是否能够清晰感知到需要的信息以及下一步的行为？《About Face 4 : 交互设计精髓》一书中提出，用户对于一件事情的心智是一个圆，我们设计出来的东西越趋于这个圆形，用户对设计就会越满意。所以在进行设计之前，多问自己一些问题。用户来这里的动机是什么？他们点击这个东西的时候会有什么预期？他们是否对未学习过的东西有一定了解?...2. 交互之中有反馈系统应该让用户时刻清楚当前发生了什么事情，也就是快速的让用户了解自己处于何种状态、对过去发生、当前目标、以及对未来去向有所了解。比如加载页面的设计中，我们会通过进度条或者场景插画的方式预知用户页面的进度，从而打消用户等待过程中的焦虑。3. 交互之后有返回可逆性是交互设计中重要的一环，用户不可能百分百的按照我们设计的路径去使用产品，事实上，用户常常会误触到某些功能，即使在线性的流程中，我们也应该让用户可以方便的退出，始终让用户保持可控的状态。比如微信聊天中的撤回功能，在发送错误信息后，可以通过长按这条消息或者表情，在选择框中操作撤回。举个例子，「饿了么」在选购商品的时候，交互前通过按钮置灰预知用户不可点击，交互中通过动效、Toast 给予用户操作反馈，交互后可通过外卖箱对已选商品进行删减或清空，保证产品可逆性。误区 3-用户的想法都是对的为了贯彻“以用户为中心”的设计原则，很多设计师会选择直接听取用户的设计建议，最终导致产品越做越复杂，最后造成体验上的损失。实际上，UX 是一项技能，而不是一种天赋。这意味着大部分用户是无法帮你进行设计的。而且当你面临未知的挑战时，不能一味听从用户的想法。你可以听取用户的意见，但不要他们说什么你就干什么。听听用户是怎么想的，看看他们是如何尝试完成某项操作的，了解他们是怎样在你的设计中迷失的，以及为什么会这样。然后，去寻找这些问题的解决方案。福特汽车创始人亨利福特说过一句名言：在汽车出现之前，去问顾客想要什么，他们可能会说：一匹更快的马。”如果我们一味的听取用户的想法，那我们只能在解决方案上做加法。如果要找到完美的解决办法，我们必须学会找到问题的本质。误区 4-交互不用考虑视觉这是交互设计师经常忽略的，把线框图当作速成且粗略的草图，或者把它当成设计的第一步，只展示流程如何运作，却忽略了是否能够更好的运作。交互设计师在组织框架时，除了保证逻辑清晰外，视觉也是构成体验的一部分。交互设计师虽然不直接负责视觉效果，但需要通过元素之间的结构关联和强弱对比，将有效的信息传递给下游。在必要的情况下，也可以通过 1-2 种颜色来表达你的想法～具体可以分为视觉重量、视觉关联两个方面：1. 视觉重量用户不可能像机器人一样把页面所呈现的内容都扫描一遍，如果你想要用户着重关注某些内容，你需要调整不同信息的视觉重量，以达到主、次、先、后的顺序。当你不断的使用排版来突出重要文字、用特定的颜色强调按钮，并且给重要内容以更多的视觉重量时，就创造出了视觉层级。用户的眼睛就可以从一个重要的地方跳到另一个重要的地方。交互设计师在传递技术文档时要体现出这一点。2. 视觉关联交互设计师除了注重逻辑关联外，视觉关联也是组织信息框架时重要的一点，在用户没有了解你的页面之前，会下意识的通过眼睛划分哪些信息都有什么关联，在设计中，我们通常将有关系的元素给予更强的亲密度、统一的样式，甚至通过卡片、色块的方式来划分关联。而且位置接近的元素关系越强。我们不需要像视觉设计师一样将原型图绘制的如此精细，但需要通过一定的处理方式体现出视觉的关联性。误区 5-我觉得这样做会更好设计师不用对 KPI 负责，但要直接对体验负责。交互设计师的工作中，自身代表的就是用户，任何时候都要避免一些主观的看法。不要你觉得，而是用户觉得。任何需求都离不开用户这一要素，不同的用户群体决定了设计上的不同策略。如果你想设计出用户满意的 UX，在工作中需要做的第一件事就是了解用户，并且持续这一过程。《用户体验设计-100 堂入门课》这本书中有个很有意思的观点，在了解用户之前，你需要先了解关于自己的两件事认清自己：你想要的东西对用户来说不重要你要知道什么东西对于用户而言不重要很多设计师刚开始能做到这一点，后来慢慢陷入设计自嗨，最终导致体验受损。交互设计师要始终意识到，出色的产品设计始于用户研究，上文说到，交互设计师的专业程度很大一部分取决于对用户的了解深度，如果你不知道如何着手了解，您可以尝试了解一些用户研究方法与工具，并把他用在工作的实践中，比如：桌面调研、用户访谈、焦点小组、用户画像、故事板等。误区 6-弹窗不能跳弹窗弹窗对很多人来说并不陌生，我们经常在各种网站和各种 APP 中看到。弹出式设计被评为“历史上最糟糕的设计体验”。所以”弹窗不能跳弹窗“这句话，如铁训般的规则深入人心。在体验设计的层面上，普遍的说法认为，一定程度上，多个弹窗会加重用户的心理负担。而且会造成用户迷失。那为什么会说弹窗不能跳弹窗是个误区呢？因为随着互联网业务深耕的发展要求，经常会遇到弹窗覆盖弹窗，浮层覆盖浮层的需求，如果我们只是以“弹窗不能跳弹窗”来否定需求，这并不是交互该做的。我们应该了解弹窗的底层体验逻辑，再探讨弹窗体验使用的合理性。1. 弹窗层级弹窗在层级上比操作界面更高一层，会聚焦视觉，所以弹窗覆盖弹窗的时候应该避免带给用户层级过深的感受，以此来降低带来的心理负担。比如弹窗覆盖时出现尺寸差异及较大的视觉差异。2. 弹窗承载弹窗的空间承载比页面要低，我见过不少的产品提出弹窗跳弹窗的需求，目的是为了希望用户在复杂操作后仍然可以留在原页面。实际上这是不对的。对于一些复杂的操作或者过载的信息，页面是比弹窗更加合适的载体，如果我们只是想用户做完这些回到原来的页面。只需要设计一个体验循环的闭环。3. 弹窗操作弹窗会聚焦行为，弹窗跳弹窗的情况只适用于线性的操作流程，线性的操作会使用户心理上有较强的预期，可以避免多个弹窗所带来的迷失感。所以，一切出发点都要围绕体验及感受的合理性，如果我们设计的交互流程呈线性，且满足弹窗的承载能力。那么完全通过一定的设计技巧实现弹窗跳弹窗的交互方式。误区 7-效率至上悖论效率至上，这句话本身没有什么错误，交互设计师应该重点关注效率。但我发现，很多人喜欢通过漏斗或者步骤来衡量一个流程的效率（用户之前用了几步，优化之后用了几步），甚至出现某些“规则”，一个流程尽量不要超过 3 步的说法。很多设计师为了所谓的“效率”而刻意缩短步骤，结果导致用户整体的使用时长增加。这就陷入了“效率至上”的悖论中。如何避免效率至上带来的“诅咒”？建议以下两点：1. 关注目的而非效率效率不是交互设计师唯一要做的事情，设计的本质是解决问题。如果我们的目的是为了设计出 XXX 保险的购买流程，我们应该思考用户在整个购买流程中的心理变化，如果像推销保险一样，上来就设计出一个购买页面，让用户去购买，用户一定会很排斥这种做法。必要的时候我们甚至可以分为 2 步，先着重介绍这个保险的好处，再试图让用户去购买。2. 状态清晰原则始终让用户保持清晰的头脑，席客定律提到过，人在面临选择越多的时候,所要消耗的时间成本越高。假如一个遥控器上面有 100 个按钮，我想使用者在看到时就已经崩溃了，而假设遥控器上只有 10 个按钮，使用者则会很快上手并开始熟练使用它。作为交互设计师，应该始终意识到这一点。无论我们设计的流程需要多少步骤，都应当始终保持状态清晰易懂。以上就是我总结的设计工作中常见的误区，如果你们也在日常工作中遇到各种各样的问题，欢迎大家评论区留言～本篇来源：优设网原文地址：https://www.uisdc.com/7-interactive-design-misunderstanding
菜单 全局 用户 你是否有过这样的体验，进入庞大且陌生的火车站后迷失方向：从哪里进站？在哪里安检？取票窗口在哪？这时你迫切需要一个准确的导视牌，帮助你在建筑空间中定位，并找到前进方向。在软件系统中用户也会面临类似的问题。带着目标进入系统后，用户会通过网页内散布着的信息气味，去寻觅目标功能入口，而提供这些信息和入口的便是导航系统。它解决了用户“我在哪”“到哪里去”的问题，并为用户提供移动方式即页面间跳转。本文将基于 B 端场景的全局导航展开，归纳总结相关概念并提出设计建议。更多B端导航设计干货：超详细！总监出品的B端设计规范指南（六）：导航栏从这篇开始，我们就要对 B 端一些常见的复杂组件进行解析了。阅读文章 > 一、为什么需要全局导航根据导航的触达范围，在 B 端设计中常使用的导航可分六种类型：其中全局导航联结了系统的所有板块，从系统整体为用户提供定位与导航，允许用户在系统浅层进行横向移动。全局导航是用户使用网站功能的第一触点，和首页内容一起塑造了用户对网站的第一印象。全局导航对用户体验的影响可以归纳为以下几点：呈现信息架构：构建用户对网站功能和内容的整体认知。提供关于当前位置的线索：帮助用户了解当前位置与可前进路径。提供可访问入口：帮助用户快速抵达目标页面。提供一致性的产品体验：全局导航通常是所有页面的共同元素，可以强化品牌形象。二、全局导航的基础样式1. 导航菜单的构成导航菜单由多个菜单项集合而成。容器：承载导航菜单内容的容器，容器颜色通常与页面背景色形成对比。选项内容：通过简短文本表述菜单选项选项，也可以采用图标+文本的形式。交互状态：normal、hover、press、disable，点击菜单热区后跳转至对应的页面。在页面浏览过程中，用户的浏览动线是从左上到右下进行扫视，因此全局导航普遍被放置在页面顶部，或者页面左侧，由此产生了常用的几种全局导航菜单范式。2. 水平导航菜单导航菜单放置于页面顶栏，横向水平延展。其中选项优先级从左到右递减。优点导航栏面积较小，有较大屏幕空间用于内容展示。页面简洁，选项数量有限，减轻用户的认知负载。在长页面中，导航上下布局与用户浏览方向一致（纵向滚动查看），沉浸感更强。缺点导航菜单间切换较为不便。若菜单选项名称过长、数量过多会受到横向尺寸限制。导航菜单横向排布，用户扫视效率低。适用于：导航菜单数量较少的场景；内容向下延展的长页面，如官网页面3. 垂直导航菜单导航菜单放置于页面左侧栏，纵向垂直延展。其中选项优先级从上到下递减。优点用户可以快速在导航菜单之间切换。充足的纵向空间可以容纳更多选项，选项过多时可以对一级导航进行分类。纵向排布的菜单内容，方便用户快速扫视并识别。缺点导航栏面积较大，用于内容展示的区域变小。视觉突出，浏览过程中打断感强。适用于：导航项较多、功能属性强的场景，如大部分 toB 网页。4. 混合式导航菜单同时使用水平导航菜单和垂直导航菜单。通常顶栏为一级导航，承载全局类目和功能；侧边栏为二级导航，提供具体网站架构和功能。优点外显一级、二级导航，提升网站结构可见性。可以容纳更多信息层级。充分利用屏幕空间，信息密度高 。缺点菜单面积较大，视觉复杂度高。用户浏览动线复杂，需要合理设计架构。适合量级大，复杂度高的的系统，如各种云服务后台。三、全局导航的拓展能力1. 弹出为了容纳更多的信息量级，hover 在一级导航下可以弹出二级菜单。顶部导航/侧边导航的不同弹出方式：当二级菜单内容过多时，也可以像各种云服务网站一样弹出站点地图。但需要对二级导航进行合理分类、规划，否则影响用户信息搜寻速度。2. 搜索当二级导航过多时，增加搜索功能可以帮助用户更快速触达入口。四、设计建议用户使用导航菜单是一个信息寻觅的过程，包括信号捕获、行为实施、反馈与评估等流程。在系统设计时需要注意全局导航的可用性，确保用户快速找到目标入口，提高系统使用效率。本环节将从导航使用体验出发，对全局导航的设计要点进行归纳总结。全局要有足够的视觉权重，默认折叠全局导航会使用户难以发现入口。一般默认侧边栏展开，不需要时收起。保持结构简洁，若导航层级过深（如三级导航及以上）可见性将大大降低。控制水平菜单选项数量，避免过长溢出，同时需要考虑未来业务的可拓展性。保证可读易于扫视。菜单选项名称保持辨识度，避免大量使用重复文本。准确映射内容，跳转页面的可预见性，采用易于理解和识别的名称/图标。五、小结全局导航是 B 端系统中不可或缺的一环，目前已经有非常成熟的设计解决方案。水平菜单和垂直菜单都很大程度上平衡了界面简洁和功能实用，在 B 端系统得到广泛应用。在系统设计前期，需要根据内容整体框架和页面布局，选择合适的导航菜单类型。在全局导航的具体设计中，则需要着重考虑提高菜单选项的可见性和用户使用效率。最后，用户的交互行为不仅依赖当下的界面外观和内容，还依赖用户的先验知识和使用经验，因此优秀的导航系统应该与用户的心智模型相匹配。欢迎关注作者的微信公众号：「应谋鬼计」本篇来源：优设网原文地址：https://www.uisdc.com/global-navigation-design
用户 功能 乘客 有人说它是全世界最牛逼的 APP，因为它的算法难度和春运期间访问量几乎是全球之最；但有人说它是全世界最垃圾的 APP，因为在使用这个产品的过程中，遇见很多奇葩、愤怒的体验。关于这两种说法，众说纷纭，本期设计大侦探，就来全面拆解铁路 12306APP，一起来看看这个产品到底是如何设计的，用户体验如何。往期拆解：上线即爆火！3600字完整拆解微信键盘的产品设计微信键盘发布啦！阅读文章 > 一、导读1. 内容结构全文 9700 字，分为六个部分，分别是导读、产品画像、出行服务、内容服务、思考总结和后记，你可以通过下面的思维导图对本文内容快速的了解。2. 适合人群第一类，UI/交互设计师，可以跳出执行层，全方位体验 12306 的产品设计，多维度去思考和总结如何规避类似的陷阱；第二类，产品经理/运营，通过全面的产品设计拆解、体验反馈，获取产品设计参考；第三类，旅游及出行相关行业从业者，通过对 12306 的全面拆解，获取竞品设计参考。3. 分析模型第一个，增长模型。由戴夫·麦克卢尔提出，包含用户获取、用户激活、用户留存、获取收入、用户推荐，分别对应用户生命周期中的 5 个重要环节，主要用于拆分和分析产品的功能价值。第二个，尼尔森十大可用性原则。尼尔森十大可用性原则是界面设计中最基础、最重要的设计原则，任何产品的设计，都可以通过这十个原则进行指导设计。尼尔森十大原则包括即系统可见性原则、环境贴切原则、撤销重做原则、一致性原则、防错原则、易取原则、灵活高效原则、易扫原则、容错原则、人性化帮助原则，通过这十大原则，可以对 12306 的产品设计体验进行全面的校验和侦查。用超多案例，帮你掌握尼尔森十大可用性原则尼尔森设计原则是人机交互学博士 Jakob Nielsen 于 1995 年发表的“十大可用性原则”。阅读文章 > 第三个，设计心理学。包括常见的格式塔原理、费茨定律、巴甫洛夫反应、72 效应、席克定律等常见设计基础理论。万字干货！15个著名的设计心理学原理和应用深度解析！“除非有更好的选择，否则就遵从标准”你是否有在听别人说某某原理法则时一脸懵 B 的时候？阅读文章 > 二、产品画像1. 产品介绍铁路 12306 是中国铁路客户服务中心推出的官方手机购票应用软件，主要为全国各地的乘客提供火车票预定、机票预订、汽车票预订等购票业务，首个版本发布于 2012 年 10 月 16 日，根据易观千帆数据，截止到 2022 年 10 月，12306 月活跃用户人数 6,923.78 万。2. 用户画像铁路 12306 的用户群体主要以男性用户居多，占比 65.04%，女性占比 34.96%；从年龄分布看，以 24-30 岁的用户群体最多，占比 36.52%，31 到 35 岁的用户占比 24.23%，36 到 40 岁占比 20.27%，41 岁以及以上占比 10.30%；从用户消费能力看，中高消费者占比 33.48%，中等消费者占比 30.43%，高消费者占比 14.70%；从地域分布看，新一线城市用户最多，占比 27.93%，一线城市占比 19.93%，二线城市占比 19.00%，其中广州用户最多，其次为深圳、杭州和北京。3. 信息结构铁路 12306 的一级菜单包含首页、出行服务、订单、铁路会员和用户中心。「首页」主要为用户提供火车票、飞机票和汽车票的购买，其次还提供各种快捷功能入口和酒店预订等服务；「出行服务」主要为用户提供约车、酒店、订单等服务；「订单」是可查询和管理在 12306 的各种订单；「铁路会员」是 12306 的会员版块，提供车票兑换、会员活动等内容；用户中心提供个人资料管理、出行向导和常用功能等内容。4. 重要迭代记录根据七麦数据统计，铁路 12306 的 APP 首个版本发布于 2012 年 10 月 16 日，截止到 2023 年 1 月 12 日，APP 版本已经更新至 V5.6.3 版本，近一年版本更新次数为 5 次。版本重要迭代记录2021 年 9 月，发布 V5.4.0 版本，新增无障碍功能、老人及障碍人士购票更便捷，即爱心版；5. 产品生命周期作为中国铁路客户服务中心的官方购票平台，铁路 12306 距离首个版本发布时间已经过去 10 年。从易观千帆数据观察，截止到 2022 年 10 月，12306 月活跃用户人数 6,923.78 万，日均活跃人数 811.65 万。由于是国有企业运营，而且是垄断业务，12306 没有任何商业变现的压力，从产品发布时间和活跃用户人数看，目前处于产品生命周期的成熟期。6. 竞争图谱截止到 2022 年 10 月，易观千帆数据显示，铁路 12306APP 在苹果的 APP Store 应用市场 APP 总排名 71 位，旅游类排名第一，汽车火车船票预定类第一，月活跃用户人数几乎是其他 APP 的总和。三、出行服务作为 12306 最核心、最重要以及实现商业变现的服务，出行服务主要为用户提供火车票、飞机票的销售，其次还链接了众多第三方合作伙伴，为用户在出行的各种场景提供了便捷的服务。1. 票务「票务」是 12306 最核心的服务，主要为用户提供火车票、飞机票和汽车票的查询以及销售，其次 12306 还对三种产品进行了组合，推出了空铁联运、铁水联运这样的服务。① 火车票「火车票」就是为用户提供火车和动车的票务销售，用户输入出发站、终点站和时间以后，就可以进行查询，其次还支持对已购买的车票进行变更到站、改签和退票。1）售票售票页当用户输入目标站点以后，就进入了售票页。在这个页面，可以看到当天列车的所有车次，包括直达、中转、出发时间和剩余票数。在底部，有一个菜单栏，包含了筛选、耗时最短、发时最早、显示票价和候补下单五个功能，这主要是帮助用户快速寻找符合自己需求的车次，比如出发车站、出发时间等。体验陷阱这个页面的操作体验不太友好，底部的菜单栏不仅没有实现全屏手机设备的兼容，而且几乎和背景的元素贴合在一起，不够醒目，如果用户不注意，根本无法发现底部竟然还有一排菜单栏帮助用户进行高效的检索。订单页在用户选择好车次以后，就进入订单页。用户需要选择座位的系别，包括硬座、软座、二等座、一等座、特等座等。用户需要选择乘车人。添加乘车人的步骤比较简单，在输入用户的真实姓名、身份证号码和手机号码以后，即可添加成功。首次使用12306的用户需要进行身份核验，用户需要通过验证系统发送的核验信息才能添加成功。细节侦查「姓名」这里有一个非常友好的设计体验，那就是针对无法输入的生僻字、名字超过 30 个字符，以及外籍用户的极端情况都给出了详细的指导，针对用户可能出现的极端的情况给与及时的提示，这就是尼尔森十大原则中的容错原则，帮助用户从错误中恢复，将损失降到最低。在「选择乘车人」的右边，还有一个「选择受让人」的功能。这个功能有很高的学习成本，会让用户摸不着头脑。我也是通过百度查询才了解到这是一个用户权益功能，它主要是指用户可以把平时购买火车票获得的积分转让给指定的用户，积分又可以抵消火车票款，从而实现抵扣。选择好乘车人以后，用户可以进行选座，就进入了提交订单、支付费用的环节。支付页订单生成后，用户需要在付款限定时间内支付火车票费用，否则订单将会取消。其次在支付页，也向用户推荐相关的保险服务，比如铁路乘意险，又分为平安险、行运险和顺意险，主要为乘客提供意外伤害疾病身故等保险。「购买返程」其实一个非常便捷的功能，但12306设计的层级太深了，而且没有加上一键返回首页或订单页的按钮，用户如果想退回到订单页或首页，需要不断点击返回，操作路径实在太长。体验陷阱底部菜单设计了三个按钮，违反了费茨定律的设计原则。用户在这个支付页的主要目标是支付费用，但是菜单栏的三个按钮权重设计得一样高，取消订单和购买返程这两个按钮，严重干扰了用户的选择，降低了操作效率。支付成功页当用户支付成功以后，「支付成功页」为用户提供餐饮预订、出行保险、酒店入住、网络约车等服务，非常便捷。不过内容的规划比较乱，体验稍差。候补下单「候补下单」是一个非常方便的功能，这个功能主要解决在当前车次没票的情况帮助乘客自动排队，如果有其他乘客退票，就自动抢票，非常贴心。这个功能也被誉为黄牛的终结者，帮助乘客自主排队。2）变更到站「变更到站」是指乘客可以更改目标站点，进入订单详情页后，点击「变更到站」按钮，点击底部的「立即变更到站」就可进入变更页面。在变更页面，乘客可以重新输入目标站点，然后再次进入车票售票页，选中需要变更的车次以后，进入订单页提交订单，变更成功。需要注意的是，变更到站只能办理一次。体验陷阱当用户点击「变更到站」的时候，如果不注意观察页面，根本感受不出原来需要在底部菜单栏进行操作，会让乘客陷入焦躁，不知道下一步从哪里进入。其次在变更到站页面，下半部分设计了很多快捷入口，比如车站大屏、约车、餐饮特产等，把用户的注意力分散了。这两个设计都严重了违反了费茨定律和席克定律，大大降低了用户的操作效率。3）改签「改签」是指用户可以更改出行的时间，改签的流程和「变更到站」相似，进入售票页后，选中需要变更的车次，进入订单页提交订单，改签成功。需要注意的是，车票改签只能办理一次，开车前 48 小时以上，退票费为票价 5%，24 小时至 48 小时之间为 10%，不足 24 小时为 20%。退票费最少 2 元起步。4）退票「退票」是指用户可以退掉已经购买的车票，退票流程比较简单，点击退票后，进入退票确认页，点击确认退票成功。需要注意是，距离开车前 8 天以上的不收退票费，其他的时段将会根据列车开车前的时间收取手续费，最高 20%。迭代建议在用户点击退票的时候，应该出现弹窗，再次提醒用户是否确认退票，这样能避免用户误操作。这就是尼尔森十大原则的容错原则，帮助用户从错误中恢复，将损失降到最低。5）购票后当乘客购买车票后，12306 的首页会加入一个行程的版块，向用户展示最近的行程详情，其次一级菜单栏「出行服务」内容也会同步更新。这个设计非常友好，直观醒目地告诉乘客最近的行程信息，通过外部触发避免乘客忘记行程。行程页这个页面从上至下包含四个部分，头部是乘客详细的车次信息，比如出发时间、经停站、天气等；中间是车票信息，包含检票口、座位号、车次和乘车二维码等信息；接下来按乘客出行前服务、车站/列车服务和到达服务三个场景为乘客推荐其他服务，比如餐饮预定、酒店预定等服务；底部是关于出发站、到达站的天气预报信息和优惠服务等信息。细节侦查行程页把乘客的出行拆分为 3 个场景，出行前服务（提供重点客户预约、我要选酒店、我要去车站、我要订餐饮和禁带物品规定）、车站/列车服务（提供临时身份证证明、遗失物品查找、我要订餐饮和站内导航）和到达服务（遗失物品查找、我要订酒店、接站约车、旅游景点预定、投诉建议和站内导航），这就是以场景为中心的设计——将设计工作的焦点从“定义系统的操作”转变到“描述什么人将使用该系统去完成什么任务”。② 飞机票「飞机票」就是为用户提供飞机的票务销售，用户需要输入出发站、终点站和出发时间，如果携带孩子或者婴儿，还需要单独勾选。飞机票同样支持改签和退票。1）售票页售票页的内容非常简单，在头部，用户可以左右滑动选择时间，页面内容以 Feed 流向用户展示详细的航班信息，其次还为用户提供了其他出行方案参考。底部设计了一个菜单栏，用户可以进行筛选设置，还可以根据价格高低和出发时间排序。2）选择舱位选中航班班次以后，进入到「选择舱位页」，在这个页面可以查看到航班的详细信息，比如航空公司、起飞时间、值机柜台等。用户需要选择舱位等级，比如经济舱、商务舱和头等舱，选中后，即可进入预订流程。拓展阅读为什么同一架飞机同一个经济舱飞机票价格不一样？这是因为一个飞机的不同舱位实际上是不同的产品，所以座位有不同的等级，故而价格有了出入。其次他们主要的区别包括但不限于退票改签的灵活程度、出票期限和目的地停留期限等等。3）订单页在订单页，可以查看到订单的详细信息，包括收费说明、退改说明等，在用户添加乘客以后，就可以提交订单。这里需要注意一下，如果乘客携带孩子或婴儿，需要添加儿童出行人。体验陷阱当乘客勾选了「携带儿童或婴儿」的选项以后，在订单页准备支付的时候，系统提示乘客需要返回添加儿童出行人信息。但却并没有告诉乘客如何添加，或直接给出对应的功能跳转链接，这让用户点击「返回添加」后却找不到功能入口。这就违反了尼尔森十大原则的防错原则，不仅在用户犯错之前没有给出提示，犯错了还不给与指导，真的非常糟糕。③ 汽车票「汽车票」为用户提供客车的票务销售，用户输入出发站、终点站和时间以后，就可进入售票页。汽车票的订单流程非常简单，在选中客车车次以后，添加乘客支付费用后，订单即可生成。体验陷阱用户在选择「达到地」搜索框输入地名时候，应该提供模糊搜索，比如输入湖南的地名，应该为用户提示相关联的车站。④ 空铁联运空铁联运，顾名思义就是把飞机和高铁这两个产品组合在一起销售，支持用户一站式购买“飞机+高铁”的联运行程，只需一次购票、一次支付。这个功能的使用场景主要是针对出发地和目的地没有直飞的航班情况下，为用户提供飞机+高铁的转运方案。这个功能对于乘客来说，支持一站式购买“飞机+高铁”车票，可以节省购票时间，非常友好。⑤ 铁水联运和空铁联运一样，这也是一个组合产品的销售，支持用户一站式购买“高铁+水运”的联运行程。使用场景、功能价值以及操作流程和空铁联运一样，我们就不必重复。⑥ 雪具快运12306 还推出了一个雪具快运的服务，为广大旅客提供多种个性化雪具寄送产品服务，还支持随车办理或上门办理寄送服务，目的是为用户打造滑雪的新体验。「雪具快运」的操作流程也比较简单，采用预约制，选中服务后，填写用户详细信息，支付成功后，订单生成。⑦ 小结作为 12306 最重要、最核心、最复杂的功能，从这个版块的内容拆解和实操体验来看，可以看出 12306 确实已经解决被誉为全世界最复杂的抢票算法逻辑（笔者通过实操测试，几乎都能买到票），特别是在春运这种会出现超过上亿用户抢票场景，真可谓非常不容易。不过从用户体验来看，非常一般，甚至有很多不合理的设计。2. 出行出行是 12360 结合了乘客在出行的场景中潜在产生的需求设计的服务，有结合车站商家的在线点餐，有结合当地地域特色的旅游服务，还有约车、保险、酒店等服务。这些服务，多数由第三方合作方提供。① 餐厅特产「餐厅特产」是一个为乘客提供在线点餐的服务，在乘客输入列车车次以后，就可以进行点餐，支持外卖配送至列车和到店自取两种形式。这个功能设计得很友好，不仅解决乘客在乘车前的就餐问题，为车站的商家引流，还可以增加平台的变现方式。② 铁路游「铁路游」是 12306 结合旅游出行的场景，为乘客推出的一项旅游服务，包含旅游专列、跟团游、周末游和自由行等。这个场景的链接其实非常好，但是版块目前设计得比较简单，内容也比较少。③ 约车「约车」是为乘客提供接送站、接送机、打车和租车的服务。这是一个强刚需的需求，用户在出行的前后都有用车服务。为乘客提供约车服务，不仅能增加变现方式，还能方便乘客出行。通过实操体验，约车主要由第三方合作方提供服务，比如曹操出行、T3 出行等公司，为乘客提供出租车、品质专车和商务车等车型。④ 保险保险分为乘意险和出行保险。铁路乘意险分为平安险、行运险和顺意险，主要为乘客提供意外伤害疾病身故等保险，在乘客购买铁路的订单页就会向乘客推荐，乘意险价格低，保障项目包含意外身故、伤残、医疗费用、住院津贴等。出行保险由第三方公司中国太平洋保险提供，主要为乘客提供出行安心保、空铁联运险和旅程预定取消险。⑤ 酒店酒店这个版块的内容相对夯实，不仅有新客大礼包这样的用户权益，还有商旅专区、今夜甩卖、高端酒店这样的内容。甚至还设计了专门的酒店会员 VIP，包含普通会员、银卡会员、金卡会员、白金卡会员和黑金卡会员，相对其他版块而言，这个版块花了比较多的心思。⑥ 铁路商城铁路商城是 12360 以乡村振兴·帮扶推介为主题打造的一个商城，包含了帮扶专区、优选好物、兑换专区、今日特卖等内容，其次还支持企业集采，批量购买。⑦ 小结从这个版块，可以看出 12360 其实结合了用户吃穿住行的刚需场景设计了对应的服务，有自主运营也有完全依靠第三方提供。不过整体的用户体验比较差，事实上可以参考像顺丰速运、智联招聘这些 APP，通过内置小程序的形式来设计，完全可以把这些版块让第三方单独设计和维护，同时还能为用户带来更好的体验。3. 会员铁路畅行会员是中国铁路统一对外会员服务品牌，开通畅行会员不需要花钱，畅行会员主要是用于会员用户积累乘车积分、用积分兑换车票等，主要包含积分权益，兑换车票、无票候补和会员活动四大会员权益。这个页面设计得比较简陋，也没有太多价值的内容，可以看出 12306 在用户运营方面比较欠缺。4. 订单12306 的订单包含了火车票订单、餐饮订单、保险订单、酒店订单、空铁联运订单、计次定期票订单、约车订单、出站引导服务订单、铁路商城订单、汽车票订单、旅游订单和铁水联运订单多达 12 种订单，从这些订单类型可以看出 12306 的服务特别多。体验陷阱这个设计实在太糟糕，严重违反了 72 效应。琳琅满目，花枝招展，让用户在这个页面几乎迷失。更糟糕的是，当你有一个非常重要的待支付订单，这个页面竟然没有角标提醒，最终你会因为这个糟糕的设计打乱自己的行程计划。四、内容服务内容服务是帮助产品实现用户留存和运营的版块，不过从 12306 的内容设计来看，整个产品的运营手段比较少，所以我把 12306 现有设计的功能拆分为便捷功能和向导功能。1. 便捷功能以下这七个功能，对用户而言，是非常便捷、友好的功能，可以帮助用户在出行的旅途中获取很多帮助。① 车站大屏「车站大屏」是一个非常贴心的功能，通过这个功能，可以为用户提供车站的实时列车信息，非常方便。大屏详情页可以拆分为三块内容，左上角可以切换全国各地的火车站，头部还有搜索框，为用户提供车次的查询，主体内容是当前车站向西的车次信息，包含发车时间、候车室、检票口和候车状态等。1）车次详情页进入列车的「车次详情页」，可以查看当前车次的完整信息，比如检票状态、候车室、检票口和全程停靠站、停留信息。在这个页面，还提供了「关注列车」的功能（关注后并无关注数据，显得很鸡肋），以及直接预订当前车次的入口。2）车站详情页「车站详情页」就像一个站点的主页，为用户提供完整的车站信息查询。这个页面可以拆分为四块，头部可以切换其他站点，并提供当前车站的天气情况以及车站基础信息。金刚区位 8 个功能入口，包含车站车次、站内导航、重点旅游、餐饮服务、周边酒店等。中间是当前车站的起售时间和换乘时间，底部是车站附近周边的酒店精选。迭代建议这个页面把车站当做一个主体，聚合了一个车站完整的功能，其实挺有创意，但页面隐藏得很深，如果不去拆解，几乎很难发现，很是可惜。我认为完全可以提高权重，升级为一级栏目，代替会员，或者和出行栏目进行整合升级。② 站内导航「站内导航」提供目标车站的 LBS 导航，对于乘客来说，到达一个陌生的站点，需要清晰的指引，这是一个非常便捷、温馨的功能，能帮乘客解决很多问题。不过这里有一个莫名其妙的设计，那就是进入这个功能之前，系统提示请摇“8”字校准手机，事实上这里是一个加载动画，但是画面和内容却误导了用户，我甚至每次进入都傻乎乎的摇动手机。③ 临时身份证临时身份证是一个非常重要的功能，12306 现在支持 APP 在线申请，极大方便了乘客的出行。申请流程也比较简单，填写个人信息，验证审核通过后，就可以生成电子证照使用。每个人每个月有 3 次申请临时乘车身份证机会。④ 遗失物品这是一个非常贴心的功能，如果你在乘车的过程中不小心丢失物品，可以通过这个功能登记，输入你的详细信息就能登记成功。⑤ 重点旅客这也是一个非常贴心的功能，主要为老年人、残疾人服务，通过填入你的信息，列车会根据你的情况提供优先进站、协助乘降等服务。⑥ 爱心版爱心版就是长辈版，专门为中老年用户设计的版本，在用户中心切换后就可进入爱心版。整个版本设计得非常简洁，操作步骤也比较简单，对中老年用户比较友好。⑦ 英文版英文版在用户中心的设置点击语言即可切换，整体的版本设计得直接简洁，用户体验不错。⑧ 小结从这个版块可以看出，一个产品如果以用户为中心去设计，是可以为用户带来很大的便捷和愉悦体验。比如像临时身份证这样的功能，过往我们只能提前出发去车站排队办理，但如今 12306 已经把这样的痛点解决，为用户节省了大量的时间。2. 向导功能以下 8 个功能，虽然属于出行向导，不过体验下来，感觉用户体验比较差，很多功能完全无法弄懂它的设计目的是什么，显得非常鸡肋。① 快捷退票「快捷退票」这个功能的设计，让人摸不着头脑。从操作流程看，首先需要输入用户的详细信息，包括姓名、身份证号码和手机，其次需要进行人脸核验，到了第三步还需要选择车票的日期车次，在最后的退票操作页面，用户点击退款后，没有和用户再次确认就直接退票。整个流程体验下来，非常糟糕。体验陷阱这个功能和订单页的退票感受不出来有何区别？如果用户要退款，不如直接去订单页进行退票，操作步骤简单，一目了然。其次不支持自动导入用户的购票信息实在太不方便，需要通过选择车票购买日期和车次，这个设计实在让人生气和愤怒（我在体验的过程中到了第三步只能退回到订单页把购票日期和车次截图下来，又再次重复前面两个步骤才到这个步骤）。② 联系方式这也是一个看不懂的功能，进入页面后，需要用户输入乘客的详细信息，但是这个乘客信息和用户在购买车票时候需要添加到乘客信息有什么不同？更糟糕的是，当你把自己的电话号码、身份证信息填入后，系统会显示核验成功，然而当你再一次进入，页面内容还是和之前并无区别，你不知道自己是不是还要重新输一次？③ 时刻表「时刻表」主要为乘客提供查询列班车次的出发时间和到站信息，但这个功能「车站大屏」几乎已经包含了，这个功能显得意义不大。④ 查票价这个功能非常鸡肋，因为在火车票的售票详情页就可以清晰直观地查询到列车票价信息，相反在这个页面，根本无法看到价格，因为价格的字体大小只有 20px，乘客几乎很难注意到。⑤ 查代售点这个功能主要为用户提供全国各地火车票代售点的查询，不过在互联网技术发展到今天，火车票代售点越来越少了。从 12306 采集的信息来看，部分代售点缺少电话等关键信息，对用户来说，比较鸡肋。⑥ 起售时间这个功能为用户提供各车站每日的起售时间，属于一个低频功能，可以解决乘客某些极端场景的需求。不过在我体验下来，比如通过此功能查询 1 月 29 日的车票，显示北京站起售时间为 10:00，但是在火车售票版块，我也可以直接购买 1 月 29 日的车票，这让我比较疑惑这个功能的价值在哪里。⑦ 正晚点「正晚点」同样是一个鸡肋功能，而且还需要输入准确的车次才能进行查询，车站大屏已经完美可以取代这个功能。⑧ 列车状态「列车状态」比正晚点都还鸡肋，让人愤怒，因为你需要输入正确的出发地、到达地和出发时间，对了，还有正确的车次才能进行查询，这样的操作成本比下载 12360APP 都还麻烦。⑨ 小结从这个部分的内容拆解和操作体验来看，12360 的产品设计得不够细致和贴心，很多功能就像是硬生生塞进去一样，滥竽充数。其次从他们的产品迭代记录次数可以看出，近 1 年更新时间只有 5 次，也许每一次都是在做加法，没有想过做减法，所以导致这部分的功能显得鸡肋而且有很大缺陷。五、思考总结通过对铁路 12306 的全面拆解，接下来我将从内容层、功能层、体验层和视觉层进行总结。1. 内容层12306 整个产品的内容设计，用一句话总结，可以归纳为——心有余力而不足。可以看到12306围绕乘客购票、出行的潜在需求场景都设计了对应的服务，比如酒店、约车、点餐、商城等，甚至还有空铁联运、铁水联运这种多场景的组合售票方式，不过在实际的版块内容打造中，则显得比较空洞，体验一般。这个产品，可以说几乎没有创新点，这主要也是由于它是由国有企业设计运营，背景极其复杂，设计目标也飘忽不定。2. 功能层在 2015 年之前，铁路 12360 承担了被誉为历史上人口迁移最大的春运的抢票工作，那时候一票难求，春运去 12360 就像是一场噩梦。不过在经过多年的升级和优化以后，目前 12360 的购票效率非常高，经过笔者多次的测试和调研，目前通过 12360 购票已经不再是难事。而且还设计了候补抢票这样的功能，帮助用户解决买票痛点，可谓非常贴心、友好。3. 体验层铁路 12306 的用户体验，非常一般，我在这次的产品拆解中至少侦查出了 20 条体验陷阱，这些陷阱都会给用户带来极其糟糕和愤怒的体验。比如让我像个傻瓜摇动手机的站内导航载入页，这完全就是把用户当成傻子一样看待，其次还有一堆数不清的鸡肋功能，对用户的操作体验造成了严重的干扰。我甚至认为爱心版和英文版比标准版使用起来更愉悦，更能减少我的焦虑。4. 视觉层作为一个 UI 设计师，在拆解 12306 的产品过程中，我对整个产品的设计感到绝望。首先，没有做到统一性，整个产品毫无设计规范，比如卡片的圆角、品牌色、版块间距根本不统一，这样的视觉体验一眼望去就非常糟糕；其次，图标、活动图、橱窗图以及详情页的设计毫无美感，满满的山寨 APP 风格，特别是订单页的 ICON，花花绿绿、琳琅满目，连最基础的统一都没有做到。六、后记作为一款国民级用户 APP，铁路 12306 仿佛陪伴了 80、90 后的青春。还记得 10 年前老家是黑龙江和河北的大学室友，每年春运开启之前就为了回家的火车票犯愁，不仅要去遥远的火车站排队，很多时候还可能空手而回，那便是最初对 12306 的记忆。如今十年过去了，12306 解决了亿万人的出行抢票需求，让我们在春运的路上，可以轻松购买一张回家的票。但下一个十年，我更希望 12360 的产品团队，可以重视用户体验设计，让我们不再掉入那些体验陷阱。参考文献：易观千帆-铁路 12360APP 数据分析七麦数据-铁路 12360APP 数据分析中国铁路 12306 官网尼尔森十大原则《设计的陷阱：用户体验设计案例透析》- 乔纳森·沙利亚特欢迎关注作者微信公众号：「设计大侦探」本篇来源：优设网原文地址：https://www.uisdc.com/12306-app
图标 用户 标签 今天和大伙分享一个非常不错的产品，那就是爱彼迎。爱彼迎（Airbnb）是一个出租住宿民宿的网站，提供短期出租房屋或房间，让旅行者通过网站或手机发掘和预订世界各地的独特房源，为近年来共享经济发展的代表之一。我第一次用爱彼迎产品的时候，发现爱彼迎用户体验、设计都非常的不错，给人感受专业、舒适、信任带有设计追求的产品。虽然爱彼迎今年已经退出中国市场，聚焦出境游业务，但是爱彼迎的产品体验有很多点值得学习，今天我将从 12 个维度进行分析。往期产品拆解：文档类产品解题宝典！24个细节全面拆解Notion一、前言Notion 是一款融合笔记（Notes）、任务（Tasks）、知识库（Wiki ）以及数据库（Database）的 all-in-one 生产力工具，产品主要服务于互联网群体。阅读文章 > 一、品牌理念从这张图我们清楚看出爱彼迎符号融入了人、地点和爱的品牌愿景。爱彼迎说任何人都可以画出的心形，超越了语言和文化，颂扬了爱彼迎的热情好客精神，而热情好客的新调色板则反映了人们的开放心态。爱彼迎的品牌色红色更好的传达了爱、热情好客品牌理念。二、品牌符号我从 App Store 找到最新的爱彼迎的 logo，发现爱彼迎的颜色有所变化，偏向粉一些的红色，更具有活力的颜色。爱彼迎的 logo 好看是有原因的，我发现图标是由三角形区域中设计的，导致图标给人的感觉很稳，同时利用简洁的线条进行图形绘制，非常不错的符号。例如日本三菱的 logo，也类似这种设计形式，虽然是三个菱形组成，但是都是在一个三角形下进行设计，显得非常的稳。同时我发现跟名字也有关联，菱字和菱形的关联。非常的经典、克制、耐看，从小就很喜欢这个 logo。三、启动页每一个 app 都有启动页，而爱彼迎用浅灰色的 logo 作为启动页。感受最深就是这个 App 没有广告，保持最纯粹的页面。四、首页设计爱彼迎首页目标非常的明确，顶部卡片利用大投影使得视觉层级是最高的，同时配上红色大按钮“搜索房源”的描述来提高用户的点击效率。五、卡片设计爱彼迎卡片设计非常有细节，banner 的比例是 3:2，用户的头像在图的右方，做了一个破形处理，让户主和图片关联起来，非常有创新的布局，让平庸的界面更加设计感，同时大部分用户都是右手操作，头像在右下角，在操作的热区，体验会更佳。六、标签细节爱彼迎标签一样很有细节，重要的标签颜色和普通不一样，重要标签是棕色色值而普通标签只是浅灰色，有个层级的对比。标签的左右安全距离保持一致，当字数有变化的时候，标签感受和规范是一致的。七、透明细节爱彼迎评分标签背景是带一点透明度的，如果用纯色会突兀，而有透明度显得界面通透、清新。右上角爱心图标白色描边+黑色透明+微投影，为了更好兼容白色图片和黑色图片。八、布局细节爱彼迎首页下滑有一个探索全球奇屋，全屏都是美丽的民宿，采用瀑布流的设计布局，图片之间错开展示，自适应的高度设计，头部大 banner，下面配上小图，具有节奏感。左上角按钮大小高宽的点击区域大于 88px(基于 2 倍图）体验非常的好。九、沉浸式体验点击进入民宿，主图铺满 3/4 的手机界面，用户可以进行左右滑动查看民宿图片细节，用户还可以上下切换名宿，整体给用户沉浸的感受。当用户点击喜欢的按钮，界面的背景色黑色变成彩色背景，给用户明显的感知。我发现这些介绍页面可以翻译成中文，也可以显示原文（葡萄牙语）对应各国国家爱彼迎又做了对应的翻译处理，作为用户是非常的友好，能完全看的懂，满足国际化设计。十、弥散色彩爱彼迎有几处用了弥散的色彩，例如选择感兴趣的民宿，背景会加入一些弥散色彩做一些设计区分。个人中心也会在背景上用品牌色作为弥散色彩进行设计，让页面更加丰富。弥散光设计！网易阿里大厂都在用的刷屏级新设计风这阵子不是有一种设计流行风悄悄刮了起来嘛！阅读文章 > 十一、图标设计发现爱彼迎的图标都是灰色线性图标，同时每一个风格的民宿会专门赋予一种图标，保证了图标的一致性。线性图标的优点是简洁、高效，减少对内容的视觉干扰，能给用户带来极致的感受。想绘制线性图标，这里有 6 个前辈为你踩过的坑我们作为 UI 设计师，一开始入门接触最多的就是图标，而现在很多设计师都钟爱线性图标，导致很多新手设计师也跟随主流的脚步选择线性图标去设计，但是线性图标是不是真的像我们看起来那么简单呢？阅读文章 > 十二、字体设计仔细的人会发现，爱彼迎专门为自己的 APP 设计了数字字体和英文字体 airbnb-cereal-font，字体比较时尚、粗壮，特别应用在标题、评分、价格重要信息上具有很好的识别性。字体也可以给产品提高品牌性，形成差异化。总结品牌符号可融入企业的愿景和理念。品牌色的选择好的话，可以达成差异化。为 APP 打造一款数字字体和英文字体可以提高产品的品牌性。破形的设计还可以运用在 APP 的布局中，会有创新性的效果。整个 APP 的图标风格需要保持一致，这样用户的感受是一致的。图片的清晰、美观、高雅可以给整个 APP 提高美感，这个需要根据 APP 的定位来确定。感谢大家阅读～～ 关注黄小伟设计，分享好的设计。本篇来源：优设网原文地址：https://www.uisdc.com/airbnb-design-2
问卷 用户 目标 用户问卷是交互设计师工作中常用的设计工具。本文为你介绍一些接地气的实操经验，相信会让你的用户问卷更有效。更多问卷设计干货：如何设计高质量B端调研问卷？高手总结了8个步骤（附模板下载）编者按：B端设计的调研问卷该如何设计？阅读文章 > 一、问题围绕你的调研目标好的调研问卷如同好文章，是有「中心思想」的，也就是你的「调研目标」。调研目标决定了调研问题的内容和数量。你需要先把想要获取的数据和信息整理出来，并分出主次。目标内容不宜太多，通常 1-3 点。接下来再根据目标来设置问题。问题始终围绕着调研目标，不偏题，也不增加累赘内容。二、问题排列有逻辑，由浅到深问题的设置和排列要有逻辑。循序渐进，对于被调研用户来说更易阅读和理解，思路会更连贯，也不会太累。比如你可以尝试使用或结合以下排列方式：按照问题复杂度来排列，由简到难；按照问卷的填写方式来排列，单选 多选 填写；按照产品功能或操作流程来排列，从第一步到最后一步。三、隐私信息，非必要，不收集很多问卷在开篇的经典问题就是：您的年龄、性别、从事行业等等。要注意的是，这类信息要根据产品特征和调研目标来判断是否有必要收集，减少对于被调用户隐私的打探和要求。至于将这类问题放在问卷的开端还是结尾，你也可以权衡一下利弊：放在问卷开端：这类问题对于用户来说是最容易回答的简单问题，可以有效帮助用户进入问答状态。适用于问题比较复杂的问卷。放在问卷的结尾：这类问题与用户隐私相关，放在最后一定程度上会减少用户的安全顾虑。适用于问题比较简单的问卷。四、问卷用语要保持中立和客观问卷的语句尽量减少诱导性用词，尤其是避免使用表示观点的形容词。保持中立和客观，避免用你的观点来左右或影响用户的观点。举几个简单的例子：“您认为这个功能是否很难用？” 就不是个好问题，你可以使用 “如果您对这个功能评分（10100 分），您会打多少分？” 来代替。“您认为我们的产品与 XX 产品相比，优势有哪些？” 也不算是个好问题，可以将 “优势有哪些” 改为 “有哪些不同”。五、化繁为简在各个方面都要化繁为简，包括：问题要少：问题太多被调研者会失去耐心，做出的答案也不会有效；语言要精：尽量精减用词，减少用副词、形容词做不必要的描述；形式要轻：易于传播、触手可得。最好是在用户吃饭、通勤时用手机即可解决；用时要短：减少输入和操作的时间，尽量用选择代替输入填写，不要让被调用户填写太多字。六、发问卷前先做预测试当局者迷，旁观者清。长时间的投入在问卷的编写中，你对语言的敏感度会变得不稳定。问卷写好后可以先找同事或朋友做预测试，可以重点检查以下内容：问题的涵义和要求：有时你认为自己解释得很清楚的问题，对于他人来说可能并不好理解。语句的通顺性：语言是否流畅通顺，语法是否存在问题。标点和错别字：使用的标点符号和错别字都需要检查和校验。七、筛选有效的调研用户有条件的话可以对用户进行有针对性的筛选，可以根据问卷的主题、问题的类型和你想要达成的目标来进行用户选择，这样做可以减少后期对于干扰数据的清理难度。欢迎关注作者微信公众号：「长弓小子」本篇来源：优设网原文地址：https://www.uisdc.com/7-questionnaire-design-skills
文案 用户 产品 讲到 UX 文案，大家可能并不陌生：一个按钮、一个弹窗的文案填充，我们几乎每天都要与他接触。但即便如此，大家对他的态度通常是得过且过的：“文案嘛，有了就行，看得懂不出错就好，没什么值得注意的”。确实，作为设计师，我们关注交互流程、视觉呈现，但 UX 文案似乎从来不是我们的首要考虑；在很多时候，文案与我们的设计流程是分裂的：要不就是设计完成后再填入，要不甚至直接让产品经理来提供文案素材；文案撰写，好像从来没有被我们真正重视过。但 UX 文案真的只是一个无足轻重的辅助位吗？更多UX文案干货：4000字干货！9个方法帮你掌握UX文案写作相比美观的视觉设计，清晰的文案在界面呈现中同为重要，好的文案不止赋予产品更好的体验，也能够拉近用户与产品的距离，优化文案也常作为可用性测试后改良产品用户体验的落脚点。阅读文章 > 一、UX 文案的重要性首先，先抛结论，UX 文案并不是无足轻重，相反的，它是好的产品体验中不可或缺的一部分。并且随着时代的发展和新兴应用场景的涌现，它对于产品体验的重要性正直线拉升。在我们还将 UX 文案看作一个可有可无的流程时，一些先进的企业就有远见的意识到了它的重要性：早在 2017 年的 I/O 谷歌年度开发者大会上，三位职业 UX 文案作家就向我们展示了 UX 文案如何切实地为谷歌带来了产品数据的提升：在用户在搜索”酒店“相关内容时，谷歌将直白的文案 “预定房间” 改为了更贴合用户心智的 “查看房源情况”；这一小小的改动，带来了17%点击量提升。随着 UX 文案的价值不断的被发掘，在海外，已经有越来越多的团队将 UX 文案写作作为一个细分的的独立专业来看待。例如，在国际最大的旅游电子商务公司之一 Booking.com，曾在不到一年的时间里增加了 40 名 UX 文案岗位，达到了每 5 或 6 个设计师中就有一个 UX 文案设计师的夸张比例。二、 重新认识 UX 文案面对海外对于 UX 文案的重视度激增场面，我们心中可能不免疑惑：“不还是为页面配文而已吗？平常不起眼的工作，怎么现在就好像突然变特殊了呢？”。存在这样的误解，是因为我们对 UX 文案的认知还停留在过去，始终认为它仅仅是一个辅助位，最多起到“锦上添花”的作用，并不能真正影响核心用户体验的好坏。而实际上，与我们印象中的边缘形象不同，UX 文案（UX Writing），也叫内容设计（Content Design），所涉及的知识横跨体验设计、内容策略、用户调研，是一个多元的、完整的设计学科；旨在基于同理心与专业沟通技巧，通过合适的文字信息，在产品使用过程中为用户提供愉悦的体验，远不只是“为按钮填词”这么简单。而随着时代的发展，UX 文案的覆盖范围、呈现方式以及工作流程等都已经发生了巨大的变化；站在设计师的角度，我们希望通过以下几个方面介绍 UX 文案与过去相比发生了哪些变化，来帮助大家消除对 UX 文案的刻板印象，重新认识它在我们设计中扮演的角色，并学会运用它为用户呈现出更加优秀的产品体验。1. 从「文字」到「语言」首先，如今的 UX 文案有着比之前更广阔的范畴：过去关于文字，如今关于语言。以前，我们讲到 UX 文案，指代的可能只包含 APP 里的标题、按钮等静态文字；但如今，随着智能家居、智能车机等新兴领域对于语音交互能力展现出的强需求，以及类似喜马拉雅等播客产品的持续火热，UX 文案已经慢慢跳出了文字的范围，有了更广阔的发挥空间。想象一下，当你结束疲惫的一天回到家时，你的智能家居助手应该以怎样的语气向你问好？应该使用什么措辞能最精准地得知你的意图？这些动态的、无实体的语音内容，也逐渐成为 UX 写作要关注的重点内容。简单说，如今所有用户和产品产生交流的场景，都可以划分于 UX 写作的范畴。得益于科技的发展，UX 写作逐渐地更接近了自己最终的目标，慢慢跳出了静态页面的框架，得以真正的与用户产生有意义的、愉悦的语言的交流。2. 从「填充页面」到「主导页面」其次，UX 文案与过去最显著的不同之一是：不再仅是为页面填充文本，更多的是根据信息主导页面。以下面一个常见的对话框为例，仅有一个小小的对话框来承载超额的信息；如果根据之前的“填充页面”的观念，我们要做的其实很简单，就是根据行文规范删减、重新排列文字，试图把过量的内容塞进小小的容器。这样得到的结果在视觉上看起来可读了一些，但似乎也不尽人意。这就是典型的机械性的填充页面，信息的展现完全受制于已给页面的结构，实际上已经脱离了更好传递信息的初衷。如果我们调转思路，试着真正从传递信息本身出发，就能很明显的发现，原来的对话框最大的问题不是文字长短，而是信息过载---强迫用户在有限的空间里一次性确认两类信息：更改时间和通知参会人。而在我们上面的方案里，这个问题并没有被解决。当我们真正开始用信息主导页面，应该做的是将一页多个问题拆分为每页一个问题，分步响应用户，对冗杂的信息进行分解，以真正创造清晰有效的对话。如果体验没有达到理想的效果，通常需要改进的是整个设计，而不单单是文字。我们需要逐渐去理解的是，页面在根本上是信息传达的媒介，一昧的修改文本来适应页面，反而是本末倒置的做法。3. 从「单纯可用性」到「体现品牌声音」目前，UX 文案通常仅需要保证基本的功能可用性；即使是已经有文案规范的团队，更多的也是将其作为辅助位，保证文案“有一致性，不出错”即可；对于品牌形象、差异化的诉求则基本一笔带过。相较于 UX 文案，大家习惯用 Icon 的质感、品牌色的搭配等视觉的呈现去传递品牌声音，因为这样的效果简单直观，是可以直接被“看得见”的，这点无可厚非。但随着语音交互的兴起，以及近年来轰轰烈烈的品牌去色化趋势，单纯的利用纯视觉的呈现来塑造品牌形象变得没那么万能了，与此同时，UX 文案对于品牌形象的重要性也逐渐被发掘；我们发现，在很多时候，一句措辞得体的语音信息，或者是一句抓人眼球的标语（Slogan），就足以弥补视觉上品牌呈现的缺憾，甚至更能与用户产生共鸣。这就需要 UX 文案在保证基本的可用性的基础上，更要考虑什么才是真正适合自己品牌的声音。例如Google Earth 过去的一句经典的标语：“Hello, Earth”，这句标语完美的契合了Google Earth的品牌形象，它简洁正向，并且和产品名称之间有巧妙的双关，即代表了产品本身，也暗示了Google Earth带领用户去探索世界的功能定位。仔细观察苹果、谷歌的产品，你就会发现从他们的 UX 文案除了保证了基本的一致性和可用性外，偶尔会隐藏一些小巧思，这些小巧思与他们的品牌形象相互呼应，能让用户在产品使用中潜移默化地对其品牌形象、产品价值观形成认知，而这样与产品体验本身结合的认知构成往往更加坚固，比传统的广告宣传更容易让人信服与认可。三、 怎样做得更好，一些实用小 tips随着 UX 文案越来越广阔的范畴，我们过去熟悉的工作方法已经并不完全匹配如今 UX 文案的目标了；因为它包括的已经不仅是单纯的文字内容，更多的还有文案之间的层级结构、什么时候出现这段文字，以及这段文案向用户传递了什么情感等等，这已经超出简单的行文规则所涵盖的了。那么，我们怎么才能真的做好 UX 文案呢？我们根据以往的项目经验，总结出了除了通用行文规则之外，三个在关键节点上可以做到的几件小事，希望帮助大家能找到真正适合、高效的设计方法，并打造出优秀的 UX 文案。1. 流程——更早地加入首先，最基本也是最重要的：在流程上，永远要尽早的考虑文案问题。我们过去熟悉的设计步骤是：“先把产品设计好，将有文字的地方空出，最后再填充。”这样带来的问题是：关键的体验问题直到最后期才会被注意到，留给 UX 文案的发挥空间十分有限，能做的只是为糟糕的体验贴上掩饰的创可贴，并不能真正避免糟糕体验为用户带来的伤害。正如我们上面所说，UX 文案不仅仅是填充文字，它的核心是在产品与用户之间创造合适、愉悦的对话，所涵盖的内容几乎横跨产品体验的每个流程。因此，要想真正缔造好的 UX 文案，永远要尽早地参与到设计流程中，这样才能真正的找出体验的问题，并最大限度的发掘 UX 文案究竟可以为此做些什么，创造与用户真正有效的交流。2. 方法——模拟真实的对话其次，在我们着手输出 UX 文案时，请尽量在脑海中模拟真实的对话场景。这个方法来自于最近的全球开发者大会（WWDC22）上，苹果设计团队向大家分享的 UX 写作方法框架：“PACE”：Purpose（目的）、Anticipation（预判）、Context（环境）、Empathy（共情）。其中，在 Anticipation（预判）里提到了 “将 UX 文案想象成一种对话” 的概念，意思是在设计产品的过程中，应该把页面上的文字看作一个与用户的对话，而不只是一个静态的短语；这样能更好的帮助我们预判用户的诉求。想象在这样的场景：当你的用户在周末的晚上打开手机，开始调节明早起床的闹钟时间；你会怎么设计这里的 UX 文案呢？使用流程似乎很简单：打开闹钟 app，调节明早闹钟时间，确认设置完成。上述的交互没有问题，用户可以清晰的完成设置。但如果考虑到上面提到的 “想象成一种对话”，那这个流程就还有可改进的地方。因为在一段有效的对话中，交流应该是有来有往的：其中的角色应该有时在聆听，有时在发言；而不应该仅仅一方是单方面的输出（在上述的场景里，仅仅是用户一股脑的对闹钟 app 进行信息输出，闹钟 app 只是单纯的服从命令，这不是一个正常对话的模式）。让我们想象是自己在跟用户在交流，就能很容易地发现用户想传递的底层信息并不是 “我要调闹钟了 ”，而是 “好不容易到周末了，我明天要多睡一会”，能解读到这一层话外音，我们就成功利用“对话”预判了用户的目的。打开 ios 的起床闹钟试一下，你会发现它比我们的基础流程多了一个贴心的询问 ：“你要将此更改应用到这个定时中的所有周末吗？”；在这里，苹果实际上做了两层预判，第一层是预判绝大多数人的周末和工作日起床时间是不一样的，所以将复用的范围限定在了周末；第二层预判是在大多数情况下人们只能确认明天的起床时间，所以主选项是“仅更改下个闹钟”。简单的一个改动，就把机械性服从命令的程序，变为一个有智慧、思想的助手。如果我们在每次输出文案时，都能试着想象真实的对话并剖析，可能就能逐渐把一个“可用的产品“变成“贴心的朋友”，真正地走进用户的内心。3. 验证——大声地念出来！最后，如果你还是觉得心里没谱，不确定是否输出了合适的文案，有一条被苹果和谷歌共同推荐的验证方法，简单粗暴但有效，那就是 “大声将你的文案念出来”。就像我们刚刚反复强调的，UX 写作其实就是与用户创造有效的交谈，那么最简单的验证方法就是真正说出来，将它真正变成一段对话，然后再去聆听，最直观的感受到你的语言听起来是否自然不生硬？是否有一些不易察觉的重复或语法错误等等？大声地将你的文案念出来，如果能使你自己信服，相信也能使你的用户信服。结语最后，读到这里，相信你已经对于 UX 文案有了一个全新的认识，并对如何做好它有了基本的概念。其实在日常工作中，每个产品对于 UX 文案的要求可能不尽相同，但重要的是作为设计师，我们能意识到他逐渐攀升的重要性并真正对他加以关注。引用苹果开发者大会上的一句话：UX 写作其实就是始于对屏幕另一侧用户的好奇心，并真正怀着尊重和理解与其交流。只要能意识到这一点，相信大家都能呈现出真正有效的、令人愉悦的 UX 文案。参考文献「1」《Material‘s Communication Principles:Intro to UX Writing》by Alex Hays： https://codelabs.developers.google.com/codelabs/material-communication-guidance#0「2」《What Does a UX Writer Actually Do?》by Yuval Keshtcher: https://careerfoundry.com/en/blog/ux-design/ux-writing-what-does-a-ux-writer-actually-do/「3」《What is UX writing?》by Bobbie Wood: https://uxcontent.com/what-is-ux-writing/「4」Google I/O 2017《How Words Can Make Your Product Stand Out》: https://www.youtube.com/watch?v=DIGfwUt53nI&t=1163s「5」Apple WWDC 2022《Writing for interfaces》: https://www.youtube.com/watch?v=GRYJq0V1I_k&t=505s「6」Figma Config 2022《Working with UX Writers in Figma》: https://www.youtube.com/watch?v=pEpwOzPU1zY&t=535s欢迎关注作者微信公众号：「腾讯ISUX」本篇来源：优设网原文地址：https://www.uisdc.com/reintroduce-ux-writting
用户 数据 产品 在这个信息数据化时代，作为交互体验设计师的你一定遇到过这样的问题：在复杂的 B 端产品中，由于企业级用户的特殊性，很难获取产品落地后的数据，难以完成设计验证；可用性测试、用户访谈等测试工具成本过高，开展实施比较困难；刚刚完成上线的新产品，如何更快更好地收集用户数据和反馈……这些问题很常见。本文将为你介绍 3 种方法，告诉你当面临以上这些情况时，该怎样发现产品自身的问题以促进体验提升，又该怎样完成设计闭环。相信会对你有帮助。更多获取用户数据的方法：7个接地气的实战经验，帮你学会做用户问卷！用户问卷是交互设计师工作中常用的设计工具。阅读文章 > 一、数据的获取方法1. 在产品中增加反馈渠道要知道，用户反馈的复杂信息、使用疑惑和问题，在经过处理和提炼后也会变成有效数据。你可以在上线的产品中增加「用户反馈」入口，鼓励用户在使用产品的过程中直接反馈使用体验和意见，可以尝试以下方法：（1）主动引导用户进行反馈：在用户刚进入产品或完成某些关键性任务后，使用 banner 或悬浮按钮等方式，吸引用户反馈问题和感受。这种主动式引导不宜太频繁，形式要简单，并且要结合场景。例子 支付宝 App 在用户截图之后才弹出悬浮按钮，是因为产品推测用户在操作的过程中可能需要求助，这时的反馈往往是真实的有效数据，用户的填写意愿也会更强：（2）轻量级问卷投放：在产品中使用弹窗、链接等方式，选择合适的用户进行投放。由于是在产品内设置的轻量级问卷，所以要注意：明确调研目的，针对某个关键性的问题进行设置；问卷篇幅要短，简洁精炼，一次 3-5 个重点问题即可；进行分类投放，对不同的用户群进行区别和分类调研，避免混淆数据；填写形式简便，减少被调研用户的输入时长，尽量用选择代替输入；尽量结合场景，同用户反馈的引导一样，问卷也需要尽量结合产品的应用场景，调动用户的填写意愿，避免用户路径的打断。（3）利用社群触达用户：在产品中增加社群二维码，用户可以通过扫码进群交流，也可以利用社群定期推广一些活动，给用户一些反馈奖励，保持与用户近距离沟通。2. 产品内的数据监测在产品内部增加用户行为和数据的监测功能。很多大厂都有自己的数据监测平台，现在也有不少第三方数据监测平台和机构，可以提供数据埋点及用户行为监测服务。如果成本有限，设计师也可以求助开发利用一些代码和插件，在产品页面中的关键节点进行「埋点」的设置。这些「埋点」是对用户行为过程及结果的记录，即用户在什么时间做了什么样的事情。用户的所处位置、场景甚至是可能的心理预判，都可以被埋点记录下来，为产品交互提升和改进提供依据。3. 模拟用户操作行为设计师可以通过对用户行为的模拟，为自己设定一个需要完成的任务，测试产品的实际用法。不仅仅是设计师本人，其他的同事也同样可以被邀请来做模拟测试。在测试中需要注意：根据产品功能的不同类别有针对性的选择与用户类型相似的人进行模拟测试；设计师要有充分的共情能力，即使对产品已经有一定的了解，也要尝试猜想和假设用户的心理和可能会遇到的问题，模拟出用户所处的真实情景。例子 工业设计中经常会用到的共情设计方法，有时会借助一些模型和工具来模拟用户的感受和场景。下图为设计师模拟老年人手部关节退化，不能正常弯曲后的生活状态，以更好的为老年人做产品设计：二、关于数据的两个常见问题Q1：在面试和作品集中没有数据展示，是不是就不能证明设计价值？很多同学认为，面试官判定设计作品的价值时会以产品的数据作为依据。这个说法不是很准确。数据的展示是从一个侧面反映你设计成果的价值。但没有数据指标，并不代表你做出的设计不是好设计；另一方面，就算你拿出完美的数据，你的设计成果质量不高，数据是靠运营和商业模式跑出来的，也不一定能证明你的设计能力。因此我的建议是，能抓到数据就尽量去抓，抓不到数据也无妨，面试时实事求是的回答，再加上你对数据作用的认知和看法即可。你可以将重点放在设计的逻辑和理论支撑上。Q2：验证 B 端产品的设计价值，通常需要用到哪些数据指标？不同的产品，设计的发力点和其所解决的问题是不同的，所带来的设计价值就会不同，相对应的评价标准和数据指标也会有变化。更多数据分析术语和模型：这5组难理解、易混淆的数据指标，看完这篇就学会了！本文将设计师难理解易混淆的数据指标进行详细的讲解，方便大家了解并掌握。阅读文章 > 用6个章节，帮你掌握常见的数据指标和数据分析模型一文读懂设计师应该懂的数据指标和数据分析模型。阅读文章 > 欢迎关注作者微信公众号：「长弓小子」本篇来源：优设网原文地址：https://www.uisdc.com/get-user-data
用户 条件 平铺 引言筛选作为一个常用的功能，在产品设计中的应用面是非常广的。比如我们去购物，会选择销量高、价格实惠并且包邮的商品，筛选区的设计就便于用户进行数据的查询和定位，可以快速查询到满意的商品。本文就筛选这个话题展开了分析和探讨。更多B端干货：4000字干货！手把手带你掌握web中的表单设计前言表单是我们生活中常见的信息添加、录入的方式之一，如何进行表单的设计也是 B 端设计师的必修课。阅读文章 > 一、筛选简介筛选，也可以称作过滤器，它属于搜索框架的一部分主要用于内容提取，将一类数据展示，一类数据隐藏，同时可以整合很多的组件。在 B 端设计中筛选存在的对于整个表单来说是非常重要的，它可以帮助用户，在茫茫的表单数据当中进行快速的定位；可对表单进行快速划分，缩短用户对于数据的寻找时间；能够满足用户在工作中，实际业务场景的筛选。二、筛选的展示类型筛选区常见到的有搜索、条件筛选这两类控件。搜索和筛选虽然同在筛选区，但是二者还是有所差异的。搜索：需要通过查找搜寻获得的。在 B 端系统界面设计中，搜索是通过指定任意条件，系统对此条件进行检索后，展示相对应内容，功能偏主动性；条件筛选：好比一个个筛子将物料进行粗细料分离的一个过程。条件筛选是系统提供指定各种条件缩小范围，可以选择查找不同条件的内容，功能偏被动性。无论被动性还是主动性，搜索和条件筛选这两个功能都是让用户使用某个条件对内容进行区分，从而找到用户想要的内容。二者在功能上相辅相成，在 B 端系统的页面中仅靠搜索或者筛选作为内容筛选都是不够的，这就需要组合筛选区了。1. 搜索筛选精确搜索这种方式搜索准确率高，所要即所得。但需要用户自己输入，然后进行查询。需要记忆搜索详细信息。输入框需要有提示输入的内容，方便用户填写，以及确认输入的类别或格式。适用于用户有清晰的目标，同时需要有查询/搜索按钮，来执行筛选。搜索可配合筛选固有类一起使用。模糊搜索模糊搜索可以用于搜索关键字的同义词，提高搜索的精确性。字段匹配推荐搜索结果，减少记忆负担，适用于不明确的信息筛选。但是会筛选出很多类似相关的内容，需要查找鉴别所要内容，不便捷。适用于用户对目标模糊，模糊是指不用关心输入了什么格式，哪怕错了，系统也会推荐给用户相对正确的；用户需要浏览操作过滤器提供的信息来辅助筛选达到目标。同时也可配合筛选固有类一起使用。2. 条件筛选下拉筛选这个筛选的优势是页面的空间利用率高，同时下拉起到了很好的收纳作用，不占据页面空间。但由于下拉的局限性无法观看到所有的筛选字段，需要操作点击查看。固定选项类，适用于下拉的筛选字段选项有限，并有明确的总结分类。这种操作起来便捷，降低用户的操作难度。一般情况下需要“搜索/查询”按钮，但是也有的产品是勾选即执行的。需要结合具体的使用场景去判定。矩阵（平铺）筛选用户可以直接看到筛选内容，支持输入更多筛选条件，减少操作步骤提高了用户筛选的效率。但平铺的筛选类目占据页面空间较大，空间利用率低，信息量过多都是重点等于没有重点，增加用户的决策时间，不适合选项太多的情况。平铺筛选控件的普适性为最强，当没有其他更好想法时，用平铺总是一个好的选择。需要注意的是，筛选条件不要过多（遵循 72 法则）。表头筛选通过表头的点击，简洁、直观地筛选当前表格列。但只能筛选当前列的内容，筛选字段比较少，筛选形式比较单一。每个表头都会有筛选的 icon，影响用户对于表头的识别。表头筛选学习成本最高，且和表头排序容易冲突，筛选值展示也不够直观。表头筛选类似 Excel 表格的操作，是一种相对高级的交互，适合表格列比较单一内容的筛选。TAB 筛选筛选条件一目了然，交互步骤少，一个 Tab 标签代表一个纬度，平铺展示筛选内容方便识别，学习成本低。但 Tab 标签筛选字段数量有限制，不宜过多，分类需覆盖选项，并且保证每一项没有交集，空间占用多、不够灵活，对用户自定义项支持较差。适用于 Tab 标签切换一般用于和时间、状态的流转有关，且没有交集的数据内容（可以是同性质，也可以是不同性质）。权重高，选项值不超过 5 个。3. 组合筛选在 B 端系统表格类页面中，字段属性很多，简单的检索方式很难准确定位到目标数据，所以在实际使用当中，常会将大量非交叉关系的属性进行罗列，搜索、筛选、TAB 标签切换组合出现，形成多属性的组合检索。而筛选项互相组合，其展示方式有如下几种：平铺式优点：用户能直接看到选项内容，方便用户识别选项，且提高了用户筛选的效率（节省了筛选操作），大而全的筛选字段最大限度避免筛选条件遗漏的问题。缺点：筛选项多会占据大量页面空间，信息量过多都是重点等于没有重点，增加用户的决策时间，不利于表格数据的直观展示，此类型一般配合“勾选即执行”使用。适用从各个维度筛选的场景，多维度筛选对信息筛选的颗粒度需求不一致，同时希望备选项被选中。折叠式折叠式筛选是平铺式筛选的改进，一种简单直接的筛选形式，对平铺的筛选项进行收纳，如果多属性组合检索中的一部分检索条件不是高频率使用的，但又是必须存在的，可以通过折叠的方式将这部分筛选字段隐藏起来，高频筛选字段外露。适用于折叠低频筛选，显示高频筛选，能满足大多场景下不占用太多空间。针对有更多筛选需求的用户也有更好的引导性。三、筛选的反馈筛选区有两种不同的反馈模式：数据实时更新反馈和数据手动更新反馈。数据实时更新反馈界面将与所有设置的筛选相匹配并对结果进行实时更新。这种模式的优点是在执行筛选时为用户提供了一种方便简单的体验，可以在每次点击后立即看到结果。适用于较低风险的交互，一旦处理多选过滤器或更复杂的输入时可能会造成混乱。当然还需要考虑处理数据的多少，如果应用中数据量巨大，每次更新时间较长，反而会降低用户的使用效率。手动更新反馈在手动更新反馈模式下，过滤结果只有在用户点击查询时才会更新。如果用户想在每次更改后查看结果，必须单击查询按钮。这种模式适合多纬度复杂的筛选，所有筛选字段设置完毕之后，统一执行操作，和实时反馈结果相比降低筛选等待时间，尤其是在大量数据进行筛选中，优化了用户体验。四、筛选要注意的问题什么情况不适合用筛选？选用筛选组件的前提是信息能被清晰分类。如用户 ID/电话号码，姓名、邮箱这种无明显规则的就不适合用筛选组件去查找，用搜索会更好。筛选分类有哪些要求？分类需符合大众认知的条件。如：按照年月日的认知来选择，地理位置按照省市区街道…要求筛选类目的分类要合理、避免晦涩难懂的文案。这决定了用户使用筛选功能的时候是否清晰无困惑。五、总结关于筛选设计指南这里就结束啦，在具体项目中大家可以根据产品的特性和需求进行对应的调整。如果文章中不对的地方也欢迎指出。欢迎关注团队微信公众号：兆日 UCD本篇来源：优设网原文地址：https://www.uisdc.com/filter-function-design-2
用户 你可以 产品 作为交互设计师，与产品、开发等同事的沟通环节必不可少。你是否也经常会遇到这样的问题：开发问我主色为什么选择这个颜色？为啥不直接用大厂组件库的主色？我们作为设计师觉得方案很好，但是运营同事觉得这种设计改动意义不大，该怎么才能说服他？我该怎么用专业的方法来说服其他非专业的同事，某些功能的交互方式是更合理的？本文会从「自我论证」和「换位思考」两个方面，帮助你建立说服他人的思维方式。一、自我论证想要说服别人，先要说服自己。在他人质疑你之前，你可以先学会「质疑自己」，这意味着你的产出设计内容需要有理有据，而并非一时兴起的主观臆断。有条理的陈述你最初的设计动机和设计依据，可以分为两个部分：1. 整理设计动机结合产品的需求、用户群体特征和公司的发展需要，总结为什么要做设计优化。我们曾经为大家介绍过几个小而美的用户数据分析方法，以此作为你分析产品的方法和依据。设计师如何低成本获取用户数据？我总结了3个方法！在这个信息数据化时代，作为交互体验设计师的你一定遇到过这样的问题： 在复杂的 B 端产品中，由于企业级用户的特殊性，很难获取产品落地后的数据，难以完成设计验证； 可用性测试、用户访谈等测试工具成本过高，开展实施比较困难； 刚刚完成上线的新产品，如何更快更好地收集用户数据和反阅读文章 > 案例：比如对于「为什么选择颜色 A 而不选择颜色 B」这类问题，你可以：结合行业/产品背景：了解行业大背景、整体风格，比如美妆行业和科技行业的色彩调性就大不相同。结合品牌特性：与企业 / 产品的品牌特性相呼应，沿用 logo 的配色方案，可以在一定程度上保持品牌对于用户心智的一致性。分析用户群体：通过对企业 / 产品的用户群进行分析，找出群体特点、喜好和性格偏好，也会影响你的色彩选择。2. 寻找理论背书提供有足够分量的理论支撑。你可以使用经典的、被行业广泛认可的设计理论或设计标准为你的设计方案做背书。他人能够持续提出质疑，有时也是因为你提供的依据不充足或不够有分量。案例：继续上文「为什么选择颜色 A 而不选择颜色 B」这类问题，你可以：参考 WCAG 的无障碍设计标准：在对比度合适的范围中，颜色在搭配场景中得分越高，清晰度越高，越有助于视障人士的阅读；应用色彩学的具体理论：通过邻近色、对比色、互补色、衍生色、明度、饱和度等概念，比较和分析两种颜色的差别和应用上带来的不同感受；二、换位思考这里说的换位思考，是要思考两个方面的问题：一是他人的目的，即对方为什么会问这个问题？为什么会对你的方案提出质疑？二是对他人的影响，即你的设计结论会对他人的工作带来什么影响？是否会为他人带来超过预期的工作量负担？基于这两点出发，下面几个方法可以帮助我们更有效地提升说服力：1. 有针对性地寻找设计依据你可以尝试判断出他人的问题类型，有的是单纯的想要了解更多的专业知识；有的则是基于自己的行业经验作出的判断。在你做解释之前，充分了解他人产生疑问的原因，可以帮助你更有针对性地寻找理论和依据。2. 站在多方视角，分析设计优势通常来说，一场交互评审涉及到产品、前端、后端等多方人员参与，除了你的设计内容自身合理之外，你也可以尝试站在其他相关方的角度，进行方案的优势陈述。这样做可以让他人更容易和你统一战线。案例：比如对于「为什么选择组件 A 而不选择组件 B」这类问题，你可以：站在前端开发的立场，你的理由可能是：组件 A 是在已有组件的基础上做的优化方案，开发起来更高效；或者因为组件 A 以后还会有应用场景，这次设计和开发之后，可以就此沉淀出新的组件，可以高频复用等等。站在业务方的立场，你的理由可能是：组件 A 这样的交互方式可以激发起用户兴趣，提升点击率和下单率；或者这样的组件很常见，符合用户对于产品的预期，用户就可以把更多的精力放在产品内容上等等。3. 权衡成本，提供备选方案评审时，你有可能发现设计改动会带来他人工作成本的增加，这时他人对你的质疑，更多是一种表达反对的自我保护的方式。这个时候，适当做出让步，如果能够提供与现有设计相近的、工作量低的备选方案，通过的概率也会增加。三、实用建议还有几个接地气的注意事项，帮助你更有效地与他人协作和沟通：1. 你觉得你自己专业，和别人觉得你专业，是两回事。很多同学认为自己是设计师，出设计方案当然是自己更专业。但是说服他人，重要的不是你觉得自己专业，而是别人是否觉得你足够专业。在语言表达和设计原理的阐述上，你要想想如何让他人觉得你很专业和可靠。2. 适当的让步和妥协，并不意味着没有原则。其实评审中「谁说服谁」并不重要，重要的是「方案最终能否在预期的时间点完成上线」或者「问题是否能得到解决」。其实大多数情况下，设计方案本身没有绝对的优劣之分，更多的还是要平衡多方的因素，包括时间成本、人力成本和资源等等。因此从单一的设计视角，无法 100% 确定我们的方案就是最优解。多听听他人的意见，这个时候适当的折中和妥协，并不意味着没有原则。有时他人的意见和问题也会给你带来新的设计思路。3. 实时沟通，征求他人意见，而非通知结论。在设计过程中，多注意信息的实时同步和进展上的沟通。很多工作都需要各方通力协作，大家是一个团队，需要尽可能消除信息差。更多情况下，你抛出来与大家讨论的设计内容，应该是方案，而不是结论。在过程中随时征求他人的意见，也是一种对他人的尊重。以上，希望对你有启发。7个接地气的实战经验，帮你学会做用户问卷！用户问卷是交互设计师工作中常用的设计工具。阅读文章 > 设计师如何低成本获取用户数据？我总结了3个方法！在这个信息数据化时代，作为交互体验设计师的你一定遇到过这样的问题： 在复杂的 B 端产品中，由于企业级用户的特殊性，很难获取产品落地后的数据，难以完成设计验证； 可用性测试、用户访谈等测试工具成本过高，开展实施比较困难； 刚刚完成上线的新产品，如何更快更好地收集用户数据和反阅读文章 > 欢迎关注作者微信公众号：「长弓小子」本篇来源：优设网原文地址：https://www.uisdc.com/design-solution-communication-skills
用户 情感 产品 情感化设计，由唐纳德·诺曼在 《情感化设计》 一书中完整提出，书中其由浅入深的将情感化设计分成了三个层次：本能层、行为层、反思层。相关的概念你可以看这篇：关于情感化设计，这篇干货带你快速入门这个知识点！小溜Epik：情感化设计是完善产品，提升用户体验的关键，在当今移动应用泛滥的时代，只有存在情感化设计的产品才能脱颖而出。阅读文章 > 接下来，我们就从案例中分析，作为设计师该如何在这三个层次中做好情感化设计。一、本能层 —— 感官刺激对于本能层，设计师可以在符合功能需求的前提下，尽力给用户带来听觉、视觉、触觉的感官刺激，促成用户与产品的 “一见钟情”。作为一款国民级应用，支付宝出行功能下的每个 icon 都做得很用心，小动画让交互更有趣：Airbnb 在北美登录界面的长按钮，按钮的颜色会随着鼠标移动而产生变化，让交互感受更加深刻：语雀 App 在生成长图进行分享和转发时，有不同的卡片样式可以选择，图案随机像开盲盒一样，促成用户尝试分享：在淘宝搜索商品，可以看到页面右下角的“花瓣图标”，点开后是拼接图效果来展示商品。每个小图可以是视频，也可以左右滑动翻页，视觉展示效果明显，挑选商品也更加方便：在互联网时代，表达哀悼也有了新的方式，很多产品都使用首屏去色黑白化，来缅怀领导人的离去：二、行为层 —— 细节引导对于行为层，设计师需要对用户的行为进行预判和引导，利用细节处理打动用户，让用户对产品产生信任感和依赖感。使用 “微信读书” 在读到一本书的 50% 的时候，页面顶部会显示剩余阅读量，并会根据你之前的阅读速度估算剩余时间，鼓励你继续读：高德地图利用树木和楼高的数据，配合天气太阳角度的计算，在夏天时为选择骑行的用户提供有林荫和楼阴的“清凉导航路线”：在一些车辆限行的城市，高德地图增加了“添加限行日提醒”功能，根据不同城市有定制化的规定。在添加车牌号时，键盘默认开启大写字母和数字组合，方便用户输入：微信的搜索推荐，会用一些小脚标来吸引用户点击，比如“互联网精英都在看”，应该是根据文章阅读的用户画像来做的精准推荐：美团外卖在用户给订单打差评时，会自动开启匿名开关，保护用户的隐私：钉钉会在你长时间（约 3-4 小时）未读某人发的单聊消息时，再次发出通知提示，避免你错过重要消息：微信群聊天，大家通常都会设置“消息免打扰”，但也很可能会错过很多重要信息。微信可以在群聊设置中选择关注的群成员，这样这几个被你关注的群成员在说话时候，你就可以接到通知提醒：三、反思层 —— 认知共鸣对于反思层，设计师要调动用户最深层的记忆和感知，将视觉效果、产品功能和用户认知紧密结合，形成用户对于产品和品牌的深刻认知。英雄联盟的微信广告植入别具一格，将游戏用语、社群平台和用户很好的连接到一起，你只要发送 “亚索，听我口令…” 这段口令，就会唤起动画效果和小程序：饿了么的搜索推荐，使用滚动条状态，并配有古灵精怪的形容词，还会有 IP 形象不断的加词加戏：网易云音乐的播客功能，在切换主题内容时使用的是模仿老式收音机调频的方式，有趣的是，你能感觉到手机随着滑动调频而产生明显的震动感：花小猪 App 为了缓解用户等待平台派单时的焦虑感，将等待进程设计成红包进度条样式的样式，等的时间越长红包越大，让用户舍不得离开：Google 浏览器首页的 Logo 涂鸦变体经常会和实际事件相呼应，比如在某年的月食日时曾使用过的涂鸦小动画，点击后则会跳转到与月食知识相关的百科页面：欢迎关注作者微信公众号：「长弓小子」本篇来源：优设网原文地址：https://www.uisdc.com/emotional-design-2
案例 用户 操作 时间对于我们每个人来说都极为重要和珍贵。随着生活节奏的加速，很多产品也都开始注重和考虑对于用户时间的节省和分配。本文重点分享三种在交互设计中帮助用户「同时做几件事」的设计方法，以及其对应的优秀案例：分割屏幕的布局更容易再续操作忽略非重要操作希望会为你带来更多的设计灵感。往期回顾：17个优秀设计案例，帮你快速了解情感化设计情感化设计，由唐纳德·诺曼在 《情感化设计》 一书中完整提出，书中其由浅入深的将情感化设计分成了三个层次：本能层、行为层、反思层。阅读文章 > 一、分割屏幕的布局通过将屏幕的布局进行分割处理，可同时呈现多项内容，让用户自由选择任务主次，同时处理多项任务。分屏设计很常见，但其中的体验细节却依旧值得研究和优化。案例 1 微信在 Pad 端的分屏布局考虑得很周到，看微信视频时支持分屏功能，还能够调整屏幕分割的尺寸比例。最小的分屏尺寸做成了手机尺寸，体验顺畅，看视频、接微信两不误：案例 2 bilibili 在移动端的视频通过小窗模式可以不间断播放，不仅可以在 App 内或外呈现小窗模式，正在播的视频，在被临时打断退出视频后，还可以用音频的方式继续播放：案例 3 微信的新功能，在你阅读文章时依旧能看到朋友发来的微信消息，可以直接在当前页面回复消息，避免你在看文章时阅读不了微信消息。你还可以将信息“标记未读”，一会儿再做处理：案例 4 微信视频号改版后，点击视频号下方的博主名称和头像，下方弹窗会弹出该博主的主页和其他视频，而当前正在播放的视频会渐渐呈现小屏播放，视频内容不会被遮挡，既不影响观看，也不影响用户探索该博主的其他视频内容：案例 5 在微信订阅号中展示的视频内容可以通过划到右下角变成小窗播放音频，既可以听内容，也不影响你继续浏览订阅号的其他内容：二、更容易再续操作产品可以让操作更容易被用户管理和掌控，在被打断后很容易被用户重新再续，给用户足够的掌控感。在一些特殊情况下，几件事可以交替、穿插地处理，同时进行。案例 1 钉钉的移动端浮窗功能，向右滑动退出正在操作的页面时，就会出现添加浮窗区域，用于收录未做完的操作。同时显示出已添加浮窗的内容数量，最多添加 5 个：案例 2 微信的浮窗功能也可以帮助用户更快捷地收录未及时阅读的内容，在打开时还可以定位到上次中断阅读的位置。用户不再需要整块的大量的时间来阅读长篇文章，可以更合理地掌控阅读节奏：案例 3 微信读书 App 会在你跳读到其他章节时，在页面下方显示“返回原进度”的按钮，方便你在跳读后回来继续阅读：案例 4 网易 163 邮箱侧重于为你呈现工作的多线程。每点开一封邮件，页面上方会增加一个类似浏览器标签页的 Tab，你可以通过它们查看自己的工作和阅读轨迹。当你在写邮件时，同时又收到了其他的新邮件，去查看新邮件之后，可以通过 Tab 直接回到邮件编辑页面，继续编写刚才的邮件：案例 5 使用钉钉发起会议邀请，如果中途退出，系统帮助你自动保存。再发起会议邀请时也会给出上次操作的提示，帮你续写内容：三、忽略非重要操作用户可以选择忽略或隐藏并不重要的、正在进程中的任务，将更多的时间用在其他事情而非无法控制的等待上。案例 1 iOS 系统中，当你在不同 App 之间传递文件时，如果文件过大，弹窗的“取消”按钮会在几秒钟之后变成“隐藏”，用户点击后可以继续做其他操作，并不妨碍后台的文件传输。案例 2 微信在接收超大文件时，增加了“发送给朋友”的选项，你不必等待文件在自己这边下载完成后再发送，可以直接发送源文件给对方，同时下载：案例 3 微信拨打语音的界面，在等待好友接听的过程中，你可以看到对方朋友圈的动态，缓解无聊的等待，也为即将进行的语音聊天提供了话题：欢迎关注作者微信公众号：「长弓小子」本篇来源：优设网原文地址：https://www.uisdc.com/13-product-design-details-2
用户 图标 品牌 前言对于金融类 App，设计流行趋势是什么？如何在设计中更好地体现银行的企业理念和品牌特色？如何提高金融类产品的用户体验？本文总结了九大设计要素，帮助你理解金融类 App 的 UI 设计。更多金融类产品的总结：15000字深度解析！银行金融APP的适老化设计指南引言任月月：据调查，中国人口老龄化程度在全球已处于中上水平。阅读文章 > 一、色彩在色彩心理学中，蓝色、绿色等冷色调，给人以冷静、稳定的感觉，体现了金融产品的科技感和可靠性。而红色、橙色、黄色，代表活力热情，也会像五星红旗带给我们的民族自豪感，可以用于金融产品要传达给用户的情感色彩。1. 品牌色一般 app 的整体色调，都会根据品牌色来设计，像下图的「招行企业银行」的首页，品牌色很好地应用在图标、按钮、文字链接、卡片背景、banner 这些地方。在界面设计中通过加入更多的品牌元素，可以潜移默化地让用户感受企业的价值，传达企业对用户负责的态度，提升用户对产品乃至企业的信任感。2. 弥散渐变色其次，也可以采用近两年流行的弥散渐变风格。弥散渐变是一种轻量舒缓的设计色彩。如果想要强化顶部导航栏或者个人中心页面顶部的视觉感，利用品牌色作为背景颜色，会显得顶部视觉厚重；如果利用白色或者浅灰色做背景色，而显得单薄。我们来看下图，用弥散渐变处理的方式做页面背景色或者在白色卡片的边缘位置强化色彩，不仅可以丰富视觉表现力，还可以和卡片内容相呼应。所以不妨试下这种十分干净清爽的新设计方式。更多渐变形式：用80张案例，帮你掌握20种渐变色表现形式！hi，我是鱼先生，终身学习践行者。阅读文章 > 二、文字界面中另一个重要的构成元素是文字，文字向用户传达信息，合理的使用文字样式非常重要。在金融界面中，我们常常用粗细体、字体大小、文字颜色深浅等来拉开文字层级，增强内容的可识别度。像 iOS15 设计风格，大标题导航也是这个道理。另外，定制字体的使用，也十分流行。这几年越来越多的公司，开始定制字体，根据自己的品牌特质去做一些特殊的字体。比如下图的「支付宝」，这些金融数据的数字，采用特殊字体的方式来设计，视觉效果更佳。三、图标图标作为功能入口、用户的操作载体，图标的设计也可以为界面添彩。目前市面上，金融类 App 的图标设计风格，主要分为以下三大类：1. 线性图标轻质简约，大多数 App 都采用这类风格。如下图的「宁波银行」的金刚区图标设计，外部深色线框加内部彩色线条（品牌色橙色+对比色蓝色+邻近色黄色）点缀。2. 面性图标颜色搭配丰富，视觉冲击力强，页面效果更加生动，常用于重要功能图标的设计。下图「京东云企业管家」首页的功能图标设计，面性图标+毛玻璃质感，图标更有质感和层次感。3. 线面结合新型的图标流行趋势，线高度概括图标的含义，面装饰点缀，风格独特出彩。下图是「涨乐财富通」的图标设计，黑色线性边框+红色内部线条+渐变红色圆形点缀。四、布局1. 留白对于布局，除了基础的信息功能框架，留白是关键。我们在工作中可以发现，很多高级感的设计通常都具有大片的留白。太过紧密的间距、没有明显的区分隔断、复杂的背景，都会大大降低用户的使用感。留白设计能使整个页面不至于太过抢眼，可以给予设计呼吸的空间，让用户快速找到所需要的信息。2. 圆角卡片此外，圆角卡片的使用，也是布局流行趋势之一，圆角会更突显矩形内的内容，有助于用户将视线聚焦于内容本身。大圆角有轻松活泼的感觉，小圆角、直角更像是一种强调，表现得严肃庄重，给人一种信任感。对于金融类 app 来讲，该使用多大的圆角，是根据整个 app 的调性来定的。比如「招行企业银行」，因为是 B 端产品，整体的调性是专业、安全，加上其 logo 的内置图形是招商银行的品牌 logo“M”图形，有棱有角的。所以在整个 App 的界面设计中，采用的是小圆角卡片，小圆角图标等等。五、插画无论在界面设计，还是在品牌营销中，很多场景都需要插画来塑造产品的气质和氛围。插画有助于将我们的品牌故事讲给用户听。这两年流行的插画风格多种多样，那什么风格会更适合应用在金融类 App 的设计中呢？1. 几何插画一般几何图形多为产品界面和宣传内容的抽象，线条和几何色块的结合，搭建出用户实际使用场景，更加简洁、清晰。下图为「中信银行」首页，banner 就是采用几何图形插画设计风格，绘制了一幅居家悠闲的画面，挺符合中信银行的定位：“有温度的银行”“信守温度”。2. 轻拟物插画在一些快速入口图标，或者重要的卡片中，会采用轻拟物插画设计来重点突出要素。下图为「广发银行」发现精彩 app 的头条页面，就嵌入了轻拟物插画，强化了这个卡片内容的色彩感和层次感。3. 2.5d 插画2.5d 立体的造型，本身更有真实感，在界面设计中可以吸引用户更细致的欣赏。下图为「京东云企业管家」的首页，新人福利模块就采用了 2.5d 插画风格。六、品牌 IP疫情第 3 年，隔离使得人们对于图片所呈现出的故事和情感，有着更为强烈的情绪反应。在 App 界面设计中，越来越多的应用了情感化设计，来赋予产品一种拟人化的情感，与用户互动，让用户感受产品的温度。那相比于品牌或者 Slogan，品牌 IP 更具备这种实力。比如广发银行的“小发羊”。「广发银行」是一家广州起源的银行，小发羊融入了广州本地人的性格属性（慢性子、爱吃、精打细算、很师奶），同时也匹配了银行业务本身的需求。在 app 的界面设计中，小发羊应用在了启动页的设计、广告设计以及养成类社交游戏和 IP 周边品牌馆，让用户从业务和日常生活都离不开。七、微交互动效UI 设计中通过微交互反馈告知用户当前正在发生的事情，所处的状态。细微的动效更能调动用户情绪、取悦用户，让用户的认知过程更为自然，用户体验更加精致到位。是一个很好塑造品牌个性的机会。比如「平安数字口袋」app，上图中的金融页面的金融小工具模块和顶部的投资 icon，作为重点功能入口采用了动态图标微交互设计，吸引用户眼球，辅助用户理解。八、数据可视化大数据时代，数据的展示是必不可少的，所以在金融、理财、账户管理等页面上，借助图形化手段，更加清晰有效的传达信息。上方左图是中国农业银行基金经理信息的页面，右图是招商银行的。左图只能粗略感知到这个基金经理的盈利能力，右图中可以对基金经理的投资风格一定了解。大片文字和图文结合两种方式相对比，数据可视化的优势一目了然。九、组件化、模块化组件化是利用原子系统从原子、分子、组织、模版、页面来快速搭建页面，让设计语言标准化体系化。模块化是在组件化的基础上，将产品分成几个模块，通过模块的组合配置，就可以创建不用需求的产品，满足客户的定制需求。下图是我们兆日的设计体系部分截图，我们的设计团队构建了全面的设计组件库，同时对接开发，一一对应实现 UI 控件。这样设计更新迭代中可以非常高效通过更新组件库去整体更新所有页面样式，方便协同办公提升效能的同时，保证全渠道体验一致性。写在最后近两年来接触了大大小小几个银行项目，无论是 0 到 1 设计，还是改版设计都有一定的收获和感悟。希望本次对金融类 App 设计的复盘能给大家提供一点思路，让产品越来越好。同时也欢迎各位小伙伴来共同探讨与指正～欢迎关注团队微信公众号：兆日 UCD本篇来源：优设网原文地址：https://www.uisdc.com/financial-app-design-elements
业务 用户 站在 对于体验设计师来说，最常见的棘手问题之一就是：如何平衡「用户体验」和「商业化需求」之间的关系。一位同学就问过我这样的问题：“我所在的公司产品为了冲刺营收，搞了很多营销手段，导致用户体验相关的数据下降了很多。产品经理也不重视用户体验，认为 ‘没有用户来投诉’ 就行。我作为产品的体验设计师，感觉很难去做点什么了。产品的营收确实重要，但这样为了短期目标而忽视用户体验的做法是不是不太好？作为设计师应该怎么办呢？”其实这样的情况，我这几年在大厂的工作中也没少遇到过。设计师在这时提出的体验问题大多会石沉大海，不被采纳。这就会导致很多设计师对工作渐渐丧失“工匠精神”，感到心灰意冷。那么此时应该怎么做呢？ 我有三条建议：站在业务视角：明确目标站在用户视角：尽量补救站在产品视角：做好记录相关话题的探讨：究竟是什么决定用户体验的走向？我总结了6个方面！随着 4G、5G 的普及，移动互联网进入成熟时期。阅读文章 > 一、站在业务视角：明确目标很多业务在某些特定的时期，目标并不是“好的体验”，有时“快”比“好”更重要，“能用”比“好用”更有价值。有时设计不是万能的，也不是必须的。虽然优质的产品和极致的体验是我们一直在努力追求的目标，但是对于很多产品、业务甚至是公司来说，“好体验”并不能支撑它们活下去。如果条件允许，相信没有业务方会抗拒好产品和好设计。他们也并非看不到体验问题，只是这些并不是当前的主要矛盾和首要目标。在不以设计为核心的公司和业务中，配合业务完成目标是设计师最基础的本职工作。 此时的体验设计师就需要：1. 了解业务需求的目标与业务方做深入沟通，站在业务视角，透过现象看本质：一定要搞清楚业务每个需求背后的目标和方向。短期业务目标有时可能会因为某些限制而与用户体验相悖，但长期发展的大方向一定并不矛盾。2. 理解业务行动的依据就像作为设计师的你有不能减损用户体验的理由一样，业务营销的行为也有其背后的依据和逻辑。也许是这种营销行为在此时此刻更符合用户心理预期；也许是以往经验证明这样的营销手段并不会影响用户与产品的长期关系等等。理解业务的显性需求和隐性需求，才会拼凑出完整的需求，你的设计决策也可以以此为据。当你手里拿着锤子，看哪里好像都是钉子。设计师是和用户打交道的人，最容易做的就是放大用户体验的价值。因此只有真正理解业务行动的目标和依据之后，才会杜绝偏见，也才能够在业务目标的指引下做出更加恰当的设计决策。二、站在用户视角：尽量补救“考虑用户体验”不是业务方的必修课，而体验设计师作为用户和产品之间的桥梁，就应站在用户视角，尽可能地对方案做补救和优化。设计在这个时候就要起到“托底”的作用。如果你想要保住产品的体验质量，不能只做批判和喊口号，还要拿出解决方案和落实方法。在这种业务相对强势的时刻，就更需要你：发挥主动沟通和协作的能力；洞察用户和业务两方的目的和需求；提供充足有力的设计依据；评估和利用有限的资源和成本；统一协调相关方推进进度；预估可能会遇到的风险和卡点。设计师的专业能力和价值不是只在大型项目优化中才得以展现，这种紧要节点同样也是你锻炼的机会。在有限的条件为用户体验质量做托底，我们不应该把自己定义为“受压迫者”，而是要做解决棘手问题的“设计军师”。很多时候，我们都会感到自己受困于当下的环境中，力不从心，独木难支。但其实不是你没有机会，而是你能看到这个机会背后的层层阻碍，因此下意识的退缩不前或转嫁责任。但如果你想要进步，就要把阻碍当成是升级的挑战，迎难而上。最重要的是，要克服自己内心深处的惰性，把抱怨“我不能”转变成思考“我怎样才能”。思考如何突破当下的业务困境，本身就是一种专业能力的历练，也是一种设计经验的积累。作为用户体验的一道最主要防线，该说的我们一定要去说，该做的我们也要去做。虽然很多时候结果并不是我们能够控制的，但过程往往比结果更有意义。三、站在产品视角：做好记录对于一些成本比较高，在短期内难以优化和迭代的点，如果你有想法和思考，就找个地方记录下来，静待优化落实的机会。未来如果产品有更新迭代，也许就能派上大用场。即使最后没有机会优化或落实你的方案，在这个过程中的思考和探索，同样是对你设计能力的培养和锻炼。生活中有很多事情并不会给你即时反馈，大多是看不到短期成效和意义的。但是几年之后当你回过头来，就会发现未来的你正是由现在的自己一步步塑造而成。你的每一步路，都不会白走。以上，共勉。欢迎关注作者微信公众号：「长弓小子」本篇来源：优设网原文地址：https://www.uisdc.com/balance-experiences-and-needs
需求 用户 流程 经常在设计群潜水的时候，都会碰到有小伙伴问相同的问题：换了一家公司，如何融入团队开展工作？刚好最近自己也是换了一个平台搬砖，所以想结合这段时间自身的经历，来跟大家聊聊，作为交互设计师，我是如何快速进入业务状态开展工作的。相关干货：B端设计师如何体系化了解业务？4个步骤快速搞定！前言接触 B 端设计的小伙伴会发现，很多业务具有角色多，业务场景复杂，功能链路长等特点，所以在工作中会经常遇到以下几个问题： 突然被调配到新业务，拿到一个不熟悉的业务或者新产品，不知如何开展工作？阅读文章 > 为什么强调“快速”，是因为对于一个职场老鸟来说，公司招你的目的不是花时间培养你，而是来救火的。如果不能快速进入业务状态，就会招来周围同事的质疑，尤其是对于像交互这种“可有可无”的职位而言。所以，如何在新的环境中快速融入，快速产出就显得尤其重要了。一、了解团队当前协作流程与痛点由于公司之前没有交互设计师的岗位，所以当我进入到团队中时，首先主动了解的是在没有这个角色之前，团队是如何运转的，以及遇到了哪些阻力。这样我才能找到当前团队协作的问题，并通过这个岗位的优势去解决，从而凸显自身的价值。在通过与产品、技术、设计等部门同事的简单沟通后，归纳出如下两个问题：1. 产品交互流程靠口述，理解偏差较大在跟旁边的技术同事沟通得知，由于之前没有清晰的交互流程产出，只有产品出的简单的线框图，导致大部分交互流程靠开发想象，再加上产品的线框图是通过生成 axure 云端链接的形式存放，经常会出现打不开、找不到的情况。产品就通过口述的方式进行流程的宣讲，从而导致的结果就是开发出来的与产品的预期偏差太大。而针对这些现状，结合之前的工作经验提出了两点优化建议与方向。① 统一团队协作工具与项目文件当前技术同事在开发的时候，需要不断切换链接去看对应的产品需求、交互流程、设计稿，不仅繁琐，经常也会出现由于项目文件命名不同对应不上的情况。所以在我的建议下，开始使用同一个软件来承载这些文档，同时将相同项目的文件采用统一的命名规则，从而提升技术同事查找相关文档的效率。② 规范交互文档的内容输出之前交互流程的产出由产品兼任，由于没有那么多时间考虑页面细节，就会导致部分页面流程的缺失。所以在我加入以后，针对当前团队的特点，优化了之前的交互文档的结构，同时与产品协同产出，将业务规则与交互说明落到对应的页面上来，进一步提升技术同事的开发效率与准确度。2. 需求经常变更，设计与开发返工率高需求变更往往是导致项目不能按时交付的主要因素，在与产品经理沟通中得知，导致这个问题的主要因素是开发出的页面流程与前期需求沟通的时候不一致，所以如何确保需求准确的传达给技术跟设计同事，对此我将整个链路拆解出了四个阶段，即：需求评审、交互评审、页面与流程宣讲、实现跟进。① 需求评审需求评审是之前团队已有的流程，但是之前评审需求时，每个角色都有自己的想法，由于没有将需求做页面化的呈现，导致直接将不确定的需求给到设计以后，设计开发出的需求不符合前期规划的预期效果，就会带来返工。而在我加入以后，在进行需求评审的同时，我会主动去归纳此次需求范围层的内容，并快速生成可视化的效果，展现产品与功能雏形。这样做的目的是能让各个角色根据当前的信息架构来判断是否是大家达成一致的效果与流程，减少因需求不明确而带来的返工。② 交互评审交互评审，是我加入以后主动去推动的流程。一般是在产出整个功能所有页面的信息架构跟流程后进行，主要目的是拉齐需求方看看整个功能用户的操作链路是否满足前期讨论的需求。而且在这个阶段也可以避免一些因交互形式的改动而带来的开发工作量的增加，从而导致项目延期的风险。③ 页面与流程宣讲页面与流程宣讲，是在我补充整个页面与流程的交互文档后进行，主要目的是面向负责此次项目的设计与开发同事，通过同步此次方案的背景、迭代的内容、用户交互的页面流程与规则、需要获得哪些数据、设计注意事项等内容，来减少开发设计过程中因前期功能不熟悉而带来的理解偏差。④ 实现跟进实现跟进，主要跟进设计阶段与开发阶段。设计中，要时刻看看设计进度以及是否很好的表达出了原型中的信息层级，而开发阶段主要是对于一些极端情况做出解释与定义，防止模凌两可的状态导致流程的不通畅，同时在测试结束后还要做一轮验收，主要查看功能是否完善，极端情况是否考虑周全等。二、主动熟悉业务，框定后续工作方向当我加入到团队后，就立马接手了需求,其实这么迅速的投入到工实际项目中是不太利于方案的产出的，因为在不了解业务背景的情况下，很容易陷入“我以为”的状态。所以在做这个紧急任务的同时，我也在利用有限的时间去完成如下三件事情，帮助自己更好的开展后续的工作。① 了解产品商业模式交互设计师不是一味的站在用户的角度去考虑问题的。产品体验设计的再好，如果不能带来公司效益的增长，也会无济于事的。所以主动了解公司的产品商业模式，不仅能很好的在产出方案的时候平衡商业与体验，同时也能在主动推进产品体验优化的时候更好的选择合适的方向。② 体验产品流程体验产品流程是一种很好的方式，来帮助自己快速熟悉产品。通过对每个模块，每个流程的拆解，不仅能知道该功能设计的目的，同时也能知道当前的流程存在哪些问题以及可优化的方向，为自己建立整个产品的功能架构图提供了很好的帮助。③ 获取产品节奏产品在不同的阶段，需要解决的问题都有所不同，获取产品的节奏能更好的明确后续的工作重心与方向。举个例子：当我加入到团队以后，在跟上一级的沟通中了解到了现在产品的商业模式，于是我就开始针对产品几个能影响到用户增长与订单转化的流程着重体验，找出优化的方向，比如注册登录流程。因为不同于常规 C 端的注册登录，当前产品需要用户注册后开通会员才能正常查看内容，该链路的体验好坏决定了产品的付费用户数量，所以我觉得对于产品是至关重要的。但是在我进一步跟上一级的沟通中得知，产品当前的存量用户还可以，而且大部分的新用户并非通过 app 主动注册的形式产生，所以产品的注册登录流程并不是现在最主要的，而是在于结合产品运营，如何让现在的存量用户活跃起来。所以在获得了产品的节奏后，我重新调整了对产品的体验优化的方向。三、切换视角，站在目标用户的角度做设计切换视角对于交互设计师而言尤为重要，因为这个岗位的价值就是为用户设计合适的操作路径，从而达到“降本增效”的目的。在产出方案的过程中，越多的站在用户的视角，意味着产出的交互流程越接近用户的使用预期。在我加入团队没多久，就接到了一个内部 OA 系统的交互需求，该需求产品经理已经在前期做了简单的功能设计，但是由于没有设计用户的操作路径，所以需要我这边来进行补充与协助。我就以这个为例，来拆解一下在做交互需求时，我是如何站在用户的角度去思考与设计的。公司的OA 系统主要是用来维护核心用户，根据用户的属性不同做分层运营。新需求是需要增加一个“记需求”的功能，用来记录用户的诉求，从而方便后续的跟进。已有的线框图如下：接到这个需求后，我并没有急于去做后面的交互流程补充，而是通过跟目标用户的交流，了解了他们使用这个功能的场景，再切换自己的视角，试图站在用户的角度，来重新审视现在的交互行为的合理性。第一个交互行为是用户查看记录好的需求。当前的设计是放在用户列表的顶部，并以卡片切换的形式查看。此交互形式虽然能提高需求的重要层级，方便用户查看，但是对于需求的数量有要求，如果相同重要层级的需求过多，采用这种形式展示就会增加用户的操作成本，那该如何优化呢？通过对用户使用场景的调研，明确该操作是目标用户的常用操作，且需求量会很多。针对常用操作，要做的就是减少用户的操作路径，方便用户触达。所以选择了跟客户列表用 tab 切换的形式展示；而针对数量多的特性，信息列表无疑是很好的选择，能承载更多的内容，同时也能让 tab 切换后的页面形式保持一致。接着我们就需要根据当前的交互形式，对场景跟目标用户的需求做进一步的拆解。信息列表虽然能承载更多的信息，但是内容一多，查找起来就会很困难，如何让用户找到一个或者一类需求呢？我就继续补充了该信息列表的搜索跟筛选功能，通过搜索能定位到具体的需求，同时为了提升搜索效率，增加了关键词联想的交互规则；而筛选是将同一特质的需求摘取出来，那如何定义需求有哪些特质呢？我通过功能的目的进行拆解，该功能是记录需求方便后续的跟进，根据跟进的目的以及用户的使用场景，定了需求的筛选维度：时间、重要程度 。然后为了让整个操作形成闭环，在用户记录需求的时候也增加了自动获取时间以及让用户定义重要程度的功能。第二个交互行为在于用户记录需求，原始的线框图是以选择项的形式让用户操作，但是为了能尽量覆盖大部分客户的需求，设置了不同维度不同层级的选择项，这就会导致一个问题，增加了用户记录需求的时间，那该如何进行优化呢？在与目标用户的沟通中发现，他们一般记需求是发生在打电话跟客户沟通的时候，而需求的内容往往不固定，之前的方式是采用手写的方式记录。结合使用场景与用户习惯，将之前选择的交互改成文本输入，同时为了进一步提升用户记录需求的效率，在用户进入记需求的面板时，直接唤起键盘，方便用户直接输入。四、敢于发声设计师往往自我定义为“执行者”，尤其是刚进入新的团队，在人生地不熟的时候更不敢发声，但是衡量一个设计师的专业性，不仅仅体现在他的产出物，还要看看他对于过程的思考与论证，而这些都是要表达出来的。在我加入新的团队产出交互方案后，就主动推进交互评审的进度，拉齐其他部门进行整个方案的宣讲，指出之前流程可能成为用户操作阻力的地方，以及自己整个的改版方向与目的，为什么最终选择了这个交互方案，最后还对自己的方案定义了考察的指标，方便后续对于方案效果的跟进。也正是敢于将这些内容说出来，才得以迅速的在团队建立良好的口碑。五、总结以上，就是笔者根据最近的经历，分享的一篇关于如何快速进入业务状态的文章。后续也会继续分享自己在实际工作中，关于产品交互的心得与感想。经验有限，欢迎大家批评指正与交流。本篇来源：优设网原文地址：https://www.uisdc.com/quickly-enter-the-service-state
插画 组件 用户 在互联网企业日常的项目需求中，插画经常会大量的运用在各类产品设计、产品运营、产品宣传中，但是传统的插画方式主要存在以下几个问题：不同岗位不同的设计师产出的插画风格不一致，质量参差不齐每次的设计插画需求都是从头开始绘制，插画的产出效率太低插画的风格不一致很难形成一致的品牌印象，品牌感太弱于是我们可以看到一些互联网团队已经走在了前面，通过构建系统的插画组件库来解决以上 3 个问题，对于设计师来说，插画组件库虽然已经不是什么特别新鲜的话题了，但是实际的执行过程中大部分设计师可能会遇到很多难题。那么，今天的飞凡指南就通过 3 个方面来深度解读下插画组件库的这个设计话题。更多插画组件库干货：保姆级教程！手把手教你做超实用的插画组件库（附组件库下载）今天给大家带来的是如何建立设计师个人的插画组件库，因内容过长并知识点过多，请泡杯枸杞观看。阅读文章 > 一、插画组件库的价值1. 设计提效当我们通过传统的流程去设计一个运营页面的时候，往往需要 2~3 天的时间，但是有了插画组件库，设计产出的效率基本上可以提升 1 倍以上，而节省出来的时间，设计师可以去考虑更有价值的事情2. 统一风格整套的插画组件库，在构建的时候，对风格、色彩、人物、元素、背景都有着统一的规范，在面对不同设计能力设计师的时候，都能够较大程度上保证风格统一和插画的产出质量3. 提升品牌感插画组件库在构建之初就要考虑和产品调性、品牌调性的一致性，这样在传播的过程中才更能在用户心中形成一致的品牌形象，提升品牌感二、插画组件库需要考虑 4 个方面的问题当我们在构建插画库的时候，以下 4 个问题是我们需要重点考虑的：如何凸显产品属性；如何体现品牌调性；如何满足用户场景；如何打造差异化的风格凸显产品属性：插画的最终目的是辅助文字去传递产品信息，我们需要直观的向我们的用户告诉我们是干什么的，而避免用户做过多的思考；如何体现品牌调性：和消费品一样，品牌是用户考虑的一个非常重要的因素，插画是传递信息和塑造品牌调性一个非常重要的渠道，所以插画库应该考虑如何能够对我们的品牌调性或产品调性进行补充如何满足用户场景：在考虑插画的元素构成的时候，我们也需要把用户考虑进来，他们使用产品的时候是哪些场景，再基于用户的场景去设计我们的插画组件元素，这样在实际应用插画库的时候才能够尽可能涵盖传播的场景如何打造差异化的风格：我们可以看到各大互联网产品的插画风格都基本上非常雷同，很难有明显的插画风格特征，这样的结果就是用户很难记住你，所以对于插画差异性的考虑也是一个很重要的点三、插画组件库构建的 3 个步骤对于设计师来说，最重要的还是如何将插画组件库落地了，总结下来可以分为 3 个步骤：插画风格推导、插画组件库搭建、插画组件库应用1. 插画风格推导插画风格我们主要可以从 3 个方面去推导：品牌、用户、产品① 品牌我们需要了解的是品牌的调性、色彩、辅助图形、logo 特征、品牌资产...，这些都是我们构建品牌插画库的基础参照。比如下面这张图是梳理的出来的 fashion data 的品牌相关元素：② 用户&产品了解我们的用户和产品，我们可以用以下这个电梯宣言的方法去梳理：关于用户：为了满足「目标用户」，他们的「什么痛点或需求」关于产品：我们的「产品名称」，是一个「怎么样的产品类型」；它可以「关键优点，通过什么样的功能，为用户带来什么样的价值」；而不像「市场上某竞品及其特点」；我们的产品是一个「主要独特价值点」比如，下面这张图是对 fashion data 的用户和产品进行的梳理，去快速的了解用户的需求痛点、产品定位、产品价值...了解完品牌、产品、用户之后就要推导出插画库的风格方向了。在讨论 fashion data 的插画风格选定的时候，其他几组插画在风格上差异性和个性表达上虽然会比较强，但是和 B 端产品的定位差异比较大，最后还是选定了普通的矢量风格插画风格，它能比较好的像用户传递出 B 端产品的高效、专业、严谨的品牌形象，后期差异化主要是通过融入品牌元素和塑造插画角色这 2 个手段来体现。2. 插画组件库搭建插画组件库的搭建，可复用性是我们考虑的重点，要达到这个目标，我们构建分子的时候就应该尽可能的把插画拆分成比较细的分子，比如头部我们可以拆分成不同角度的基础头型、发型、表情...① 角色组件定义角色基础的形体比例、肢体细节形体比例、肢体细节基本上就能够确定我们的角色是何种特点，比如，我们常见的互联网扁平插画风格就和我们的正常人物比例、肢体细节比较接近一些，但是一些欧美的插画风格经常会用很夸张的比例造型来塑造个性的角色，比如头特别小，肢体特别大。还有不同人物的比例也会有所不一样，比如男性女性的黄金比例是 9a（九头身），小孩的比例大大约是 4a，但这不是固定不变的，还要看具体的插画风格。为角色搭建灵活的骨骼系统构建组件库，我们自然是希望我们的插画能够和人的骨骼一样，能够灵活的做出各种动作，这就要借助于灵活的骨骼系统了，通常情况下我们可以将我们的人体骨骼拆分成以下的组织。在组织的连接处，我们尽量都能够采用正圆形，这样在变换动作的时候才能够更好的衔接上，大家可以看看传统的皮影人偶也是采用的这种连接方式，才能在舞台上作出灵活的动作。建立不同角度下的表情、动作、服饰等组件人物的应用场景不仅仅只有正面的角度，还有其他的角度，我们一般只需要设计正面、半侧、正侧这 3 个角度即可，在这 3 个角度我们需要构建不同的表情、动作、服饰...尽可能满足角色在不同场景的使用需求。② 通用组件通用组件我们一般基于用户场景来制定。比如下面的这个案例，fashion data 是一个高效的跨境电商数据管理平台，主要针对店铺运营人员，为他们提供快速管理店铺商品、直观查看店铺经营数据等服务，所以用户的场景主要办公场景和业务场景，办公场景的元素有比如：书桌、电脑、办公用品...；业务场景的元素有，比如：仓储、物流、数据、商品... ，最后我们再基于这些元素去制定通用的组件。③ 背景组件背景组件一共可以分为 2 种类型，场景背景和纹理背景。场景背景一般是基于某个特定的场景来制定的，用来交代画面所处的环境，比如室内背景、白天、黑夜、晴天...纹理背景一般是用来装饰和丰富背景，比如下面的插画，加了背景纹理插画明显层次和画面更加丰富了。3. 插画组件库应用搭建完组件库之后，就可以在产品运营、线下物料、产品界面使用它们来提升设计的效率了。当然随着业务不断的变化和用户场景的变化，我们的插画组件库也应该及时的扩容和优化。写在最后需要提醒的是，插画组件库的目标是帮助那些重复、且设计质量要求不高的设计需求提效，而设计难度较高的设计需求还是需要设计师来处理，而这才是设计师能够真正体现价值的地方，同时，把时间节省出来，设计师才有精力去思考更多更有价值的事情。本篇来源：优设网原文地址：https://www.uisdc.com/illustration-component-library-design-guide
用户 权限 系统 导语不论是对 iOS 还是 Android 系统的 App 而言，获取用户权限都是极其重要的，但数据表明用户在面临授权请求时会非常谨慎地判断。那作为设计师，我们如何通过用户体验设计影响用户的 App 授权行为，以提高用户的授权可能性呢？授权相关设计细节分析：简单的微信授权登录，没想到设计细节如此惊艳！现在很多网站产品和 APP 产品都不再固执地建立自己的用户账户体系，而是使用了微信授权登录的方式来降低获取新用户的门槛，这一方式对产品方和用户来说都有很多好处，例如让注册时操作成本更低，用户也不需要记录各个平台的不同账号等等，但是这种登录方式也带来了一些隐私方面的问题。阅读文章 > 一、背景介绍相信大家都遇到过这个令人头疼的场景，当我们下载一个新的 App 并尝试使用时，扑面而来的是接二连三的授权弹窗，请求我们给 App 授予各种权限。若我们不授予权限，很多功能都无法正常使用。这是因为不论是 iOS 系统还是 Android 系统，手机系统厂商都设计了一套授权机制。手机系统厂商之所以设计授权机制，是出于两方面的考虑：一方面是为了符合隐私法规的要求，保护用户的信息及隐私。例如我国于 2021 年 11 月 1 日起正式施行的《个人信息保护法》中规定“App 不应以非正当合理的方式强迫捆绑和收集用户个人信息，如因用户不同意收集非必要个人信息或打开非必要权限，App 拒绝提供业务功能“。另一方面是出于用户体验的考量，例如 iOS10 以后的系统都会在用户使用 App 前询问用户 “是否允许使用移动数据”，这一定程度上避免了用户的数据流量被无端消耗。但是 App 想要顺利地拿到用户权限并没有那么容易。根据 2020 年国家网络安全宣传周组委会回收的 32 万份“App 安全意识保护公众调查问卷“结果显示，88.5%的受访者对于 App 申请手机权限会进行理性分析，谨慎授予权限。当 App 无法顺利地拿到用户的权限，则可能无法给用户提供优质的使用体验；用户使用体验的不佳最终会导致用户的流失。但是 App 的授权设计被很多产品开发及设计师忽略，很多 App 在用户首次使用时就连续弹出 n 个授权弹窗，这很有可能让用户在 3s 内放弃这个 App。因此如何通过用户体验设计提高用户对 app 进行授权的可能性，对于一款 App 来说，是极其重要的。不同的手机系统有不同的授权流程，本文的研究范围将集中在市场占有率最高的 iOS 系统和 Android 系统上。下文会先介绍 App 授权的基本信息，然后再介绍如何为一款 App 设计优秀的授权体验，提高用户的授权可能性。二、App 授权基本信息1. 权限列表在 iOS 系统和 Android 系统中，需要用户授予的权限是具有一定差异性的，详细的权限列表见图 1。iOS 系统将权限分为用户隐私权限和系统权限，这两类权限都需要用户授权。两者的区别体现在授权弹窗上：用户隐私权限允许 App 开发者在弹窗中添加简短的自定义提示语；而系统权限不允许 App 开发者添加自定义提示语，只能使用系统固定的提示语。常见的用户隐私权限主要包括定位服务、通讯录、日历、照片、蓝牙共享、麦克风、语音识别、相机等，而系统权限主要包括无线网络与蜂窝、通知、VPN、键盘。Android 系统将权限分为危险权限和普通权限，其中危险权限需要用户授权，而普通权限不需要用户授权。常见的危险权限包括：定位服务、通讯录、日历、麦克风、相机、存储。在 iOS 系统中经常需要用户授权的无线网络与蜂窝、通知、照片权限在 Android 系统中属于普通权限，不需要用户授权。2. 授权流程&授权弹窗那 iOS 系统和 Android 系统的这些权限都是如何让用户进行授权的呢？两个系统分别设计了一套授权流程让用户进行授权操作，用户只需要在用于授权的模态弹窗上点击一下就可以选择是否授权，这样简化了用户的授权步骤。若用户同意授权，则可以正常使用相关功能；若用户拒绝授权，则无法正常使用相关功能。下图呈现了 iOS 和 Android 系统授权弹窗的基本样式，主要包含授权标题、授权提示语、和授权操作按钮。两个系统的授权弹窗差异主要体现在授权弹窗提示语和授权弹窗弹出次数两个方面：在授权弹窗提示语方面，iOS 用户隐私权限的授权弹窗是允许 App 开发者在弹窗中添加简短的自定义提示语，但是 iOS 的系统权限授权弹窗和 Android 的授权弹窗都不可以自定义提示语。授权弹窗弹出次数与用户拒绝授权后的流程相关。iOS 系统的授权弹窗只会出现一次，若用户第一次没有同意授权，则用户只能在系统设置模块自行打开权限开关。而 Android 系统的授权弹窗只要用户未勾选“不再询问”就可以反复出现，若用户第一次没有同意授权，则下一次进入该场景时，App 依然会弹出系统授权弹窗请求用户授权。3. 预授权（pre-permission）正如上文提及的，由于 iOS 系统的授权弹窗只会出现一次，若用户第一次没有同意授权，则下次只能在系统设置界面自行打开权限开关。尽管从 iOS 8 开始，App 已经可以在界面中将用户直接引导到系统设置界面进行授权，但操作成本依然很高。此外，由于 iOS 系统的用户隐私授权弹窗只能添加简短的提示语，iOS 的系统权限的授权弹窗和 Android 的授权弹窗不可以自定义提示语，有些用户很难理解为什么需要授权。为了解决拒绝后再次授权操作成本高和用户理解成本高这两个问题，出现了预授权（pre-permission）的概念。预授权是先弹出自定义的授权界面，让用户做出选择。如果用户同意，则弹出系统授权弹窗；如果用户不同意，则不弹出系统授权弹窗。虽然对于用户来说，在体验路径上多了一个步骤，但是给用户多保留了一次通过系统授权弹窗进行授权的机会，相当于降低了用户的试错成本。关于哪些权限适合设计预授权，下文会进行分析阐述。三、App 授权设计那在了解了 App 授权基本信息后，我们该如何为一款 App 设计好的授权体验，提高用户的授权可能性呢？在这里可以运用 material design 授权模型和 CREATE 行为漏斗模型进行授权设计。1. 第一步：确定 App 在 IOS 和 Android 系统上分别需要哪些权限首先，产品经理和技术人员需要罗列出 App 在 iOS 系统和 Android 系统中哪些权限需要用户授予。在这一步要遵循的原则是：不要向用户获取非必要的权限。2. 第二步：利用 Material Design 的授权模型对权限进行分类，设定授权时机并判断是否需要预授权在明确了要向用户获取什么权限后，设计师可以利用 material design 中的授权模型对权限进行分类，设定每个权限请求的时机，并判断是否需要预授权教育。谷歌的 material design 设计规范是从两个维度考虑授权设计：权限重要性和权限明确度，基于这两个维度将授权场景分为了四类。虽然这是 Android 系统的授权模型，但同样适用于 IOS 系统。① 预先请求授权（Ask up-front）重要性高且容易理解的权限可以在用户第一次打开 App 时就请求授权，因为如果用户能轻松理解该权限的使用目的和重要性，那么预先通过系统授权弹窗上进行授权对用户而言是最快捷的授权方式。例如 iOS 的无线网络和蜂窝数据权限就属于该类别，因为用户知道若不授予权限，无法正常使用很多功能。定位权限在打车 App 中也属于该类别，因为打车前定位是用户的共识，所以打车 App 可以预先请求用户授予定位权限。但是对于有些权限而言，在用户第一次打开 App 时就请求授权是很容易被拒绝的，如：通知权限。因为用户对应用的信任感在一开始是最低的，而且在一开始缺乏使用场景，用户并不清楚权限的使用目的。② 在使用场景中请求授权（Ask in context）用户容易理解但重要程度不是非常高的权限适合在使用场景中直接向用户请求授权，如通讯录、麦克风、相机权限。因为在使用场景中请求授权时，用户对权限的使用目的有预期，同意授权的可能性更高。例如：在需要上传图片的场景中，请求用户的相册权限，用户一般都愿意授予。③ 预先教育后请求授权（Educate up-front）重要但不容易理解的权限可以在用户第一次打开 App 时，对用户进行教育后再请求授权，如：通知权限和通讯录权限，它们都属于用户敏感权限。如果通知权限和通讯录权限对一款 App 而言非常重要，建议设计师可以设计预授权页面对用户进行教育，再请求用户进行授权。④ 在使用场景中先教育再请求授权（Educate in context）重要程度不算高而且用户不容易理解的权限适合在在使用场景中先教育用户再请求，例如：非通讯软件的通知权限，因为用户开启通知权限时会顾虑有消息干扰。那需要教育的这两类权限该用什么方式教育呢？由于系统授权弹窗的自定义提示语有字数限制，所以可以使用预授权的方式进行教育。使用预授权方式进行教育的权限主要有以下特征：用户觉得可能会被打扰的权限，如：通知权限；用户觉得很涉及隐私的权限，如：通讯录权限、定位权限；若设计师希望对某些权限进行详细的说明，也开始采用预授权的方式进行教育，例如：相机、麦克风等权限。总的来说，授权时机可以分为两类：第一次打开 App 时授权、在使用场景中授权。从是否需要教育的维度来看，分为直接通过系统授权框授权、通过预授权的方式先教育再授权。但是同一个权限在不同的 App 中可能会属于不同的区间，所以设计师在分类时，需要根据 App 的功能特点具体考虑。3. 第三步：着眼于单个权限，基于 CREATE 行为漏斗模型设计预授权弹窗和系统授权弹窗那在确定了合适的授权时机和是否需要预授权之后，设计师要把注意力放在单个权限的授权弹窗设计上。想要成功地说服用户授权，那设计师应着眼于人们产生授权行为的心理动机，从用户心理出发进行设计，让设计影响用户的行为。这里可以运用到一个模型----CREATE 行为漏斗模型，用来挖掘用户同意授权的整个心路历程。① 什么是 CREATE 行为漏斗模型（CREATE Action Funnel）CREATE 行为漏斗模型是 Stephen Wendel 博士在《Designing for Behavior Change: Applying Psychology and Behavioral Economics》一书提出的概念。这个模型展示的是人们决定做出某种行为所经历的路径，从接收提醒（Cue）到第一反应（Reaction）到分析评估（Evaluation）到检查能力（Ability Check）到判断时间压力（Time Pressure），最终决定是否采取行动（Experience）。② 运用 CREATE 行为漏斗模型设计CREATE 行为漏斗模型在用户授权行为上的运用如下：Cue：屏幕上弹出授权弹窗，用户接收到授权提醒Reaction：用户会凭直觉做出反应，在瞬间决定是否授予权限Evaluation：用户会有意识地评估授予权限的利弊Ability Check：用户会评估自己是否有能力完成授权操作Time Pressure：用户会判断授权是否紧急，是该立即授权还是可以稍后授权如果我们想通过设计达到说服用户授权的目的，那我们需要减少用户在行为漏斗的每个阶段所遇到的阻碍，在每个阶段推动用户授权。下文会从预授权弹窗的设计和系统授权弹窗的设计两个方面分别阐述。预授权界面的设计阶段一：用户接收提醒（Cue）首先，在用户接收到授权提醒时，要让用户明确地感知到 App 在请求用户授权，这样才会开始后续的思考。那如何设计预授权弹窗才能让用户有强烈的感知呢？强化提示的力度，并移除容易让用户分心的元素：（1）在视觉上采用容易吸引用户注意力的色彩、字体、插图等；（2）全屏形式会比半屏或弹窗形式的提醒更明显，同时可以降低多余元素带来的信息噪音，让用户聚焦授权提醒上；用清晰的文字提示用户 App 想要请求授权。阶段二：用户做出第一反应（Reaction）当用户看见授权提醒的瞬间，直觉会告诉用户想不想授权。而用户的直觉取决于该任务是否让用户感到愉快或让用户觉得重要。设计的界面要引发用户正向的感受，让用户觉得授予权限是正确的选择。提示语要措辞清晰且语气诚恳，避免用户的习惯性拒绝。阶段三：用户分析评估（Evaluation）在用户在做出直觉判断后，会有意识地分析授权的利弊。那在该阶段，授权弹窗要让用户明白同意授权更有利。例如，若用户得知授予通讯录权限后才可以添加通讯录的朋友，他们同意授权的可能性较大。那设计如何该影响该阶段呢？通过提示语强调同意授权的好处，说明拒绝授权的后果，例如提示语中可以说明“App 要获取这个权限的目的是什么，如果拒绝授权的后果是什么”。通过提示语打消用户的顾虑。例如关于通知的预授权弹窗中可以明确说明：开启通知后不会打扰用户。提示语可以通过社会认可强化用户的信任度，例如表示很多人都同意授权。在界面上限制操作选项的数量，避免提供过多的选项干扰用户的分析。阶段四：用户检查能力（Ability Check）如果用户评估后发现同意授权更有利后，他们会想了解如何操作才能授权，要克服多少阻碍。那此时该如何设计呢？授权界面需要明确地告知用户该如何授权，例如通过清晰的提示语、插画，或播放一小段简单的动画，展示如何授权。授权界面上要降低授权操作的难度，例如将同意授权的按钮设置为默认按钮，放在用户容易触达的位置。尽量让授权操作与系统授权弹窗的操作一致，例如系统授权弹窗上的“同意”一般居右，预授权界面上也可以采用一致的按钮设计。阶段五：判断时间压力（Time Pressure）在用户明确了授权对自己有利而且自己有授权的能力后，用户会判断授权任务是否紧迫。那在设计上，我们可以利用人们的损失规避心理。通过提示语告知用户选择稍后授权需要付出更多的精力，操作会更繁琐。通过提示语告知用户立即授权的好处更多。预授权界面的设计原则总结：1. 采用全屏的设计形式会比半屏或弹窗形式的提醒更明显，降低多余元素带来的信息噪音，让用户聚焦于授权提醒2. 在视觉上采用容易吸引用户注意力的色彩、字号、插图等强化提示力度3. 请求授权的提示语文案需要清晰、语气诚恳，结构可以如下：（1）App 要获取这个权限的目的是什么；（2）拒绝授权的后果是什么，如：无法使用功能；（3）打消用户顾虑，如：请求通讯录权限时说明不会侵犯隐私，用户可以随时关闭；请求通知权限时说明我们不会打扰用户；（4）强调立即授权比稍后授权更有好处，例如：稍后授权会付出更多精力4. 降低授权操作的难度：（1）在界面上限制操作按钮的数量（2）尽量让授权操作与系统授权弹窗的操作一致，例如：将同意授权的按钮设置为默认按钮，放在用户容易触达的位置，如左右布局的右侧，或者上下布局的上方。5. 利用插画、动画、或简单文字明确告知用户授权的操作方式6. 利用插画、文字等强化用户的信任度，表示很多人都同意授权系统授权弹窗的设计IOS 和 Android 的系统授权弹窗并不允许用户进行过多的设计，只有 IOS 用户隐私权限的授权弹窗允许在弹窗中添加简短的自定义提示语，弹窗的样式并不能做太多设计。设计师能影响的主要是 CREATE 行为漏斗的分析评估阶段（Evaluation）。考虑到提示语的字数限制，系统弹窗的提示语结构可以设计为：说明授权好处或者说明拒绝授权的后果，例如：如果不授予权限，您将不能使用什么功能。涉及到有些用户比较敏感的权限（如定位权限、通讯录权限），可以在授权弹窗中说明权限的使用目的后，再添加打消用户顾虑的语句，如下图中写的“App 彻底关闭时不会收集您的位置信息”。4. 第四步: 设计授权被拒绝后的交互流程即便设计师按照上述方式进行了授权设计，提高了用户的授权可能性，但依然会出现用户拒绝授权的情况。那我们如何设计用户拒绝授权后的交互流程，以改善用户稍后授权的交互体验呢？① 预授权被拒若用户在预授权界面拒绝授权，并不会触发系统授权弹窗的流程。当用户再次进入使用场景时，可以重新出现预授权界面，让用户决定是否授权。或者在权限的相关使用场景中设计文字提醒，提示用户进行授权。② 系统授权弹窗被拒iOS 系统的系统授权弹窗被拒如果用户在 iOS 系统授权弹窗中拒绝授权，系统授权弹窗不会再次出现。但设计师可以在用户点击“拒绝授权”后设计明显的“未开启授权”的提示，提示用户若想使用相关功能就得打开该权限，并给用户提供一个设置权限的按钮。用户点击该按钮后，可以快速跳转到设置模块的授权页面，减少用户的操作步骤。未授权提示的样式可以设计为弹窗，也可以设计为全屏。若权限重要性高，那可以将提示设计为全屏，强化用户的感知。下图展示了腾讯视频的案例：当用户拒绝网络权限后，下次进入 App 时，会弹出未授权网络权限的弹窗，并在弹窗中提供了快速跳转设置权限的按钮。Android 系统的系统授权弹窗被拒由于 Android 系统的授权弹窗只要用户未勾选“不再询问”就可以反复出现，若用户第一次没有同意授权，只需要在用户拒绝授权后，弹出一个轻量级弹窗提示用户未开启授权即可。用户下一次进入该场景时，App 依然会弹出授权弹窗请求用户授权。总结总的来说，不论是对 iOS 还是 Android 系统的 App 而言，获取用户权限都是极其重要的，但是数据表明用户在面临授权请求时会非常谨慎地判断。因此，通过提高用户体验设计提高用户的 App 授权可能性是非常有必要研究的方向。虽然 iOS 系统和 Android 系统的权限列表具有差异性，授权流程和授权弹窗的设计上也有差异性。但是对于设计师而言，为 iOS 和 Android 系统的 App 设计优秀的授权体验的方式是大同小异的。设计流程总结如下：第一步：确定 App 在 iOS 系统和 Android 系统上分别需要哪些权限第二步：从整体考虑，利用 material design 中的授权模型对权限进行分类，设定授权时机，并判断是否需要预授权第三步：着眼于单个权限，基于 CREATE 行为漏斗模型设计预授权弹窗和系统授权弹窗第四步：设计授权被拒绝后的交互流程授权设计过程中所遵循的设计原则总结如下：绝对不获取没必要的权限强化授权提示从利他角度设计授权弹窗的提示语，打消用户顾虑，提高用户信任度降低授权操作的难度，包括为用户拒绝授权后的再次授权提供快速跳转欢迎关注作者微信公众号：「腾讯设计族」本篇来源：优设网原文地址：https://www.uisdc.com/app-authorized-design
设计师 用户 需求方 如今的互联网岗位不断精细化，设计岗位也是如此，设计团队内的视觉设计师通常分为产品体验设计师和运营视觉设计师。产品体验设计师主要负责产品功能及体验设计，并为用户提供良好的使用体验。运营视觉设计师主要负责运营活动设计，通过设计引导用户关注参与活动，达成拉新、促活、成交等运营目标，有时兼顾产品功能和品牌推广的作用。更多运营设计干货：运营设计师如何快速上手主会场设计？来看京东的规范流程总结！文章主要讲述的是新手运营设计师在经验不足的情况下，如何快速上手主会场设计，以及通过流程的详细理解与归纳，巧妙避免由于不熟练而导致工作效率低下的问题。阅读文章 > 一、运营设计都干啥运营设计的工作范畴相对繁杂，不仅更换频率高，种类也比较多。从工作内容上可以细分为产品线上、新媒体平台、线下和其他辅助内容 4 大块。1. 产品线上包括专题、活动页面和入口设计；专题页：是指有主题的活动页面，我这里列举的是非营销主题的落地页，一般用来展示主题信息，以信息呈现为主要目的。运营活动：是以营销（拉新、促活等）为目的的落地页或系列页面。按照项目重要性，可分成 S 级、A 级和 B 级不同等级。AB 级一般指热点或日常运营活动，S 级指业务年度大促活动，往往兼顾多种目的并增加游戏玩法，设计时要通过合适的视觉效果来引起用户的兴趣并引导转化。这里需要提一下运营玩法，根据业务的目标策略常见的有增长类活动，比如助力领红包，砍价，团购等形式，以分裂拉新为主要目的。还有一类独立完成的小游戏，红包雨、抽奖等，以增加日活为目的或搭配综合活动。入口设计：包括各类 Banner、弹窗、浮窗和开屏页等广告位，是设计师日常接触最多的内容。虽然体量较小，但是运营活动转化重要的一环，直接影响活动效果。以 2021 房产春运为例，活动兼顾拉新、促活和品牌功能推广目的，主会场展示各类产品功能，并设有游戏专题页用来展示活动任务和奖品，小游戏简单好上手可以增加用户粘性，游戏任务深入到直播看房和在线付定金功能中，为业务倒流，形成了良性循环。2. 新媒体平台各大社交和短视频平台是当前产品运营的重要途径，包括微信生态中的小程序、公众号、视频号和社群，抖音和小红书等短视频及内容平台。而为电商店铺服务的运营设计师是更加专职的运营设计师，负责设计产品店铺日常及促销活动时的首页，详情页等。3. 线下设计线下设计接近传统平面设计，需要设计线下宣传制品，包括手册折页、易拉宝展板、海报等其他印刷制品，根据业务属性可能还有店面装饰以及装备设计等。4. 辅助设计这里把其他会涉及到的设计内容统称辅助设计，其实并不严谨，因为单独拿出任何一项都是可以细说的专业领域，比如字体设计，品牌策划、IP 设计，VI 手册，规范设计等。这里就不展开细致阐述了。二、干就完了，还要分阶段？按照工作流程顺序，我们可以把运营设计分成三个阶段——设计前、设计中及设计后。每个阶段根据合作对象和目的的不同，工作方法也有区别。1. 设计前——沟通① 理解项目和体验设计师一样，在开始设计工作之前，我们要先充分理解需求的目标、背景和用户。项目目标常见的运营项目目标有拉新、促活、回流和转化，即获取新的用户、活跃老用户、让流失的用户重新回流，以及实现商业转化创造价值。其次是产品目标，即巩固产品策略、建立品牌形象、提高品牌美誉度、实现品牌价值。最后还有行业目标，即提高设计影响力与行业影响力，这个目标相对是比较长期持续的。项目背景项目背景是目标的动机，此项目是基于哪个产品功能设计的，有没有之前的项目需要延续或比较，是否基于节日或其他热点展开等，总之要充分理解立项的动机。目标用户依照活动上线的不同平台，可以把用户分为共域和私域用户，私域用户更加精准，可以通过专业的用户分析得到他们的普世特征，思想和情感需求等，洞悉目标人群的特征才能实现精准的设计触达。② 沟通技巧既然是和需求方沟通，那沟通方法和技巧是设计前的工作核心，如何有效沟通是很多年轻设计师需要学习和掌握的。以设计师的角度主动参与。需求方的设计能力参差不同，有可能就是设计小白，不能明确表达期望的效果和风格，作为设计师尽量主动提供参考，以达到可视化的沟通和讨论，并在沟通过程中确定方向，作为开展设计工作的依据。预判风险。首先要和需求方沟通排期，给自己留出充足的创作时间；还要和技术团队沟通实现性，规避不能完成的效果，保证项目的顺利进行。此外还要保持专业度，也就是保持理性，沟通时从项目本身出发，不带有情绪和偏见。2. 设计中——合理在设计过程中设计师会通过一些创意方法，运用一些表现手法，最终落地设计输出，呈现完整的作品。创意方法比如联想，夸张、幽默等；表现手法包括插画，合成，三维，动态等，这里也不做具体讲解了。我们来聊聊设计工作中的合理性，合理性包括设计呈现的合理性和工作流程的合理性。① 设计合理传统的平面设计又称视觉传达，其概念是以视觉媒介为载体，利用视觉符号表现并传达信息，所构成的主要要素是文字，插图和标志。运营设计的基础即为视觉传达的，要向用户快速有效的传达信息，所以信息展示的合理性至关重要。怎样才叫合理呢？要看设计的目的是什么？结果导向反推设计的合理性。视觉内容越直观越好，现在是碎片化信息时代，用户大多是没有耐心和时间的，所以我们要通过设计把要传递的信息进行整合排序，提炼信息的主次关系，可以把利益点和有效信息重点突出，快速抓住用户眼球。之后再用设计将产品与用户建立起良好的关系，渗透产品功能甚至品牌价值。举个小例子：人眼习惯最先阅读文字，其次是颜色，插画等，所以文字需要清晰明了，阅读感需要流畅。调整后的弹窗阅读感流畅了，信息的主次关系也更明显。② 流程合理细化流程可以让工作流程更加合理，可以最大限度的规避返工风险。确定视觉风格和初稿阶段，根据需求目标和主题选择适合的设计风格，并和需求方确定后再开始初稿的搭建，草图可以在设计小组内部审核后再深入设计，避免过早陷入细节，造成返工。二稿阶段，围绕关键词进行视觉创意，表达创意内容，展示设计手法，并完整的展示需求方所要体现的所有信息，让对方能够理解创意和信息布局的合理性。运用专业能力完成设计图，在调性，氛围和细节把控上做到高级感。3. 设计后——体/验设计图完成后并不意味着工作的结束，需要在设计还原上跟进。“体”意为体现，跟进技术实现的效果，通过走查保证和设计图的同步；线下制作需要通过打烊保证成品的效果和质量。“验”意味验证，需要和需求方一起关注数据，线上项目可以通过后台数据反馈活动效果，还可通过问卷、访谈等方式得到用户真实的反馈，从而优化设计策略和方向。一个验证的例子，下图是 58 到家 APP 首页的一个弹窗，目的是为微信社群倒流。由左侧的样式更换成右侧更为简洁的红包样式后，点击率有了明显的提升，设计样式的变化直接影响了数据的变化。通过这样的数据验证，设计师可以和需求方一起探索更优的视觉呈现，为业务赋能。此外，项目结束后的总结和复盘，可以把项目过程中遇到的问题及时列出，通过数据整理分析，沉淀方法和经验。三、最后唠叨几句设计是服务于产品和用户之间的工具，作为设计师具备专业的思维能力是有必要的，如商业思维 (从宏观到微观考虑问题)，产品思维 (以用户为中心，思考产品的价值)，营销思维 (让别人认识你)等，作为运营设计师可以加强营销思维的建立为业务服务。此外，文案能力和交互能力在工作中也应用甚广，有时一些文案和交互问题在具体设计中才会暴露，需要和需求方和交互设计师一起共创。最后的最后，要与时俱进，不光是审美和表现技法上要与时俱进，运营设计师往往要做些内容相关的需求，对时事热点和话题也需要具有一定的敏感度，眼界上也要与时俱进，才能迸发出更多的创意和灵感。字体设计保姆级全方位教学！万字干货前言在平时的工作中，我们是否有考虑过运营设计的商业目标是什么？阅读文章 > 互联网下半场，运营设计师的生存之道宜信BXD 运营设计组 - 梅晓晓：2018年是人工智能重点发力的一年，关于「人工智能会完全取代设计师」的话语层出不穷，很多从业者倍感危机。阅读文章 > 欢迎关注「58UXD」的微信公众号：本篇来源：优设网原文地址：https://www.uisdc.com/introduction-to-operation-design
文案 用户 产品 相比美观的视觉设计，清晰的文案在界面呈现中同为重要，好的文案不止赋予产品更好的体验，也能够拉近用户与产品的距离，优化文案也常作为可用性测试后改良产品用户体验的落脚点。如果说信息架构、逻辑流程是产品交互的筋骨，那文案无疑就是血肉。有时产品经理给设计的需求和客户提供内容会有错字，语句不通顺，若设计师能够快速发现就可以体现出自己的专业，一般懂文案的设计师沟通和表达能力都不会太差，写好文案对于设计师来讲无疑是一件锦上添花的事情。设计是文案的视觉化呈现，文案是设计的思维表达，两者相辅相成，好的设计一定是懂文案的。「文案」这个词看起来好像很简单，且主观感觉优先级略低，但并不意味着它容易表述。一个好的文案说明是需要从多个角度出发考虑的，表述不清晰就会对用户造成误导。那么设计师如何写出好的文案呢？掌握这些小技巧，可以输出更容易让用户理解的文案。更多UX文案教程：如何写出优秀的UX文案？来看高手的总结！如何写出优秀的 UX 文案？阅读文章 > 一、清晰（突出重点 弱化次要）通过可用性测试可以了解文案的哪些部分是清晰的，哪些是迷惑用户的。对不清晰部分的文案进行细微的调整，能够产生巨大的改变。文案超过两行就需要用户更集中精力阅读，用户从而难免产生排斥心理，如果文字信息真的很多，可以把一段话整理分类依次竖向排列，同样可以给用户清晰及高效的阅读感受。例如平安云的隐私政策更新提示弹窗界面，设计师通过行间距将文本内容进行了分组，并且对标题文字进行了加粗和加大字号的处理，用户读起来会比较轻松。要对文案做好内容的平衡，若一次性显示太多不必要的信息，会扰乱界面给用户带来不必要的阅读与操作压力，需要谨记只有在用户有需要的前提下才展示这样的文案说明。对于辅助的说明文字可以稍做隐藏，用户需要的时候支持查看；提示文字不是只能设计成平铺直叙的只读文字，花了心思便可做得恰到好处。如下图，平安云账号中心的实名认证界面，关于对单位证件号的提示说明文字内容被隐藏，需要 hover 在问号 icon 上才会弹出提示，提示的内容以表格的形式呈现，并对各账号进行了举例说明，更便于用户理解，从而无障碍地进行表格的填写。尽量使用简单、直接、易于理解的词汇，让内容和指示更容易被用户接受和理解。间接、暧昧模糊的说法，生僻和过于“文雅”的用词，会增加用户的认知成本，所以应当尽量避免使用这类无法识别的词汇。二、一致（规范字数 结构一致 全局一致）一致性的文案设计可以帮助用户建立产品工作方式的心理模型，从而获得更好的用户体验。如果在产品中对同一事物使用不同的术语，比如用户点击页面 A 去到的是页面 B，用户就会感到困惑，在编写文案时保持一致性很重要。一些具体准则可以帮助我们达到这一目的。1. 规范字数：不同组件平均应该有多少个词？每个按钮一个、两个或多个词。尽量控制描述文字的字数，保持一致，使页面整齐美观。按钮的文字也尽量保持字数一致，可保证页面的稳定性。我们有时候看到很多文字有长有短，排除一些异常情况，确实是有很多情况我们可以对文案进行优化的，不是吗？2. 结构一致：确定文案的结构，是否仅包括一个动词或是动词与名词的组合（例如“动词”+“名词” 或 “动词” +a+ “名词” ）卷又卷不动，躺又躺不平，摆又摆不烂，死又死不了…哦吼，这是很多人的现状。瞧瞧这吐槽的段子都对称着，有些还压上韵了，我们写产品文案的时候就照着这个标准卷吧！3. 全局一致，同一个名词在产品中要保持一致，行动点名称尽量与跳转页面标题一致。如果你的新增按钮文案为新增 XXXX，那尽量所有的新增按钮文案都这样描述，不要有的是新增 xxx,有的是添加 XXX。例如：对内容的增删改查，在很多 B 端产品的页面表格操作下，通常会见到查看按钮，点击可看详情，这边建议尽量把查看改成详情呢，点详情不管接下来看到的是弹窗还是进入下一级页面，其标题叫详情或者 xxxx 详情，就做到了行动点名称与跳转页面标题一致有没有，这只是一个例子，我知道你可以做到举一反三。三、简洁（言简意赅 通俗易通）1. 使用熟悉的单词和短语也有助于减轻用户的认知负担。编写对话内容时应尽量避免使用“行业术语”“科技术语”、“专业词汇”、“方言用语”等（如 404、505、错误码 XXX 之类的描述），避免写出不具普遍性的对话内容，避免表述一件事情时绕来绕去，如使用双重否定表示肯定等让用户不易懂的文案，减少用户在操作前总是要去思考和陷入不知所措的情况。让用户明确的知道当前发生了什么，进而正确决定其接下来的行为。一个事情说了半天人家没明白你说的啥，那就说人话吧……特殊情况除外，例如你在疯狂星期四转发给朋友让他给你买KFC铺垫了很多很多巴拉巴拉的段子，朋友觉得你好有趣，一感动就跟你买了。当然这种情况你也可以直接说“我想吃KFC，给我买”，可能你朋友也会说“好的，买买买……”谁会拒绝一个打直球的吃货小可爱呐。建议对你的朋友足够了解后。再选择合适的措辞。正如我们在设计的时候是需要对用户足够了解才能写出更合适的文案。2、如果必须使用生僻的词汇，需要增加注释说明。发票金额是明白的，可开发票金额，哪些可以开，哪些不可以开，不表述清楚用户就不确定，需要通过注释去表述，腾讯云的设计还运用了公式去说明，相比文字描述“可开发票金额等于腾讯云可开票金额加云市场可开票金额”这样去进行文字说明要直观的多呐。3. 有效的文案应该是对话式的。告诉用户接下来的操作会导致的下一步的结果，就像与人在对话一样，这其实是一件比较难实现的事情，因为我们对所设计的产品以及每天遇到的行业术语非常熟悉。解决这个问题的一种方法是与用户一起测试，看 他们是否懂我们使用的语言。四、尊重（尊重用户 提示友好）1. 永远站在用户的角度考虑，当出错的时候不要责怪用户或使用命令或强迫的语气，多给予用户理解包容与支持鼓励，专注于解决问题，让其感受到产品足够多友好，感受到被尊重。2. 即使是需要用户承担相应的责任，文案也要克制，使用相对的语气将问题出现的原因或可能出现的结果反馈给用户。腾讯云的账号中心-安全设置界面：安全设置肯定是用户非常关心的，对于每种操作的解释说明，都平铺展示，用户可以一眼就 get 到自己需要的设置在哪操作，怎么操作。心里有数，不慌不忙。在新的设备上去登录微信，之前的设备会退出登录，微信使用的文案描述规则是：先摆出事实告诉用户现状，再说如果进行接下来的操作会导致的后果。这段文字在这里被标红，着重强调的样式更容易让用户知晓。当微信在其他设备登录时，需要常用设备进去确认。使用“平淡的语气”提到了如果设备不在身边或不是本人登录可以会导致的严重后果，让用户谨慎操作。3. 尽可能提供补救措施，降低用户的损失，利用文案对用户情绪进行安抚。辛辛苦苦 P 的“照骗”忘记保存了，好心碎，下次打开的时候，美图秀秀提醒“你之前有尚未保存的图片，是否继续编辑？”惊不惊喜？好开心，赶紧保存下来，发个朋友圈。五、严谨（无错别字 专业科学 形成闭环）充分了解用户背景才能用词专业、精准，采用专业适当、精炼准确的词语高效的传达信息，帮助用户理解。基本用语要规范，避免使用错别字，词句需要表达完整；专业用语需要精准，并且是所属行业认可的通用语言，不使用对目标用户来说难以理解的词语；时间的表述也必须要明确。六、利他（用户为主 提示友好）文案的表述应该让用户感受到我们是为了他在思考，功能的描述也可以以对用户有益处的方式去表达。腾讯云-费用中心-用量明细下载页面：对于页面数据的展示说明清晰描述了只展示付费后的产品，关于时间线也只支持近 6 个月的下载，但如果用户想要更多就可以去哪里下载。这些友好清晰的提示都是设计师花了心思设计呀！页面内容如果加载时间长，提前告诉用户，数据加载可能耗时较长，如果用户有其他的事情先去忙，稍后再返回页面查看数据结果。这么清楚的描述，简直爱了。七、语气（语调统一 凸显品牌）语言风格，要基于自身的业务，符合产品的调性。作为以技术为支撑的产品，在表达过程中要体现严谨、专业的风格，避免使用太口语化的语言，尤其是俗语和网络用语。在合适的场景下，用更富有人情味的语气与用户沟通，反馈信息，会提升使用感受，现在的产品设计不仅仅是人机交互，更是人与人之间的交互，要给用户更人性化的反馈。如下苹果官网的一些文字提示写的有非常通俗易懂。八、标点符号正确使用标点符号以及字母的大小写这些都属于交互设计的细节范畴，使用它们时也需要做到切合时宜，它代表着产品的规范与科学性，连符号都用错了，你的交互设计怎么可能让用户信任？另外符号在语言规范中也有增强语气，加深语言力度的作用，所以说符号的使用在交互文案设计中也是非常重要的。1. 中英文大小写产品名称缩写需要全部大写，如：ESC、SLB；但是特殊的产品品牌，例如：XFlush，需特殊处理。全英文的标题、标签、菜单项等等都要遵循英文句式中首字母大写的规范，正确使用专有名词的大小写规范。遵从行业规范，符合用户的认知，不会逼死强迫症，也凸显了产品专业。2. 阿拉伯数字统计数据使用阿拉伯数字，用户对于数字的感知速度更快，使用数字而非文字表述会更加有效；3. 标点符号可以省略不必要的断句点，帮助用户更加高效的扫视文本内容。元素单独出现时可以省略标点（例：标题、标签、输入框下的提示、悬停文本中的提示、表格中的句子）元素单独出现时也有需要加上标点（例：多句或多段的文案和列表内容、任何文字链前的句子）谨慎使用感叹号，感叹号用于表达强烈的情感，让文案显得过于感情化，容易让气氛变得过于激动和紧张，故尽量避免使用。九、文案不是万能的文案说明不可能解决所有的可用性问题，它并不能引导用户去操作一个拙劣的产品，若是产品设计有问题，应该优化的是产品本身，而不是完全通过文案来告诉用户如何去操作。如果不能简单的去解释行为， 就不能设计出好的产品。十、小结本文列举了一些简单的案例，这些案例可能只是一句话或者几个字的差异，就能带给产品不一样的感受；对业务逻辑和用户场景理解得足够深刻，我们方能用准确简洁的文案去解释。产品文案的优化需要产品设计流程中各个环节各个角色的共同努力，多思考批判，多梳理检查。学习是一个持之以恒的过程，需要有耐心，在深刻理解这些文案技巧的基础上再灵活运用，那么相信你的设计一定会更上一层楼。希望本文有帮助到各位，大家一起加油吧！写文案没灵感？这8款文案网站免费用！编者按：本文为大家收集了 8 款好用的文案网站神器，包括名言通、押韵助手、学句子、藏头诗生成器、朋友圈文案网站生成器、邻近词汇检索、彩虹屁生成器、句易网，让你写文案手到擒来。阅读文章 > 欢迎关注团队微信公众号：兆日 UCD本篇来源：优设网原文地址：https://www.uisdc.com/9-writter-tips
在路上
张大湿
落霞与孤鹜
表哥
飞翔的企鹅
