视觉传达设计-软件界面基础设计PPT格式课件下载.ppt

视觉传达设计-软件界面基础设计PPT格式课件下载.ppt

《视觉传达设计-软件界面基础设计PPT格式课件下载.ppt》由会员分享，可在线阅读，更多相关《视觉传达设计-软件界面基础设计PPT格式课件下载.ppt（44页珍藏版）》请在冰豆网上搜索。

手机网页界面设计问题问题1网页VI无区分，网站之间无差别。

？

Metro风格改进方案解决1导入VI系统，运用平面色块、图标等元素增加网页视觉识别度。

手机网页界面设计问题问题2网页信息分类不清晰，显得庞杂无序。

Metro风格改进方案解决2利用色彩、大号字体构图区分版块。

手机网页界面设计问题问题3功能按键无特殊设计，容易被忽略。

百度百度Metro风格改进方案解决3利用平面色块提高醒目度。

手机网页界面设计问题问题4当前状态显示不明，用户容易迷失。

解决4显示输入框，关键字突出。

基础设计系统标准标志标准标志变形标志变形标志早期的很多标识设计虽然在静止媒体上运用自如，可是其在元素本身和构成形式上都是不适合用做动画效果来做展示，在当今时代其传播途径必然受到限制，这对于品牌生存与发展是不利的。

标识的概念由静止转为动态，由视觉转为视听结合，弥补视觉障碍者对信息的接受，这就是说随着运用媒体的改变，从动态的角度出发，标识不仅仅服务于静态的媒体，除了必须具有传统标识设计的普遍性要求之外，还有更高的要求。

交互标志的设计重点（更注重情交互标志的设计重点（更注重情感与体验）感与体验）1、以平面的vi为基础2、三维立体感3、三维动态与动态元素的提取4、多角度平面效果的界定5、光影、动态色彩等动态元素的界定6、与听觉的结合以晶莹剔透的色彩配合新款苹果电脑与iPod等系列大胆发售，给人以崭新轻松的新形象。

1、三维立体感变形标志2、3、标识的立体化与互动元素：

、标识的立体化与互动元素：

物象间利用它们的相似形、互借互生、融入对方的形象结构中，相互成为对方必不可少的一部分，形成两形或多形共用的有机整体。

如湖南卫视的台标与盛开的菊花组合和谐自然。

3、三维动态6、与听觉的结合2000年汉诺威世博会动态标志年汉诺威世博会动态标志主题：

人类主题：

人类-自然自然-技术技术2000年德国汉诺威世博会主题会标。

2000年汉诺威世博会聚焦于人类、自然和技术三者之间的关系，在21世纪门槛上，向全世界提出了社会和谐的课题。

大会会徽征集工作从1994年开始。

与以往不同的是，包括来MetaDesign的ErikSpiekermann在内的九位名德国知名设计师共同题名了一批名不见经传但才华横溢的年轻设计师加入徽标征集活动，以体现新世纪的新观点、新视野以及对未来的想象。

根据主办方的要求，这个标志必须是：

反映主题、独特性强、造型简洁而不乏深意、适用于印刷、动画制作、网络等多种媒质、可任意放大或缩小、能与“Expo2000Hannover”的标题字样协调结合。

由奎恩工作室（GermanstudioQwer）设计的这个作品无疑契合了主办方对于新世纪世博会的概念定位。

它是一个能根据不同场合改变结构与色彩的波纹图形，在整体结构不变的情况下时刻呈现出不同的运动状态。

它充满动感，仿佛只有高倍相机才能抓拍它下一刻的游走。

它又像一种难以捕捉的现象，充满了未知和不确定性。

正如主设计师MichaelGals所阐释的那样：

“它包涵了促使其保持运动和活力的元素，一种永恒的能量。

这也是21世纪发展对人类的要求：

保持运动、思维灵活、勇于创新，运用智慧推动世界向前发展。

”由著名设计师组成的国际评审组织评价认为：

这个外观看似有机生物结构的造型是标志设计领域技术运用手段变化的重要标志，它极富动感的造型与传统静止的印刷形态产生强烈的反差。

看来不论在内涵还是技术上，这都是一个会呼吸的标志。

3、动态元素的提取、动态元素的提取（元素适合打散与重组）（元素适合打散与重组）标识的构成元素是标识动画的主体，这些元素的设定直接关系到标识动画的成败。

设计标识的同时需要考虑到这些元素之间是否具有可分散性，很多标识动画的表现方式是以标识本身为题材，进行动态的拆分、多个形态的重叠等等。

