诗沐的设计博客和作品集。提供网页设计/开发/用户体验咨询/wordpress博客主题设计等服务。记录网页设计&开发教程，发布wordpress主题。

版权声明：本文来自于Shimu design，转载请注明作者信息及原文链接。
Trackback: How Blackboard theme has been done – the original

上面那张图是就是这个小站wordpress主题：Blackboard的最初的起源，查看大图。和现在这个线上版本看起来还是有蛮大差别的，我想用How Shimuuu has been done这个系列网志来记录一下这个小站诞生的全过程。可以查看这篇网志，里面包含了目录。

最最最原始的想法

从图里可以看出，最开始我也没有用黑板这个灵感。关键词只是big typography和textured background，最重要的是one page style（把blog, portfolio, about, contact都放在一张页面上），这些都是受了现在网页设计的潮流的影响。在最初的字体选择上，当时对字体的认识还没有现在这样全面，可以从图里看到，sans-serif和sans两种结合得并不是很好（用的是Old style goody和Arial blod）。整个纹理背景，也是在一名国外设计师的博客的基础上修改的，其实也不是很契合我的风格。不过，这只是最初的试水。

黑板的灵感

在这稿出来之后我并不是很满意，太多别人的影子。我试着发挥自己更多的想象力来做，暂且不管最终结果如何，看看能走到哪一步。在几次头脑风暴之后，有了黑板这个灵感。我在网络上搜寻了很多图片，它们都提供了不少创意。

融入黑板元素的稿子

我尝试融入进更多的黑板元素，甚至拍了一块真的黑板的照片并用photoshop处理成了无缝纹理；还有一些插画，我想达成黑板画的风格。这些过程中的稿子我都觉得不错，不过最终还是被我放弃了。因为我发现在主体内容增多之后，我没办法处理好这些烘托气氛的元素，也没办法把他们和谐地融入进主体内容。考虑到网站的性能，我并不打算在主体内容上用太多的图片，所以黑板画风格的插画在我此后的设计中逐渐被精简。

与此同时，为了黑板显得不那么单调，我也加入了一些grunge的元素。有了先前的经验，这次我十分注意它们和主体内容的结合，以及重用。现在线上版本的grunge元素（首页左边导航处的黑板上水迹的模拟等）只用了两张图片，一方面是因为使用了css sprite，一方面也是把这些元素做成无缝衔接的可以运用到页面上任何内容上。

在最开始的创意阶段，我大概花了一两个月时间寻找契合的灵感，试过了很多图形元素、作品和网志排版样式。很多在后期的设计中都换了模样。这是第一次做wordpress主题的必经过程吧。好在这后面的过程中不断有好的想法冒出来，也给我的博客增添了更多的特色。敬请期待下一篇：How Blackboard has been done – the idea grow all the time

类似的网志，挑你喜欢的看：

• .htaccess文件中添加301重定向
• wordpress教程：如何将文章分成两栏显示
• New site launched!
• wordpress教程：如何在不同的页面显示不同的分类文章
• wordpress3.0导航菜单初探