平面设计看这本就够了_陈根

图 7-12　Xp 图形化系统界面

图 7-13　BunmTop3D 的桌面操作系统

第 7 章　平面设计发展的立体化 141

Graphic

平面设计Design

③ 透过实际物体来操作虚拟物的互动　任天堂公司 2006 年推出轰动一时的游
戏机 Wii，就是采用的这种互动概念模型，让使用者透过实体摇杆的运动，在虚拟
空间中得到相对应的结果。如图 7-14 所示。

图 7-14　以实际物体的运动来操作虚拟物件，是 Wii 游戏机的一大特色

操作式互动概念模型有许多好处，但也有它所不容易克服的缺点。首先，数字
系统中一些比较抽象的工作，并不容易找到合理的实际操作方式做呼应。例如“将
档案另存新档”，如果不用指令来完成，那应该用什么样的象征手法，才能让使用
者来直接操作呢？再者，特别是对于一些重复性的工作，要逐一操作则太过烦琐。
比如用拖曳的方式来整理档案，远不如用指令按钮编排来的迅速。例如现在的智能
手机都采用的是触控操作，许多数字设备也在采取和推广这种形式。如图 7-15、
图 7-16 所示。

142

www.huiyankan.com

图 7-15　戴尔推出的支持触控操作的显示器

图 7-16　未来的智能医疗触控操作界面

（3）指令式
指令式是一种非常直接的互助模型，用户透过文字指令、按钮、目录选单或者

快捷键来指挥系统运作，用户一个命令、系统一个动作，就像军队执行任务一样直
截了当。这种互动模型非常普遍，从早期 DOS 输入文字的命令行（command line）
操作系航、用按钮来操作的家电产品、路边的自助贩卖机或者是复杂的专业应用软
件，许多都是采用指令式互动模型，因此它可以说是最普遍的一种互动模式。

第 7 章　平面设计发展的立体化 143

Graphic

平面设计Design

如图 7-17、图 7-18 所示，想要哪一种食物和饮料，就按下面对应的按钮，是
指令式操作界面的典型例子。

图 7-17　食物自动售卖机

图 7-18　饮料自动售卖机

144

www.huiyankan.com

指令式互动的好处在于直接、有效率。可是只要系统的功能一旦复杂化，指令
式互动模型的缺点就会暴露出来。因为过多的按钮和指令，不但容易造成混淆，也
会延长用户的学习曲线（Ieaming curve）。曾经因为找不到 Word 软件中某一项功能
而开骂，或者曾经在 Photoshop 冗长使用说明书之中埋首叹息的人，相信都能够体
会这种延长学习曲线所造成的困扰。如图 7-19 所示为 Photoshop 软件操作界面。

图 7-19　Photoshop 软件操作界面

但由于指令式互动的高效率特质，许多专业的软硬件还是采用这个概念模型。
因为这种类型的互动产品，所面对的并不是一般消费者，而是必须长期使用这些工
具的专业人员。在熟能生巧之后，指令式互动其实是非常快速而且便捷的，因此这
个概念模型适合用在专业的互动产品中，如图 7-20 所示。

（4）浏览式
浏览式互动概念，就是让使用者像是在真实生活中逛街一般地，在信息空间中

随性移动。有些人将网络上的搜寻和浏览也归于此类，但我个人认为，浏览式互动
真正的典型有如下两种。

① 虚拟空间中的浏览　也就是让使用者在 3D 虚拟空间中自由移动，许多角色
扮演电玩游戏及所谓的虚拟实境（virtual reality），都是属于这个互动概念的典型。

第 7 章　平面设计发展的立体化 145

Graphic

平面设计Design

图 7-20　Facebook 网站随平台的不同而呈现不同的界面

以网络游戏为例，《开心农场》是以农场为背景的模拟经营类游戏。讲究互动
互助。每天用户只需要上线给自己或者帮好友的作物浇浇水、杀杀虫、除除草、收

146

www.huiyankan.com

收（或偷取）果实即可。游戏不仅可以调动用户上线的积极性，还可以促使用户发
起对站内好友的互动，让好友一起互动。游戏模拟了作物的成长过程，玩家在经营
农场的同时，也可以感受“作物养成”带来的乐趣。如图 7-21 所示。

图 7-21　《开心农场》是以农场为背景的模拟经营类游戏

② 实体空间与数字信息空间的结合　近几年更为热烈讨论的一种浏览式互动模
型，则是结合实体空间与数字科技的做法，例如会随着人的移动和需要调整的智能
型家居（smart home）或是感知环境（context-aware environment）。像智能手机
和 ipad 这种携带式的数字器材，全面提升了数字资讯与实体空间的衔接。有人将这
种虚拟与实体重叠的现象，称之为增强现实技术（augmented reality）。这种实体与
数字的结合，让使用者以另一种模式与资讯互动。

电影《阿凡达》热映掀起了 3D 电影视觉体验的热潮。如今，4D、5D 技术也已
被广泛应用。例如 4D 电视即在原有 3D 立体显示基础上由单一空间上的立体显示升
级为空间上、时间上和空间与时间上三种立体显示模式，这样可以满足全家人围坐
在一台电视机跟前同时以全屏的形式观看着各自喜欢的节目而互不影响，使得一台
电视变为了多台电视。5D 影院让观众从听觉、视觉、嗅觉、触觉及动感五方位来达
到身临其境。当观众在看立体电影时，顺着影视情节内容变化感受到风暴、雷电、
下雨、撞击、喷洒水雾所对应的立体事件，座椅也随时变化，如图 7-22 所示。

第 7 章　平面设计发展的立体化 147

Graphic

平面设计Design

图 7-22　5D 影院让观众从听觉、视觉、嗅觉、触觉及动感五方位来达到身临其境

Layar 是全球第一款增强现实感的手机浏览器，由来自荷兰的软件公司 SPRXmobil
研发设计，如图 7-23 所示。

图 7-23　Layar 是全球第一款增强现实感的手机浏览器

Layar 具体工作流程为用户开启应用程序，自动启动摄像头，GPS 探测到目前
所在的位置，罗盘判断摄像头所面对的方向。然后每个内容合作伙伴（CP）自动匹
配当前位置的内容，并各形成一个图层。用户可在屏幕侧面通过点击来切换自己感
兴趣的图层。通过这些步骤，Layar 将现实世界跟虚拟的数字内容完美地结合到了
一起，让人们通过手机浏览器，就能知晓现实世界。例如，将手机的摄像头对准建
筑物等，就能在手机的屏幕下方看到与这栋建筑物相关的、精确的现实数据。有趣
的是，还能看到周边房屋出租、酒吧及餐馆的打折信息、招聘启事以及 ATM 等实用
性的信息。如图 7-24 所示。

148

www.huiyankan.com

图 7-24　将手机的摄像头对准建筑物等，就能在手机的屏幕下方看到与
这栋建筑物相关的、精确的现实数据

7.1.4　交互设计案例

Google Fizz 网页应用交互设计
为了帮助基于网页的 Android 应用更好地与原生应用竞争，Chrome 现在可以利
用通知提醒联系用户，并将网站与用户主屏关联，如图 7-25 所示。
Google 一个全新的项目浮出水面，允许程序员在移动设备上开发更灵活、更便
捷的网页应用，该项目名为 Fizz。Google 发布的 Chrome 42 Android 版，其中新增
的 Fizz 功能最大的特点就是让网页应用可以弹出通知提醒，就像手机上那些原生应
用一样。
对于 Google 来说，Fizz 是全新的一个篇章，他们希望利用网页，将自己在移动
操作系统上丢失的“领地”重新夺回来。网页的普适性让它可以在各种操作系统上
应用，Google 再也不用担心 Google Maps 不兼容 Windows 10，或 Android 上没有
苹果的 Apple Photos 应用。

第 7 章　平面设计发展的立体化 149

Graphic

平面设计Design

图 7-25　Chrome

