恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
设计模式 | 宏 Macros:如何让用户快捷完成自定义操作
0.0°
2022-01-11 原创文章 经验/观点 举报 878 0 0 0

作者:空谷,蚂蚁集团设计师

本文是《设计模式周周看·Ant Design 为你讲透设计模式》周刊的第二十三期内容,上期为你介绍了交互操作的一种设计模式历史记录,本期介绍另一种交互操作的模式:宏。


What 是什么

简介: 「宏」是一种创建指令集来减少用户交互操作的设计模式。用户可以通过记录或把一系列操作放在一起来创建一个宏以供复用。指令集在集合里包含了其他一些小的操作,往往可以节省大量时间,提高工作流程效率。

例子: macOS 的快捷指令,就运用了宏这种模式。用户可以录制自己的快捷指令,高效地完成复杂任务流程。


Why 为什么

没有人想要一次又一次地重复执行同样一组交互式的任务。这正是计算机应该擅长的。用户的行为模式其中有一个叫做简化重复工作(Streamlined Repetition),宏就是可以为它提供很好的支持机制。

显然,使用宏命令可以帮助用户加快工作。而且,通过减少命令个数和需要进行的动作来完成某项任务,他们也减少了可能的手指滑动、疏忽和遗漏,以及类似的错误。

当用户可以把一长串操作压缩到一个命令或一个快捷键的时候,也会增强心流体验 —— 用户可以在更短的时间内,花更少的精力来完成更多的工作,而且可以一直保持更高层的目标而不会陷入各种细节中。


When 什么时候使用

用户想重复一长串操作或命令。他们可能想要把这些操作或命令重复作用在文件列表,数据库记录或其他对象上,例如对每个对象进行相同的操作。


How 如何使用

任何时候,为用户提供某种方式来“记录”一系列操作,并且可以随时很容易地 “回放” 它们,而且在操作上需要像一个简单命令、一个按钮或一次拖拽一样简单。


定义宏

用户应该能够按自己的需求命名宏,这样用户就可以用按自己的认知理解这个操作序列。用户可以检查自己所做的工作,或者重新查看一个已经忘记的操作列表来看它到底做了些什么(和命令历史模式里一样)。让一个宏可以引用另一个宏,这样的话,它们可以建立在其他宏的基础之上。

用户肯定会想保存这些宏,以备下次使用,因此确认它们是持久的被保存到文件或数据库中。把它们显示在一个可以搜索、排序甚至分类的列表里,具体呈现方式按用户的需要而定。


执行宏

宏本身可以回放,来让操作更简单;或者如果它作用在某个对象上,而这个对象可以从一种调用方式转换到另一种调用方式,那么你可以允许这些操作带参数(例如,使用一个占位符或者变量而不只是一个对象本身)。宏也应该能一次作用在多个对象上。

这些宏的名字(或者调用它们的控件)如何展示基本上取决于该应用程序的本质,考虑以“内建”的操作来显示它们而不是使其处于次要地位。

记录这些操作顺序的能力,再加上宏与宏彼此引用的能力,可以让用户有机会发明一些全新的语言化或可视化的语法 —— 一种很好地协调他们自己工作环境和工作习惯的语法。这是一种非常强大的能力。事实上,这就是编程,但是,如果你的用户并不认为他们自己是程序员,那么不要把它叫做编程,否则你会把他们吓走(“我根本就不会编程,我没法完成这样的工作”)。


Example 案例

Photoshop CC

Adobe Photoshop CC 中具有广泛的宏功能应用。主要功能是创建或记录复杂的多步图像编辑和转换命令。这在 Photoshop 中叫做“动作”。通过自动化和复用,使用“动作”显著加速了图像工作流。以下示例中,在左侧,选中了一个名为“综合色调(Sepia Toning)”的动作来显示该动作中依次发生的多个嵌套步骤。在右侧,动作菜单显示了录制、编辑和微调复杂的多步骤动作的选项。

