界面设计不只是为了好看，实际上界面对内容的有效性是一个决定性因素。界面决定了交互，界面决定了人如何使用信息及操纵信息。
下面这个教程是我转载的：原文地址：http://5.itis5.net/lunwen/jiemian/jie.htm
界面，是软件每一步操作时所显示的电脑版面，本文所研究的主要是指课件中的界面。课件界面设计宗旨是：内容清楚、指示明白、版面美观、有亲切感。
界面通常包含有图形与文字。界面的设计，是对素材取舍及形式的处理手段。在设计中，需要对设计的形式反复推敲、琢磨，才能使其达到完美的境地。这几经提炼而成的形式又往往受一些最基本的原理所支配，受最基本的形式法则所制约。
第一节 界面设计中的视觉流程
在我们医学教育类的课件中，有关图片、说明文字、图表等必须被迅速和明白无误地找到。这就要精心设计界面的视觉流程，使所有视觉元素协调有序。
观看界面的视觉过程为视觉流程，它是一种视觉的空间运动。界面流程清晰、明朗，使读者感到心理上的安定。流程往返复杂，则引起视觉紊乱，造成心理上的 不愉悦。由于视觉流程的整体形式不同、方向不同、主旋律不同，就有不同的流程运动。它的表现大致为以下形式：
一、 主次引导
靠空间位置的主次关系来确保流程的合理性，使视觉区域的流动符合人的生理习惯。界面各元素应按视觉运动的规律给以一定的组合，形成界面的脉络，诱导读者的视线从主到次、从强到弱、从文字到图像……形成一个和谐整体。
二、 视觉中心
界面的视觉中心可以理解为：以强烈的形象或文字占据界面的某个部位，形成界面视觉焦点。视线往往由视觉中心开始，沿着一定的方向运动。所以，把握视觉 中心也就把握住编排的整体性。设计者将最有视觉魅力、最为重要的元素放在界面某区域，人为地创造界面的视觉中心，以显示界面阅读的起点。
三、 顺序标记
靠明确的顺序标记，借助文字等有先后信息的符号引导流程，如1、2、3、4……，A、B、C、D……等，强制读者按编排的意图观看，这是一种最简单而又最有效的方法。
第二节 界面设计中字体的应用
文字是任何界面的核心，经过精心处理的文字材料完全可以制作出效果很好的界面。字是一种十分清晰的符号，可以立即引起我们的大脑作出含意明确的思考。 同时，这符号又具有形态方面的审美功能，即特别强调从艺术的角度，从视觉要素方面去考虑字的类型。系统化、特征化了的字体又可组合排列成美的文字界面。
随着计算机技术的发展，字体的选择，字母的大小、高低、宽窄，角度的变化等都有了无限的可能。设计方法的大幅增加，对有良好训练、有字体意识的设计者 而言，为探索更好的易读性，为寻找一目了然的界面编排提供了方便，而对缺乏字体修养的设计者来说，这超强的变化方法意味着一种危险的诱惑，往往在变化中迷 失方向。在字体逐渐系统化、特征化的过程中，设计者只有像作曲家对待音符那样对待每一个字母符号，从视觉艺术的角度来考虑字体带给人的艺术美感，才能给予 字体更多新的表现力。
一、 常用字体
1. 英文字体
英文字母仅26个，但字体种类至少有百余种。在罗马系和歌德系两大类中，又可归为有衬线字体与无衬线字体。有衬线体相当于汉字的宋体，其特征是竖笔较 粗，横笔较细，有古典的优雅之美。无衬线体则相当于汉字中的黑体，所有笔画粗细都一样，富有时代感。英文字体的结构与汉字有明显的差异，汉字能容纳在一方 块内，而英文字不仅有大小写，而且每个字的排列结构均不同，设计编排时更要注意它们间距的视觉美感。
2. 中文字体
中文字体大致可归为：1．宋体类 2．黑体类 3．圆体类 4．书体类。字体不断的发展基本来源于这几种常用字体，并在此基础上不断革新与演变。
二、 易读性与可读性
在界面中，有时往往出现编排的缺陷。有的字排得太小，不易看清；有的排得太窄，也有的排得太宽，不仅影响界面美观，而且影响阅读的流畅。界面设计者必须加强对字体易读性与可读性的研究。
易读性指字体被阅读和理解的速度及准确性。可读性则指衡量内容难易的程度。要提高界面可读性，必须有良好的易读性。
不同的字体影响辨认的速度。据研究，有衬线体读起来更快，更易识别，所以报刊、杂志和书籍类读物正文往往采用宋体，英文则用罗马体，而标题、引言等则 用无衬线体。如黑体，横竖笔画粗细一致，方头方尾，虽不如宋体活泼，但由于结构紧密，庄重大方，常用于标题和重点文句，显得醒目有力。在一个界面中，一般 只采用3、4种以内的字体，多了就会引起视觉上的混乱。将原有字体加粗、变细、拉长、压扁或变化字号大小，都可增加界面设计的变化手段。
三、 字号
字号即文字的大小，有号数制、级数制和点数制(也称磅)。一般常用的"字号"，即为号数制。字号的大小同行宽和文章的主题密切相关。标题用字一般大约 四号以上，正文用字一般五号左右最便于阅读。如有些参考材料，加框提要或注脚等，则可排小号字，字小精密度高，整体性强，由于读者阅读时间短，不会造成视 觉疲劳。一般说，字体不宜太花，以致影响阅读，尤其中文字体在正文中用长体、扁体或斜体都不便阅读。应该看到，界面上文字的组合由于字距行距的作用，组成 的块面形成丰富的灰色调，其良好的比例形状都给界面带来和谐之美。
四、 字距与行距
字与字之间的距离称作字距，行与行之间的距离称作行距。用电脑输入文字，字距一般用缺省值，行距多在1.25-1.5之间，除非是特殊的界面设计。如 果在正文中拉宽了字距，就不便于阅读，又多花篇幅。如果行距过窄，上下文字相互干扰，容易跳行读错。如行距过宽，太多的空白显得松散，不能有较好的延续 性，使阅读较长篇文字时感到疲劳。
字距与行距比例的一般规律：行距最少要大于字距。至于具体距离，应根据设计的主题而定。在学术性很强的课件中，多用以上的标准值，以强调科学性；如果 是娱乐、抒情类界面，加宽字距与行距有轻松、疏朗之感；简介、告示之类宣传品，则采用宽、窄行同时并存的手法，以增加界面的活泼、装饰效果。
五、 文字编排
在一个界面中，文字占有重要的比重，它往往是界面个性的基本组成部分，并反映着不同的情调。创意性的文字编排，文字本身的变化组合都是极其重要的，它将产生新颖的界面效果。
1. 文字组形式的变化
a. 两边对齐。文字组成的字群从左到右长度均齐，显得端庄、严谨。
b. 齐左或齐右。文字组成的字群左齐右不齐，或右齐左不齐。在它们的齐左及齐右处，自然产生一条清晰的垂直线，界面有紧有松，有严谨有自由，从而获得特有的节奏感。
齐左，符合人们的阅读习惯，轻松自然；一般课件的正文多采用此类形式。
齐右，视觉上的不习惯往往又获得界面的特殊效果；
齐中，以中心为轴，两端距离相等，使视线集中于中心，加强整体感。
c. 自由出入。文字群中插入去底图片，使文字绕图形边缘自由地出入，产生生动的随意之感，加强主题的表达。
2. 文字组形状的变化
界面中文字数量的多少，形成的字群面积与界面总面积之比，也称作界面率。界面率低、留白多，虚实对比强烈，给人产生高雅感。休闲类、抒情类或广告的留白率较高；而界面率高，信息强，但容易产生杂乱感，需精心编排。
3. 符号、线框的运用
将界面中某些文字的传递重点，如引语、提要、副题之类的提纲性文字，运用符号加以引导，或线框框起，或放于突出的位置等，使其在整体中特别明显，产生较强的视觉效果，使读者迅速简明扼要地把握主题
第三节 界面设计中图片的编排
界面中的图片，广义理解为除文字外的一切有形部分，它包括加工剪裁的照片，人工手绘的插图，电脑制作的图像等。图片在传递形象信息，吸引读者的注意 力，美化界面等方面具有独特的魅力。一幅合适的图片，将胜过千言万语，但如果使用不当，也将影响界面的效果。它们的构成，可从形状、数量、大小、方向、组 合等方面加以变化和创新。
一、 图片选择
界面设计者常常面临一项繁重的工作，即图片的选择。一个学科，一个课程，一个专题，可能拍下几十张照片，而能采用的通常只有两三张，这就需要设计者对 图片的选择应尽可能精选，避免重复，少数几张能说明问题就没必要重复使用更多图片，以保证足够的尺寸，提高图片信息量。
文字说明尽量放在图片下边或右边，这更符合读者的视觉习惯，否则容易影响阅读的速度与准确性。
二、 图片剪裁
界面中的图形往往通过剪裁处理，以突出主题的需要。在图片的画面上作必要的剪裁，去掉容易使人分心的干扰内容，紧凑的剪裁能将平淡的图片变得有声有色，使读者更集中注意于图片所传递的有效信息。
图片有时特写，有时全景，有时"出血"，有时去底，呈现丰富的变化。
1. 完整形
将图片以规整、单纯的几何图形加以剪裁，如以方形、长方形、圆形、椭圆形等加以规范与限制，将主体形象与环境共融，富有情节性，能完整地传达主题思想，是常见的图片形态。出现在画面时，常使人有安定、稳重、端庄的感觉。
2. 退底形
将图片中精选出的图像沿图像边缘剪裁而保留轮廓的图形，此图形离开了特定环境的限制，自由而突出，给人带来轻松、活泼的感觉，创造出富有个性的画面。与完整图形的严谨性相比，它更具感性，更加生动。
3. "出血"形
"出血"形即将图形充满界面，无边框限制，有向外扩张与舒展之感，由于"出血"界面的动感，增强了与人亲近的效果。
第四节 界面设计中色彩的运用
色彩给人视觉上造成的冲击力是最为直接与迅速的。作为第一视觉语言，色彩在界面设计中的作用是字体与图像等其他要素所无法替代的。由于对色彩的爱好是 人类一种最本能、最普遍的美感，它对观看者的影响便是最为直接的。界面设计者要考虑读者最初一瞬间的色彩感觉，牢牢地捕捉住他们的眼光，以达到引起关注的 目的，使设计的图例、照片、字体与空间等关系与色彩一起变成一种视觉化、形象化的语言，以达到更有效的传递目的。
一、 整体色
色彩具有影响人们心理，唤起人们感情的作用。色彩作为界面的设计要素之一，其视觉传递的作用在创意中往往得到加强。
所谓色调是由参与配色的色相、明度、纯度和面积关系决定的。整体色是指界面主要倾向于某一色调。不同的色彩表现不同的情感，根据设计主题选用不同色 彩，将有利于情景交融的沟通。在表现这些色调时，色彩所体现的感觉将有效地突出主题内涵，创造主题特有的情调。
二、 重点色
在同调的色中，局部加上不同调的色，形成视觉美点。色彩的点缀在界面中产生一种紧张感，成为整体的一个着力点。点缀的色应该采用小的面积，并与其他色形成强烈反差，以加强吸引力，形成视觉中心。
三、 对比色
画面上冷暖色对比，同时占有相同面积及地位。界面上两色不分主次，对比强烈，色彩华丽，装饰性很浓。
第五节 界面制作的技术要求
课件从使用形式上分类，有单机版和网络版。随着网络技术的迅速发展，网络版课件越来越成为主流教材。网络教育之所以能在今日社会中扮演如此重要的角 色，是由于它快捷的传输信息的速度。没有速度的网络也就丧失了它存在的意义。因此，我们在设计网络教材时，应该在提高传输速度上下功夫。
对网络教材的设计者来讲，如何使需要传递的信息在质量与容量两方面达到平衡是设计的关键。
一、 文件容量
目前网络连接主要有双绞线和拨号方式，前者每秒传输为10-100M，后者为56K。校园内我们用双绞线连接方式，但如果考虑到一个课件能成为社会通 用的开放性教材，则绝大部分用户是拨号上网，起码目前是这样，那么，教材的容量便直接影响运行时间。因此，尽量减少文件容量是制作人员的设计关键。文本占 有的容量远少于图象容量，所以，在界面设计中容量的考虑主要从图象着手。
图象文件容量的大小受几个因素制约：一是图象尺寸，二是精度，三是色彩。
界面图象的尺寸面积与容量成正比。在可以接受的范围内尽量将图像设计得小一些，这样对减少容量很有好处。
要提高传输速度，一定要将文件做得小而精。那该精到什么样的程度呢？根据目前常用显示器的分辨率，从0.25mm-0.35mm，即dpi（每英寸线数） 为72-100。也是说，一幅图像的分辨率你做到72-100dpi，在荧屏上看已经很美了，你再做的分辨率更高，也是浪费的。
文件的颜色模式为RGB，颜色数不少于256色就可以，这样的文件在任何显示器中都不会有粗糙的感觉。
二、 文件压缩
有一些制作软件，如类似Adobe Photoshop这样的图像制作软件，此类软件是专门为设计和制作印刷广告而开发的，虽然在制作图像效果上可以随心所欲，但开发商并未考虑到文件容量与 文件质量的协调比例以适应网络运行的特殊要求。不过随着网络的发展，适应其特性的"图像压缩软件"也应运而生，我们通常称它们为"减肥软件"。这是因为它 可以在保证－定画面质量的情况下，大幅度地压缩文件容量，有些软件最大压缩比可以达到20：1。试想一下，如果两个网络课件有着相同的界面外观，但浏览速 度上一个却是另一个的20倍!
网络技术的发展，使原来概念上的单指平面设计的界面定义又有新的内容，它包括有文字、图形、图像、动画、音效和视频等多种设计元素而成为新的集合。
运用多种设计元素，增强界面力度，使多媒体课件得以极大的发展。
今天，网络型课件以其互动性的绝对优势，在二十一世纪新型教育模式中，发挥不可估量的作用。网络教材包容性很强，集合了几乎所有媒体的优势，作为一种新型传播手段，给设计者们前所未有的发挥想象的空间。