但如果想要获得成功，网页应用所要表现出的性能和功能都得跟原生应用一
致，这也是 Google 推出 Fizz 项目的目的所在。

对于该项目，Chrome 开放网页平台的高级产品经理 Alex Komoroske 表示“网
页可更加便捷地导航、探索新功能和各种不同的体验，用户只需输入地址即可，无
需费劲地安装软件”。但也存在一个问题 ：网页应用通常无法和原生应用保持步调
一致。如图 7-26 所示。

图 7-26　用户只需输入地址即可更加便捷地导航、探索新功能和各种不同的体验

150

www.huiyankan.com

在 Chrome 42 上有三个全新的 Fizz 功能 ：
首先，网页应用可以给用户发送提醒，比如来自社交网络的更新，或是对象
发来的电子邮件，当然前提是用户同意接受通知提醒。与 Google 签约使用通知
提醒推送的公司包括 Beyond the Rack，eBay，Facebook，Pinterest，Product
Hunt 等。
其次，如果满足一定标准，Chrome 会在手机主屏上建立标签，让用户便捷地访
问这些应用。其中一个标准就是，用户需要在两周时间里至少访问两次某个网站。
第三，Google 推出了一个名为网页清单的技术，允许程序员将有用的信息打包
封装，比如一个网页应用图标，或是没有网络连接时可显示的信息。
早期的 Fizz 功能，主要让网页应用可以更好地在离线状态下工作，这对于那些
没有手机网络的用户来说非常有用。
Fizz 目前正在开发的一项功能就是同步，它允许网页应用在没有打开的状态下
自己完成更新。如果你的邮箱可以自动完成更新，那么就不必每次在打开之后等待
下载新数据了。还有，用户可以在 Twitter 应用上面定时发送一条推文，这样即便在
没有网络的时候也不妨碍使用。
Fizz 未来拓展的一个功能就是持久存储，它可以帮助用户在没有网络的时候确
保网页应用可以使用。在离线支持下，Google 开发了一项名为 Service Workers 的
技术，可以推送通知提醒和同步。
Google 开 发 的 技 术 还 没 有 成 为 标 准 化， 即 目 前 他 们 所 做 的 一 切 都 是 基 于
Chrome 浏览器的。Mozilla 也正在利用 Service Worker 技术，而微软表示还需要对
该技术进行评估，而苹果的 Safari 团队对该技术没有发表任何评论。
从长远来看，Fizz 可能成为网页应用标准，并让更多使用其他浏览器的用户接受。

7.2　动态设计

动态设计也是平面设计的一个类别，可以追溯到 20 世纪中期的电影片名和播放
的动画。当时，字体排印和平面设计受到科学技术发展落后的约束。今天，任何预
先制定的动作要素都是可能的。

环顾四周的次数越多，就会发现越多最令人惊奇的动态设计，如手机屏幕或者
儿童的电子玩具。在 30 年前，这些动态设计是无法想象的，甚至从技术上说是根本
不可能的。媒体技术如坐火箭般快速发展，直到今天，我们整个身体都参与进来，
任何玩过任天堂 Wii 游戏机或微软游戏机的虚拟游戏的人都知道此言不虚。

即便是最简单的 Flash 或者 JavaScript 的滚动条都是动态设计。所有动态设计

第 7 章　平面设计发展的立体化 151

Graphic

平面设计Design

都表达了一个主题或者一种情感。这是通过技术的媒介吸引观察者的一个不可或缺
的部分，但是如何使用动态设计却是非常复杂的。在设计网站时，动态设计和互动
设计可能会“碰撞出火花”。换句话说，仅仅因为会，并不代表应该。设计构想应
该既有思维性，同时又需要时刻牢记构想。对于耐克公司的网站来说，旋转动感的
文字可能正好与品牌精神一致。但是对于希望宣传稳定而安全的品牌形象的银行来
说，任何动态效果需要很快停止。而对于零售品网站，动态效果实际上可能会影响
人们下单购物。即便如此，动画具有唤起共鸣的效果，在任何情况下都不能忽视或
者否定它的力量，它应该与设计结合得很好。

总部设在法兰克福的德意志银行品牌空间展厅，由德国互动设计公司 ART +
COM 与国际设计机构 Coordination 协作完成。

该空间的意义在于展示德意志银行的历史、现状，业务领域以及品牌理念。依
据 Anton Stankowski 所创造的德意志银行 logo，ART+COM 将二维图形转换成三维
语言，构建出精彩的互动空间，如图 7-27 所示。

图 7-27　ART+COM 将二维图形转换成三维语言，构建出精彩的互动空间

ART+COM 将二维图形通过变形转化为抽象的三维结构，当参观者站在特定视
点，根据透视关系，这些结构组合便会呈现出德意志银行 logo 的二维图形。在展厅
内部，ART+COM 创建了三组这样的区域，整合不同媒体装置，以不同方式为客户
展示德意志银行品牌。

在第一组装置中，参观者可通过触摸台面上的感应表面来了解银行历史与时
事，如图 7-28 所示。

进入第二组装置区域，三维影像捕捉设备将参观者的身影与墙面投影连接并互
动，观众动作被投射到墙面并触发显示银行的数据信息，如图 7-29 所示。

152

www.huiyankan.com

(a) (b)

(c) (d)
图 7-28　参观者可通过触摸台面上的感应表面来了解银行历史与时事

(a) (b)
图 7-29　三维影像捕捉设备将参观者的身影与墙面投影连接并互动

第 7 章　平面设计发展的立体化 153

Graphic

平面设计Design

第三组装置以一种富有想象力、艺术化的方式去诠释品牌。在这里，银行 logo
成为一个动态雕塑，logo 中心对角线由三维空间中的 48 个三角形面片构成，随着三
角形之间协调动作，整体组合流淌变换。此外，三角形表面作为投影介质，可播放
动态画面，如图 7-30 所示。

(b) (c)

(a) (d) (e)
图 7-30　三角形表面作为投影介质，可播放动态画面

ART+COM 还设计了第四组装置，在主要入口楼梯的尽头，以同样的方式，一面
形象墙由一系列多边形镜面组成，起初参观者只能看到一面凌乱的蓝色镜面墙，当逐
渐步上楼梯到达特定视点时，镜面墙呈现出德意志银行 logo 图形，如图 7-31 所示。

图 7-31　镜面墙的动态变化

154

www.huiyankan.com

7.3　声音的设计

在以视觉呈现为主的平面设计领域，我们很难理解声音可能发挥的重要作用 ；
但是如果有效地使用，声音能够丰富设计项目。因此，我们完全可以把它看成是另
一层平面设计交流呈现。

对 于 形 象 标 识 来 说， 声 音 可 以 是 非 常 关 键 的。 例 如，（ 美 国 ） 全 国 广 播 公 司
（National Broadcasting Company，NBC）的三小节音调的报时声，可能是最为美

国人所熟知的小旋律了。这是第一个音频商标，无需借助色彩、字样或动画，既可
以代表 NBC，而且即使是在另一个房间里听到，人们也知道电视里在播哪个电视台。

声音是可变的平面设计工具，可以用它构建含义，这点与使用文字和图像是相
同的。例如，如果要关掉体育节目，改听戏剧或芭蕾音乐，那么听众的注意力就会
从体育赛事转到文化或艺术方面去了。以非传统的方式利用声音，比如把声音与看
似无关的图像结合起来，会增加传统设计项目不具备的一种隐喻性维度。

对于声音商标专家奥黛丽·阿比尼（Audrey Arbeeny，audiobrain.com 公司的
合伙人），声音成为了一笔以三维术语描述的宝贵财产。该公司为微软公司所开发
的第二代家用视频游戏主机 Xbox 360 设计了音频标识，该标识以一个呼吸的声音收
尾。正如奥黛丽所解释的 ：“最后呼吸声音的隐喻表现了人类的能量，以及对这个
全球品牌的好奇感和惊叹。”这个商标的声音通过反映一个活跃的娱乐系统的品牌
属性，丰富了品牌的呈现效果。

