3    设计说明
通过对本次设计进过了详细的分析理解之后，决定采用比较传统的书画风格来完成这一界面，希望通过这样一种风格展现出魏碑的特色。整个设计主要分成了6个功能模块，从开场动画模块，到主界面的模块，再到历史沿革、艺术特点、作品赏析和书写技法模块，将魏碑书法从头到尾详细的介绍了一下。下面就创意构思和各个功能模块做一个详细的解释说明。
3.1    创意构思
本课题的主要内容是魏碑书法，但是需要通过现代化的界面设计来展现出来。所以在一开始风格定位的问题上面有了一些问题。界面设计它是很新兴的东西，现在很多的界面设计都是比较现代化的，是很具有视觉冲击力的，互动感也是很强的。而魏碑书法它是中国传统书法当中的一种，如果把它做得非常的现代化，那会让人觉得很不自然。所以通过一番思考过后，最终决定用一种比较传统的书法风格来完成此次界面设计。确定完主题风格后，开始要对这次设计的整体框架结构做一个规划。首先，在进入到主界面之前，在界面开始阶段做一个开始动画，动画的内容就围绕着魏碑展开，在动画中加入一些图片和文字，通过简短的动画让读者对本课题所要展示的主要内容有一个初步的了解。等播放完这段动画以后，做一个导航界面，整个导航界面的制作是通过文字和图片信息所组成的，在这个导航界面上面，读者可以通过点击导航栏中的任意一个项目进入到指定界面中去，来浏览想要看的东西，在这一过程中可以从中感受到交互的快感。导航栏界面之后就是主界面了。本次主界面设计的色彩运用主要是偏向黑白灰的，将灰色作为主色调，展现一种简洁明了的感觉。而在界面上的内容展示方面主要是采用了图文并茂的方式。其余的分界面的设计主要围绕着主界面的风格形式来做。最后，再罗列一下本次专辑界面设计的6大功能模块，分别是开场动画、主界面、历史沿革、艺术特点、作品赏析以及书写技法。每个功能模块代表了魏碑书法的每个值得欣赏的地方，通过详细的介绍，展现出魏碑书法的各个与众不同特点。

3.2    功能模块
3.2.1    开场动画
就像电影开头一样，开场动画通常都是很抓眼球的，它能引起你看下去的兴趣，一定要花一番功夫去把它做好。这次的界面设计开始动画，我准备首先在画面中出现本次设计的主题“魏碑”这两个字，打算用一种墙面掉灰的效果将它慢慢呈现出来，放完这一段后，画面中会依次出现笔、墨、纸、砚的图片，并在图片下方附上相关的文字解释，再接下来图片慢慢变淡，然后再由浅变深的呈现出导航栏界面。在导航界面中会有一张背景图，上面会有一个矩形灰色的透明框，在鼠标移动到这个透明框上时，上面的导航文字就会慢慢地浮现出来，然后只要点击上面的文字就会进入到相应的页面中。如果没有直接点击，而是将鼠标移到框外的话，等过几秒之后，如果在框外移动鼠标，那么灰色框也会跟着移到，这是一个很有趣的地方，主要都是通过代码实现的一个效果。

3.2.2    主界面
通过点击导航栏上面的首页，就会进入到主界面当中。由于这次的界面设计内容是魏碑书法，所以我准备用一个比较传统的页面风格。首先我找了许多水墨书画图片，然后在其中找了一些传统的水墨画，把他们放到主界面中，作为背景图。把用毛笔所画出来的一根横放的黑色墨迹作为放置导航文字的地方，再在页面当中添加了一些传统水墨山峰的图片，使得整个页面充满了中国传统文化的气息。后面的几个分界面的主体风格也都是采用了这样的一种风格形式。而在主界面的内容编排上面是这样做的：在整个页面的左边，放上一个会自动滚动的图片框，其中的所有图片主要都是和魏碑有关的，其目的不仅是为了用来展示魏碑书法，而且也是整个主界面设计的亮点，如果没有了这样一个滚动图片框，那么整个页面的总体感觉会显得非常的单调乏，就会感觉像在看一些很常见的静态的页面了，那样就会失去可观性。回到图片框上，这次所做的滚动图片框，不仅可以自动的切换到下一张，还可以通过手动点击按钮，或者拉动图片下方的滚动条，来切换图片，这就大大的增加了本次界面设计的交互感。主界面的另外一部分，则是放在整个页面的右边，这里所放的就是一段文字，主要是对魏碑书法做一个精简的概述，其内容主要是魏碑的分类、它的一些主要的作品、发展的历史、字体的艺术特点以及在书写上面的技巧方法。总而言之，整个主界面的最终目的就是能够让读者在看了之后，对魏碑书法会有一个大致的认识和了解。 魏碑书法艺术专辑界面设计(3):http://www.751com.cn/yishu/lunwen_10857.html