发生一个或多个错误。。_Material Design 错误

当应用程序无法完成预期的操作时会发生错误。

一些错误示例包括:

  • 当用户输入不被理解时
  • 应用无法加载
  • 不兼容的操作同时运行

用法

当应用程序无法完成操作时会发生错误,例如:

  • 该应用程序不了解用户输入
  • 系统或应用程序失败
  • 用户打算同时运行不兼容的操作

通过设计便于用户轻松输入信息的应用程序,最大限度地减少错误。应用应接受使用可用性的常见数据格式,以提高用户的理解。
解决错误:

  • 清楚地传达正在发生的事情
  • 描述用户如何解决它
  • 保留尽可能多的用户输入的输入

用户输入错误

帮助用户在检测到输入错误后立即修复输入错误。如果检测到错误,则禁用表单提交,如果仅在表单提交后检测到,则清楚地解释错误以及如何修复错误。

文本字段输入

在用户与表单上的每个字段交互之前,期间或之后,可以包括帮助文本

仅在用户与字段交互后显示错误文本。如果用户输入不正确的数据,帮助文本可能会转换为错误文本。

将表单文本最小化到基本要素。并非每个文本字段都需要帮助和/或错误文本。

规格:

在文本字段之间和错误文本下方放置16dp的垂直空间。

87ffa451664cff625042ad90f83de857.png
文本字段输入的示例

3d8707ef363cf411a1e96317fa713d87.png
输入错误文本的文本字段示例

表格提交

默认情况下应启用“提交”按钮。
如果您正在执行内联表单验证,并且带有错误的字段已清楚标记,则可以禁用提交按钮,直到错误得到纠正。

颜色

错误文本应反映产品的调色板。建议您使用对比色来表示错误状态,例如红色或橙色等较暖的色调。

错误文本应清晰易读,与背景颜色形成鲜明对比。

浅色背景的字体

  • 错误:Roboto Regular 12sp
  • 提示和帮助文本:#000000,不透明度为38%

dc0b16fdd8317cd7c3e8968d381c2116.png

深色背景的字体

  • 错误:Roboto Regular 12sp
  • 提示和帮助文本:#FFFFFF,不透明度为50%

a7356051c232cc45f37b3c67586fd98a.png

帮助文本和错误文本

220f017af7ef17c8d596ec5dbe0023de.png
帮助文本示例

f498c23323368b449c7763aabf8f4645.png
带错误文本的示例

a0beee6b17aba584d4477d567eb35570.png
帮助文本示例

7e3465a56665ab9307fde187c8c3b5b9.png
带错误文本的示例

f54ebb6226baa8281164eb027515ee18.png
带有辅助文本的普通示例和带有帮助文本和错误文本的普通示例

696f7958dec38c6a13125dc1fba1baf6.png
输入和错误文本

浮动文本标签时出错

0bc4b272fdf9181389c067874133c399.png
带输入文本的浮动文本标签示例

68aa2b14392e1a5cf1e4c1f1290d3031.png
带有错误文本的浮动文本标签示例

1bb7e72adeff1fd0f32e6a40f8b7b4e4.png
带有提示文本/标签的普通示例和带有输入文本,标签和错误的普通示例

d5084b97a8efc42f74afbbf5f5244f41.png
浮动文本标签的规范

文本字段输入 - 大于/小于字符或字数

可以在用户与字段交互之前,期间和之后显示字符计数器。在用户接近字符限制之前,请考虑不显示计数器。

  • 计数器字体是Roboto Regular 12sp
  • 计数器字段具有16dp的额外底部填充

094de305f7e703107972164517b0c20f.png
带有字符计数器和用户输入文本的单行输入标签示例

d3769975366c2fe123d776fcf0d41c90.png
带有字符计数器和错误文本的单行输入标签示例

e88671a6e3eee912575ea11606111142.png
带有字符计数器和用户输入文本的多行输入标签示例

0ba17f97ca6cf4a007d5c42fd974d032.png
带有字符计数器和错误文本的多行输入标签示例