苹果公司用 Siri 拉开了语音交互的序幕，如图 7-32 所示。

图 7-32　苹果用 Siri 拉开了语音交互的序幕

第 7 章　平面设计发展的立体化 155

Graphic

平面设计Design

siri 虽然只是一款普通的语音助理软件，但其却对后续的智能手机发展产生了
重大的意义，这在它盛行后有大量的追随者相继涌现的现象便可一窥端倪。究其原
因，是因为 siri 解放了用户双手，让用户在操控智能手机的时候有更多选择，另外，
siri 的语音控制方式还能让用户在获取查询结果方面更便利。对于普通用户，siri 开
创了一种新的交互方式，它最大的特色就是人机的互动方面，不仅有十分生动的对
话接口，其针对用户询问所给予的回答，也不至于答非所问，有时候更是让人有种
心有灵犀的惊喜，例如使用者如果在说出、输入的内容包括了“drunk”“home”
这些字（甚至不需要符合语法，相当人性化……），Siri 则会判断为喝醉酒、要回家，
并自动建议是否要帮忙叫出租车。

从技术层面讲，语音核心技术不断进步，已经达到了大规模应用要求。同时，
智能终端、无线网络的广泛普及，人们对语音交互的需求不断增长。

在国外，Google 和微软都在倾力自主研发语音技术，现已有 Google Now（图
7-33）和 Cortana（图 7-34）问世。据了解，与传统版本的搜索不同的是，Google
Now 搜索只有在全部采用谷歌产品的情况下才能达到效果，或许这是它唯一不足的
地方 ；Cortana 是微软发布的全球第一款个人智能助理，它“能够了解用户的喜好
和习惯”“帮助用户进行日程安排、问题回答”等。它会记录用户的行为和使用习
惯，利用云计算、搜索引擎和“非结构化数据”分析，读取和“学习”包括手机中
的文本文件、电子邮件、图片、视频等数据，来理解用户的语义和语境，从而实现
人机交互。当前苹果最新发布的 Apple Watch 手表也支持用语音直接启动 Siri 的功
能，只要说“嘿，Siri”就可以了。

图 7-33　Google Now 　　　图 7-34　小娜（Cortana）是微软发布的个人智能助理

在中国，许多企业在实际生活应用中也推出了语音搜索功能，例如手机淘宝客
户端更新，最大的变化就是加入了语音搜索功能，识别率可达 93%，对于用户来
说是个极大的体验提升，如图 7-35 所示，唯一的不足是不支持方言搜索 ；再有驴
妈妈手机客户端新版本上线，增加了语音搜索体验，将为游客带来不一样的使用感
受，为出行提供更贴心的服务，如图 7-36 所示。

156

www.huiyankan.com

图 7-35　手机淘宝客户端更新加入了语音搜索功能

图 7-36　驴妈妈手机客户端新版本增加了语音搜索体验

第 7 章　平面设计发展的立体化 157

Graphic

平面设计Design

“未来，每一部手机都将能听会说 ；未来，每一台家电都将能听会说 ；未来，
每一辆汽车都将能听会说 ；未来，每一个玩具都将能听会说。”这是一个美好的畅想。

在全世界范围内，语音技术走过了漫长的蛰伏期。但正是在近一两年，随着智
能手机的崛起，语音技术应用似乎迎来了爆发性增长。在中国已发展了 20 多年的语
音技术，也真正进入到普通人的生活，开始了一个前所未有的快速发展阶段。不少
中国本土的语音公司迅速崛起，改变了国外公司垄断中国语音技术市场的局面。

目前，在一些特定的情境里，语音交互已经成为主要的方式了，比如汽车里。
例如，捷豹路虎推出了最新的 Bike Sense 防刮蹭系统，用以保障骑行者安全，防止
汽车与骑行者发生碰撞。在汽车传感器的帮助下，Bike Sense 系统可以在自行车或
摩托车接近汽车时，以灯光、声音、振动三种方式来提醒汽车司机，如图 7-37 所示。

图 7-37　捷豹路虎 Bike Sense 防刮蹭系统应用语音技术

据悉，Bike Sense 主要有三种应用场景。如果骑行者从汽车左侧经过，那么左
侧的门框、A 柱就会亮起灯光，左侧的音响也会发出声音，同时司机座椅左侧还会
产生振动，从而引起司机注意。而当汽车正等候行人或骑行者穿越马路时，如果司
机不小心踩到加速踏板，这时加速踏板会振动以提醒司机，并且处于无效状态，直
至危险解除。对于那些没养成查看路况的人停车开门时，Bike Sense 能弥合这部分
人的粗心。如果后方有自行车或摩托车驶来，司机在拉车门时，门把手会振动、亮
光提醒。

简单地说，人机交互的演进也可以认为是人们越来越懒的演进过程。俗话说得
好，“能动口的绝不动手”，就是这个道理。语音最大的优势即它是人类最自然的交
互方式。

158

www.huiyankan.com

8第 章

平
面
设
计
的
商
业
性

平面设计Graphic

Design

Graphic

平面设计Design

8.1　平面设计创作的一般步骤

平面设计是一个复杂的过程，需要分阶段来完成。任何一件成功的作品在诞生
之前，一定会有一个循序渐进的创作经历，它需要设计师有一个清晰的思路，并有
条不紊地去组织工作。平面设计一般包含了以下几个步骤。

8.1.1　分析客户要求

在接受版面设计任务后，首先要明确客户（有时客户就是我们自己）对设计的
基本要求。因此，设计师第一步便是进行必要的咨询。为了使这样的咨询更富于建
设性，不妨要求客户提出构思意图以及相关的设计草图，或是以经典的设计样品为
例进行必要的说明。总之，设计是以客户的诉求标准为前提在进行的，在深入进行
构思前，要尽可能将客户的要求融进自己的设计中。

8.1.2　设计主题定位

了解了客户的要求就可以开始为设计主题定位了。版面设计的核心就是将客户
的诉求目标通过视觉作品的形式最终传达给读者，设计应当注意不同读者对作品内
容的理解能力。因此，版面的设计风格应该根据不同诉求对象来确定不同的格调。
这种“对什么人说什么话”的构思就是为设计主题恰当地定位。

在主题定位的过程中，应当注意到不同主题的版面设计都会引起读者不同的反
应，要理解客户，理解读者，巧妙地使平面作品与读者产生共鸣。为这些定位寻找
特定的设计风格也是设计成功的关键。

8.1.3　初步构思创意

构思是设计中最重要的一步。根据设计主题，将收集到的各种素材与资料进行
分析、整理、概括、提炼，就会渐渐形成一条设计主线。在构思过程中有许多创意
和灵感会若隐若现、一闪而过，应当学会将这些稍纵即逝的意念用草图的形式及时
记录下来，事后经过筛选、对比与补充，不断将其完善。最后，在众多的创意方案
中选择出较理想的，经过不断修改以便产生最好的方案。构思创意的过程是对主题
内涵的不断深化与提炼的过程，就是在不违背客观事实的前提下，运用比喻、象
征、拟人、夸张、抽象、移情等方法，追求一种“言已尽而意无穷”和“语不惊人

160

www.huiyankan.com

死不休”的境界。在版面设计中，除了合理编排各信息要素外，还应注意整体风格
的一致性，如视觉的整体设计要有统一的标题、字体、色彩和风格等。

8.1.4　实施版面设计

当相对满意的方案确定后，就应将草图设计再现于计算机，在计算机中对设计
方案及构成的编排格式反复推敲，仔细琢磨，形成几张不同设计方案的效果图，以
便进一步挑选，寻求更理想的效果。

8.1.5　推敲征询意见

当初步的设计完成后，要认真审视自己设计的方案，要不断向自己质疑 ：“这
符合客户的要求吗？”“读者会对这些版面感兴趣吗？”同时还要征询其他设计同
行的意见和建议。随后，将计算机设计的多个方案打印出来，让客户过目比较，根
据客户意见再修改，使设计趋于完美。在最终设计定稿后，才可以交付印刷。