Photoshop中的批处理菜单和对话框。这是另一个宏生成器。这些是用户创建的工作流脚本,用于指导Photoshop从一个位置打开图像,应用保存的操作,并将具有指定命名的图像保存在另一个位置。这甚至节省了更多的时间,因为用户不需要手动打开每个图像来应用动作宏。通过这种方式,用户可以快速、自动地处理大量文件,节省大量的人工劳动。


IFTTT

现在,可以将不同的Web应用程序,服务和平台集成在一起并编写脚本,就像它们是一个应用程序一样。 IFTTT是用于实现此操作的Web应用程序。拥有API访问权限并与IFTTT平台集成的第三方软件公司可供使用。给定的客户可以提供他们对IFTTT的第三方登录,并开始用宏连接他们不同的网络应用程序,(在IFTTT中称为“recipes”),以完成工作。

以下是IFTTT recipes可以执行的一些示例:

  • 在所有社交媒体帐户中同步个人资料照片
  • 自动将图像文件从社交媒体备份到云存储帐户
  • 根据您的手机打开/关闭家庭自动化设备
  • 将社交媒体帖子保存到云电子表格
  • 将健身数据从设备保存到云电子表格


IFTTT recipes 是通过向在线帐户提供登录凭据,然后使用 IFTTT 网络应用程序构建简单的宏来构建的。


屏幕中短语 “ 如果[ Twitter ] 那么 [ + ]”是一个正在被创造的宏。第一部分准备就绪。此帐户已与其 Twitter 帐户集成。选择 Twitter 图标将打开另一个屏幕,用于为宏配置Twitter驱动的触发器。下一步是配置 “那么” 步骤。例如,将每条推文记录到 Google 电子表格中。这些是 IFTTT 或其他集成 Internet 服务应执行的操作。这些宏允许集成未连接的网络应用和服务的定制自动化业务流程。


Microsoft Excel 

Microsoft Excel 允许对宏进行记录,命名,与文档一起存储,甚至配有快捷键。 在本例中,用户可以录制一个宏,然后在编程环境中进行编辑 (Excel中包含一个轻量级的Visual Basic编辑器)。用户记录宏来处理数据和操作电子表格。可以对其进行编辑和保存以供重复使用。

如果你正在开发一个真正可编写脚本的应用程序,那么从 Excel 中得到的教训就是要考虑这样的宏是如何被滥用的。考虑对通过宏可以完成的操作施加约束。


更多案例

你可以在下方查看「宏 」更多的案例:

https://airtable.com/shrvVNyfZPVZypDtn


共建计划

https://airtable.com/shrb1W6EL9t6JdbKW

注:本模式来源《Designing Interfaces》,案例由 Ant Design 团队收集整理,如有侵权请联系删除。


2021 年期 Ant Design 设计周刊《设计模式周周看——Ant Design 为你讲透设计模式》,是由 Ant Design 的设计师编写的设计方法内容。欢迎大家关注@AnT Designer及 Ant Design 专栏,获取第一时间更新:

https://www.zhihu.com/column/c_1310524851418480640

我们怀着满腔热情,希望可以将这份周刊作为交互体验教案级别的内容呈现给大家,也欢迎大家向我们提出宝贵意见。

Powered by Froala Editor

更新:2022-01-11

收藏

0人已收藏

Ant Design

企业级产品设计体系,创造高效愉悦的工作体验

  • 59

    作品

  • 568

    粉丝

  • 1

    关注

  • 设计模式丨历史记录:让用户的操作有迹可循
  • 设计模式 | 多级撤销 Multilevel Undo:让用
  • 设计模式 | 撤销按钮:让用户更有掌控感
  • 设计模式丨加载提示:如何让用户看到任务执行进度?

    猜你喜欢

      2022-01-11 原创文章 经验/观点 举报 878 0 0 0

      设计模式 | 宏 Macros:如何让用户快捷完成自定义操作

      0.0°

      你确定要举报设计模式 | 宏 Macros:如何让用户快捷完成自定义操作

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2022年01月11日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      0
      0
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录