【甜屋- The Sweety House】成功上线——设计过程完全解析

经过两个星期左右的努力，甜屋的制作终于完成大部，也放到朋友的域名下，可以供求职使用了。现在总结一下甜屋的制作过程。

 

一、第一步是确立网站的主题。因为对蛋糕喜爱有加，所以一下子就想到要制作这么一个主题网站。也开始到处搜集素材。搜集素材是个漫长的过程，总是容易让自己的计划被打乱。比如找了很多，却还是不满意；或者是找找停停，时间一下子就浪费掉。发现这一问题后，我决定还是先把这一部分的工作暂停一下。开始设计页面的布局及排版。

 

二、在本子上很快画想要的首页效果：

HTML代码也很快的写好，应用CSS样式，想要的效果基本实现了。之所以说是基本，是因为网站LOGO是直接“借”用了其它网站的。为了方便开发的速度，这样的借用确实提高了我的效率。还有就是细节还未实现。

 

三、首页的雏形已经出来了。为了让页面的内容丰富起来，我需要一些文字。但又不想随便乱粘一通，于是找了专业的蛋糕网站，“借”用了它们的文字描述，实在有些汗颜，毕竟，让我绞尽脑汁的去写出长篇大幅的蛋糕相关文章，还是很有难度的。这期间，找到几家国外的专业蛋糕店网站，它们的专业图片和文字让甜屋的构成瞬间饱满。文字与图片素材已不成问题了。

 

四、网站次页面的设计与实现：

 

次页面实现的同时，也确定了导航标签切换时，页面的跳转方式。在这里，我使用Iframe。

 

五、细节修改与LOGO制作。内容包括：首页背景的设置、内容框阴影、图片组的链接效果，以及AD位置的内容。次页面主要是内容框的色彩搭配、导航栏美化，字体等等。这些完成以后，才开始制作属于甜屋自己的LOGO。于是又开始找PS画笔素材。经过一番修改，终于得到比较满意的LOGO，也就是现在使用的：

 

效果还算过得去，hoho，不能跟专业UI设计师相比嘛。

 

最终的网站成品：

截图色差有点大，米办法。。。

 

 

网站地址：

http://slimeweb.com/CandyHouse/index.html

 

欢迎围观，提意见~~~~