8.1.6　版面清样审定

为了对客户和作品负责，减少设计的遗憾及不必要的经济损失，在大量印刷
前，应通过轻印刷方式，以出版使用的纸型、纸张制作清样，对作品做最后的审
查。设计师还需对印刷样品仔细检查 ：是否有文字疏漏或错误，是否达到色彩设计
的标准，以及在印刷过程中是否出现其他错误，以便进行最后的弥补与修正。

至此，整个版面的设计步骤就全部完成了。

8.2　平面设计师

平面设计是智慧演绎，是一项伟大的创造性活动，时代的发展使平面设计的形
式与内涵不断发生变化。在当代文化语境下，新的时代需要设计师的艺术情操和综
合知识的多方面投入。作为一名平面设计师，优秀的综合素质、高超的艺术表现技
巧以及科学、理性的设计方法论是其进行设计创新的先决条件，这就决定了平面设
计的主体—设计师必须具有“大内存”的智能结构。设计师既要知识广博、专业
精深，同时还需要具有极高的社会责任感，这是当代社会对平面设计师的基本要求。

第 8 章　平面设计的商业性 161

Graphic

平面设计Design

8.2.1　平面设计师的能力建构

平面设计的灵魂是创意，创意的概念是以创新性思维为基础的，而创新性思维
的形成则又是取决于设计师智能结构的完备。

（1）强烈的创新精神和领先的时代观念
当今社会正把创新视为一个民族进步的灵魂，创新的作用与意义显而易见，平

面设计的灵魂也同样建立在创新这个根本点上。一名有造诣的平面设计师，其创新
精神与其设计作品的主题内容是紧密联系在一起的，设计师的成功，首先是其创新
精神的成功。时代的发展使社会对平面设计师的要求有了更高的标准，从维护艺术
设计的尊严这个层面上来说，平面设计的核心是观念论的培养，更是创新思维和创
新精神的培养。

平面设计画面中的每一个元素的创造和组合都需要设计师情感和智慧的投入，
但创意成功的关键是设计师强烈的创新意识。求新、求异、求奇不但是艺术性的追
求，更重要的是创新精神的体现。

平面设计师作为现代都市的一员，应紧跟时代步伐，把准时代脉搏，才能在竞
争大潮中保持不败。在信息密集型的现代社会中，人们的意识形态和生活观念不断
变化，设计师的思维必须保持与时代同步，并主动去适应时代的要求，努力使自己
的设计行为与社会文化发展方向保持一致，设计师的技术可以落后，但设计观念必
须领先。现代社会已进入了一个多元文化复合的时代，设计师的行为必须具有一定
的前瞻性，要不断地学习和进步，不断地假设和推测，真正起到引领社会文化新潮
流的重要作用，这是设计思想和设计行为永葆青春的重要法则。

（2）广博的综合理论知识和精深的专业知识
艺术设计集自然科学、人文科学与社会科学等学科知识为一体，多维性和交叉

性是艺术设计学科的典型特征。艺术设计是技术，同时也是艺术，是科学、艺术、
文化和经济的高度融合，一项设计任务的完成往往需要设计师掌握许多与设计相关
的多重知识体系。良好的综合理论素养和精深的专业知识，不但是设计师进行策划
与创意、设计与制作的基础，而且是提高设计品位的敲门砖。

平面设计从策划、创意到图形、文稿、色彩、版面编排和印刷工艺，每一个
环节都需要设计师的深思熟虑和精确定位。策划与创意是主题概念表达的先行曲
目，在这一阶段中，平面设计师要精通市场学、心理学、社会学、管理学等各种
学科知识，要在横向上具有广博的综合理论知识，更须站在决策者的层面来看待
问题。设计师的精确定位，决定了设计师必须是智者和学者，如此，设计师的大
脑思维才能更加活跃，从而碰撞出灵感的火花，产生卓越的创意。在图形、文

162

www.huiyankan.com

案、字体、色彩、版面编排、印刷等后期制作环节中，平面设计师还必须具有精
深的专业知识（包括广告理论、传播理论、艺术理论等），这是设计师必须具备
的纵向型知识结构。设计师必须是本专业的内行和专家，才能有效地把握整个设
计的全过程。

在当今社会中，平面设计的概念逐渐被拓展和延伸，平面设计师的专业知识早
已超越了一般的纯艺术性原则，从视觉语汇到语义的设计以及传播，设计师的知识
结构必须达到既“精”且“专”。具备广博的综合理论知识和精深的专业知识，设
计师的思维才能达到理性和感性共存，进而创造出既有高度文化内涵，又具有实际
应用价值的平面设计作品。

平面设计作品竞赛本质上是设计师大脑的比赛，没有知识、没有品位的设计作
品是不能传世的，对设计师的赞赏应该是其“专精兼取博学”的学者精神，而不是
单纯的技巧表现能力。

（3）非凡的艺术家情怀和高超的审美能力

平面设计在二维空间中展示出特定的视觉主题，在不平静的画面中，图形、
字体、色彩和版面编排在共同为主题概念服务的基础上，体现着多姿多彩的艺术
美感。

平面设计师面对一个固定的设计主题，当策划与创意有了一定的概念后，就
会主动寻找借以传情达意的视觉元素。当自己的主观愿望与所观察的现象或物象
发生共鸣时，就会从有意达到有思，在具有艺术性的联想和理性的思考后，使较
模糊的主题概念变得越来越清晰，再经不断地修饰和锤炼，最终物化为可感、可
观的艺术画面。平面设计师要善于积累生活感受，善于观察和联想，创意和制作
实践始终贯穿于艺术的情理之中，最终使平面作品承载更多的艺术性趣味和较高
的文化内涵。

设计师所具有的艺术家情怀是增强平面艺术设计品位的保障，高人一筹的审美
水准是超越自己和领先于他人的锐利武器，它是平面设计创新性思维或主题创意概
念形成具体可视化体系的基础。设计师的这种能力主要表现在造型基础和各种表现
手段方面，设计师以高超的表现能力使自己的创意构思以优美、感人的视觉形态表
现出来，给人以直观、生动的形象感受，这不仅能有效地与客户沟通，更重要的是
能使设计由精神向物质的转化得以完美实现。

特别是在电脑滤镜效果泛滥成灾的今天，追求自然化、人工化、艺术化的表现
手段已成为一种新的时髦。一名合格的平面设计师，应该了解各种艺术形式的表现
规律和表现手段，平面设计师艺术修养的高低，将很大程度地影响到设计作品的文
化品位和艺术层次。杰出的平面设计师应该是综合运用各种知识的通才。

第 8 章　平面设计的商业性 163

Graphic

平面设计Design

（4）良好的群体意识和卓越的沟通协调能力
社会生产力和文化观念的发展与变革，使现代平面设计行业的分工越来越精

细，一个设计项目的完成往往涉及多种知识，并需要各类人才的共同参与，这其中
不仅包含了多方面的智慧和技巧，平面设计师群体意识和沟通能力的加强也是保障
设计行为迅捷、有效的重要手段。

设计师在一次完整的设计活动中扮演着多种角色，虽然设计师们在被细化分工
的不同岗位上工作，但不同的岗位和不同的角色之间具有相互转换的关系，设计
师们只有相互合作才能使设计活动具有最终的意义。设计师在具体的平面设计活动
中，通常被称为平面设计师或视觉传达设计师，他们的任务是设计、选择、编排最
佳的设计符号并准确、快速、高效地进行传达。随着平面设计领域的不断扩展和延
伸，平面设计师可被细分为广告设计师、招贴设计师、时装设计师、书籍设计师、
影像设计师、动漫设计师、展示设计师等，平面设计师或者担当起指挥者的角色 ；
或者担当起生产者和传播者，甚至是助手的角色。同时，设计师们还可以与政府、
团体、其他设计事务所以及企业和零售商进行联合。

