设计具有交互式设计的交互式画布。
浏览:299 时间:2022-2-12

本文不打算讨论如何使用Axure和xmind,因为该软件可以自学,并不打算成为科学交互设计。这就像解释什么是篮球,而不是教他们打篮球。我希望教你一些东西,我可以用它来立即解决问题。交互式设计画布是一个很好的工具,它可以帮助设计师从全球视角审视需求,找到真正的问题,并结合所有因素来提出可行的解决方案。

一,交互设计的核心要素

从实际问题开始。

小明是一位28岁的外国人,精通智能手机。他第一次来到北京。他想去Deshi Building看朋友,但经过10 0 177 lb 00到西二旗地铁站,我不知道怎么走,如果你是地图App的设计师,请设计一个步行导航功能帮助他顺利进入房地产。

△小明怎能到达德施大厦?

我们可以这样想。小明的出发点是西二旗地铁站。他现在的目标是去房地产大楼。事实上,这个目标意味着三个先决条件:

准确,它是对房地产,而不是其他地方。安全,不能走在路上,走出车祸。效率更高,真正的建筑并不遥远,用户肯定不想走在路上,可以更好。

从起点到目标,肯定会有一些步骤。我们将列出关键步骤,如下所示。

△要求,目标和关键步骤

现在我们一步一步地进行分析和设计。首先,手机启动应用程序。有一个启动界面。我们可以用一些口号来安抚小明因迷路而引起的焦虑。例如,“步行导航,找到方向不再困难”。

△启动界面

接下来,输入起点并使用手机的GPS定位功能自动显示地图上的当前位置。为了防止定位不准确,可以将起点更改为输入框,以确保可以随时修改。下一步是进入终点,显然还有一个输入框。启动导航后,此步骤肯定需要一个按钮来触发。这三个步骤非常接近,所以我在界面中做到了。

△导航设置界面

小明沿着航线走,是最关键的一步。除了在地图上显示真实建筑物的当前位置,路线和位置之外,还有其他因素可能影响导航的成功或失败。

例如,天气,地铁站附近的道路不是很好,所以我们需要根据天气给用户不同的路径。第二是光。小明白天是一座真正的建筑。它不是在晚上。白天的光线非常强烈。颜色太浅的界面可能有点不清楚。因此,设计应使用对比色并自动放入手机。亮度亮了。第三是用户的行为。稍微观察一下,当用户使用地图导航时,他们会首先查看地图,然后去,然后观察地图以确认它们是否正确。小明有可能越过地图看地图,所以当遇到关键的路线变化时,比如转弯的时刻,我们可以设置振动或语音来提醒用户打开手机查看线路。时间和改变旅行方向的时间。另外,我们更好地设计一个剩余的时间和距离,以减轻小明的焦虑,否则他不知道何时到达,心理会更加烦躁。

△导航界面设计

终于抵达了Deshi大楼。在这里你可以回忆一下,当你到达预定的位置时,你是如何确保到达的?一种方法是问附近的人,“这是一个真正的建筑吗?”这座建筑没有大的迹象。遗憾的是,房地产大楼似乎并非如此。因此,我们可以将真实建筑的图片放在界面上,方便用户与真实环境识别进行比较,然后提示用户完成导航,给出一个退出按钮,并进行初步设计。整个行人导航完成。

△导航完成界面

以上是交互设计的近似过程。

辛向阳(卡内基梅隆大学设计哲学博士,香港理工大学人机交互创始人,江南大学设计学院前院长)将交互设计归纳为五个核心要素:人,目标,场景,行为,工具(媒体)。

