首页 > 其他 > 详细

还愁原型设计选哪个?——没有更好,只有最适应的!

时间:2020-05-19 18:44:01      阅读:56      评论:0      收藏:0      [点我收藏+]

原型软件选哪家,不如先来了解它

       1,原型是指模拟要开发的系统的原始模型。在软件过程中,原型是软件早期一个可运行的版本,它反映最终系统的部分重要特性,如界面、功能或者性能等等。

       2,原型(prototype)即把系统主要功能和接口通过快速开发制作为“软件样机”,以可视化的形式展现给用户,及时征求用户意见,从而明确无误地确定用户需求。同时,原型也可用于征求内部意见,作为分析和设计的接口之一,可方便于沟通。

       原型设计是将想法转变为设计过程中至关重要的一环。可以概括的说是整个产品面市之前的一个框架设计。以网站注册作为例子,整个前期的交互设计流程图之后,就是原形开发的设计阶段,简单的来说是将页面的模块、元素、人机交互的形式,利用线框描述的方法,将产品脱离皮肤状态下更加具体跟生动的进行表达。

      接下来我将会介绍三种原型设计软件,希望能给大家带来帮助。

 

一、设计中低保真、快速的手机端和Web网站   

      场景特点:构建移动应用(手机端APP和Web网站);中低保真;快速搭建

      中低保真原型一般指有限的功能和交互原型设计。它们被用于描绘设想、设计方案以及界面布局……建立这些原型的目的主要用于沟通、演示和报告。对于低保真、快速移动应用程序的原型设计,用于此场景的最佳工具是可以在短时间内以低保真方式展示整个应用体验流程。

      在这里举例一个软件——摹客(Mockplus),摹客以特有的“快和简单”的产品属性,获得国内企业和用户的青睐,在国内行业第一,在全球和设计名企争雄,目前拥有国内外150万用户,其中企业用户千余家,包括华为、腾讯、微软、甲骨文、快手科技、招商证券等知名企业。

      Mockplus是原型工具中的后起之秀,随着其功能不断完善,在全球拥有的粉丝也逐渐增多。与很多设计工具不同,Mockplus从创立之初就一直坚持简单,快速的路线。简单不意味着功能上的单薄,正相反,无论是设计,演示,分享,审阅,Mockplus相比大部分工具都更胜一筹。

1、原型设计快速上手

海量组件和图标,拖拽即可得。 快速交互、快速设计、多种演示预览方式。 摹客让原型设计如此简单。

2、协同工作效率提升

从产品经理、设计师到开发工程师,一起协同工作,支持主流格式的产品文档和设计稿。摹客,让每个人更快,让团队效能更高。

3、设计规范轻松管理

轻松定制设计规范、统一管理设计资源,还可以一键导出,团队共享、级联应用,摹客,让设计资源的价值得以真正体现。

 

技术分享图片

 

技术分享图片

 

 

(一)多种预览方式

     多样的预览方式为可用性测试的进行提供了前提条件。Mockplus支持以下几种方式:

     直接点击界面上方的三角形预览

     输入原型码,在手机上查看原型

     扫描二维码,在手机上查看原型

     在线发布项目,将生成的链接复制到浏览器中预览

技术分享图片

 

 

(二)支持多种项目导出方式

      导出html离线包

      导出可独立运行的演示包

      导出图片

      导出项目树

技术分享图片

 

 

(三)演示过程中,用户或团队成员可以进行评论和批注

      Mockplus 3 带来了独一无二的在线审阅体验。现在,项目在线分享以后不仅可以演示,还可以对页面发表评论,更可以直接在页面上进行标注。标注功能是同类软件中仅有的,你可以使用箭头、文字、矩形、画笔等多种工具对页面上的任意位置直接进行标注。交流很明白。

 

