界面框架设计与配色.ppt

界面框架设计与配色 一、软件界面设计与配色的联系一、软件界面设计与配色的联系 二、界面设计中的框架设计和文字排版二、界面设计中的框架设计和文字排版 三、美观与协调性细则三、美观与协调性细则 四、四、216216网页安全色网页安全色 五、颜色原理和象征意义五、颜色原理和象征意义 六、颜色的使用风格六、颜色的使用风格 一、软件界面设计与配色的联系一、软件界面设计与配色的联系 界面是软件与用户交互的最直接的层，界面是软件的 外表。包括排版颜色等等因素。 界面设计的好坏决定用户对软件的第一印象。而且设 计良好的界面能够引导用户自己完成相应的操作，起到向 导的作用。同时界面如同人的面孔，具有吸引用户的直接 优势。 界面框架设计界面框架设计 二、软件界面设计与配色的联系二、软件界面设计与配色的联系 1 1，框架结构3类： 分栏式、区域划分、个性化无规律排版 2，图文结合： 图片和文字是网站构成的基础信息。插图不仅起到 美化页面的作用，还让网站信息更直观和明确。 3，字体大小 ： 利用CSS精确控制页面元素，特别是字体是很重要。 二、软件界面设计与配色的联系二、软件界面设计与配色的联系 4，考虑页面收缩及打开速度 5，导航作为页面的重要视觉元素和功能元素： 处理主从导航的关系，调节各部分的平衡。 三、美观与协调性细则三、美观与协调性细则 1 1，布局合理。 2 2，按钮的大小要与界面的大小和空间要协调。 3 3，字体的大小要与界面的大小比例协调,。 4 4，前景与背景色搭配合理协调。 三、美观与协调性细则三、美观与协调性细则 5 5，主辅色搭配协调。 常用的辅色有浅灰#E1E1E1、#EFEFEF、#C0C0C0等。 6 6，界面风格要保持一致。 7 7，注意窗体最小化和最大化时情况。 开发人员与美工的配合开发人员与美工的配合 需要设计的具体内容，完成时间，制作规范。 最后文件的大小，文件格式等。 界面配色界面配色 关于配色关于配色 颜色的搭配使用在网页制作中起着非常关键的作用， 有很多软件界面设计以其成功的色彩搭配令人过目不忘。 驾驭好颜色搭配。除了学习各种色彩理论和方法之外，还 可以学习一些著名网站的用色方法。 四、四、216216网页安全色网页安全色 红绿蓝RGB 数字信号值： 0，51，102，153，204，255的组合。 6 * 6 * 6 = 216色。其中彩色210种。非彩色6种。 五、颜色原理和象征意义五、颜色原理和象征意义 1 1，色相：纯粹色彩相貌差异。红黄蓝。 2 2，明度：色彩感觉的明亮或灰暗程度。 3 3，纯度：色的饱和度，彩度。色彩中包含黑白两色的成分。 4 4， 色彩情感联想： 不同的颜色有着不同的含义，给人各种丰富的感觉和联想。 红，黄，黑，白，灰，蓝，绿，紫 5 5， 色彩调和：多色协调 六、颜色的使用风格六、颜色的使用风格 不同的界面设计或网站都有着自己不同的风格，也 有着自己不同的颜色。使用颜色方式大概分为几种类型： 1、 公司色：使用企业CI形象中的标准色