人们指的是用户,这是互动的主体,在这种情况下它指的是小明。目标是用户期望的结果。在这种情况下,小明希望结果准确,安全,高效地到达房地产。场景中,这个词更抽象,可以理解为用户的环境,如天气,灯光,旁边还有其他人等,可能会影响用户的行为。工具(媒体)指的是用户交互的对象,这里是移动电话上的地图应用程序。最后,行为是用户通过在媒体上制作行为(包括行为(点击,缩放)和其他行为(行走)来达到目标​​。

△交互设计的五个要素

因此,交互设计可以理解为:充分考虑用户,场景和媒体对目标的影响,并通过设计媒体的使用来提示用户实现目标来改变用户的行为。

△交互设计的五元图

不同的用户年龄,使用手机的熟练程度,职业,性别和心情都会对用户的目标产生很大影响。例如,上面的图片不是小明,是老明,50岁,从未使用过地图APP,眼睛和耳朵都不是很好,特别是在设计时,如文字和图形要特别大,最好可以用声音播放声音。场景:例如,天气,光线,雨天,你必须改变道路,车祸提醒用户注意的地方等等。工具,在这种情况下智能手机,如果没有打开GPS,你必须提醒用户打开它。如果您没有电源,则必须提醒用户充电等。有许多因素会影响用户实现目标。

交互设计师的作用是权衡这些影响因素,设计更好的解决方案,并帮助用户更好地实现目标。经验丰富的设计师和缺乏经验的设计师之间的差异之一是能够快速找到影响用户目标的主要因素。

二,交互式设计画布1.0

现在我们将这些元素组合到一个表中,以形成交互式设计画布1.0版。然后稍微改变前面的例子,如果小明从通州开车到德仕大厦,你就设计了驾驶导航功能。目标,场景和媒体有哪些变化?您如何设计媒体如何用于改变用户行为?

例如,目标,想一想,这个目标和步行目标之间的区别是——他必须首先在房地产大楼附近停车并步行到房地产大楼,所以这里的第一个目标应该是准确的安全,快速停在Deshi大楼附近的车。影响目标的其他因素和我在画布上列出的几个初始解决方案,欢迎添加。

△交互式设计画布1.0

使用交互式设计画布,您可以在分析需求时找到正确的方向,并以统一的方式考虑问题。设计方案不会出错。

第三,用户需求和业务需求

仅仅考虑用户的需求是不够的。很多时候,要求不是来自用户,而是来自公司的订单。如果您是百度网络磁盘的设计者,老板希望提高自动备份功能的开放率。你必须设计一个计划,你如何处理它?

我们可以根据业务需求或业务目标调用公司的订单,提高自动备份的开放率,并让更多用户打开自动照片备份。这是很好理解的。如果备份更多照片,用户偶尔会查看照片。如果没有百度网盘,产品粘性会增加,照片占用的空间越大,成本就越高。付款将为公司带来良好的利润。

我们前面提到的交互设计的五个要素的目标实际上是用户体验目标,因为这是用户想要实现的目标。业务目标和用户体验目标之间存在关联。业务目标是提高自动备份的开放率。为了实现我们的业务目标,我们必须让用户打开自动备份开关。换句话说,这里的用户体验目标是:更多用户打开自动备份开关。只有首先满足用户体验目标,才能实现业务目标。

△用户体验目标和业务目标

第四,用户行为如何受到影响?

下一步是我们的设计师如何分析如何让用户打开自动备份开关?

这是一个新的模式,动机,担忧和障碍。

动机是用户执行动作的驱动力。如果驱动力不够强,用户将不会采取行动。忧虑和动机恰恰相反。在用户采取行动之前,忧虑是用户关心的问题。如果怀疑越少,用户就越有可能采取行动。障碍是用户在行动过程中遇到的障碍。障碍越小,行动就越好。我们的用户体验目标是让更多用户打开自动备份开关。

△动机,忧虑和障碍

现在我们考虑可以为用户创建什么样的动机让他打开切换操作?

例如,某些用户可能希望节省手机空间,因此我希望备份额外的图片。也可以从旅行中回来并准备备份旅游者拍摄的一批照片。它也可能是由于外部诱惑,如打开自动备份发送10美元。

那么在用户打开自动备份之前有什么问题呢?例如,如果网络磁盘不安全,则不会泄露隐私。或者认为我们提供的空间不够大,仅仅支持一半的空间是不够的。还有一个网络磁盘不会不稳定,当数据丢失时,你找不到它。

动机和担心是在用户采取行动之前,障碍是用户的行动。如果你打开很多步骤,路径很长,或者界面内容很复杂,用户可能会放弃中间的自动备份。

△创造动力,消除顾虑,解决障碍

现在让我们看看下面的图片,看看竞争产品如何创造动力,消除顾虑并解决障碍。

△竞争产品如何创造动力,消除顾虑并解决障碍

有很多模型可以解释行为是如何发生的。例如,斯坦福大学教授BJ Fogg认为行为是由动机,能力和触发三位一体产生的。用户具有意志,能力,并且触发事件以生成行为。

△B=MAT

一般而言,人类行为受主观因素(个人情绪,思维,经验等)和客观因素(物理环境,社会环境,工具等)的影响,其中一些因素可能对用户行为有益。然后,当我们进行设计时,我们应该放大这些因素的影响来激励用户产生行为。我们应该引导和安抚导致行为伤害的因素。

△主观因素和客观因素影响用户行为

V.交互式设计Canvas 2.0

根据上述组合,形成了交互设计画布2.0。每次我们收到新请求后,在基本梳理和竞争产品分析后,我们都可以打印此画布来填充它(您也可以使用Axure组件库电子版)。新需求列用于填写需求方提供的背景信息,资源和限制。最后一栏机遇/挑战是填补上一部分因素的困难和灵感,初步解决方案等。

在项目期间,将填充的画布放在一个清晰的位置,提醒自己掌握整体情况,不要出错,如果你发现新的灵感和缺失限制,你也可以随时添加到画布。

人们思考和记忆的能力是有限的。在考虑某个角色时,他们往往会陷入困境甚至错过一些重要的条件。画布的意义在于提供思考的框架。没有必要用全额填充画布。它是好的,填补需要,甚至根据自己的习惯重新构建画布。

△交互式设计画布Axure电子版

△互动设计帆布正面

△交互式设计画布反转

无论是思考还是团队合作,画布都是非常有用的工具。除了我编译的交互式设计画布外,市场上还有其他类型的画布,例如商业模型画布和用户同理画布。

△Airbnb的商业模式画布,来源:http://blog.sina.com.cn/s/blog_8a9e31500102wszx.html

△用户同理画布

下载地址

以上图片是下载后包含的5个文件,下载地址:https://pan.baidu.com/s/1BdK-fJ8chkQfIzHPkWt99w,提取密码:6g6k