8b77015c80d7139b85b9bfad18012f5b.png
这些状态的示例:带有用户输入文本的单行输入标签,带有错误文本的单行输入标签,带有用户输入文本的单行输入标签,带有错误文本的多行输入标签

e74b472d46c4ec99706c069ab56eb469.png
文本字段输入

不相容的价值观

在用户与文本字段交互期间或之后显示不兼容值的错误。

如果两个或多个字段具有不兼容的输入:

  • 在文本字段中,指示需要修复。在下面添加错误消息。
  • 在表单或屏幕顶部显示消息,总结所需的修补程序以及任何其他说明

表单提交时检测到的错误

使用合并的错误消息重新加载表单并在顶部滚动位置。当用户在表单中工作时,可以解析各个字段的错误消息。

3273307b9e9242c5c46e8b04205a9dd0.png
表格示例

650ebcdb33eace53982136798adf307b.png
尝试表单提交后检测到的错误示例

形式不完整

空表单字段应由下面的文本字段和错误消息指示。

显示不完整的表单错误,以指示用户在通过表单前进后跳过字段。如果无法通过表单检测用户进度,请在用户尝试提交表单后显示错误。

表单提交前有多个错误

当用户在表单中工作时,单独标记错误消息。

3273307b9e9242c5c46e8b04205a9dd0.png
表单示例

4e0e0a0361c7c3272726af36edb28a19.png
不完整表单的示例

620e8690203b0afb1570fd9377dbf56d.png
单行列表错误的示例

应用错误

应用程序错误与用户输入无关。
常规应用错误
发生错误时,应用程序应显示加载指示符,直到出现错误消息。
UI中可能会将未指定的功能指示为已禁用。例如,按钮不能显示为禁用状态,与文本配对说明它不可用。并非每个错误都需要弹出一个新组件。
如果可能,请为您的用户提供一个有助于他们解决错误的操作。

18b8223f64de00353c179f7b8b87cf64.png
警报对话框:应用程序反馈有关阻止正常操作的错误

7661da5e538c77275d5142cabe7748a9.png
包含有关外围错误的应用反馈。Snackbars是短暂的。不要将它们用于严重,持久或批量错误。

同步错误/加载失败

当同步关闭或内容无法加载时,用户应该能够尽可能多地与应用程序的其余部分进行交互。

c223b5b8cf7ae32de4585fba0909289e.png
屏幕/内容无法加载的空状态

677f46a77bb5171f5c0c63b23bc4f159.png
带有操作的容器/组件特定错误

连接

当连接断开时,用户应该能够尽可能多地与应用程序的其余部分进行交互。

如果合适,提供一个链接以帮助用户完成他们的任务。仅提供您实际可以支持的链接。例如,如果您可以检测到操作失败,请不要提供“再试一次”等选项。

18bca56c83d054fddef64a5e24283c28.png
Snackbar有重试的动作

0daefe7c6b8540f8d3e904f0ced70ba3.png
仅在线可用的屏幕的空状态

不兼容的状态错误

当用户尝试运行冲突操作时会发生不兼容的状态错误,例如在飞行模式下拨打电话或从受限制的工作帐户截取屏幕截图。通过清楚地传达他们正在选择的状态以及对其余经历的影响,帮助防止用户进入这些情境。触发这些错误时,不要暗示它们是用户的错误。

一般不兼容
澄清错误的原因和起源。
例如,在受限模式下不允许使用屏幕截图和高级功能。

5d049d129dc12f4a732ef95ccb554d78.png
Snackbar +特殊模式指示器

离线选择

当用户离线但尝试执行需要联机的任务时,显示不显眼的持久性指示符。

例子:

  • 在飞行模式下拨打电话
  • 离线时的音乐可用性

7d2d5e4364a7517ca2d440160cad2382.png


请求许可

如果您的应用在继续操作之前需要用户权限,请在应用流程中包含权限请求,而不是将其视为错误。

如果在第一次运行应用程序之前需要权限,请考虑将它们包含在应用程序的首次运行体验中。

例子:

  • 应用的权限已更改
  • 应用内购买已停用

a368d64818b5306a582dc3bd1e7a4071.png
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值