人机界面的艺术设计.ppt

《人机界面的艺术设计.ppt》由会员分享，可在线阅读，更多相关《人机界面的艺术设计.ppt（85页珍藏版）》请在三一办公上搜索。

1、人机界面的艺术设计,2,3,4.1 设计的概念,艺术设计是就设计具有一定的艺术成分和艺术意义而言，并非艺术创作（纯艺术），而是指非纯艺术的物质产品的设计人机界面设计中的艺术设计与界面所涉及的具体内容有关硬件界面和软件界面中的艺术设计要求有所不同，又有本质上的联系,4,4.2 艺术设计的研究内容,艺术设计包括艺术设计创作、艺术设计作品和艺术设计欣赏的整个过程艺术设计学研究该过程中的一些主要环节艺术设计创作过程“消融”在艺术设计作品中，反映在界面上，主要体现为硬件界面和软件界面。这些作品的使用价值体现在用户的消费和使用之中，它的文化价值也只有在使用和欣赏过程中才能实现艺术设计学的研究对象与设计的功

2、能性和审美性密不可分,5,4.3 艺术设计与技术,艺术设计是工程技术与美学艺术相结合的设计体系，不同于技术设计（如机械设计和电气设计）和纯艺术与技术设计的不同：技术设计旨在解决物与物之间的关系（产品的内部功能、结构、传动原理、组装条件等）。艺术设计在解决物与物关系的同时，侧重解决物与人的关系（产品的外观造型、形体布局、装饰效果、色彩搭配等）。需要考虑产品对人的心理、生理的作用与纯艺术的不同：艺术设计首先应满足消费者的物质需求，以实现功能为目的，其次才是满足精神上的需求艺术设计与技术有密切联系。设计以科学技术为创作手段和实施基础，并且设计观念受到现代技术的深远影响,6,4.4 艺术设计的形态,形

3、态的概念形态是内在的质、组织、结构、内涵等本质因素，上升到外在的表象因素，通过视觉而产生的一种生理、心理过程通常与感觉、构成、结构、材质、色彩、空间、功能等紧密联系对于硬件界面，形态以客观存在的形与人发生关系对于软件界面，形态以一种非物质化的数字形态与人进行交互,7,4.4 艺术设计的形态,形态的内容点几何意义上的点没有大小和形状，只有位置设计意义上的点则上升为一种“体”的概念点所代表的含义设计中的点：按键、旋钮、开关、螺钉、指示灯、商标、文字、把手等线几何意义上的线是点运动的轨迹，没有粗细，只有长度和方向造型意义上的线具有宽度和深度线条在设计中的作用线与点的关系不同线条所表现的不同性格与表情

4、,8,4.4 艺术设计的形态,形态的内容（续）面几何意义上的面是线移动的轨迹不同面所表现的不同表情和性格体长度、宽度和深度三次元共同构成的三度空间体所代表的性格特征,9,1、构成：是一种造型概念，既把不同形态的几个以上单元或元素（包括不同的材料）重新组合成为一个新的单元，并且 于可视化的，力学的观念。2、平面构成:是指将既有形态（包括具象形态、抽象形态点、线、面、体），在二次元的平面内，按照一定的秩序和法则进行分解，组合，从而构成理想形态的组合形式。,构成的概念,10,造型基本要素之一点,点的定义在几何学的定义里，点是只有位置而没有大小的。点是线的开端和终结，是两线的相交处。但从造型意义上说，

5、却有其不同的含意。点，必须有其形像存在才是可见的。,圆点是最具有点的特性,11,点在设计中的应用,12,造型基本要素之二线,1.线的定义在几何学定义里，线是只具有位置，长度而不具宽度和厚度的。它是点进行移动的轨迹。并具是一切面的边缘和面的交界。从造型含意来说，它必须使我们能够看到，所以，线具有位置、长度和一定的宽度。它在造型设计中是不可缺少的。线有两种，即：直线和曲线。当点的移动方向一定时，就成为直线；当方向常变换时，就成为曲线；点的移动方向间隔变换而成的是曲折线。它界于直线与曲线之间。,13,2.线的性质和种类,在造型中，线比点更具有较强的感情性格。它的重要性格，主要表现在长度。而长度是按点

6、的移动量来决定的。除了移动量之外，点的移动速度也支配着线的性格。比如：速度的大小，决定线的流畅程度，能表现出线的力量强弱。线的种类：直线，是男性的象征。具有简单明了、直率的性格。它能表现出一种力的美。曲线，是女性的象征。比直线较有温暖的感情性格。糨会使人们体会出一些柔软、幽雅的情调。,14,3.线的错觉,15,4.线在设计中的应用,16,造型基本要素之三面或形,1.面的定义面，在几何学中的含意是，线移动的轨迹。,17,2.面的种类及其性格,直线性曲线形自由曲线形偶然性,18,19,形在设计中的应用,20,三、平面构成的基本手法,1.重复构成即在同一个设计中，相同的基本形要出现两次或超过两次。重

