小团队的敏捷开发的特性，导致开发体系的不完整，往往需要设计师快速的输出设计产物。后台产品具有交互上的复杂性和使用角色背景等不同的特性，往往会导致我们在设计过程中，只注意到了对正向的逻辑进行设计，而忽视了逆向逻辑以及对新用户的引导，从而导致产品的用户体验不好。用户在操作前后没有合适的引导反馈。
针对这一问题，我们从容错设计出发，分析操作前后的使用场景，总结常用后台组建在操作前后的运用。
文章目录：
什么是容错设计
操作前—引导提示/防患于未然
操作后—结果反馈/帮助纠正
总结
什么是容错设计：
百度百科的解释为：“ 容错设计是允许操作者产生失误行为的设计行为 ”
操作前 - 引导提示，防患于未然
引导提示，帮助用户学习，减少用户在使用过程中的焦虑感，防患用户在后期使用过程期间可能会范的错误。
气泡卡片组建
点击或者移入时，弹出气泡式的卡片浮层。
实例：
用户在第一次进入系统时在，主动出现的弹出气泡框，指导用户的下一步操作。
警告提示组建
某个页面需要向用户提示展示需要关注的信息的时候，始终显示在某个位置，不会自动消失，可关闭。
实例：
关键信息提示，告知用户当前需要注意的信息，减少用户犯错的几率。
限制用户行为
在操作前适当限制用户的某些行为，避免用户出错。
实例：
在登陆的时候，用户没有输入完，按钮默认不可点击状态，输入完成后，按钮变为可点击状态，避免用户无意义的行为。
文字提示组建（提供帮助）
用户进行操作时，可能对此任务不太了解，可使用文字气泡框进行提醒。文字提示气泡框，在鼠标悬停时显示出现，移出时消失。
实例：
由于后台系统的复杂性和专业性，一些涉及专业的icon，用户不能够直接明白含义，所以我们采用文字提示组建，增加用户识别度，预防用户出错。
气泡框组建
一些重要的的元素操作需要用户进一步的确认时，在相应元素附近弹出浮层提示，询问用户，是否继续此操作，比如提示说明，需要引导用户操作时，或者增加用户某些操作难度时出现。
实例：
在删除表格项时，由于删除此项目的不可恢复性，需要询问用户是否需要删除，我们需要用到气泡框提示。
操作后 - 结果反馈/帮助纠正
用户在操作某个功能后，系统如果没有明确的提醒，容易引起误操作，例如：重复点击某按钮。如果操作后反馈没有及时告知用户错误的原因以及如何修改，用户会感受到极大挫折感。
对话框提示组建
模态对话框，当用户执行重要操作时，或者操作不可逆时，询问用户，让用户知道操作结果，需给出确认操作的提示，在浮层中显示一般出现在一些不可逆的操作时出现，例如：确认信息、错误提示等。
实例：
在删除重要数据时，需要增加用户的操作难度，以及提醒用户次操作的重要性，我们需要用到对话框提示。
全局提示组建
操作后的反馈提示，轻量级的反馈组件，不打断用户当前的操作流程，一般出现1-3秒结束，toast与弹出框相比对界面的遮挡很少，不会阻断当前用户的心里流，建议从上往下滑动提示。
运用
用于在点击某个主要操作后，告知用户操作结果，我们用全局提示
通知提示组建
一般时系统的主动推送，内容会较为复杂，在右上角显示通知提请，告知用户下一步行动、系统信息推送时出现，可关闭。
运用
更新系统后，进入系统时，系统会主动告知当前使用者，当前系统更新了那些内容。
输入框反馈组建
输入信息是后台交互设计中最为常用的功能之一，对用户输入的信息进行实时检验，告知用户错误原因，并提供帮助。
运用
当用户输入自己的密码之后，即被告知用户这个动作的含义（信息要清晰、精炼、忌空泛、模糊），到底是输入正确还是输入错误。
加载中组建
用于页面和模块的加载状态，减少用户的焦虑，常在和后台交互数据等待时间过长的时候出现。
运用：
在查看某些数据时，由于数据量过大，可能会导致图表数据的加载过长，我们需要用到加载中的组建，合适且符合产品调性的动画会更好。
进度条组建
告知用户当前任务或操作完成的百分比，减少用户焦虑。
运用：
在上传文件时，我们需要了解上传的状态，需要用到进度条。
系统异常提示
系统运行出现异常情况时出现，告知用户发生的原因，并帮助提供帮助方案。在制作此类提示时一般从情感化设计和情绪板入手，减少用户在使用过程中的焦虑感和受挫感。
总结：
本文从容错设计入手，针对ant.design和iviewui所提供的反馈组建，分析这些组建在后台系统中运用，但是在实际的使用过程中，我们还需要针对具体的使用场景进行运用，ant.design和iviewui所提供的这些组建，使我们在工作当中，针对实现方案和前端据理力争，有反驳的依据。
参考：
http://www.woshipm.com/pd/727110.html
http://www.woshipm.com/pd/396100.html
天道酬勤
2
作品
10
粉丝
72
关注
大牛，别默默的看了，快登录帮我点评一下吧！:)
登录 立即注册