┆死┆ 发表于 2009-6-6 15:28:11

photoshop制作博客网站模板实例教程

博客网站已经越来越多的被国内用户所接受与使用,由于博客的内容比较简单,大多作为个人的心情抒发或日记形式,所以BLOG界面也比较直接,往往排版就分为左右内容与导航区,不过简单的东西不一定容易设计,往往优秀的BLOG界面还是比较稀少的,本文的BLOG网站是由国外设计师设计,截面清爽简洁,细节处理比较到位,值得借鉴
http://pic.16xx8.com/article/UploadPic/2009-6/2009663393645.jpg本教程主要是告诉大家如何在photoshop里面设计一个有活力并具有现代感的博客界面。
我们会从零开始告诉大家如何从一个空白的画布来一步步的制作出整个界面。
http://pic.16xx8.com/article/UploadPic/2009-6/2009663393171.jpg
这是我为Springy Developments的一个WordPress主题项目中的一个特别的设计,将来我想我们一起来看看如何将这个设计转化为编码的过程以及最后如何将他们制作成最终的产品。
牢记最初的概念设计稿,下面的教程将会一步一步来明确这个过程。想要一个好的设计,大量的试验和一些元素的重新安排是不可或缺的,因为这将让我们很好的理解为什么使用这些工具,为什么这样布局来设计这样一个产品。
http://www.mysea.net/download/js/get163.asp?url=http://www.wzsky.net/ddimg/uploadimg/20090309/1022252.gif
http://pic.16xx8.com/article/UploadPic/2009-6/2009663393966.jpg

,
打开PS然后创建一个空白文档。我比较喜欢在一个大一点宽屏文档上面开始制作。切记使用RGB色彩模式以及设置为72DPI就好,因为我们紧紧是在屏幕上使用(注,一般印刷是300dpi,而屏幕只要72就够了,CMYK为印刷色)
http://pic.16xx8.com/article/UploadPic/2009-6/2009663393684.jpg
首先我们来处理页面的背景,这个地方没什么特别有趣的填充物。给背景选择一个素色,然后从上面使用放射性渐变工具一直拖到中间。当然你也可以选用自己喜欢的颜色,在这里我就选择了我选择的是蓝绿色的渐变。
http://pic.16xx8.com/article/UploadPic/2009-6/2009663393863.jpg
打开一个 牛皮纸 素材, 我们将用它来为背景增加一些有趣的材质效果。
http://pic.16xx8.com/article/UploadPic/2009-6/2009663393855.jpg
**** Hidden Message *****下一次,我们就来学习一下如何把做好的模板设计切图为XHTML+CSS网页用图片 http://bbs.16xx8.com/thread-73781-1-1.html
页: [1]
查看完整版本: photoshop制作博客网站模板实例教程