8个 UX设计技术

2019-11-09 13:44:29

字体：大中小

来源：转载

供稿：网友

如果你认为数字设计是由photoshop框架勾勒出的阴影部分，恐怕你错了。我们已经谈到了产品设计师的工作，从我们的设计师的作品和谈话判断，我说，没有成功的项目没有有才干的人被聘用在设计师的位置。如果我错了，纠正我。专业设计接近工程，无论是一个购物清单的MVP还是粒子砸的超级对撞机。设计不是最终产品，你可以看看和玩，它是一个漫长的过程和负载的工作之前的最终结果。为移动应用创建UX设计，我们的目标是提供一个成功的高质量产品，以满足客户的要求和最终用户的愿望。为了实现这一点，我们将所有的设计过程划分为用户体验技术。

角色

无论你要做什么，总有最困难的阶段，这个阶段是开始。一旦你拿铅笔做第一笔，它变得更容易。但是这第一冲程应该是什么样子？换句话说，什么是设计过程的开始？第一个设计应用程序的UX技术是关于识别角色。主角，次要线索和所有那些家伙附加谁永远不会说话？不完全是，但这些人也很重要，无论你叫什么。

UX design techniques

角色不一定只属于人。他们可以是产品的最终用户，移动设备，应用程序将与之通信的服务器，应用程序将要投放的组织以及在使用时与最终产品进行互动的所有其他角色。我们需要确定角色，以便了解我们计划增长产品的生态系统。一旦完成，将更容易概述用户体验环境以定义应用程序将要执行的功能，以及每个角色必须完成的工作范围。

记事板制作

现在它真的听起来像小说。顺便说一下，你知道，在邀请演员和拍摄场景之前，电影创作者坐下来画画吗？他们需要在视觉上理解行动的顺序，每个电影帧的内容，最有利的时刻，弱点和更多。这里是Matrix的styleboard。还记得电影里的剧集吗？

UX design techniques. Storyboarding

电影制作中使用的故事板是一个例子。但是，只要我们谈论与图形相关的设计，为什么不回顾人类文字的历史呢？它从故事板开始 - 岩石雕刻，壁画，在笼子墙壁上的动物和所有这一切。显然，说明事物最好理解任何概念或想法。回到我们的数字时代，我们如何在移动应用设计中使用故事板？我们可以绘制漫画与不同的字符和情况！你认为如果情况像一天一样清楚，并且像黑白一样简单，你可以跳过这一步？继续，但是有一个很大的风险，忽略这样一个重要的技术将不会对你的产品的成功做任何好处。常见的错误是认为，在一见可见的情况下，琐碎不需要拼写。但是，一旦你采取一个简单的场景，用户与您的产品互动，并将其分解为小块，你会注意到很多你没有注意的问题。故事板正是你需要考虑所有的细微差别，确定设计解决方案，并把它们放在首位。这一步的重点是从团队成员和客户那里找到我们想要的“a-Ha”时刻。想知道什么是“a-Ha”的时刻？这是启蒙的时刻，当你得到的是什么是什么，为什么的想法。故事板帮助我们找到问题并解决它们。它可以防止将来可能出现的问题，因为后来发现它们显然会花费你更多。我们将在设计中犯许多错误。完美需要错误。但是它们变得可见的越快，它们将被纠正得越快。美国电影导演安德鲁·斯坦顿（Andrew Stanton）说：“我的策略一直是：尽可能快地错误。故事板帮助我们思考。它帮助我们了解现有的情景，以及测试潜在情景的假设。说明想法非常有助于他人更好地了解我们想说什么。它就像解释在城市火车站的方向。你把它画在一张纸上，任何随意的路人都知道如何从他们现在的地点到他们想要的目的地。

UX design techniques. Storyboarding

设计师的主要技能不是Photoshop，而是能够描述和描述情境或场景。你将产品的用户分成一组不同的字符，并尝试可能发生在特定字符的各种故事。然后，您以百分比评估情况的概率，并采取措施实现最佳的用户体验。