在艺术设计发展的初期阶段，作为一个新兴的产业，其从业人员少，竞争意识
弱，几个人或一个人就可以使一个设计部门正常运转。但随着科技、文化的发展，
专业知识越来越复杂，单靠个人的力量很难完成复杂的设计工作，因此，设计的团
队作用越来越重要。北京 2008 年奥运会吉祥物的设计是集合了多位设计师的共同
心血，经专家反复论证后才诞生的。一套完整的企业形象设计或重要的品牌广告设
计必须以集体性行为共同完成，虽然其署名可能是某位知名设计师的名字，但作品
却是集体智慧的结晶。

在当今的平面设计部门和团体中，设计环节和职位分工越来越具体，越来越细
致，在一个普通的广告公司中，至少要有包括客户、创意、艺术、媒体等部门的工
作人员。每一个设计项目虽有分解，但整体设计的完成却有赖于各类工作的相互配
合和协调，任何一个环节的失误都有可能造成设计的失败。特别是在设计的构想阶
段，目前设计界普遍认可和采用集体“头脑风暴”的设计方法，这种工作方式要求
设计师必须具有良好的人际关系和强烈的群体意识。

平面设计师要完整地了解客户的各项需求，首先必须与客户进行沟通，在了解
客户要求的基础上才能准确地进行设计定位，当设计方案完成后，还应当虚心听
取客户的意见和想法，并认真征求同行专家的意见，在各方面的认识达成统一意见
后，再进行调整与修改，最终使设计趋向完美。

设计师要善于与人共事、善于尊重他人的意见和想法，相互启迪，相互协作，
以“团队精神”来推进平面设计的进程，这比单枪匹马的个人精神具有更大的作用。

164

www.huiyankan.com

8.2.2　平面设计师的社会责任

美国艺术理论家维克多·帕奈克（Victor Papanek）说 ：“设计的作用并不是创
造商业价值，也不是在包装及风格方面的竞争，而是创造一种适当的社会变革中的
元素。”现代设计师从某种意义上讲已经变成信息编码者或信息传播者，这种信息
编码和传播是在社会交流的前提下来进行的 ：艺术设计不再只是单纯的物质性的行
为，而是一个复杂的服务系统的创造者，它包括精神的、心理的、生态的、环境的
等多重因素。平面设计师的创造行为不但要为人的视觉负责，而且还要为设计作品
的社会意义承担更多的责任。

设计师作为艺术设计的主体，由于其生活背景、气质、性格、综合素养乃至社
会公德等方面存在着差异，他们在设计的实践活动中，可能是顺从者，也可能是改
革者，还可能是对抗者，这三种不同类型的设计师在对待设计的义务和道德责任方
面有着很大的不同。顺从型的设计师往往只注重设计作品的审美性质，改革型的设
计师虽关注设计的社会意义，但往往在实践中与实际需要产生冲突，对抗型的设计
师则坚信只有深刻、广泛的设计结构上的改变才能称之为创新。作为设计创造的主
体，这三种不同类型的设计师所具有的社会责任感各不相同。

设计师为人类的利益而设计，就平面设计师来讲，其社会责任感的具体内容应
包括以下五个方面 ：

① 对消费者生理和心理需求的深入了解与关注 ；
② 对社会文化语境的尊重 ；
③ 对印刷成本的控制与节约 ；
④ 对消费者的消费趋向和趣味的引导 ；
⑤ 促进人与设计作品的交流。

8.3　成功的设计方解决方案的组成要素

平面设计通常是一个循序渐进的过程。其步骤包括最初的设计纲要、研究、草
图等。整个过程中包含了设计师必须考虑并归入每个独特设计方案的很多基本要素。

① 时间 / 预算　平面设计要素中最具体的部分，使平面设计成为一门受到约束
的应用艺术。

② 内容　需要包含在创作的交流呈现中。
③ 形式　根据需要表现的内容而在设计作品中呈现的形式。
④ 功能　项目目标的基本方向。例如，一个活动的宣传设计的主要目标是说服

第 8 章　平面设计的商业性 165

Graphic

平面设计Design

别人参加。功能决定了设计将采取的创作方向。
⑤ 结构　观众在设计作品中发现信息的层次感 ：首先看到和读到什么，其次看

到和读到什么，然后看到和读到什么，等等。每位设计师都借助某种结构或规则传
达信息。

⑥ 实用性　创作对观众有用的设计的一种实用考虑。实用性包括很多方面。例
如，具有古风的字体的边缘美学可能对音乐杂志很有用，但对于药瓶上的说明则刚
好相反，因为药瓶说明必须采用清晰、易辨认的字体。

⑦ 美学　设计作品的外观效果，能够吸引或吓跑观众。美学与实用性是紧密相
关的。利用给人以冷色系的工业包装的环保产品，从逻辑上说，不太可能与用土色
和有机形状包装的产品产生联系。平面设计无论艰苦或甜蜜，无论平淡或惊艳，都
必须始终牢记设计主题和观众。但是需要记住的是，美学可能是审美能力的问题，
会受到文化规范的影响。设计师需要了解观众，以及观众欣赏作品的场所。

⑧ 特性　设计作品与周围作品的不同之处。人们要面对各种不同的信息和图像
的冲击。设计必须具有某种与众不同的特性。假如墙上的海报“大叫”起来，那么
“低语”的那幅海报可能获得独特的品质。平面设计的短暂性提供了创作具有特性
作品的可能性，体现在作品能够做到的方面（功能、结构、实用性、美学）和做不
到的方面。

在平面设计领域中，客户总是有三种选择，这三种选择可以说是一个三角形。
选择如下 ：设计项目可以很快、很好、很便宜地完成，但是客户只能挑选其中两个
选择。这些选择的组合如下 ：①设计可以很快和高质量完成，但是成本不便宜 ；② 设
计可以很快和很便宜地完成，但是质量不高 ；③设计可以很便宜和高质量完成，但
是很慢。

8.4　平面设计案例精粹

8.4.1　TOGETHERNESS 全盒包装设计

中国传统过年礼盒，寓意祝福、吉利、团圆。
全盒设四种利事封，分别以两组搭配，各含不同传统元素如舞龙舞狮，猪仔钱
罂及拨浪鼓，银柳和糖果，都是中国过年庆祝福物及围绕设计师的儿时回忆。
此全盒设计新颖，用不同特性的纸张配合各样印刷技术，令其达到理想效果 ；
就如传统刺绣拼图加上现时新颖纸张款式、颜色及技术，亦有些如激凸效果配以花
纹纸及崭新设计，使产品凸显与众不同的效果感觉、如图 8-1 所示。

166

www.huiyankan.com

(a) (b) (c)

(d) (e)
图 8-1　TOGETHERNESS 全盒包装设计

8.4.2　日本烧酒动漫广告设计

同样是卖酒，有的只是厂家和品牌一厢情愿的“自醉”，有的却展现出拳拳诚
意和出彩创意足以“醉人”，岛国人民为卖出好酒就不惜亮出终极杀手锏 —动
漫来俘获年轻一代的消费者。这支名为《老爸的土豆之神》的烧酒动漫广告（图
8-2），将日本著名的土豆烧酒品牌“萨摩白波”巧妙植入故事情节，把温馨含蓄的
父子亲情以及“酒是故乡醇，月是故乡明”的思乡情透过动漫故事娓娓道来。

当烧酒的暖意流窜在谜样的情节里，到底萌萌哒的土豆之神代表的是酒？是
爱？还是这份故乡亘古不变的新意？似乎并不重要，因为你除了能闻见土豆烧酒
香，已然嗅到了广告里透出的淡淡感动与温馨。而为这支广告亲自操刀的，是著名
动画家佐藤好春，作为曾出任《龙猫》《魔女宅急便》《红猪》等多部宫崎骏作品的
动画监督，处理起这样的动漫广告，自然得心应手。

第 8 章　平面设计的商业性 167

Graphic

平面设计Design

(a) (b)

