为流畅的用户体验创建完美的用户流程

发布日期:2018-08-13   来源链接:www.51kema.com

如果有人要求你定义“流程”这个词或描述一个例子,你会说什么?您是否会立即考虑与用户体验或交互设计相关的流程?也许......但是,也许不是。

在这篇文章中,我将描述如何根据我作为UX设计师的经验创建流畅的用户流程。

你可以考虑水的流量。例如,融雪如何流入瀑布和溪流,而瀑布和溪流又流入水库,湖泊和海洋。

照片1417444900330,dc44c79af021

您也可以考虑空气流量。您是否知道高尔夫球有凹坑来扰乱周围的空气流动(这会减少阻力),导致球比平滑的球飞得更远?

image05

图片来源:新不伦瑞克省旅游局(鲱鱼湾高尔夫球场,加拿大新不伦瑞克省),Creative Commons 2.0维基共享资源

您还可以在效率方面衡量流量(或缺乏流量)的成功程度。看看今年4月在风洞中合作解决流量问题的NASA和波音公司。

这些团队为波音757尾翼配备了特殊技术,可以提高飞行效率。这个影响?降低燃油消耗可能为航空公司节省数百万美元,这反过来可以节省飞机票数百美元,甚至数千美元的飞行常客。对我们来说听起来不错!


流程与UX设计的关系

那么所有这些“流动”的概念有什么共同之处呢?

  • 流程描绘了运动:通过水,空气,网站,应用等运动。
  • 流量是可变的:流量变化可能导致高尔夫球飞得更远(或不足); 一架飞机巡航速度更快(或有更多阻力); 和一个网上购物者轻松结账(或放弃她的购物车)。

长话短说,流量的概念很重要。您的网站或应用程序的成功通常取决于您的建模流程如何满足目标用户(角色)的需求以及您的业务需求。

因为低保真原型缺乏视觉细节,所以用户流程是原型的核心。Lo-fi原型可帮助您专注于为用户创建最顺畅的流程以实现其目标。

以用户为中心构建流程

在构建用户流时,您应该考虑的第一件事是什么?

这可能是显而易见的......你的用户!

例如,如果您正在设计允许用户创建报告并共享它们的商业智能工具,您将需要至少有两个流:数据使用者的一个流(即接收/审阅报告的用户)和完全数据分析师的单独流程(即用户构建/共享报告)。

屏幕截图2015-02-18 at 7.25.18 PM

在开始创建原型流之前,您应该清楚地了解您的角色的动机和需求。问问自己,是什么驱使我的人物角色以及他们想要完成什么?

一旦创建了角色,就可以更好地掌握用户目标。绘制出两组目标,以便了解原型需要完成的任务。

有关创建角色的模板和有用提示,请参阅免费电子书“用户体验设计过程和文档指南 ”中的“在潜入设计之前分析用户”一章。

考虑目标和入口点

如果您正在设计网站用户体验,那么在创建流程之前的另一个好习惯是确定并确定用户来自何处。根据Morgan Brown关于停止设计页面和开始设计流程的建议,我们建议您考虑以下Web或移动原型来源:

  • 直接流量
  • 有机搜索
  • 付费广告
  • 社交媒体
  • 推荐网站
  • 电子邮件

image07

不同的入口点定义不同的用户行为。对于想要在亚马逊上购买智能手机的人,请看下面假设情景的不同之处。

有机搜索访客:

  • 搜索iPhone的评论
  • 进入Amazon.com。
  • 使用搜索栏找到iPhone
  • 浏览更多iPhone评论
  • 使用搜索栏找到三星Galaxy
  • 浏览Galaxy评论
  • 返回原始iPhone亚马逊供应商
  • 买iPhone

直接访客:  

  • 进入Amazon.com
  • 使用搜索栏找到iPhone
  • 买iPhone

现在,我们并不是说比较购物体验那么简单(或直接和有机游客之间的行为总是黑白)。但是,我们说,您必须制定出这些不同的流程,以便提供全面顺畅的体验。

要查看基于这些入口点的一些示例流程,请查看文章使用用户进行构建:如何设计用户流程。作者Peep Laja创建了三个不同的用户流,每个流来自不同的入口点,并与特定的用户和业务目标保持一致。