用例图/行为图

行为图描述了外部用户（演员）的视觉行为。它标识每个actor可以采取的确切操作。例如，如果我们谈论图书馆，这里有两个演员。一个是图书馆员，另一个是图书馆客户。图书馆客户可以搜索或借书，而图书馆员可以搜索图书，添加图书和删除图书。在我们的领域，例如贺卡应用将有两个演员，其中一个将是一个祝贺，另一个 - 一个生日男孩。 Congratulator可以登录Facebook，从Facebook的朋友列表中选择一个朋友，选择一张卡片，写他的愿望，并发送一张卡片给生日男孩。让我们假设，后者没有在他的移动设备上安装这个应用程序。他可以得到他知道的人发送的贺卡的通知，来到应用商店并安装贺卡应用程序。一旦在那里，生日男孩可以收到卡，喜欢它，并做任何你希望他做的，以启用与Congratulator的互动 - 发送回复，例如。看下面这个案例的行为图。

UX design techniques. Use case diagram

用户故事/行为规范

这部分是每个用户案例的实际书面描述，与您的产品的互动可以产生。我们在专门针对QA测试方法的文章中讨论了用户故事。所有用户故事以“作为用户我可以...”开头，然后详细描述用户可以使用应用程序做什么。当我们完整地概述了所有的用户故事时，我们可以开始规划冲刺。为此，我们需要为每个用户案例设置优先级，并估计实现用户故事中描述的功能所需的时间（以小时为单位）。最高优先级项目首先进入生产。冲刺通常持续一两个星期。其范围根据实现某个功能所需的小时数来计划。通常，一个冲刺将包括在用户故事中描述的一组情况。

用户流

当我们完成用户故事的工作后，我们可以更清楚地了解用户与您的移动应用程序的互动。这有助于我们创建用户行为或用户流程图。用户流是所有关于几何。我的意思是，我们需要具有一定定义的形状，使他们参与到图表中。让我举几个例子：

Square 正方形显示页面（登录屏幕，主页，用户个人资料）Trapeze 梯形- 用户决定（用户选择，用户过滤器，用户类型）Diamond 钻石 - 计算机决策（登录无效，帐户确定）Round 圆形的 - 错误消息Blue arrow蓝色箭头 - 注册用户通道Red arrow 红色箭头 - 新用户通道当我们有所有的形状和用户案例，我们很好地把它们放在纸上，并绘制一个图表，描述用户与您的应用程序的交互过程。

UX design techniques. User-flow diagram

思维导图

用户流程有助于识别每个页面的一组功能以及屏幕如何相交。思维导图表示产品的架构。它说明了应用程序的结构和元素之间的关系。思维导图是某种没有手机屏幕的线框。他们的主要优点是他们制作速度非常快。有在线资源用于创建思维导图，所以我们实际上使地图与客户和团队实时。这将允许我们节省时间介绍更改和讨论项目的细节，特别是考虑到远程协作的特殊性。看下面的我们的倒计时应用程序的心灵图，我的一天。

Mind Map. My Day app

线框

最后！线框是最终设计的骨架。线框的意义是为每个屏幕分配功能，并显示屏幕之间的依赖关系。它是着色之前的最终草案。只有当每个线框与团队讨论和客户批准我们开始工作的彩色按钮，美丽的动画和原始的自定义元素。

Wireframes. My day app

原型

你知道，在用户界面设计传递给代码之前，可以与应用程序交互和测试吗？快速原型服务，如invisionapp.com或mockup.io可以帮助您在其开发的第一阶段看到应用程序的行动。我们需要做的是将线框/模型上传到其中一个服务，动态元素，如可点击的按钮或可滚动列表将在每个屏幕上可用。线框化之后是模型创建。我们制作模型的原型并将它们一个一个地发送给客户。这样，客户端获得了一个看起来与未来产品完全相同的工作原型。你可以已经吹嘘你的应用程序给你的朋友，展示给投资者或测试目标受众获得反馈。

Prototypes. My Day app design