(c) (d)

(e) (f)
图 8-2　日本《老爸的土豆之神》的烧酒动漫广告

168

www.huiyankan.com

8.4.3　360°立体书设计

纸质书和电子书的争论，由来已久。孰好孰坏，一时间真是难以说清道明。
毕竟作为传达思想的载体，这两者并无明显差距，然而，如果我们要传达一种
形而上的美感，想必只有纸质说才能带来惊艳。日本建筑设计师大野友资早在 2012
年参加 YouFab 设计竞赛时，就首次提出了立体图书（图 8-3）的概念，通过唯美
的雕刻，360°展示一个故事，让你日翻日新，每一次面对它都是新的感悟。

图 8-3　日本建筑设计师大野友资立体图书

第 8 章　平面设计的商业性 169

Graphic

平面设计Design

然而，由于 360°立体书制作精细复杂，并没有得到大范围印刷。2015 年，大
野友资在图书出版商 Seigensha 的支持下，终于有了两本 360°立体书《富士山》
（图 8-4）和《白雪公主》（图 8-5）开花结果。

(a) (b) (c)
图 8-4　《富士山》

(a) (b) (c)
图 8-5　《白雪公主》

其实，与其说是书，它们更像是一道风景。富士山的美与白雪公主的纯真，让
人欲罢不能想要剁手，真是美得不像话。

8.4.4　MINI 汽车标志设计

MINI 设计最初的想法是研发一款以高效动力为基准，以灵活性为用户提供独一
无二的驾驶体验的车型。简约和感性的设计的完美融合，很好地诠释了 MINI 的新
形象。

从诞生之日起，MINI 就将“改变”写进了自己的 DNA ：1959 年，全球石油危
机，随需应变催生了第一台 Mini ；2001 年，Mini 与时俱变，正式更名 MINI ；半个
多世纪的沉淀、变革、探索、再变革，让曾经代表着时代精神的 MINI，继续成为新
时代精神的代表。

2015 年，随着新一代 MINI CLUBMAN 的上市，宝马旗下品牌—MINI 汽车开

170

www.huiyankan.com

启了品牌重塑之路。在 MINI 汽车推送的微信中，我们可以看到调整后的标志，新
标志由原来的立体标志，而变成线条。MINI 写道 ：从立体，到二维，从复杂，到简
约，勇敢向前时不忘初心，迎向未来时保持本色。在变与不变之间，给世界一个更
好的 MINI。图 8-6 所示为 MINI 汽车新标志。

图 8-6　MINI 汽车新标志

新一代 MINI CLUBMAN 重塑了 MINI 走向未来的品牌哲学 ：MINI 将全力打造五
个性格鲜明的核心车型。同时，MINI 将开放思想，进军新的业务领域并发展品牌的
视觉识别系统。MINI 正在扩展在高档紧凑型车细分市场的产品组合，提供新的服务
和技术，把新的用户转变为忠实的 MINI 粉丝。全方位的策略调整将确保 MINI 独有
的成功故事继续延续下去。图 8-7 所示为 MINI 汽车产品形象。

图 8-7　MINI 汽车产品形象

8.4.5　麦当劳用“超级符号”打造中国风品牌形象

人们对一个品牌的印象，来自于一些记忆碎片的堆积。比如可口可乐给人的品
牌印象是几十年的记忆碎片记忆堆积起来的 ；杜蕾斯在社交媒体上追了无数个热点
后给人留下了现在的印象。

第 8 章　平面设计的商业性 171

Graphic

平面设计Design

对品牌和产品来说，好的记忆碎片能让人印象深刻。当它触动人心之后，就能
形成高效传播，进而有效地将它承载的品牌身份和价值观传递出去。新媒体场景下
更是如此。

“超级符号”是人们本来就记得、熟悉、喜欢的符号。超级符号往往蕴藏着许
多文化因子，它可以是一段历史、一个故事、一部电影、一个艺术品。当把超级符
号跟品牌巧妙关联起来以后，就能得到好的创意。麦当劳 2015 年在社交媒体上做
了许多不错的中国风系列作品，给人留下了许多不错的品牌记忆碎片。

（1）日常相关的图 / 文元素
麦当劳刚过完在中国的 25 岁生日。这 20 多年来，以麦当劳为代表的西式快餐

被汉化得越来越厉害，推出的芝麻猪排堡上的两片馒头片说明了一切。海报（图 8-8）
中，出现了挺多跟人们日常相关的超级符号。图案有“馒头片”“蒸笼”；文案有“馒
火”“蒸”。这些日常元素对于中国人来说，简直深入基因，图文搭配一下子很直观
地道出了“中西合璧”的产品特征。

图 8-8　芝麻猪排堡海报

麦当劳在“生活日常”这个点上，走得特别深远，在以微博为主的社交媒体上
玩得挺多。

蒸笼、簸箕、茶盘、竹篮，这些造型袖珍生活用品（其实是艺术品），散发生
活气息。加上精巧细致的竹艺，轻松地就能勾起大部分人对故乡的记忆。这个时候
看到嫩绿的卡马龙和诱人的咖啡，受众的食欲应该很快就会被勾起。

（2）传统节日时令
如图 8-9 所示，“大薯”是一种以马铃薯为原料，切成条状后油炸而成的食品，

是现在最常见的快餐食品之一，流行于世界各地。而“处暑”是暑气至此而止。于
处暑吃薯，送夏迎秋趁着传统节气，抓住“暑”和“薯”同音关系，玩文字游戏。
字里行间采用日历文案形式，创意巧妙用心。

172

www.huiyankan.com

图 8-9　大暑与处暑

这么有心，七夕节自然也不肯错过。麦当劳文案的情诗写得真好，如图 8-10
所示。

(a) ᇶཧۨᇶᎧᏁዬᇻၺ (b) ‫ڔ‬ଜೂጓᎧช্ๆᒅ

(c) ᓙૄᄖᄭᎧፖ੡ೝ৆ (d) ಑฻ሤᓐᎧཧ༙ሤ્

图 8-10　麦当劳七夕文案

第 8 章　平面设计的商业性 173

Graphic

平面设计Design

上述配图依次看下来就是牛郎织女的完整故事。借助这个中式经典爱情，主打
产品也进行巧妙植入。

从小到大听过许多故事。故事里住着的仙女、道人、书生、玉帝，对于他们的事
情我们知道得很多，却未曾想过有一天他们也会吃起麦当劳，关键是画风还这么美。

图 8-11 是麦当劳请微博插画大咖 @ 呼葱觅蒜做的一套作品（全套作品为 9 枚）。
这些穿着清奇古装的仙人们开始食用人间烟火，一个个还吃得那么香那么自然。

(a) ልๆᅪ൲ (b) ߐᐠ૰ࡼ಑ࡸိ

(c) ডᔫጓࡼၗည (d) Ꭽ࢓‫ڸڸ‬བྷ෾ए

图 8-11　麦当劳文案

曼妙美丽的画风，颇有共鸣的生活化场景，配上逗趣的文案，让作品中仙人配
麦当劳的设定一下子产生了奇妙的化学反应。很多人看了以后，在微博上说这是他
们见过的最有艺术的广告。

在社交媒体上，这种受欢迎的良心作品可以派生出多种玩法来 ；玩得好，粉丝

174

www.huiyankan.com

的参与热情是很高的。带上超级符号的创意的力量有时候真的很大。
麦当劳是这样玩的 ：除了单线展示之外，麦当劳还联合作者分别在微博上发起

# 让我们好在一起 # 的活动，参与互动的粉丝选出最喜欢的，带序列号 @ 麦当劳转
发，就送同款明信片。这个过程形成了有效传播，这些作品一下子成了更多人的记
忆碎片。

（3）猛抱强大 IP 的大腿
强大 IP 指的是一些能够产生强大经济效应和关注度的原创内容，包括综艺节

目、影视作品、游戏等。
这些内容在一定时期内会成为人们日常话题的中心，自然也是超级符号。抱住