创建流程大纲

此时,你应该知道:

  • 您将为哪些用户/角色设计流程
  • 需要完成哪些用户和业务目标
  • 您的用户来自哪里(即入口点)

现在,您可以考虑用户在特定页面上之前和之后发生的事情。与交互设计最佳实践中描述的一样,您可以链接页面并根据需要创建任意数量的流。

您可以开始探索不同页面流的一种快速方法是创建一个简单的流程大纲。在绘制草图或原型设计之前,书面大纲可帮助您探索应用或网站中最重要的部分 - 内容。围绕内容构建流程可以更准确地评估用户体验所需的总页数。

以下是一些概述流程的技巧。

写作第一种概述流程的方法

你可以使用Jessica Downey在她的文章“ Jumpstarting Your App Conception Without Sketching UI”中写到的写作优先方法。这种概述方法有助于充实想法并建立对您的应用或网站的每个页面的“共同理解”。

让我们为一个银行应用创建一个。场景:有人想打开自动存款。请注意,在下面的大纲中,[方括号]中的内容代表操作按钮/链接。

第1步:您想设置自动存款吗?

[设置自动存款]

 

第2步:选择存款频率

[每月一次] [每月两次]

[每隔一周] [每周]

第3步:每月存款一次

[选择日历日]

第4步:设置金额

显示金额字段

[设置自动存款]

概述流程的简写方法

您还可以尝试Ryan Singer在Basecamp使用 的速记方法。Ryan的方法将流程视为持续对话。

对于我们上面的银行应用程序示例,我们可以创建步骤2和3的简写,如下所示:

image01

草绘和原型设计流程

现在,我们已准备好为流量大纲和/或流量速记中的每个页面创建低保真度草图。草图将您的想法变为现实,并在布局和结构方面提供更多细节。创建草图后,一个简单的低保真原型可以帮助您与用户一起测试这些想法。

image04

您可以在各种不同的方式勾画出的用户流量,这表现在用户流量的这些例子,并流入导线从线框杂志。但是,在提交任何特定流程之前,请创建一个简单的原型来验证其与您的用户和业务目标的一致性。它不必是任何花哨的东西 - 您的原型可以在纸上完成,这样您就可以开始了解用户在内容和操作之间的流动方式。

image03

从那里,您可以继续在纸上迭代草图并将其剪切成纸质原型,或者转移到像UXPin这样的数字原型制作工具。

UXPin中的用户流原型

流动及其拆解的真实例子

现在我们已经向您展示了创建自己的用户流并将其转换为草图和低保真原型的过程,我们将为您提供一些有趣的用户入门实用 UX流程示例。

image02

用户入职是一个很好的场景,需要特殊技能来平衡用户需求和业务需求。用户想要尽可能少的学习曲线直接进入应用程序。该业务显然也希望用户潜入,但他们也想轻轻推动用户升级他们的计划。要查看我们正在谈论的解构的示例,我们强烈建议您参加用户入职。

您当然需要掌握有说服力的设计艺术,以便创建流程来教育用户,同时帮助他们发现升级的好处。

下一步

在掌握用户体验方面,绝对无法替代实践。

我在自己的职业生涯中使用过UXPin来创建用户流,交互式线框,低保真原型,甚至是动画原型。应用您在此学到的知识,随时创建一个免费帐户,以便您可以开始尝试。

我建议你首先将基本流程作为思维导图进行线框化(使每个框表示用户操作中的一个步骤)。一旦您感到满意,随意为每个页面构建线框,然后添加交互以使您的流程与原型一起生动。

  昭通科码科技有限公司,一站式互联网+智能化经营服务,用互联网科技铸就客户成功之道。
  提供企业和商铺一站式智能经营服务和互联网转型解决方案;包括云南微信开发、云南网站建设、云南APP开发、云南广告设计、云南营销推广 、云南电商服务、互联网转型等服务。
  科码科技一直顺应国家“网络强国”和“科技强国”的发展方向和“互联网+”发展战略,坚持用IT科技和互联网技术服务各行各业,指导客户用电商和新零售思维做思考和决策,帮助用户建立专业化和信息化的先进经营管理体系。