4、空间的延续性（多平面角度的定格）空间的延续性（多平面角度的定格）标识在静止状态一定是单一视角的，也就是二维的，而一旦成为动态效果时，标识就可以是跨空间的多维的。

因此在构思标识的同时，需要换一个角度考虑标识的形态，比如想象从侧面、背面、斜面等视角是否具有延续性，要适当追求标志的运用弹性。

4、空间的延续性（多平面角度的定格）空间的延续性（多平面角度的定格）标准字体标准字体指用于软件界面标志、标题、主菜单的特有字指用于软件界面标志、标题、主菜单的特有字体。

体。

设计师可以根据需要选择特别的字体，但由于设计师可以根据需要选择特别的字体，但由于字库的不同，会出现显示问题。

也可以作为图字库的不同，会出现显示问题。

也可以作为图片显示，但是文件会很大，影响下载。

片显示，但是文件会很大，影响下载。

中文网站网页默认的字体是宋体。

标准色彩与辅助交互色彩标准色彩与辅助交互色彩标准色彩标准色彩界面给人的第一印象来自视觉的色彩感受。

确定标准界面给人的第一印象来自视觉的色彩感受。

确定标准色彩（即定色调）是软件界面设计的重要一步。

色彩（即定色调）是软件界面设计的重要一步。

标准色通常采用标准色通常采用l3种色单独或组合使用。

单色易记，印象强烈，但容种色单独或组合使用。

单色易记，印象强烈，但容易与别人重复；

多色组合易显出个性，然而用色过多；

制作复杂也是不易与别人重复；

制作复杂也是不可取的。

可取的。

界面的标准色一般只采用一种，广泛应用于标志、标界面的标准色一般只采用一种，广泛应用于标志、标题、主菜单和背景色块中，给人以统一的企业感。

具题、主菜单和背景色块中，给人以统一的企业感。

具体应用时以标准色为中心，利用它的明度变化产生不体应用时以标准色为中心，利用它的明度变化产生不同的色彩。

（注意：

不是所有色彩都适合在界面中做同的色彩。

不是所有色彩都适合在界面中做标准色。

会存在视觉疲劳等问题标准色。

会存在视觉疲劳等问题）其它色彩只是作为其它色彩只是作为对比和衬托，决不能喧宾夺主。

对比和衬托，决不能喧宾夺主。

选定的标准色要给出标准的色值。

动态交互色彩的标准（辅助动态色彩）：

1、文字交互前后过程中的标准色彩2、菜单交互过程中的标准色彩渐变色彩的标准与标识动态色彩的标注方式动态色彩的标注方式商标品牌等的动态编排模式商标品牌等的动态编排模式在在标标准准字字体体、动动态态标标志志、动动态态标标准准色色的的设设计计完完成成之之后后，进一步的任务就是三者之间的编排以及规则的制定。

进一步的任务就是三者之间的编排以及规则的制定。

许许多多企企业业的的产产品品都都有有着着自自己己独独立立的的品品牌牌名名称称和和品品牌牌形形象象（商商标标）；

甚甚至至同同类类产产品品由由于于销销售售定定位位不不同同，品品牌牌也也大大不不相相同同。

有有的的是是产产品品品品牌牌延延用用企企业业品品牌牌，二二者者合合而为一。

而为一。

动动态态组组合合的的编编排排，一一方方面面强强调调了了交交互互中中企企业业的的独独特特个个性性；

另另一一方方面面，也也为为大大量量的的交交互互应应用用设设计计提提供供了了模模式式，使之在交互中更迅速、更规范。

使之在交互中更迅速、更规范。

横排、竖排等方式，以平面横排、竖排等方式，以平面VIVI手册的编排为基础手册的编排为基础网页左上角的品牌标志与字体的动态组合终端开机页面的品牌动画标准图标标准图标以平面以平面VI为基础为基础边框、形状边框、形状标准大小（几类）标准大小（几类）质感以及不同质感间的图标转换质感以及不同质感间的图标转换风格风格标准颜色组合与限制标准颜色组合与限制交互动态与前后变化交互动态与前后变化清晰度（图片精度）清晰度（图片精度）标准交互方式标准交互方式交互方式的界定与规范交互方式的界定与规范（标签式、翻页式等交互方（标签式、翻页式等交互方式的范围界定）式的范围界定）点击步骤点击步骤标准声音标准声音进入页面（或开机、关机）的标准音乐进入页面（或开机、关机）的标准音乐交互反馈的标准音乐（如点击音、操作交互反馈的标准音乐（如点击音、操作成功音与失误提示音等）成功音与失误提示音等）（如（如intel的标准音）的标准音）其它其它手势、触感等手势、触感等吉祥物吉祥物Android系统