这些强大 IP 的大腿，整好了，说不定就一下子有了很大的曝光，分分钟将喜欢原作
品的人路转粉也是很常见的。

在电影《大圣归来》大火燎原期间，麦当劳用跟作品同样的画风，做了一套大
圣跟江流儿在麦当劳吃喝的温馨图（图 8-12）。抱着大圣的大腿，这一击，把大圣
的自来水们萌得不要不要的。

图 8-12　麦当劳与《大圣归来》

8.4.6　Wonder Room 工作室的智能移动海报设计

毋庸置疑，今天我们从电子设备中获取的信息要远远多于平面纸媒，但海报无
论在何时都是一个极好的推广平台，它似乎不太可能成为过时的设计。相反，海报
也正在积极地适应电子时代的节奏，Wonder Room 工作室就是智能移动海报的领
潮人，如图 8-13 所示。

第 8 章　平面设计的商业性 175

Graphic

平面设计Design

(a)

(b)

(c)
图 8-13　Wonder Room 工作室的智能移动海报设计

176

www.huiyankan.com

工作室的幕后创始人史蒂夫霍凯特介绍，他们曾试验过几种在线印刷海报的方
式，通过制作大量的海报他发现人们更习惯于从社交媒体上接受资讯，因此他开始
思考如何能为粘在墙上的传统海报注入数字化的新生命，挖掘海报被固定在墙上以
外更多的功能。

习惯在标准印刷纸上进行设计的 Wonder Room 在刚接触线上打印时总是频频
出错，但当他们解决了数字与印刷这个简单而智能的问题后，Wonder Room 的可
爱海报开始大放异彩，在创作时，Wonder Room 发现手是陪伴他们最好的伙伴，
因此他们想通过动态图的形式将更多的事物呈现在屏幕上。

8.4.7　《韩熙载夜宴图》App 交互设计

“南唐后期，国势日渐衰弱，整个金陵城被一种萎靡的气氛笼罩着。来自北方
的贵族韩熙载，仿佛受到了命运的作弄。”伴着知了窸窣的叫声和悠扬的琴笛旋律，
画面从一轮孤月渐渐转移到郁郁葱葱的竹林，再聚焦人声鼎沸的豪门夜宴……这，
便是故宫博物院今年新出的 App《韩熙载夜宴图》（图 8-14）的“开场白”。好听的
讲解女声在精致的动画中穿梭，不知不觉地，《韩熙载夜宴图》的创作背景、主人
公形象被娓娓道来。

图 8-14　故宫博物院 2015 年推出了新 App《韩熙载夜宴图》

第 8 章　平面设计的商业性 177

Graphic

平面设计Design

2015 年 1 月， 故 宫 博 物 院《 韩 熙

载夜宴图》App 正式上线。此前，故宫

博物院已经发布了《胤禛美人图》《紫

禁城祥瑞》《皇帝的一天》三款 App，

反响皆不俗。这一次，故宫博物院所

藏绘画之宝、五代时期顾闳中的《韩

熙载夜宴图》（宋摹本）（图 8-15）成

为 App 的主角。

中国十大传世名画之一《韩熙载

图 8-15　五代时期顾闳中的《韩熙载夜宴图》 夜 宴 图 》 共 分 为 听 乐、 观 舞、 暂 歇、
（宋摹本）局部 清 吹、 散 宴 五 个 段 落， 以“ 连 环 画 ”
的构图叙事形式，描述了南唐巨宦韩

熙载在家开宴行乐的全过程。但出于藏品保护，《韩熙载夜宴图》得以呈现的机会

十分有限，这也是故宫博物院推出这一 App 的主要原因。

据悉，此番制作历时近两年，拍摄、制作素材累计容量将近 900G。“高清的文

物影像、专业的学术资料、丰富的媒体内容和创新的交互设计”是它最大的亮点。

还有网友评论说 ：“故宫出品的 App 在精美和免费这一点，其实低调地显出了‘不

差钱’的土豪本质，要保持啊。”下面，就让我们一起来欣赏一下这款 App 的精美

和“土豪”。

（1）高清—家具上的花纹清晰可见

进入数字画卷，手指左右滑动间便能浏览全卷。因为是高清呈像，画面还能随
手放大。这就好似在博物馆实体赏画时，凑近身子，近观细节，家伎发髻上的珠
钗饰品、衣袖上的图案纹理乃至家具上的雕刻花纹都清晰可见（图 8-17）。其实，
App 共有三层立体赏析模式 ：总览层、鉴赏层和体验层，画面精细度从左往右递增。
换言之，同样一幅画可被远观、可被近赏，角度完全由观众的手指决定。

而 在 体 验 层， 若 轻 轻 触 动 屏 幕， 指 尖 所 至 之 处 半 径 五 厘 米 内 似 有 烛 光 追 随
（图 8-16），而周围则是黑景。如此，指尖所触的局部画面就被突显出来。只见“烛

光”忽闪忽闪，给人一种秉烛夜读且不时有轻风拂过的错觉，伴着不断的笛音，颇
有古典意境。

（2）解说—有文字版的，也有人声版的

有意思的是，若指尖所触为画中人物或器具，稍做停留则可见画面呈现文字示
意（图 8-18），部分人物还会呈现“鼓掌”“敲鼓”“洗手”等动态。拥有最丰富文
字描述的当属主人公“韩熙载”。奇特的是，每个场景中有关他的文字描绘各不相

178

www.huiyankan.com

同，或是出身简介、或是仕途遭遇、或是

八卦轶事。

据悉，整幅数字画卷中共有 100 个内

容注释点和 1 篇后记。要知道，《韩熙载

夜宴图》本身涉及的画面细节也是历史研

究 的重要资料。无论是“注子”“方案”

之类的古时家具，王屋山、李家明等人

物 身 份 与 关 系 介 绍， 还 是 家 伎 坐 姿、 侍

女服饰、叉手礼等文化知识，几乎都配有

简洁明了的文字说明。出于场景融入，这 图 8-16　轻触这款 App 的画面，似有若明

些说明可要比单纯白纸黑字的呈现要生动 若暗的烛光追随

得多。

除 了 这 些 细 节，App 中 也 有“ 有 声 ”

文字对于画面整体进行“技术”解说，包

括画面线条、角度、布局和寓意，内容相

当专业，美术或文博出身的人或对此更为

偏爱。

（3）音乐—用非物质文化遗产“南
音”演绎

除了文字与配乐，最好玩的演绎其实 图 8-17　放大局部，家伎的发髻、衣饰乃
是个别场景中的“真人”入画（图 8-19）。 至家具上的花纹都清晰可见
指尖触碰时，忽然之间画中人“活”了起
来，换上了与画面极其类似的衣裳。比如 图 8-18　停留在画中人物或器具上，古色
家伎王屋山表演六幺舞，一边是渐变的文 古香的文字示意便会显现出来
字说明，一旁就是从画中“舞”出的灵动
表演。又比如画中有五位乐伎表演吹笛，
突然间就演变为五位真人吹笛演奏。她们
的头饰、服饰、人物大小竟都高度吻合，
让这样的设计更显巧妙。

据悉，App 中的乐舞表演，无论乐曲
或舞姿都严格还原当时实况，可谓良心之
作。此外，原本晦涩艰深的学术内容也化
为 18 段故宫专家的音视频进行生动导读。

第 8 章　平面设计的商业性 179

Graphic

平面设计Design

图 8-19　在个别场景中，有真人入画 据故宫博物院微信公号说，他们此番组
建了由知名书画专家单国强、余辉领衔
学术指导的创作小组，邀请台北“汉唐
乐府”表演团体用非物质文化遗产“南
音”演绎画中乐舞，香港电影美术指导
叶锦添担任美术顾问，北京交通台主持
人春晓、美籍学者安义宣分别为中英文
版 本 配 音 …… 如 此“ 重 量 级 ”， 确 实“ 真
土豪”。

8.4.8　Airbnb 网站界面设计

