【8A文】UI设计教程.ppt

《【8A文】UI设计教程.ppt》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、用户界面（UI）UserInterface曾俊勇视觉的要素造型造型决定一个物体看起来像什么视觉的要素颜色颜色会带给人们一种感觉视觉的要素大小大小给人某种差异视觉的要素远近，清晰度等在摄影中，比较强调这些。计算机人机交互界面人机交互界面主要因素是什么？造型颜色大小远近清晰度计算机UI中，把握好造型，颜色，大小——成功UI的开始！造型Demo1寥寥几笔，先勾画出造型，像什么。小提示：日本的很多小孩能惟妙惟肖地勾画出机器猫的造型。造型Demo2网友评价：最简洁，最有表现力的表情小提示：兔斯基QQ表情至今为止互联网上最全的表情。。。造型Demo3

2、我们常用一个造型像什么来叫它的名字小提示：比如鸟巢。。。公司的大胖造型Demo4我们常用一个造型像什么来叫它的名字小提示：裤衩咋走？（三环央视大楼）造型Demo5我们常用一个造型像什么来叫它的名字小提示：迪拜的七星级帆船酒店UI造型Demo1QQ小巧的造型，像一个"通讯簿"。利用它，我们还可以与它对话。人机交互UI（UserInterface）用户界面除了给用户提供信息外，往往还有交互性。我们称之为“人机对话”吧。UI造型Demo2音乐播放器（千千静听）的造型。包括“控制面板”，“播放列表”，“歌词秀”。觉得它很酷，似乎听起歌来都好听些。

3、UI造型Demo3浏览器再怎么都会有像一个“地址栏”的造型。UI造型Demo4这个“地址栏”的造型。看起来就像网页浏览器了。不管是Firefox还是chome，或者IE，最基本的造型是一定是不可缺少的。UI造型Demo5iphone的造型。思考and问题：造型是指某个东西看起来像什么，用一些基本线条，形状勾画出来。请描述一下iphone的基本造型。UI造型Demo6一个website，它有哪些造型？UI造型Demo7先观察几个网页吧。。。UI造型Demo8先观察几个网页吧。。。UI造型Demo9先观察几个网页吧。。。UI之website造

4、型1LogoWebSite的基本造型有哪些？让它看起来不像一份报纸？从“各种各样”的UIdemo中不难发现有这些元素。UI之website造型2WebSite的基本造型有哪些？让它看起来不像一份报纸？从“各种各样”的UIdemo中不难发现有这些元素。MenuandNavigate（导航）UI之website造型3WebSite的基本造型有哪些？让它看起来不像一份报纸？从“各种各样”的UIdemo中不难发现有这些元素。ContentUI之website造型4WebSite的基本造型有哪些？让它看起来不像一份报纸？从“各种各样”的UIdemo

5、中不难发现有这些元素。CopyRight（bottom）竟然发现——Mtime还将造型，颜色等申请了产权保护！可见，这些要素很能影响心灵深处。UI之website造型总结LogoMenuandNavigate（导航）ContentCopyRight（bottom）答案原来太简单了！真想拍你一板砖，这也要你说。。。。。。。等先，那我再多说一点，造型其实还可以内套造型！设计网页的思路一般是这样，考虑到外部的造型，其次再考虑到内部的造型。比如logo,menu,content...等再是什么造型。起个名字叫“造型渐进”法。画龙最后点睛一笔还是较

6、为简单的，而画轮廓，慢慢地勾画出来很难。造型小结造型决定一个物体看起来像什么平时我们如果细致观察，将一些基本的元素勾画出来，深入人心，就是成功的造型。颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色的感觉分类颜色Demo1一叶知秋颜色Demo2黑白的老照片——时间的

7、久远颜色Demo3红色海报——革命年代的热情颜色Demo4偏重暗色——非主流的色调小提示：正常图片暗色化，加入一些文字，这样玩非主流。颜色Demo5犀利哥：低调的黑色内衣深沉的蓝色裤带上有红色的强调色当然，造型也是关键。造型好的男人叫“型男”。颜色Demo6QQ校友色调——主打绿色，清新，亲近网页颜色搭配，一般不超3种颜色，主色，辅色，强调色。颜色理论这么多丰富多彩的颜色？做为设计师，如何调配它们？可见光谱三原色三次色十二次色环网页颜色搭配传统，高雅，优雅网页颜色搭配传统，稳重，古典延伸——WaysToTakeYourWebdesign

8、FromGoodToGreat保持微妙的颜色倾斜度延伸——WaysToTakeYourWebdesignFromGoodToGreat网格化延伸——WaysToTakeYourWebdesig