技术分享图片

 

 

       点击摹客的官方网站,进行下载以及查询。(https://www.mockplus.cn/?hmsr=twx
 
 
二、响应体验设计

      场景特点:构建响应式网站(手机、平板、桌面);省时和高效兼备;需要将页面链接在一起,显示它们的流程

      在面对响应式设计需求的用户时,首先应当明确以下几个问题:

      1. 为什么必须设计响应?

      2. 响应设计真正的目标是什么?

      3. 设计每个显示模块详细需求是什么?

      在进行响应式设计的同时,也需要前后端开发的支持,否则设计高效率的响应设计将会变得非常困难。

      以下我将会介绍一款软件——UXPin      (“如果你能想像它,你就可以设计它”)
技术分享图片

 

 

技术分享图片

 

 

      UXpin为了方便用户对原型进行可用性测试,专门提供了一套可用性测试套件供用户下载使用。其中包含了5份测试模板(PC/Mac)。5套模板显然不能满足所有的情况,但的确能为用户提供一些参考。
 
 

元素状态

      首先最让我惊喜的是 UXPin 引进了状态这一概念。我们都知道,有时候一个元素会有很多种状态,而状态的组合又构造出很多新的状态,最典型的就是按钮了。在一般的设计工具中我们只能一一列出各种状态。

 

技术分享图片

 

      UXPin 的做法就是引入状态,同一个元素或组件可以设置多组状态。这些状态可以用于交互动画中,也可以作为组件的样式覆盖,你甚至还可以嵌套组合不同的状态,来灵活使用它们。

 

技术分享图片

 

变量、条件和表达式

      UXPin 自带的交互效果本身很丰富,除了常见的元素变化、页面跳转、显示隐藏,它还支持进行 API 请求等高级操作。同时,让它区别于其它设计工具的一点是,它支持变量和条件。

      所谓变量,就是你可以将一些值存起来,比如用户填的一个数字。而基于这些变量,你可以进行条件判断,比如将用户填写的年龄保存起来,再根据它是不是大于零的来进行后面的交互。这可以帮助我们做出具有一 定复杂度的交互效果。

 

技术分享图片

 

      变量的值支持表达式,UXPin 内置了一些基本表达式,比如数学中的绝对值、四舍五入,手机、邮箱、日期格式判定,以及设备窗口尺寸等。你可以使用这些表达式来处理变量,实现自己的定制化需求,让你的交互效果进入更高一级的层次。

 

技术分享图片
      附上UXPin的官方链接以供下载:https://www.uxpin.com/
 
 
三、简单易用新小白
      而对于第一次接触的人员,可以尝试这款软件——墨刀。
       首先墨刀有以下五大特性:

1、小白也会用!不用学习!简单易用的原型设计工具

      无论是 PM 从 0 到 1 绘制原型、还是设计师导入设计稿制作交互,都可以快速轻松完成可交互原型。

 

技术分享图片

 

2、电脑、手机、微信等多种设备完美演示

      你可以将你的作品分享给任何人,无论在 PC、手机或微信上,他们都能随时查看最新版本。

 

技术分享图片

 

3、工作流文档生成,关注产品全局

      开发人员可告别复杂的需求文档,打开工作流便可看到全局状态和注释,实时同步进度和文档——工作流成为最有效的沟通语言。

 

技术分享图片

 

4、在线团队协同,多人聚焦讨论

      产品细节、新增需求、打点评论清晰可见。制作者可以第一时间收到细节反馈,方便意见的统一修改。

5、Sketch + 墨刀 = 交互批注利器

      将 Sketch 的设计稿一键导入墨刀即可马上制作交互,工程师还可以通过开发者模式,看到完整的图层信息。

 

 

好了,接下来我来教大家如何快速入门:

 

      注册/登录墨刀后,首先到达的是「项目管理页」,创建的项目都会展示在这个页面。点击右侧的按钮「创建项目」,可以选择空白项目,也可以直接套用模板。选择空白项目:有iPhone、ipad、Android、Web四种平台,选择后进入项目属性设置页,可设置不同的设备型号。点击创建,就进入到了工作区。

      如想自定义原型尺寸,可选择Android的Customize进行自定义。或者有需要,还可上传个性化图标和启动界面图。

 

技术分享图片

 

      直接套用模板:墨刀推出了丰富的模板项目,可先预览模板效果,挑选成功后点击「创建项目」即可。通过编辑模板你可以更快地掌握页面设计、交互设计的方法,也可在此基础上完善个人产品原型。

      附上墨刀的官网链接以供下载:https://modao.cc/

 

 

 

 

部分资料来自以下链接,感谢原作者的相关信息

作者:摹客;链接:https://www.zhihu.com/question/19572438/answer/391126648;来源:知乎

作者:海洋的日常;链接:https://zhuanlan.zhihu.com/p/34082256;来源:知乎

作者:ae627d4a1271;链接:https://www.jianshu.com/p/861424a40473;来源:简书

作者:leadream;链接:https://www.baidu.com/link?url=Vw7pMb-9ERZdDvdHNjYqBbhyMyfAU3VVI5X2Y0bNmnJddq3o-1HgCbqI6xw7EJGS&wd=&eqid=c150092d000012c7000000035ec396d8;来源:少数派

还愁原型设计选哪个?——没有更好,只有最适应的!

原文:https://www.cnblogs.com/radiocast/p/12917954.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!