本文概述
- 用最小可行的原型模拟发射
- 循序渐进:如何构建MVPr
- 勇敢地发起和学习
但是, 当我们退后一步, 观察数字产品设计的跨学科本质时, 很容易看出设计师是如何陷入完美陷阱的。
考虑单个数字产品设计中涉及的所有人员和角色:
- 设计研究员
- UI设计师
- 信息架构师
- 用户体验设计师
- 产品设计师
- 产品经理
- 内容策略师
- 品牌专家
- UX复制编写器
- 等等。
这种类型的战略预测可能很有价值, 但也会导致设计过程停滞并陷入可怕的完美循环中:” 在执行Y和Z之前, 我们必须正确获得X。”
那么, 有什么选择呢?有没有一种方法可以根据现实世界的度量标准和从实际人员那里获得的见解快速创建, 发布, 测试和改进数字产品?
在本指南中, 我们将通过最少可行的原型解决这些问题, 并为设计师提供令人惊讶的简单过程, 以构建, 测试和完善数字产品。
文章图片
该插图没有卫星图像的真实细节, 但是它具有足够的视觉信息, 可以轻松地将其识别为我们的家园星球。以同样的方式, 最少可行的原型为用户提供了” 足够” 的功能, 以决定产品概念是否值得。
用最小可行的原型模拟发射
没有人知道什么……在整个电影领域, 没有一个人可以肯定地知道什么将起作用。每次出去都是一种猜测, 如果幸运的话, 这是一个受过良好教育的猜测。 –威廉·高德曼(William Goldman), 奥斯卡奖获奖编剧数字产品设计过程的最早决定最多只能基于猜测。在产品交付给实际用户之前, 一切都是理论上的。另一方面, 在产品准备就绪之前发布产品可能会损害其声誉(代价高昂的错误)。
如果有一种方法可以在任何重大设计工作开始之前就很好地模拟发布并确定产品的生存能力, 该怎么办?
这就是最小可行原型(MVPr)的价值, 该产品设计方法比更熟悉的” 最小可行产品” 所需的时间和金钱少得多。
以下是最低可行原型(MVPr)设计过程的概述:
- 发现
- 研究
- 信息架构
- 视觉设计
- 发射
- 测试
是的, 我们将看到, 依靠上述步骤的基本要素, 我们可以成功地…
- 模拟真实产品的功能;
- 模拟实际产品的发布;和
- 发现真正的产品是否值得构建。
启动发现过程的好方法是搜索与你的想法相似的网站, 博客和应用。了解他们的历史, 目标市场, 运作方式等。如果你发现没有任何相关竞争对手能像你的原型那样做, 请继续前进。
此步骤不需要任何专业知识。秘诀在做-从意图发展为行动。
特别注意竞争对手的优势和劣势。你如何使用他们已经完成(或未完成)的内容来使原型更坚固?
经过1-2个小时的研究, 你应该能够找到最重要的竞争对手并了解每个竞争对手的关键方面。
文章图片
这个来自旅游业的竞争对手的摘要示例突出了发现阶段的主要目的:发现竞争对手公司的优势和劣势所带来的机遇和挑战。
2.研究:定义你的用户
谁是你的目标用户, 为什么他们应该关心你的产品?理解这一点至关重要, 但是我们必须从计算得出的假设开始。最好从一个有强烈见识的愿景开始。不要再猜测或尝试做出” 适合所有人的东西” 。我们不希望浪费时间的设计。
相反, 请仔细查看在发现阶段发现的竞争对手站点, 并根据常识描绘潜在用户的画像。
以下是一些实用的调查领域, 可在网上轻松访问:
- 造访评论网站, 看看人们对你与竞争对手的经历怎么说。
- 在社交媒体上关注你产品行业的影响者, 并观察他们如何吸引受众。
- 搜索著名的新闻文章, 详细了解竞争对手的运作方式。
- 在社交媒体上查看竞争对手与用户的互动。
- 查看你是否可以找到讨论你竞争对手的问题的论坛。
文章图片
用户配置文件可以是一般的, 也可以是非常精细的。在MVPr流程的早期, 尽快找到尽可能多的内容非常重要。
3.信息架构:构建原型
原型将如何工作, 最重要的信息是什么?
开始回答此问题的最简单方法是分析与你所构建的原型相似的顶级网站。你选择参考的网站的整体外观和体验应该出色。
首先将网站分成几部分。所有相关页面是什么, 它们的外观如何组织?不要害怕反转网站的框架, 然后使用你自己的信息, 颜色, 图像等重新创建网站。
为什么要这样呢?你的网站可能会以与竞争对手网站类似的方式运行-你只是怀有不同的目标。如果用户对既定的体验反应良好, 则无需发明复杂的系统。
*专业提示:研究网站的信息体系结构时, 一种有用的技术是拍摄屏幕截图并将其设为灰度, 这样你就不会因颜色的影响而分心(这很有说服力)。
文章图片
消除噪音并专注于重要事项的一种好方法是将产品屏幕截图转换为灰度。
之后, 利用在线资源, 使设计人员能够快速从零过渡到交互式原型。有大量的用户界面工具包, HTML模板, WordPress主题等等。不要害怕修改它们以适合你的原型, 也不必担心像素完美或代码精美。在这个阶段, 没有人在乎。他们关心你的产品是否有用。
使用免费的UI工具包的方法如下:
文章图片
你需要的UI套件将取决于你要设计的原型的类型。在这种情况下, 使用专注于视觉内容的模板可实现快速而轻松的重组。
我们在上图中完成了什么?
- 我们删除了所有颜色和图像。
- 导航栏保持不变。
- 过滤系统的功能保持不变, 但措词已更改。
- 我们从两列转到一列, 以便更好地展示我们计划使用的图像。
4.视觉设计:重新利用免费的UI资源
原型的外观和感觉离不开它的工作方式。不只是图形。有影响力的视觉设计讲述了一个故事, 并提供了真正的价值体验。
在这里, 视觉一致性是关键, 因为它可以帮助用户熟悉产品并更有效地导航。为了在原型开发的早期阶段实现这种一致性, 重新利用免费的UI资源是明智的。
以这种方式工作, 你将不必花费数小时来开发具有凝聚力的设计系统。排版, 按钮样式, 图标和所有其他重要的UI组件均已处理。
文章图片
不用花时间在多个屏幕上设计一致的用户界面, 而要利用UI套件并专注于创建内容。在此示例中, 我们迅速从线框模型过渡到高保真模型。
5.启动:要编码还是不编码?
现在是时候与全世界分享你的原型了。幸运的是, 将模型转换为动态原型比以往任何时候都容易。多亏了许多直观的工具, 你甚至不需要知道如何编码, 但是你应该学习吗?
无代码MVPr
完成视觉设计后, 请将原型嵌入到登录页面中, 以便访问者可以与之交互并提供有关你想法的一般反馈。在MVPr设计过程的这一点上, 有几种创建无代码原型的方法。这是你的选择:
基本原型
- InVision具有构建和测试基本原型所需的所有功能, 并且提供了无痛苦的体验而没有复杂性。
- 对于复杂的交互, 过渡和动画, Principle非常有用。
- 利用Framer, 设计人员可以模拟任何可以想象的数字产品体验。当原型必须具有原生动画和基于逻辑的编码的外观时, 这是一个完美的选择(例如:如果这样做, 则可以这样做)。
- Webflow提供了在100%所见即所得的画布上进行设计, 构建代码和启动响应式网站的功能。
文章图片
单击以查看完整图像。
这是一个有用的图表, 它分解了可用于快速而精确地创建交互式原型的几个设计程序的优缺点。 (来源:库珀)
编码的MVPr
代码可能是一个了不起的盟友。毫无疑问, 这是构建产品的最佳方法。主要缺点是你需要知道如何编写代码才能体验高级定制的好处。如果没有适当的知识库, 选择尝试代码会减慢你的速度。
有大量的代码入门套件可帮助你顺利完成工作。例如, 我们上面介绍的UI套件有自己的HTML版本可供下载:
文章图片
现在, UI工具包
文章图片
Readymag是一个在线设计工具, 可帮助创意专业人士轻松创建微型网站, 投资组合等。
文章图片
Webflow允许设计人员在浏览器中构建响应式网站。
文章图片
Themeforest提供了数千个可定制的主题和模板。
6.测试:利用广告见解
测试原型的秘诀在于工具, 这些工具可让你以最少的努力获得最大的洞察力, 同时仍可提供价值。你所需要的只是几美元和一些耐心解决问题的方法。
衡量你的产品兴趣的实际第一步是制作一个广告, 并定位在研究阶段找到的人们。根据你的受众群体和你要设计的产品类型, 你可以在Google, LinkedIn, Instagram或Twitter上投放广告。对于企业对消费者的产品, 建议使用Facebook。
*专业提示:AdEspresso是一个方便的地方, 可以同时运行数百种社交广告, 同时收集有用的比较分析。
投放广告, 你将学到两件事:
- 看过你广告的人数
- 点击广告的人数
- 添加一个” 订阅” 表单, 并要求用户提供其电子邮件地址。
- 进行跟进, 让他们知道你何时启动。
- 确保打开并运行你的社交媒体渠道, 以便你可以构建社交按钮, 以允许用户宣传你的产品。
- 可以用于早期营销工作的电子邮件地址列表
- 人们向他们的个人和专业网络推荐你的产品
- 更清楚地了解是否有人对你的产品感到兴奋
勇敢地发起和学习 最小可行原型的最终目标是:从有根据的设计猜测转变为具有速度和信心的真实, 可行的反馈。
这是一个包含不确定性和失误作为改进机会的过程。最重要的是, 它奖励行动。好的设计需要大胆的决策和面对缺陷的意愿。
因此, 不要为追求完美而感到困惑, 也不要将自己与大型品牌及其庞大的资源进行比较。继续向前迈进, 很快你就会发现自己使用的产品经过了抛光处理, 令人激动不已。
【沟渠MVP,采用最小可行原型(MVPr)】? ? ?
在srcmini设计博客上进一步阅读:
- 轻松原型– InVision Studio教程
- 如何进行有效的设计冲刺
- 谁知道Adobe CC可以线框?
- 面向大众的UX测试:保持简单且经济高效
- 客户旅程地图–它们是什么以及如何构建地图
推荐阅读
- 野兽派网页设计,极简主义网页设计和Web UX的未来
- 简单是关键–探索最小的Web设计
- 通过微交互实现更好的用户体验
- 为什么小字很重要–显微镜UX的重要性
- android 点击无效验证
- macOS 10.15 Catalina xxx.app已损坏,无法打开,你应该将它移到废纸篓解决方法
- 记录vue项目 用hbuilder离线打包集成极光推送 安卓篇
- Post请求的两种编码格式(application/x-www-form-urlencoded和multipart/form-data)
- 安卓 版本判断 API