fireworks之网站后台界面设计教程

UI / UI设计教程 /      

uimaker
UI设计师 / 江苏 南京

来源:蓝色理想   作者:tvtv

关键词


本文只是讲一下网站后台设计的一个大概流程,有的细节部分就不再细讲了(没有进行美化,只是一个简单的流程)。
现在开始,先看一下成品图,其实也不能算是成品,因为,主工作区没有做,每个人有每个人的做法,这里就留给大家自己来配吧。

 

1、先用钢笔画出形状,如图:




2、用“部分选定”工具对刚才画出的路径进行调整,如图:




3、给调整好的路径上色,如图:




4、复制刚才制作好的路径,进行调整,这里我复制了两个,呵呵,自由发挥吧,如图:




5、用“直线工具”画两条白色的斜线,笔尖大小自己调整一下,然后设置透明度,如图:




6、画一个圆形,设置成白色羽化30,如图:




7、再画一个大点圆,设置成白色羽化88,如图:




8、画圆,设置成白色消除锯齿白色,然后把它放到左上角的部分,设置透明度30,如图:


 


9、画上自己的LOGO吧,这里只是简单的写了几个字,呵呵,如图:




10、画一个栏目条,记得前几天做了一个栏目条的效果教程,大家有不会弄的可以去看一下,这里要说的是,制作好后把它放到我们上面做的所有层的下方,如图:


11、画好按钮,这里也不再说了,经典里的按钮教程,多的到了“低头不见抬头见”的地步了,嘿嘿,如图: 


12、好了,上面部分已经做完了,下面我们来做左栏部分,首先让我们来先画一个矩形,大小自己看着定吧(记得把它放到我们上面做的所有层的下方),如图: 


13、最后就是画出栏目框了,这个框其实并没有什么高技术性可言,很简单的,如图: 


OK,发完收工

源文件:

 

 收藏