7、复能加强给人的印象，造成有规律的节奏感，会使人产生一种统一、和谐的感觉。,21,2.发射构成,发射可以说是特殊的重复。重复的基本形和骨格围绕一个或几个共同的中心进行排列，这样就形成一个向外或向内的发射图形。具有多方面的对称具有非常强烈的焦点能够造成强烈的视觉效果,22,3.特异构成,指的是规律的破坏，秩序的轻度对比。在设计中，为了使单调的画面显得活泼一些或是为了体现重点部分，都可以采用特异构成的方法。,23,4.密集构成,在设计中，基本形的安排有时紧有时松，既不均匀又无规律，这种手法就叫“密集”。,24,5.视幻构成,在平面设计中，需要在平面上来表现立体，即要在二度空间里去表现出三度空间的长、

8、宽、高。在平面上要产生空间视幻的效果，常用变形、色彩和肌理、透视与投影等手法。,25,一、色彩概述,人能感受到色彩的条件：光、物体、眼睛,26,光的混合-加混合,27,颜色的混合-减混合,28,二、色彩的三要素,29,色彩的构成法则,明度推移,30,色相推移,31,纯度推移,32,色彩空间混合,33,色彩的对比理论,色相为主构成的色调,34,明度为主构成的色调,35,纯度为主构成的色调,36,冷暖为主构成的色调,中性微暖色,中性微冷色,冷色,暖色,暖极,冷极,37,冷暖为主构成的色调,38,面积为主构成的色调,39,色彩象征与色相分析,红：具体联想：火焰、太阳、鲜血抽象感情：热烈、危险、活力、

9、愤怒红色的纯度高，注目性高，刺激作用大。用红色做主色的多媒体作品不多，因为在大量信息的页面里有大面积的红色，不易阅读。但，如果搭配合理，可以起到振奋人心的作用。,40,带有神秘色彩的暗红色，卡通插图，先进、野性。,41,用明清色的红，深浅不同，带有韵律和节奏的跌宕情绪。,42,纯色加白（明清色）的心理特征：圆满、健康、温和、愉快、甜蜜、优美。同时给人一种幼稚、娇柔的心理。在儿童类多媒体作品中常见。,43,纯色加黑（暗清色）的心理特征：给人以枯萎、固执、孤僻、憔悴、烦恼、不安、独断的心理。过黑的红色的应用比纯红色广泛，一些个人的作品常用它营造另类气氛，宣泄情感。,44,纯色加灰（浊色）的心理特征

10、：给人以烦闷、哀伤、忧郁、阴森和寂寞的感觉。不太舒服，不能大面积使用，只能作为点缀。,45,橙色,具体联想：桔子、灯光、秋叶抽象情感：温暖、健康、欢喜、嫉妒橙色的刺激作用虽然没有红色大，但它的视认性和注目性也很高，既有红色的热情又有黄色的光明，一级活泼的特质，是人们普遍喜爱的色彩。橙色可以营造朝气蓬勃和大自然的气氛，它没有红色那么激烈，适用范围较广。,46,47,纯色加白（明清色）的心理特征：给人以细嫩、温馨、暖和、柔润、细心、轻巧和慈祥的感觉。适用于儿童、女性、文化类。纯色加黑（暗清色）的心理特征：给人以沉着、安定、茶香、古香古色、情深、老朽、悲观和拘禁的感觉。纯色加灰（浊色）的心理特征：给

11、人以沙滩、故土、灰心的感觉。橙色的暗清色和浊色适合旅游、知性、文化、理智一类。,48,黄色,具体联想：柠檬、黄金、枯叶抽象情感：光明、希望、富贵、朝气以黄色为主色的多媒体作品并不多，但黄色在配色中使用最为广泛，它具有明朗愉快的感觉。,49,50,51,52,纯色加白（明清色）的心理特征：给人以单薄、娇嫩、可爱、幼稚、不高尚、无诚意等感觉，不适合政府、金融、法律等题材。纯色加黑（暗清色）的心理特征：给人以没有希望、多变、贫穷、粗俗、秘密等感觉。纯色加灰（浊色）的心理特征：给人以不健康、没精神、肮脏、陈旧等感觉。,53,黄绿色：,具体联想：嫩叶抽象情感：新鲜、春天、纯真、无邪、活力、新生黄绿色是介