地址(总公司): 昭通市昭阳区珠泉路117号7楼

地址(分公司): 昆明市西山区大商汇茶城90栋3单元616室

电话: 0870-2858589


扫描关注公众号


科码科技   |   广告设计   |   营销推广   |   微信开发   |   网站建设   |   APP开发   |   电商服务   |   科码头条   |   案例展示   |   关于我们   |   网站地图

版权所有 © 2017-2030   昭通科码科技有限公司 滇ICP备18001393号-6 公安机关备案 53060202000062号

为流畅的用户体验创建完美的用户流程

发布日期:2018-08-13   来源链接:www.51kema.com

如果有人要求你定义“流程”这个词或描述一个例子,你会说什么?您是否会立即考虑与用户体验或交互设计相关的流程?也许......但是,也许不是。

在这篇文章中,我将描述如何根据我作为UX设计师的经验创建流畅的用户流程。

你可以考虑水的流量。例如,融雪如何流入瀑布和溪流,而瀑布和溪流又流入水库,湖泊和海洋。

照片1417444900330,dc44c79af021

您也可以考虑空气流量。您是否知道高尔夫球有凹坑来扰乱周围的空气流动(这会减少阻力),导致球比平滑的球飞得更远?

image05

图片来源:新不伦瑞克省旅游局(鲱鱼湾高尔夫球场,加拿大新不伦瑞克省),Creative Commons 2.0维基共享资源

您还可以在效率方面衡量流量(或缺乏流量)的成功程度。看看今年4月在风洞中合作解决流量问题的NASA和波音公司。

这些团队为波音757尾翼配备了特殊技术,可以提高飞行效率。这个影响?降低燃油消耗可能为航空公司节省数百万美元,这反过来可以节省飞机票数百美元,甚至数千美元的飞行常客。对我们来说听起来不错!


流程与UX设计的关系

那么所有这些“流动”的概念有什么共同之处呢?

  • 流程描绘了运动:通过水,空气,网站,应用等运动。
  • 流量是可变的:流量变化可能导致高尔夫球飞得更远(或不足); 一架飞机巡航速度更快(或有更多阻力); 和一个网上购物者轻松结账(或放弃她的购物车)。

长话短说,流量的概念很重要。您的网站或应用程序的成功通常取决于您的建模流程如何满足目标用户(角色)的需求以及您的业务需求。

因为低保真原型缺乏视觉细节,所以用户流程是原型的核心。Lo-fi原型可帮助您专注于为用户创建最顺畅的流程以实现其目标。

以用户为中心构建流程

在构建用户流时,您应该考虑的第一件事是什么?

这可能是显而易见的......你的用户!

例如,如果您正在设计允许用户创建报告并共享它们的商业智能工具,您将需要至少有两个流:数据使用者的一个流(即接收/审阅报告的用户)和完全数据分析师的单独流程(即用户构建/共享报告)。

屏幕截图2015-02-18 at 7.25.18 PM

在开始创建原型流之前,您应该清楚地了解您的角色的动机和需求。问问自己,是什么驱使我的人物角色以及他们想要完成什么?

一旦创建了角色,就可以更好地掌握用户目标。绘制出两组目标,以便了解原型需要完成的任务。

有关创建角色的模板和有用提示,请参阅免费电子书“用户体验设计过程和文档指南 ”中的“在潜入设计之前分析用户”一章。

考虑目标和入口点

如果您正在设计网站用户体验,那么在创建流程之前的另一个好习惯是确定并确定用户来自何处。根据Morgan Brown关于停止设计页面和开始设计流程的建议,我们建议您考虑以下Web或移动原型来源:

  • 直接流量
  • 有机搜索
  • 付费广告
  • 社交媒体
  • 推荐网站
  • 电子邮件

image07

不同的入口点定义不同的用户行为。对于想要在亚马逊上购买智能手机的人,请看下面假设情景的不同之处。

有机搜索访客:

  • 搜索iPhone的评论
  • 进入Amazon.com。
  • 使用搜索栏找到iPhone
  • 浏览更多iPhone评论
  • 使用搜索栏找到三星Galaxy
  • 浏览Galaxy评论
  • 返回原始iPhone亚马逊供应商
  • 买iPhone

