原型图做网页视觉设计

1、有哪些好用的在线界面原型工具，且支持IE

十大界面原型与布局工具

作者夏梦竹

工具开发者原型设计
摘要：原型设计能起到有效沟通的作用，漂亮，直观的原型图更是让人赏心悦目。本文罗列了2013年最新的10大界面原型与布局工具以帮助设计师和开发者创建出更加优秀的产品。
创建网页或者程序不仅要关注主页的排版以及与主题想匹配的图片，还应注重视觉设计，这是因为它更能吸引用户进而提升搜索量。因此，项目开发首先需要确立良好的设计，创意是必不可少的。所以，项目经理、Web设计师、开发者在线框和原型工具方面需要具备一定的功底。
本文罗列了2013年最新的10大界面原型与布局工具以帮助设计师和开发者创建出更加优秀的产品。
1. Solidify
Solidify允许用户在模型、线框或者草图中获取原型图。此外，你还可以快速地查看屏幕界面原型。如果在桌面、计算机或者手机上运行Solidify还能轻易地测试出项目原型。如果你没有太多的时间花在这上面，你也可以共享给其他测试人员，随时随地获取反馈意见。
2. PowerMockup
专为设计师准备的PowerMockup在创建PowerPoint时为线框提供模板。包含各式各样的模板，包括菜单、表格、文本框、按钮和标签。当你在创建PPT时你可以轻易的将这些模板拖入使用。另外，用户还能在库中添加自己的条目，只需选择PPT的外形，然后点击“添加模板”标签，一款自定义的模板即可轻松创建。
3. Antetype
当你创建大型的且连续性的项目时，Antetype是最佳选择，这是因为它允许开发者创建一整套的构件库。该构件库可收集各小部件，在原型中方便易用。此外，每个小部件都有一定数量的定制和默认状态可单独或者同时进行编辑。
因此用户在编辑时无需使用不同的副本，Antetype可适应不同项目的需求。
4. UXPin
UXPin是为那些不擅长UX设计的开发者而开发的。经验丰富的UX设计师为UXPin提供了一整套的完整的工具包。
在UXPin上用户可以为自己的项目找到所需要的模板。他们通过上传UX和项目文件来获取模板，比如Project Canvas、Project Kick Off、Business Model Canvas、Personas等等。
此外，用户无需来回收发邮件，因为在这里任何项目都可在一起工作。UXPin旨在帮助项目经理开发适应任何一款分辨率和设备的响应式线框和原型。
5. QuirkTools
QuirkTools让网站创建更加简单和便捷。

利用QuirkTools构建Web应用可帮助用户创建属于自己的一款应用。Wires就是典型的例子，该应用帮助用户创建基于桌面、移动手机或平板电脑的线框模型。此外，QuirkTools还能让开发者与同事、客户共同协作打造最完美的设计。
6. Wireframe.cc
利用Wireframe.cc即可轻易的创建线框。Wireframe.cc支持有限的调色板和模板，以简洁为主。有两个模板供选择：移动手机和浏览器窗口，前者包含景色和垂直风格；后者则是纵向和横向风格。有了Wireframes.cc用户可清晰的看到整个创建过程。
7. Easel
Easel是一款基于浏览器的Web设计工具，允许用户记录模型和创意。其功能包括按钮、表和文本框。这款工具还集成了Twitter Bootstrap库贯穿其他额外的图标和颜色。此外，Easel 让用户在Web中设计保持最佳像素，用户可以使用先进的工具比如CSS3、Web字体，无需在浏览器和文本编辑器之间来回查看，告别繁琐的过程，轻松创建应用。
8. InVision
InVision让你以高水准的级别快速创建令人印象深刻的原型。利用这款工具，用户可在很短的时间内链接到UX草图、设计以及线框，还能与其他团队分享该项目。InVision使设计演示更加轻松方便，用户可以在项目中进行实际演示，在浏览器中加载或者以SMS形式连接到移动设备上。
该工具还支持追踪功能，让你轻松查看项目进度。
9. Proto.io
Proto.io这款工具完美适合设计师在触摸屏幕上的小工具。支持主流的移动触摸风格和手势，包括swipe、pinch、tap、zoom、tap-hold。此外，还能整合动画屏幕转换比如，幻灯片、旋转、流、翻转等等。
该工具不仅仅是为了生产先进的屏幕转换，还能允许用户学习和应用最基本的动画技能比如在原型创建中的移动、缩放、旋转等等。
10. POP