如果你曾使用 Airbnb 预订过地方，那么你会在这个过程中，逐步发现这个企业
拥有着顶尖的产品设计团队。这个正在改变整个行业的企业，正在为用户提供着顺
滑无缝的体验。

Airbnb 网站（图 8-20）以下这些设计无论是用来提升整体的用户体验，还是激
励产品增长，都起到了积极的作用。

图 8-20　Airbnb 网站

（1）情绪感染
当用户打开 Airbnb 的网页的时候，立刻就被友好和安全的氛围所包围（图 8-21）。

营造这一氛围的影响因素很多，但是有一样绝对是最突出的，也是决定性的，也就

180

www.huiyankan.com

是页面中所用的照片。如果仔细观察 Airbnb 所有的图片选取，你会发现他们的选
图规律 ：绝大多数图片所拍摄的是几个“朋友”在优雅的环境中，微笑着享受生
活的情形。

图 8-21　当打开 Airbnb 的网页的时候，立刻就被友好和安全的氛围所包围

这就是典型的“情绪感染”的使用案例。维基百科中对于“情绪感染”的解释
很直白 ：它指的是两个个体在情绪上相互影响和传递的趋势，当人们不自觉地、下
意识地模仿对方的情感表达方式的时候，他们能够感受到同伴的情绪反射。

当 Airbnb 用无处不在的生活场景和微笑的照片来包围你的时候，我们会在潜移
默化中被 Airbnb 社区所影响，与那些幸福的旅行者和这个品牌产生情感关联。

实际上，这种手法并不鲜见，许多企业在情感化的设计上都可以堪称得心应手
了。比如“Facebook 是如何通过控制用户浏览的新闻来创造情绪反应的”，就能给
你不少灵感。

（2）文案驱动情绪
Airbnb 在整个网站的语言使用上极为一致。“有归属感的世界”（图 8-22），

“属于任何地方”，“欢迎回家”等。许多文案的遣词造句看起来并不是特别显眼，
特别独特，但一定是经过深思熟虑创造出来的。他们将过去老套的、模式化的住宿
搜索定制为更为情绪化、个性化的搜索。
永远不要低估文案的力量。它们可以为任何体验和过程构建内容。例如，你在
做澳大利亚旅游专题的时候，你有三张悉尼、墨尔本、布里斯班最漂亮的照片，那
么你会怎么配文案呢？“下一次旅行的理想选择”可能是一个不错的文案，但如果
改成“本周顶级独家圣地！”，点击量一定优于前者。第二个文案能够调动起用户
的情绪，有些正准备旅行的用户会直接改去澳大利亚，因为别人也是这么做的！

第 8 章　平面设计的商业性 181

Graphic

平面设计Design

图 8-22　有归属感的世界

（3）保存以前的搜索结果
例如，我们常去的咖啡馆的服务员会记住我们点咖啡的习惯，这也是促使我们

加入这家店 VIP 会员的重要原因。如果一家店记住你的需求，并且愿意为你定制化
服务，体验也算得上是非比寻常了。

通常你在一个网站搜索过之后，网站会记录下你的一个时间段内的搜索历史。
但是 Airbnb 不同的地方在于，它会通过在线服务记录下你所有的搜索记录—即使
不在 Airbnb 搜索的记录。这也就意味着，你在谷歌、百度、携程、去哪儿搜索了去
马尔代夫之后，你打开 Airbnb，点击搜索框，马尔代夫会立刻出来，如图 8-23 所示。

虽然这只是一个小细节，但是可以在此窥见 Airbnb 在打造无缝的浏览体验上的
坚持。

图 8-23　保存以前的搜索结果

（4）价格上抓住痛点
随着 Airbnb 的成长，每次搜索的列表都有数以千计的结果弹出来，单是选择障

碍就足以令用户头疼不已。不过在随后的搜索中发现，Airbnb 开始非常谨慎地用一
个条形图来显示房源的平均价格变动范围，这就意味着用户不用翻上几百页来筛选
了，如图 8-24 所示。

182

www.huiyankan.com

图 8-24　价格上抓住痛点

（5）列表内图片切换（用户交互）
当人们筛选房源和居住地的时候，最重要的事情是什么？最重要的，是那个地

方实际的样子是否与照片相符。当获取搜索结果之后，每个搜出来的房源和地点的
基本信息都很完备，最重要的是，图片都是主体，并且成组的图片无需跳转，直接
浏览（图 8-25），方便之极！

图 8-25　图片直接浏览

（6）列表实时更新
列表实时更新（图 8-26）这个功能并不是每个网站都添加了，但是具备这一功

能的网站是否做得好用还是两说。而 Airbnb 就做得很不错！当搜索出结果的时候，
右侧是地图左侧是列表，当在地图上选取不同地点的时候，搜索结果会随之自动更
新，稍加脑补人们就会意识到这绝对是一个深思熟虑的设计，这种额外的交互体验
绝对是在惊喜的范畴以内。

第 8 章　平面设计的商业性 183

Graphic

平面设计Design

图 8-26　列表实时更新

（7）社会认同与限量销售（图 8-27）
其实这也是一个颇为经典的“技巧”。通过限量销售来创造紧迫感，让用户看

到有多少人同时与之竞争则是通过数字来创造社会认同提升产品销量。
比如，用户第一次在 Airbnb 查询并预订的时候，由于预订名额不多，地方紧

俏，结果可能会预订失败。下一次去阿姆斯特丹的时候，如果还是想预订这个地
方，下次用户会更早预订并做好准备的。有的时候人就是这么奇怪，越是得不到越
是想得到。当然，这当中的平衡和技巧需要掌控好。

过度的控制可能会造成饥饿营销，这并不可取。

图 8-27　社会认同与限量销售

（8）坚守核心价值观（图 8-28）
在特殊的日子里，听到来自全世界各地的“朋友”的问好是一件多么美好的事

情。Airbnb 就在为用户做这样的事情。
Airbnb 的创始人 Brian Chesky 在接受某媒体采访的时候说道，Airbnb 提供的远

不止于一个简单的住宿场所，它所提供的是一个帮大家交朋友的地方。

184

www.huiyankan.com

图 8-28　坚守核心价值观

如果在年底的时候收到一封 Email，邮件标题是“同你的 Airbnb 房主每个季节
问候一次”。这是增进友谊、构建社区的绝妙提案。这些令人感觉美好的事情也确
实能使人产生好感，为之着迷，所以相比于其他相似的服务，用户更愿意在 Airbnb
预订房间。

（9）动态首页

Airbnb 的首页设计（图 8-29）有视觉焦点，对于视觉走向也有引导。和许多同
类网站不同，Airbnb 将探索的环节和省略了，而是专注于让用户沿着网站的视觉流
向下意识浏览下去。

当人们搜索过，点击过几个地方再回到首页的时候，会发现首页已经根据自己
的浏览记录进行了个性化定制，符合需求，推荐也帮人们省去了重新发掘探索的步
骤。虽然这种功能算不得起眼，但是人们会为这种小改变而惊艳。

这些有意思的细节设计不仅使得体验更好，而且拿捏的时机也很好。预订过几
个地方，搜索过十几个城市，人们会发现这是一个令人感到温暖的网站，而自己也
会成为一个温暖的人。

图 8-29　动态首页

第 8 章　平面设计的商业性 185

参考文献

[1] 王受之 . 世界平面设计史 . 北京 ：中国青年出版社，2002.
[2] 斯科特·W. 桑托罗 . 走进平面设计 . 北京 ：人民邮电出版社，2015.
[3] 阿历克斯伍怀特 . 平面设计原理 . 重庆 ：重庆大学出版社，2015.
[4] 马库斯·韦格 . 平面设计完全手册 . 张影，周秋实译 . 北京 ：北京科学技术出版

社，2015.
[5] John McWade. 超越平凡的平面设计 ：版式设计原理与应用 . 北京 ：人民邮电出

版社，2010.

www.huiyankan.com