直接访客:  

  • 进入Amazon.com
  • 使用搜索栏找到iPhone
  • 买iPhone

现在,我们并不是说比较购物体验那么简单(或直接和有机游客之间的行为总是黑白)。但是,我们说,您必须制定出这些不同的流程,以便提供全面顺畅的体验。

要查看基于这些入口点的一些示例流程,请查看文章使用用户进行构建:如何设计用户流程。作者Peep Laja创建了三个不同的用户流,每个流来自不同的入口点,并与特定的用户和业务目标保持一致。

创建流程大纲

此时,你应该知道:

  • 您将为哪些用户/角色设计流程
  • 需要完成哪些用户和业务目标
  • 您的用户来自哪里(即入口点)

现在,您可以考虑用户在特定页面上之前和之后发生的事情。与交互设计最佳实践中描述的一样,您可以链接页面并根据需要创建任意数量的流。

您可以开始探索不同页面流的一种快速方法是创建一个简单的流程大纲。在绘制草图或原型设计之前,书面大纲可帮助您探索应用或网站中最重要的部分 - 内容。围绕内容构建流程可以更准确地评估用户体验所需的总页数。

以下是一些概述流程的技巧。

写作第一种概述流程的方法

你可以使用Jessica Downey在她的文章“ Jumpstarting Your App Conception Without Sketching UI”中写到的写作优先方法。这种概述方法有助于充实想法并建立对您的应用或网站的每个页面的“共同理解”。

让我们为一个银行应用创建一个。场景:有人想打开自动存款。请注意,在下面的大纲中,[方括号]中的内容代表操作按钮/链接。

第1步:您想设置自动存款吗?

[设置自动存款]

 

第2步:选择存款频率

[每月一次] [每月两次]

[每隔一周] [每周]

第3步:每月存款一次

[选择日历日]

第4步:设置金额

显示金额字段

[设置自动存款]

概述流程的简写方法

您还可以尝试Ryan Singer在Basecamp使用 的速记方法。Ryan的方法将流程视为持续对话。

对于我们上面的银行应用程序示例,我们可以创建步骤2和3的简写,如下所示:

image01

草绘和原型设计流程

现在,我们已准备好为流量大纲和/或流量速记中的每个页面创建低保真度草图。草图将您的想法变为现实,并在布局和结构方面提供更多细节。创建草图后,一个简单的低保真原型可以帮助您与用户一起测试这些想法。

image04

您可以在各种不同的方式勾画出的用户流量,这表现在用户流量的这些例子,并流入导线从线框杂志。但是,在提交任何特定流程之前,请创建一个简单的原型来验证其与您的用户和业务目标的一致性。它不必是任何花哨的东西 - 您的原型可以在纸上完成,这样您就可以开始了解用户在内容和操作之间的流动方式。

image03

从那里,您可以继续在纸上迭代草图并将其剪切成纸质原型,或者转移到像UXPin这样的数字原型制作工具。

UXPin中的用户流原型

流动及其拆解的真实例子

现在我们已经向您展示了创建自己的用户流并将其转换为草图和低保真原型的过程,我们将为您提供一些有趣的用户入门实用 UX流程示例。

image02

用户入职是一个很好的场景,需要特殊技能来平衡用户需求和业务需求。用户想要尽可能少的学习曲线直接进入应用程序。该业务显然也希望用户潜入,但他们也想轻轻推动用户升级他们的计划。要查看我们正在谈论的解构的示例,我们强烈建议您参加用户入职。

您当然需要掌握有说服力的设计艺术,以便创建流程来教育用户,同时帮助他们发现升级的好处。

下一步

在掌握用户体验方面,绝对无法替代实践。

我在自己的职业生涯中使用过UXPin来创建用户流,交互式线框,低保真原型,甚至是动画原型。应用您在此学到的知识,随时创建一个免费帐户,以便您可以开始尝试。

我建议你首先将基本流程作为思维导图进行线框化(使每个框表示用户操作中的一个步骤)。一旦您感到满意,随意为每个页面构建线框,然后添加交互以使您的流程与原型一起生动。