有了Prototyping on Paper (POP)创建iPhone原型不再是难事，其提供了一个传统的高科技线框技术。没有复杂的软件，所有的用户需要在纸上或者笔记本上绘画或绘制出线框。
该线框仅通过摄像头拍摄，利用POP确保草图能自动调节对比度和亮度，然后通过“链接点”连接到草图来设计模板。首先确保任何事情都在完美状态，用户只需点击“play”并模拟接口即可。
最后：
在设计网页或程序之前，需要把界面给“画”出来成为原型设计，就像动画片要画分镜头、手稿一样。原型设计能起到有效沟通的作用，漂亮，直观的原型图更是让人赏心悦目。有了这些工具，原型和线框变得更加简单和方便，即使是初学者也可设计自己的网站或者应用，赶紧尝鲜吧。
当然，原型工具还有很多很多，欢迎与我们分享。

2、平面设计、网页设计、UI设计、视觉设计、电商美工设计的区别

平面设计的范畴还有很多，例如电梯广告、展板、VI识别等。
主要技能：PS、CDR、AI、ID等设计软件是最常用的软件，掌握其中一种或几种基本能胜任。当然除了软件技能之外，更需要注意的是配色、排版、工艺等知识的学习。
网页设计
凡是用浏览器打开的都可以称之为网页（此处不包含电商）。网页设计可分为展示型网页，功能型网页。展示型网页主要设计一些官网，活动页面等，功能型网页，例如淘宝、携程之类的。网页设计除了设计视觉效果之外，更重要的是考虑用户的操作问题。好的网页设计师可以进行切图、静态网页的编写。网页设计更重要的是能够与前端工程师合作，那么我们应该懂一些网页设计的基本规范。
网页设计的单位：像素；颜色模式：RGB；分辨率：72
主要技能：PS是网页设计最常用的工具，如果能掌握AI或者一款3D（3DMAX、C4D）软件，那么视觉效果会有更多的选择。HTML的编码能力最好也能够具备，实现静态网站，那就更具有竞争力了。
电商设计
这几年电商设计师的薪资水涨船高，电商设计主要分为：店铺电商设计和平台电商设计。店铺电商主要负责店铺产品的拍摄、店铺设计、店铺装修、站内外广告设计等。平台电商是针对电商平台进行的设计，所谓的电商平台例如：淘宝、京东、天猫就是电商平台，当然很有很多很多小众的、行业细分的电商平台，电商平台设计与网页设计师更像。
电商设计的单位：像素；颜色模式：RGB；分辨率：72
主要技能：主要技能：PS是网页设计最常用的工具，如果能掌握AI或者一款3D（3DMAX、C4D）软件，那么视觉效果会有更多的选择。HTML的编码能力最好也能够具备，实现对店铺装修有很大的作用。
UI设计
提到UI设计的载体首先想到的是手机，没错，手机确实是目前社会中最常用到UI设计的载体，手机以外还有电脑／平板／电视／取款机／购票机／游戏机等。比如容易忽略的ATM提款机上的界面，地铁站的自助购票机界面等都是UI设计范畴。UI的英文全称是user interface 翻译成中文是用户界面，也就是说我们平时用的任何有交互界面的设计都能称之为UI设计。
UI设计师是制作视觉设计的，在尺寸，按钮，间距等方面需要做到像素级别的准确度，而在做一些banner宣传图时又需要有天马行空的表达。有点像平面设计与网页设计的结合。
如果UI设计师在规范、切图、交互上面下功夫，会使你如虎添翼。做设计的思维一定不能停留在视觉层面。

3、我想问一下视觉设计师就是做原型图的吗？

不明白你这个问题的原意！你是不是想问视觉设计师的工作内容是什么？或者说什么是视觉设计师？

4、网页视觉设计师和前端开发有什么区别

网页设计分为两大部分：一、单纯的设计，也就是ps。二、就是网页制作，前端开发div+css。一般来说大公司都是分的很细的，而小公司却让一个人做。不管做哪部分刚入职时都会有一个老师带着也就是说给老师打下手，老师会分出来一部分内容让你去做。直到可以独立完成为止。

5、网页设计流程，用画原型图吗？逻辑谁来设计