12、于黄色和绿色的中间色，比绿色常用。黄绿色有朝气，代表生命，但也具有无知和不成熟的心理感受，政府类题材不适用，适合表现儿童和年轻的题材。,54,55,纯色加白（明清色）的心理特征：给人以嫩苗、清脆、爽口、芳香、明快的感觉。纯色加黑（暗清色）的心理特征：给人以酸涩、忧愁、委屈的感觉。纯色加灰（浊色）的心理特征：给人以不新鲜、温湿、俗气、迷惑、泄气的感觉。,56,绿色：,具体联想：大地、草原、庄稼、森林、蔬菜、青山抽象情感：自然的、健康的、成长、新鲜、安静、和平、凉爽的、清新的纯绿色界面的作品并不多见，淡绿色、墨绿色的常见。绿色常与蓝色、黄色等搭配使用。,57,58,59,纯绿色加白（明清色）：给人

13、以爽快、清淡、宁静、舒畅、轻浮的感觉。纯绿色加黑（暗清色）：给人以安稳、自私、沉默、刻苦的心理感觉。纯绿色加灰（浊色）：给人以湿气、倒霉、腐朽、不放心的感觉。浊色往往要少用。,60,蓝绿色,具体联想：森林、深谷、清泉、深海抽象情感：深远、沉重、幽静、智慧、平稳蓝绿色的明视度及注目性基本与绿色相同，只是比绿色更冷静，更凉视。蓝绿色有智慧之感，应用于知识、科技、教育。,61,62,63,纯蓝绿色加白：给人以高洁秀气之感。纯蓝绿色加黑：给人以顽强、冷硬、庄严的感觉。纯蓝绿色加灰：给人以灰心、衰退、腐败的感觉。,64,蓝色：,具体联想：天空、海洋、水抽象情感：平静、科技、理智、速度、诚实、真实、可信蓝

14、色是幸福色，表示希望，在西方，蓝色是身份高贵的象征。用于科技、知识、计算机、政府、企业、男性等题材。,65,66,67,纯蓝色加白：给人以清淡、聪明、伶俐、高雅、轻柔的感觉。纯蓝色加黑：给人以奥秘、沉重、大风浪、悲观、幽深、孤僻的感觉。纯蓝色加灰：给人以粗俗、可怜、笨拙、压力、贫困、沮丧的感觉。,68,蓝紫色：,抽象联想：深远、崇高蓝紫色和黄色的刺激相反，是明度很低的色彩，注目性较差，其明视度必须靠背景来衬托，给人以收缩、后退的感觉。蓝紫色具有紫色的神秘，高亮度的蓝紫色显得非常高雅。,69,70,蓝紫色加白：给人以迷惑、妖媚、梦幻、幽静、离别、谦让的心理感觉。蓝紫色加黑：给人以寒夜、固执、阴森

15、、邪恶的感觉。蓝紫色加灰：给人以麻烦、讨厌、不幸、老成、消沉的感觉。,71,紫色：,具体联想：葡萄、夜空抽象情感：优雅、高贵、细腻、秘密、不安定紫色因与夜空、阴影相联系，所以，富有神秘感。容易引起心理上的忧郁和不安，又给人高贵、庄严之感，所以，女性题材常用。,72,73,74,紫色加白：给人以女性化、清雅、含蓄、清秀、娇气、羞涩的心理感觉。紫色加黑：给人以虚伪、渴望、失去信心的心理感受。紫色加灰：给人以腐烂、厌弃、衰老、忏悔、矛盾等心理感受。,75,紫红色：,抽象情感：温暖、浪漫、娇艳、甜蜜、开放、享受非常的女性化，浪漫的，柔和的，华丽的,76,77,78,紫红色加白：给人以文雅、轻浮、秀气、

16、细嫩、柔情、美梦、甜蜜等心理感受。紫红色加黑：给人以狂野的、有毒的、自私等心理感受。紫红色加灰：给人以灰心、嫉恨、堕落、不新鲜、忧虑的感觉。,79,白色：,具体联想：雪、云、白纸、天鹅抽象情感：纯洁、清白、纯粹、清静、明快、空白、高尚、整洁明视度和注目度相当高，与其他色彩混合均能取得很好的效果。在网站上最常用。,80,81,灰色,平凡、谦和、中庸视认性和注目性都很低，很少单独使用，多与其他颜色相配合。,82,83,黑色：,厚重的，老年的，恐怖的，死亡的，严肃的黑色与其他颜色配合，能增加刺激，很少单独使用。,84,85,4.8 艺术设计的美,艺术设计美的原则及内容功能美：功能的形态化所体现的美技术美：美的本质的典型体现软件界面与技术的关系：即使技术先进，但界面形式粗糙，仍使人感觉技术水平低下形态美：人机界面外在形态材质美：硬件界面设计需要通过材质创造内容,