‘壹’ web开发流程图 一般用什么软件
1. Codepen
Codepen应该是全世界最受欢迎的开发环境之一了。CSS技巧的作者Chris Coyier是Codepen的联合创始人之一，这也就是为什么这款app看起来那么豪华。除了视觉上的优秀效果，它可以生动地展现预览，当你修改了代码，就可以看到效果，使你能够更容易地找出变化。
Codepen用于CSS的预处理器包括SCSS、SASS，LESS和Stylus，用于JS的有CoffeeScript和LiveScript，用于HTML的包括Haml、Markdown、Slim和Jade。另外，它还包含了8个可用的内置的JS库。Codepen中合作和私人的“pens”需要付费使用。【前往Codepen】
2. JSFiddle
JSFiddle可以说是成就了开发环境的流行，它是第一个也是最出名的平台。JSFiddle有超过30个可以立即使用的JavaScript库，你还可以轻松的添加外部文件。在预处理方面，它有用于CSS的SCSS、用于JS的CoffeeScript以及用于HTML的简单Vanilla。
如果你在与其他开发者合作，我强烈建议你使用JSFiddle。在所有的开发环境中，JSFiddle的协作特性是同类型应用中最好的，而且区别于Codepen的是，它的这个特性是操作简单并且免费的。
但JSFiddle没有的是预览功能，你需要手动刷新页面。和其它开发平台相比，JSFiddle确实也比较慢。另外，JSFiddle还有一个不足就是它的执行键不是很灵敏，有时需要多点击几次才能够执行代码。【前往JSFiddle】
3. JS Bin
JS Bin是由JavaScript开发大师Remy Sharp创建的，他拥有一家专注于JavaScript和HTML5的web开发公司。JS Bin的JS预处理器包括CoffeeScript、TypeScript、Traceur、JSX以及可供使用的超过40个的JS库。你同样可以添加外部文件，但是必须在编辑器上手动操作。而用于CSS的预处理器，它提供了LESS。
JS Bin和以前开发平台的区别在于它允许你把文件下载到你的电脑上，这对于开发者，尤其是在离线状态下调试代码的程序员来说，是一个很不错的特点。你还可以创建私人的Bin空间，不过你需要对此付费。另外，JS Bin不支持协作功能。【前往JS Bin】
4. CSSDeck
CSSDeck已经存在一些年了，但它的影响力好像不是很大。不过，由于它的简洁性，它还是值得关注的。如果你不需要其它平台里那些复杂的功能，那CSSDeck就应该是你的选择。
CSSDeck的预处理器包括用于HTML的HAML、Markdown、Slim和Jade，用于CSS的LESS、Stylus、SASS和SCSS，以及用于JS的CoffeeScript。它还有几个可用的CSS和javascript库，对于没有的库，你只需要将其手动地添加到库的列表中就可以使用了。
CSSDeck虽然很简洁，但它有一个让我很吃惊的特性，就是它支持用户改变字体大小，这是一个简单却实用的功能。所以说，如果你在寻找有很多很炫的功能的开发平台，CSSDeck可能不适合你。它的简洁性让你更专注于最重要的事情，这也是它最大的特点。【前往CSSDeck】
5. Dabblet
当我还在使用十六进制颜色代码的时候，Dabblet的特性让我惊讶了，它的颜色预览居然显示在代码旁，这是我第一次见到这样的设置。虽然我不确定这是否是一个有用的特性，但是它的整洁性还是给我留下了很深的印象。
现在，Dabblet最棒的地方在于它允许用户以5个不同的视角进行预览，分别是CSS编辑器和效果，HTML编辑器和效果，CSS和HTML的编辑器和效果，JavaScript及运行结果，全部综合效果。这些功能在绝大部分的开发环境中都没有。
它也有不足，第一，Dabblet缺乏HTML和CSS的预处理器，这是令人困惑的。第二，它没有内置的JavaScript库，不过你可以通过手动插入JavaScript库来解决。第三，它的每个板块大小是固定的，无法作出调整，这和以前传统的调试平台是一样的。第四，它缺少一个用于演示其他用户作品的板块。【前往Dabblet】
6. Liveweave
Liveweave是一个拥有很多功能的开发平台，比如可以关闭的实时预览。你也可以为了保护视力，开启夜间模式，将所有界面都变暗。Liveweave提供了20多个JavaScript库，甚至还支持SVG。其内置的标尺使测量更加精确，更符合美学标准。
它还有一个吸引我眼球的地方，就是它的协作功能。如果你过去曾经使用过Teamviewer，你会发现它们是相似的。你需要做的事只是点击协作链接，你就可以分享来自于你到weave的链接了。
你甚至可以下载你的weave文件，并把它保存为单独的HTML文件或者保存为包含独立HTML、CSS和JS文件的zip压缩包。对了，Liveweave还有一个内置的Lorem Ipsum生成器。 【前往Liveweave】
结语
当然，每一个平台和工具都有它自己的特性，都会对你有所帮助
‘贰’ 我是做web前端的，要实写一个流程图，不会写，没思路，求指教
如果这个流程图是固定的，也就是说是不会随着数据，改变位置的话，那就做五行七列的格子，然后往格子里加东西应该就可以了。像那个蓝色四个角，你可以在这个包裹电话的小盒子里，定位四个小正方形，定位到四个角上。
例外那个每个图标样式都是固定的上图下文，上图带四个小正方形的交互，并且大部分带箭头，可以写公共样式。像那些线，如果嫌麻烦，可以用图片代替，定位上去。
‘叁’ 最好的画流程图的软件是什么
一、亿图图示
亿图图示是一款综合类办公绘图软件。它拥有260+绘图类型，包括流程图、组织结构图、UML图、电路图、平面设置图等。从绘图类型数量上看，它在这7款流程图软件中居首位。
功能特点：
1、除了丰富的绘图类型；
2、多端运行，亿图图示同时兼容Windows、Mac、Linux，而且支持Web网页版；
3、强大的云文档、社交分享功能，能够很好解决办公协同问题；
4、在文件导入/导出方面，是目前支持文件格式种类最多的流程图软件。
‘肆’ 制作流程图的软件或工具有哪些
1、axure rp
Axure RP是美国Axure Software Solution公司旗舰产品，是一个专业的快速原型设计工具，让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。
作为专业的原型设计工具，它能快速、高效的创建原型，同时支持多人协作设计和版本控孝升雹制管理。
2、Microsoft Office Visio
Office Visio 是office软件系列中的负责绘制流程图和示意图的软件，是一款便于IT和商务人员就复杂信息、系统和流程进行可视化处理、巧帆分析和交流的笑培软件。
使用具有专业外观的 Office Visio 图表，可以促进对系统和流程的了解，深入了解复杂信息并利用这些知识做出更好的业务决策。
Microsoft Office Visio帮助您创建具有专业外观的图表，以便理解、记录和分析信息、数据、系统和过程。
3、亿图流程图制作软件
亿图流程图制作软件是一款类似Visio的流程图、网络图绘制软件，新颖小巧，功能强大，可以很方便的绘制各种专业的业务流程图，程序流程图，数据流程图，网络拓扑图等。
它在设计时采用全拖曳式操作，最大限度的简化用户的工作量，方便易用；提供各种图形模板库，方便专业人士的使用；提供强大的图文混排和所见即所得的图形打印；
另外为软件企业提供可以二次开发的图形控件，提高企业开发效率，节约开发成本，是一款实用的流程图软件和绘制流程图工具。