2011年,adobe公司发布了两款新软件的测试或预览版,edge和muse,两款都是很有创意的软件。都是应用于网页设计,都是针对设计师而开发的。Edge之前介绍过,以adobe擅长的动画设计模式实现HTML5+CSS3动画,而muse则用来实现无代码的网页实现。今天要介绍的是muse,刚刚在这个月正式发布的软件。

引用官网的宣传语就是“Think design,not code”,“Design and publish HTML websites without writing code.”。但凡一款新软件,接触的第一个问题就是,它能做什么。这个问题对于muse来说可以这么来理解,无代码话的网页设计,一般网页常用到的下拉菜单之类都可以通过拖放来实现。优势点,和图形设计软件无缝结合,dw之类的专业网页设计软件是传统类型的网页设计,图片是只能导入成品图片,不能在软件中加工,而muse可以做的就是直接导入psd,可以同时打开两个软件,用muse导入。再有DW中定位是比较麻烦,不够直观的,在muse中可以随意拖放。定位的事?不用你考虑,生成网页之后,软件自动生成。

界面介绍:和一般adobe的图形设计软件布局大同小异。比较特殊的是,多了模式的几个选择按钮,“PLAN”,“DESIGN”,“PREVIEW”,“PUBILSH”。这是因为鉴于网页设计的特殊性,网页设计一般设计导航设计,页面和页面间的关系尤为重要,PLAN的作用是理清页面关系,哪个是首页,哪个页面又是和哪个页面是并列关系的如图所示,这里面放着的是缩略图。移动鼠标放在页面之上会自动出现“+”号,左右的是并列关系,下面的是从属关系。

双击缩略图或上面图标栏的“design”就能设计页面。建议实际使用的时候,在上面的大菜单栏“window”下的全部可以拖动的。这些菜单包括,色板,文本之类,这些和photoshop之类大同小异。有个小快捷菜单值得注意,就是widgets library,里面的菜单选项就是常用的网页组件,按需直接拖放到工作区,例如,“menu”里面的 “bar”,拖放到工作区之后就是这个样子,有没有发现其右边的小箭头,就是对其功能设置,基本上所有的组件的设置类似。是不是举得很方便,就设计师而言不用再每天对着头痛的代码,让网页好像设计图片一样,考虑的是摆放,考虑的是美感。

诚然多么方便都好,基本的网页知识还是需要知道的,例如padding,margin,就如在新建页面的时候出现的这些,之后点击输出,生成了html和script文件,本质上来说,是利用jquery生成了页面的,当然了你也可以以此为基础添加自己的服务器脚本。

软件的使用有待各位自己尝试,adobe的软件也是经过版本迭代才形成现在的样子的。现在的版本效率还是有点问题,速度慢。功能也不齐备,但从大方向看,这软件是相当吸引的。