首先要有网页或者说是网站的需求方提供需求内容。
例如页面要包括哪些，如用户登录，注册，信息展示，甚至在线支付之类的东西。
然后还要有一些具体功能需求，如用户注册需要提供哪些资料，如身份证，地址之类的信息。
信息展示具体是哪些。

有需求方先要写明自己的需求，然后根据需求进行下一步的设计，原型图肯定要画，因为没有图就无法制作网页。
先把图画好，然后和对方商定细节，例如logo的大小，段落间距，字体颜色，之类的细节东西。
画好图并确定后就可以按照图来制作网页。
至于内部后台相关也要商定。
具体由谁来做什么要视情况而定。
例如如果对方公司有美工之类的，可能就直接给你一些素材甚至画好的图让你直接制作。
也有可能需要你自己画图或者找人画图。

6、如何进行web页面原型图设计

简单来说，产品经理进行页面原型设计时，只需要把业务逻辑和交互逻辑讲明白，不需要做得特别精美，而是要把握重点，把重心放在分析用户需求、规划产品功能上。之后交互设计师可以根据产品经理的原型图进行设计。
从使用工具来看的话，产品经理在做原型时其实只需要Mockplus或摹客原型这样的快速原型设计工具。只要提前想清楚主要的功能点和交互逻辑，使用工具内置的现成组件，十分钟就能把原型做完。
交互设计师需要做的是根据产品经理绘制的原型版和相关产品文档，绘制高保真原型，通常交互设计师会使用PS、sketch、XD之类的设计工具，在完成页面设计后上传到摹客等协作平台添加交互。完成后也可以直接发链接给其他成员审阅，这时候主要看的就是原型呈现的视觉效果了。

7、ui设计要会Axure RP么 ？？ 网页设计涉及原形设计么

你好！
分工明确的话，做视觉设计的可以不做原型设计。
ui设计不一定需要Axure
RP软件；
网页设计的低保真涉及到原型设计，后期的高保真和开发不涉及。
希望对你有所帮助，望采纳。

8、求大神给我一份RP原型图，和根据原型图制作出的html网页.

这类的要求还是很简单的。你可以提供图直接在线制作，这类的要求也很简单的。

9、网站交互设计：线框图，原型和视觉稿的区别

首先，他们都是网站的界面和交互方面的模型，但完成度各不相同。

线框图 —— 更多侧重呈现网页界面的主体结构，极易只要的页面跳转和逻辑关系。一目了然的了解网页设计的大致情况。

原型图 —— 原型添加更多的界面细节以及交互，已然是相当真实的网页设计模型，能够进行初略的产品演示和测试。

视觉图 —— 更进一步丰富视觉、细节以及交互，与最终产品十分接近，方便演示和迭代。

当然，设计师设计过程中，使用的工具也会有所不同。例如，线框图和原型图，一般原型设计工具，例如摹客Mockplus, 几分钟就能快速完成。它新出的在线全新升级版本，提供更多模板、组件、交互以及状态设计选择，高还原度原型设计，轻松打造。

10、平面设计，网页设计，ui设计三者有什么区别

区别一：定义不同

1、平面设计，是以“视觉”作为沟通和表现的方式，透过多种方式来创造和结合符号、图片和文字，借此作出用来传达想法或讯息的视觉表现。

2、网页设计，根据企业希望向浏览者传递的信息（包括产品、服务、理念、文化），进行网站功能策划，然后进行的页面设计美化工作。

3、UI设计，指对软件的人机交互、操作逻辑、界面美观的整体设计。

区别二：使用平台不同

1、平面设计是纸媒时代的产物，主要以平面媒体或载物进行设计，报纸、杂志、画册、海报、宣传页、书籍装帧等都是平面设计的工作。随着互联网及移动互联网的发展，浏览逐渐趋向移动端发展，平面设计的发展也受到一定的阻碍。

2、网页设计主要针对的PC端运用的设计，后来移动互联网的流行，网页开始在手机上流行起来，为保证能够多端正常显示，在HTML5和CSS3的帮助下，“响应式设计流行”，使得网页能够在任何平台都能正常显示。

3、UI设计主要针对的PC端运用的设计手机系统界面、软件界面、网站界面、游戏操作界面、智能电视界面、汽车导航界面、VR虚拟现实等都需要UI设计师。

区别三：信息量不同

1、平面设计承载的信息量是有限的。

2、网页设计或UI设计的信息承载量是无限的。

3、平面设计是无法与读者进行沟通获取用户反馈的或者二次更新的。