本文是:启动创始人学习如何使用Wireframe软件或网站概念并希望了解可用的最佳线框工具。使用此资源,您可以学习自己创建线框。
写道:Alex Senson,Ashley Burton,Tyler Boulanger
绘制出启动软件产品的每个单独页面可能看起来很无聊;但是,本规划阶段是发展过程的关键方面。在本文中,我们将描述Wireframe是什么,它在设计过程中的重要性,以及如何为自己的产品提供Wireframe。此外,我们将识别您的启动可以在整个线框过程中使用的键线框工具。
这篇文章是写给创业者的(特别是非技术创业者)谁计划开发软件产品。你的初创公司可能有一个开发团队,在深入设计和开发过程之前,你需要绘制软件产品的线框,原因如下:
- 要向开发团队展示设计要求
- 在开发之前收集用户反馈
- 向客户预售产品概念,并衡量他们的兴趣
- 理解和计划软件产品的流程
- 使用软件产品的同时理解和计划用户的体验
或者,您的启动可能外汇或者分包合同工作,你要确保在设计阶段双方之间没有脱节。如果你的初创公司正在雇佣或签约一个开发团队,确保你可以使用线框有效地描述你的软件产品的轮廓,以改善想法的流动。
开发出伟大的软件产品需要大量的规划和起草,以便在长期运行中节省时间和资源。亚搏体育客户端app下载您的启动不仅需要开始思考用户如何导航页面,还要介绍信息的呈现方式。
使用此资源来学习如何有效地提供恒星软件产品。最终,目标是通过学习Wireframes,您的启动将能够廉价快速地起草软件产品的设计。设计的不同迭代速度越快,您的启动器的反馈越多,确保用户创建的产品可由用户使用。
涉及的主题:
- 线框 - 介绍
- 了解什么是线框图及其在开发过程中的重要性
- 的优点和缺点线框
- 确定创建线框的关键优势和缺点
- 记住的事情在开始Wireframe之前
- 在开始Wireframe之前评估关键用户研究
- Wireframe:手绘或计算机软件
- 识别Wireframing两种主要方法之间的差异
- 应该包括什么在一个线框?
- 了解在线框中应包含的关键元素
- 什么不应该包括在内在一个线框?
- 熟悉不应包含在线框中的元素
- 线框工具您可以使用
- 评估启动时可用的不同线框工具
- 用于创建原型的软件工具和可点击的演示
- 评估可用于创建原型和可点击演示的不同工具
- 什么是wireframes试图回答?
- 确定Wireframe评论过程中要问的关键问题
- 之后你做了什么线框图?
- 了解软件开发过程中的Wireframing以下内容
我们将通过与RIC中心合作的公司和创始人的案例研究来说明这些想法
案例分析:Robyn Halbot来自分析使用线框工具
如何Wireframe - 介绍
关键外卖:线框图是在结构层次上创建软件产品的基本设计。这样做是为了创建和评估产品的导航结构,以接收用户反馈。
您的初创公司不能简单地赶紧,开始编码软件产品,只关注您将使用的所有图形和颜色。首先,开发团队需要规划软件的布局。此过程称为线框。
线框是一种在结构级设计产品的方法(图1)。本产品可以是网站,软件或应用程序。
考虑到用户的需求,设计人员使用线程范围为产品页面或屏幕的布局内容和功能。预先使用Wireframe,在添加视觉设计和内容之前建立基本结构。
想象像建筑物的蓝图一样的线框。Wireframe清楚地描述,特别是在给团队成员(创始人,设计师和开发人员)的同时是产品的概要。Wireframe的目的是在创意阶段之前提前提供视觉理解,以获取用户,利益相关者和团队批准。
在讨论线框时,行业内的个人通常会描述启动可以模拟其软件产品的其他方式。这些其他方法还用于确定产品的结构和流量,同时提高用户的体验。
初创公司在设计和开发阶段可以模拟他们的软件产品的其他方式是:
- 演示 - 演示是正在开发产品的演示。演示作为概念证明,展示可能的应用程序,而不提供产品的任何功能或可用元素。
- 可点击的演示 - 可点击的演示更进一步,然后添加转换元素。这允许软件产品或网站的页面或屏幕之间的实际导航。
- 原型-a原型是具有有限功能的产品的交互式视觉表示。创建原型以确定最终产品是否有意义,并确定设计元素的主要问题。
与线框相比,可点击的演示和原型更复杂。结果,它们在被批准之后完成,以便进一步审查用户体验和流量提供产品提供。
虽然线框,设计人员创建了全局和二级导航结构,以确保所使用的结构和术语代表用户期望。此外,Wireframes呈现了页面上显示的信息,并传达的总体方向和描述用户界面。
可以创建两种不同类型的线框:低保真线框或高保真线框。低保真线框是对软件产品布局的简单抽象描述,以促进快速通信(图2)。高保真线框,然而,包括增加了交互元素动作的详细程度,以及每个内容元素的具体尺寸(图3)。
总体而言,线框充当笔和纸草图之间的中间地面,以及启动软件产品的第一个原型。通过在过程中花费时间草图勾勒出产品,您的启动将能够创建一个良好的产品并基于大量用户反馈的产品。
如何为不同种类的产品线框
关键外卖:当您使用Wireframing网站,移动应用程序或软件产品时,使用的方法没有实际差异。初创公司可以使用相同的线框工具,但是,请记住用户如何与最终产品交互以确保线框是合适的。
无论您的初创公司正在设计网站,软件产品或应用程序,无线比文件都涵盖了相同的基本原理。无论上下文,线缆允许启动如何清楚地了解产品如何看起来和功能。
下面是您的启动时要记住的一些提示,用于为每个独特的产品类型提供线框。
如何Wireframe:网站
- 为网站的移动和桌面版本创建一个线框
- 确保线框适用于不同的屏幕尺寸
- 为网站的每个单独的页面创建一个线框
- 使用justinmind web wireframing ui套件开始设计您的网站。它包含特定于网站的设计元素,并预先安排的方式来显示不同类型的内容
如何线框:移动应用程序
- 请记住平台,iOS和Android,它将用于运行应用程序
- 确保线框适用于不同的屏幕尺寸
- 为应用程序的每个屏幕创建线框
- 可以使用与软件产品相同的线框工具
如何Wireframe:软件产品
- 记住行业或用户的软件产品体验,以确保您提供适当的导航和用户体验
- 确保线框适用于不同的屏幕尺寸
- 为软件产品的每个屏幕创建线框
- 可以使用与应用程序相同的线框工具
线框的优点和缺点
关键外卖:Wireframing占用了设计过程的块,在开发期间不应该跳过一个。创建线框允许增加用户反馈,但是,它可能是用户掌握的困难概念。
创建线框是在开发过程中的另一个阶段,即某些启动可能会尝试跳过以便更快地进入开发。以下是在决定是否创建线框时考虑的优缺点列表。
好处:
- 与编码产品相比,更快和更便宜地审查和更改线框的结构。
- 客户可用测试的早期视觉。
- 基于用户需求和轮次用户反馈,对功能的置信度提高。
缺点:
- 由于缺乏设计和技术元素,用户并不总是容易掌握概念。
- 需要将线框转换为设计的最终版本。因此,需要有关于为什么要素定位在它们的位置的文档。
- 内容可能无法适应线框布局。设计师和文案将需要一起工作,以确保他们配合在一起。
总的来说,RIC中心建议在设计过程中花费时间在设计过程中创建线框。这是因为它允许启动以更好地计划设计工作,在开发之前进展到工作需要重做的程度。简单的线框工具允许创始人提供Wireframe产品本身以节省资金。
在开始Wireframe之前要记住的事情
关键外卖:在创建线框之前,您需要进行一些初始用户研究。和你的团队一起规划每个网站页面的目的。这将确保每个页面对用户都有价值。
在您的启动开始之前,该团队需要在使用产品时坐下来计划用户需求的关键方面。以下是您的启动在Wireframe工作之前应该能够回答的一些关键问题:
- 谁是预定的用户,与软件产品的每页交互时,业务目标是什么?
- 如何组织内容以支持这些目标?
- 主要信息和徽标应该去哪里?
- 当用户到达页面时,应该首先看到什么?
- 用户的行动号召在哪里?
- 用户希望在页面的某些区域看到什么?
在绘制线框之前,特别是如果是第一次启动时,请查看在线可用的线框的示例。查看线框示例是在您的启动刚刚开始时获得灵感或一些指导的好方法。
如何画线框图:手绘或计算机软件辅助线框图工具?
关键外卖:线框可以用手用笔和纸或用白板创建。或者,设计人员可以使用线框软件来帮助创建其线框。使用最舒适的最舒适,因为Wireframe将多次修改。
纸和笔或白板线框非常易于改变,这可以在关于软件产品的早期对话期间有助于显着帮助。与编码版本相比,使用这些线框的使用也更便宜。这是因为用户可以在一个想象和设计的每个阶段提供反馈。
通常,大多数初创公司开始使用手绘线框,然后稍后在设计过程中移动到计算机软件。以后切换到软件工具允许启动以跟踪更详细的决策。
基于软件的线框工具允许在不同地理位置中的团队成员之间进行协作。他们还让初创物保留所有线框设计的详细记录。这允许启动在当前设计不适合时,可以轻松修改以前版本的线框。
虽然比手绘线框更昂贵,但软件工具还可以允许启动从线框到原型移动。本文稍后可以在稍后在稍后找到推荐的软件Wireframing工具列表。
初创公司应该根据最适合它们的方式使用手绘方法或客户软件到线框。有些人可能更喜欢用手开始勾画,而其他技术倾向的人可以使用软件工具。通过对Wireframe方法感到舒适,您的启动将能够快速为软件产品创建电线帧的多个迭代。
什么应该包括在线框架中?
关键外卖:Wireframes的设计简单。这允许用户专注于所提出的软件产品的导航,而不会被视觉元素分散注意力。
创建线框时,启动需要坚持简单的设计。这允许设计师,利益相关者和用户专注于网站的导航。而不是让所有各方都侧重于软件的视觉元素。
初创公司应该专注于快速、廉价地创建一个容易编辑的线框。这允许初创公司在设计过程中创建许多迭代的线框图。
初创公司需要创建一个简单的线框设计,重点是导航的建议软件。这确保了所有用户反馈都围绕着建议的设计是否对用户有价值和直观。
线框中应该包含的设计元素:
- 简单的设计,尽量减少干扰
- 矩形和正方形与“X”内部以显示图像的位置。可以为视频添加播放按钮符号。
- 灰度彩色方案
- 最多两种通用字体(一种衬线字体和一种无衬线字体)
- 通过使用不同的字体大小和样式描述内容层次结构
- 所有的屏幕都应该有明确的目的和方式来满足用户的需求
- 清除呼叫动作以允许轻松导航
以下是一个设计精心设计的线框的示例,其中包含设计元素(图4)。通过查看线框,用户可以轻松地看到页面内的导航。
正方形和矩形用于展示图像将放置的位置。这允许用户提供关于放置的反馈,如果页面上的图像上有太多或太少。
线框是用灰度创建的,以确保颜色的使用没有视觉干扰。通过使用显示用户单击该框将访问哪些新页面的框,还显示了清晰的导航。
整个线框使用一致的字体,便于阅读。此外,信息的层次结构使用不同的字体大小显示。这使得简单的设计可以展示页面中最重要的元素。
总的来说,这是一个精心设计的线框的一个例子。它更多地关注软件页面的导航结构,而不是其视觉外观。
在创建线框时,请确保您的启动包含上述设计元素。这将确保创建的线框只包含基本的导航和内容元素,以接收足够的用户对设计的反馈。
什么不应该包含在线框中?
关键外卖:不应创建包含颜色和图形等可视化设计元素的线框。这分散了线框的目的,并且启动最终在将修改的东西上消耗太多钱。
当刚开始学习如何制作线框时,初创公司可能会想要开始添加大量的颜色和图形。然而,早期的线框图并不是考虑这些设计元素的时候。
线框用于规划设计。它们将被快速而便宜地创建,因为在此过程中会有许多迭代的Wifframe。
初创公司不需要浪费时间,如果他们刚刚将其重做,那么Wireframe看起来很有吸引力。相反,使用这些资源来进行亚搏体育客户端app下载用户研究并进行测试,以确保正在开发的设计适合用户
设计元素,不应包含在线内部:
- 复杂的设计,有很多分心
- 华丽的图形和图像
- 使用颜色
- 多个字体或使用非泛型字体
- 使用不一致的字体大小和样式来显示层次结构
以下是一个设计不良的线框的示例,其包含不应该存在的许多元素(图5)。只要查看此示例就会注意到如何立即评估视觉设计元素而不是导航或功能元素。这正是你不想要的!
线框被分散注意到!现在,使用多种颜色对用户令人困惑,就像现在一切都脱颖而出。
使用不同的字体也令人困惑,并且用户最终询问为什么?此外,页面的标题小于文本的下一个子弹。这导致用户困惑页面的主题是什么。
在线框上添加图像可以导致用户提出关于它们选择的原因的问题。此外,用户可以开始关注为什么选择此页面的这种通用图像。
总的来说,这是一个设计不良的线框的一个例子。它更多地关注软件页面的视觉外观,而不是导航结构。
创建线框时,请确保您的启动不包括上述设计元素。这将确保创建的线框只包含基本的导航和内容元素,以接收足够的用户对设计的反馈。
Wireframe工具可以帮助您学习如何WireFrame产品
关键外卖:有许多工具可用于创建WireframeS中的启动。评估团队的技术水平,以及在确定要使用的工具时,启动将在您的启动时进行多少线框项目。
使用的线框工具类型取决于设计的启动和阶段。位于中心的设计团队可以在一小时的会议期间在白板上快速映射一个基本的线框。但是,分布式团队需要能够以数字方式创建线框,并在多个协作者之间轻松共享。
作为一个创始的创始人,您甚至不需要有很多设计背景,以便能够使用这些工具的大多数。通过您自己,您可以创建一个线框,以便在产品进入开发阶段之前获得早期用户反馈。
下面列出了初创公司可以使用的各种线框工具。技术人员和非技术人员都可以使用这些工具。这些工具是最推荐的,最不推荐的。
线框工具:Balsamiq.
Balsamiq是初学者提供的最佳线框工具。因此,Balsamiq是使用RIC中心工作的最常用的线框工具。
Balsamiq适合创建快速草图线框。此工具使用网格系统来允许用户在设计元素之间看到距离和对称性。Balsamiq允许用户创建线框而无需学习复杂的工具。总的来说,它允许启动看起来比仅在废纸上创建线框更专业。
平台: | macOS, Windows,网络浏览器 |
成本: | 桌面应用程序89美元。两个项目的云订阅从9美元/月开始 |
积极: | 易于使用的拖放构建器。可用于说明Wireframe如何看待各种屏幕尺寸 |
否定: | 原始用于更高级的线框需求。当多个设计师需要查看线框时难以使用 |
线框工具:InVision徒手画的
Invision Freehand是一种基于Web的线框工具,非常适合白板上的着色帆布。这个工具是所有推荐的工具。因此,最好用手用手做的初创公司,所有成员都可以贡献和修改在一起。
Invision Freehand是Invision Suite的一部分,因此使用此程序创建的线框可以在稍后的开发阶段上传到原型设计软件。这会节省时间在继续下一个开发阶段时,而无需从每次开始划痕。
平台: | Web浏览器 |
成本: | 一个项目免费,三个项目的起动器为15美元/月 |
积极: | 基于云计算的多人可以同时查看和编辑线框。提供与Sketch和Photoshop的实时同步功能,让团队能够在优化后的原型上绘制和注释 |
否定: | 如果线框显着改变,则可能会丢失。移动单个图像时,电路板的排列行为错误地改变了自身,导致浪费时间必须纠正图像位置 |
线框工具:草图
素描是当您希望将创建的线框传递给第三方应用程序时可用的最佳线框工具。素描,轻量级设计工具,与Adobe Illustrator相比,这款工具简单直观。该工具允许用来快速创建带有画板和矢量设计形状的线框。
遵循Wireframe创建后,用户可以导出完整的设计或单个元素。此外,用户可以在设计过程中进一步将图标集成在一起。例如,它可以与原理,农民和奇迹等原型应用集成。
平台: | 苹果系统 |
成本: | 99美元/年(一年后你仍然可以使用它,但不会收到更新) |
积极: | 很多集成插件,允许不同的团队轻松沟通 |
否定: | 小故障很常见(例如,字体颜色不会改变,滞后)。这是一个桌面应用程序,因此协作可能很困难。用户无法同时在设计文件上工作。 |
线框工具:奇迹
Marvel是一个线框图工具,主要由预先设计的线框图模板组成。这些模板允许非技术团队成员轻松绘制线框图。
漫威提供交互式原型和代码切换。此外,团队成员可以被邀请合作和评论线框。
平台: | Web浏览器 |
成本: | 免费为一个用户和两个项目,从提供一个用户和无限项目的Pro计划的12美元/月 |
积极: | 可以编译一个团队库的设计元素,可以在整个过程中轻松陷入困境 |
否定: | 没有很多工具来创建高保真线框。用户需要仔细阅读素描以创建更抛光的用户界面设计。 |
线框工具:Adobe Photoshop.
Adobe Photoshop是一种先进的基于像素的设计软件,可用于创建高细节线框。Photoshop不是专门为线框创建的工具,其主要目的是照片编辑。
如果有使用该工具的团队成员具有重要技术背景,则初创公司应该仅使用Adobe Photoshop。初创公司应该使用专门为线框创建的工具,例如Balsamiq。
平台: | macOS,窗户,iOS |
成本: | 9.99美元/月的创意云摄影计划,包括访问Lightroom |
积极: | 轻松创建高保真线框而无需切换设计系统 |
否定: | 陡峭的学习曲线难以将设计规范交给开发团队。初创公司需要使用可以导入Photoshop文件的原型工具。 |
线框工具:摩根
Moqups是基于HTML5的平台,最好用于创建线框交互设计流。此工具在基本流程图上构建为线框概念。
Moqups利用拖放功能,可以快速简单地绘制线框图。然而,总的来说,这个工具在其他线框图设计竞争中并不突出。
平台: | Web浏览器 |
成本: | 为单个用户提供无限项目的个人计划,从13美元/月(每年订单)至13美元/月 |
积极: | 许多模板可用于帮助启动设计流程实时协作 |
否定: | 在用户第一次启动时难以导航。没有可用的大型元素库,因此用户需要在需要时用手做出特定的元素。 |
此外,蚂蚁设计可以在创建线框时使用,无需使用特定的软件工具。Ant Design提供了一组用户界面设计元素和相关代码,可以轻松地将它们添加到线框图的不同元素中。
Wireframe软件需要简单,易于移动的元素,允许快速更改。这提供了启动功能迭代的能力,并在创建原型之前获得大量用户反馈。通过剩下的简单,启动团队的技术和非技术成员将能够创建线框。
如何创建原型和可点击的演示:软件工具开始
关键外卖:有许多不同的原型软件工具可供初创公司使用。通常,有一些方法可以将线框图工具与后来的原型工具连接起来,以防止任何开发滞后。
使用前面提到的Wireframing软件工具创建了Wireframe后,开发团队可以开始创建原型或可点击的演示。有不同的软件工具可用于创建这些原型和可点击的演示。
以下是启动的所有不同原型和可点击演示工具的列表。技术人员和非技术人员都可以使用这些工具。这些工具是从最推荐的最初订购的,以最少推荐启动。
invision.
Invision是最着名和广泛使用的原型软件可用。它允许启动快速,轻松地创建出色的原型,以显示他们的用户和利益相关者。
初创公司只需要上传线框设计,将静态屏幕变成一个完全可点击的原型。这是通过添加过渡和手势来实现的。
用户和团队成员可以通过平滑的管理功能轻松地在原型上直接提供反馈。此外,不断添加新的原型特征,以帮助改善原型化过程。
奇迹
Marvel是另一个可用于启动的点击原型工具。可以直接上传来自线框工具的屏幕。同样,可以上载来自Photoshop和Shixt的图像。
这些设计可以链接在一起,以便创建导航结构。然后可以进行转换和手势以使原型似乎更真实。然后可以共享项目以获得用户和其他团队成员的实时评论和反馈。
主题
Keynote是一个非常简单的原型工具,使用它不需要任何编程技能。如果你的初创公司需要快速创建原型,这个工具是完美的;然而,与现有的其他技术相比,它是过时的
启动可以将屏幕截图从草图上传到程序到幻灯片。然后,启动可以模拟幻灯片上的实际按钮,并在整个中添加链接以将一个幻灯片连接到另一个幻灯片。它类似于在Microsoft PowerPoint上工作。
工艺CMS
Craft CMS有一个插件集合,允许初创公司在Sketch和Photoshop中创建原型。画板可以使用交互式热点链接在一起,以创建一个可点击的原型。
然后可以使用工艺来将创建的原型发送到Invision软件。这允许在新设计的原型上进行协作反馈。
通常,可用的任何原型软件都涉及将启动软件产品的线框设计加载到程序上。然后,启动需要定义热点并选择应使用哪些类型的手势来触发它们。
RIC中心案例研究:使用工具创建线框分析Robyn Halbot
Analyticly是一个独立的应用程序,公司可以上传他们的数据,并接收使用机器学习生成的高质量的见解和建议。在创建此应用程序期间,Balsamiq.和蚂蚁设计是使用的两个主要的线框工具。
在产品开发的设计阶段,对竞争对手的产品屏幕布局进行分析。Balsamiq.然后用于根据审查其他产品的灵感,以及公司自己的设计计划,为应用程序的每个单独屏幕创建线框。Balsamiq.通过分析选择,因为它是一种易于使用的工具,可以通过非技术个人使用以创建简单的线框。
蚂蚁设计在分析上也被使用,以便在为开发人员提供的夹切中快速创建功能模拟。蚂蚁设计提供初创公司,专门的创始人具有有限的技术知识或开发人员,这些技术知识或开发人员是正确的,该开发人员是正确的,创建功能模拟的能力,以有效地传达他们的想法。蚂蚁设计还为您提供的代码,每个设计元素包括在模型,以便初创公司可以复制和粘贴到集成开发环境(IDE)正在使用。
Balsamiq.和蚂蚁设计被analyze一起使用,自己创建一个基本原型。线框创建Balsamiq.和在内部选择的设计元素蚂蚁设计根据用户的需求和所需的功能元素来规划和设计原型。总的来说,与在产品开发的早期阶段外包所有的工作相比,这些工具单独使用可以很便宜地创建一个原型。
开发人员是非常可视化的,因此包括软件产品每个屏幕上所有元素的计划的完整线框图对于开发过程是必不可少的。当创建线框时,它可以用来评估产品的不同结构布局选项以及它们如何连接在一起。这个预先确定的计划可以与开发人员进行沟通,以便他们确切地知道需要什么功能元素,以及它们应该放在屏幕的什么位置。截图和线框图实际上就是你创业计划的列表。在计划阶段,将模型分解成单独的任务,为任何外包工作创建工作说明(SOW)。我们将所有单独的任务放在Trello板上,这是一个项目和任务管理产品,所以很容易看到开发项目的进展。”
总的来说,使用Balsamiq.和蚂蚁设计用于为公司的软件产品创建模拟。这些线框工具用于以结构级别设计产品。在完成线框之后,Directicly使用线框为其开发人员创建详细计划,以在整个开发过程中使用。
什么是wireframes试图回答?
关键外卖:确保您的启动是收集足够的用户反馈,以便回答有关开发的线框的关键问题。如果导航是合适的,则确保询问,如果所有用户的需求和期望都已满足。
使用线框以便快速迭代以评估软件产品的建议设计。通过这个过程,用户反馈将努力收集以改善设计。
以下是你的初创公司在线框图制作过程中应该尝试回答的一些常见问题:
- 哪些导航类别和交互机制最适合用户?
- 在线框上完成页面结构、导航和工作流:
- 现在提供用户想要和期望的信息?
- 在某种程度上存在信息,用户可以轻松找到所需的方式?
- 使用标签用户会很容易理解吗?
- 允许用户轻松,准确地预测其行为的结果?
- 是拟议的互动行为和相关页面功能吗?
- 鉴于您的启动当前约束(时间,预算,人员),是否可以构建设计?
- 视觉层次结构和软件每个页面上的内容是否有意义?
- 页面上有多少内容与用户的任务相关?
- 页面上存在的是完全无关和无关的页面?内容是否可以删除或重新定位?
收集每个线框迭代的用户反馈,请确保您的启动专注于上述问题。这可确保从多次迭代开始,您的启动将能够为用户创建最佳产品。
Wireframing后你做了什么?
关键外卖:在线框图绘制之后,用户在修改线框图之前对其进行审查并提供反馈。一旦线框图被批准,创业公司就会在将设计交给开发人员之前创建更详细的模型和原型。
线框快速,便宜,无常。在创建之后,WIREFRAMES旨在通过用户研究和利益相关者输入来改变。
收集用户反馈并创建线框的多个迭代。在此阶段,用户通常会更加关注软件和用户体验的功能,而不是屏幕元素的美学特征。
因此,启动在此阶段通常在此阶段获得更多的反馈,然后在完全开发的原型中获得更多的反馈。这允许启动以确保它们为用户创建最佳产品。
在完成线框的迭代后,启动然后继续开发模拟。这种模型通常被认为是开发的软件产品的更加视觉表示。
在创建原型并进行用户验证后,初创公司就会转向原型设计。这是设计工作移交给开发人员之前的最后一个阶段。从这里开始,您将创建您的功能最小可行的产品。
结论:如何使用您可以使用的Wireframe和Wireframe工具
创建线框允许启动计划用户的屏幕或页面布局和用户的交互模式。这一切都在没有引入色彩和图形的分散注意力细节。Wireframes应该具有明确的导航,不需要使用颜色,阴影和花哨的菜单来进行意义。
Wireframe作为设计师,用户,利益相关者和开发人员之间的共同语言。它们是以一种复杂的方式创建,足以告知每个人。并且简单地通过过多的细节或设计语言,不要变得复杂。
总的来说,线框图允许初创公司在开始软件开发之前彻底地审查和规划设计。这将防止初创公司在不适合所需用户的设计上浪费资源和时间。亚搏体育客户端app下载和设计团队坐下来,勾画出一些关于如何设计软件产品的想法。
最终,线框允许启动真正规范软件的导航和布局。初创公司在过程开始时越命令越来越能确保在开发过程结束时,他们的手将有一个恒星产品。
得到教训
恭喜!您现在已经了解了Wireframing以及在软件开发的设计阶段时应该使用它的初创公司。阅读本文后,您应该学习以下关键概念:
- 线框可以以不同的方式创建,例如在白板上或使用软件工具。
- 专注于软件的导航结构,而不是其视觉外观。
- 以直观和自然的方式呈现线框中的内容,以确保用户可以轻松理解软件。
- Balsamiq是最受创业者推荐的线框图软件工具。
- InVision是最受创业者推荐的原型制作软件工具。
- 不要致力于线框!他们经过多次迭代。