商业视觉设计实战 标题文字篇

这次小编给大家整理了商业视觉设计实战 标题文字篇，本文共6篇，供大家阅读参考，也相信能帮助到您。

篇1：商业视觉设计实战 标题文字篇

之前我把平面设计的视觉呈现分为：构图，调子，元素和内容四大部分组成，所以我分四部曲来讲，其中元素部分又分为标题，主体和大场景三部分，今天讲的就是标题部分，在讲标题设计之前，先说说这四部曲的基本前提：

序

目标

我们做设计究竟是为了什么?公司请视觉设计师做美术包装广告究竟是为了什么?

赚钱!

宗旨

我们公司是上市运营公司，公司存在是为了盈利为了赚钱，我们视觉设计师是包装，我们目的是把公司产品美术包装做好，

让用户有视觉享受，更好的引导去花费，赚用户的钱，因此，我们做的是商业设计。

用户认同我们，能让美术引导他们去更开心的去浏览，去消费我们的产品就是我们的成功。

所以，商业设计必须以用户的角度出发。

良好的设计习惯

因为我们的设计是从用户角度出发，建议每次完成设计后，首先问问自己，也可以问问别人测试一下，如果你是用户，看看这份设计是否吸引到你，是否愿意去读下去

用户的特性

大部分人总是很忙，生活匆匆过，一般外面的线下广告用户去看不会超过3秒，什么能够让他们视线停下来?网络资讯琳琅满目，怎样才能让迅速浏览和点击的用户停住视线?其实你们自己都是用户，问问自己-那肯定是吸引你眼球的视觉冲击力强的广告，还有你感兴趣的广告文字。线上广告主要是 以banner为主，道理是一样的，能让行走的人留住视线，能让在邻罗满目咨讯中浏览网页用户停住视线的广告，必须的就是充足的视觉冲击力和捕捉力的平面主体，另外就是凸显敏感的标题和重点字眼。

标题文字篇

平面设计除了在视觉上给人一种美的享受外，更重要的是向广大的消费者转达一种的信息，一种理念，因此在平面设计中，不单单注重表面视觉上的美观，而应该考虑考虑信息的传达。

标题主要是表达广告主题的短文，一般在平面设计中起了画龙点睛的作用，获取瞬间的打动效果，经常是运用文学的手法，以生动精彩的短句和一些形象夸张的手法来唤起消费者的购买欲望。不仅要争取消费者的注意，还要争取到消费者的心理。。(引用网文)

标题的最基本要求：

清晰，明了

请问，三秒内以上banner谁能看清楚写什么?有能抓的住谁眼睛?

标题的三大特性：

逻辑性

标题选择上应该简洁明了，易记，概括力强的短语，不一定是一个完整的句子，也有只用一、二个字的短语，但它是广告文字最重要的部分。

标题文字不适宜过长，往往三四个字为一个停顿，作为一个设计师，要懂得如何提炼标题文字主次和语法逻辑，让观众读起来一下子捕抓到商品所表达的意思，例如：我相信我会飞!设计的时候，可以提炼：我相信，我会飞，提炼后马上明了目的是我会飞;一切皆有可能，停顿应该是：一切，皆有可能;科技以人为本，停顿应该是：科技，以人为本，科技怎样呢?就是以人为本;

准确的文字提炼，能让用户快捷地捕捉到要点字眼。

315专题“假货让我很不爽”这个标题，突出的字眼应该是 假货让我很不爽，马上就知道假不爽，但是，如果为了迁就效果而做成 假货让我很不爽，那就变成假是爽的了

还有就是标题文字停顿货重点字注意颜色的配合，文字转行或者颜色变化同样会引起误会。 所以请注意提炼重点文字逻辑和提炼停顿的技巧，直接影响到信息效果。

上图不被设计者解释一下，我以为33626是电话号码，什么叫套出租房?原来是33626套房，所以设计的时候是不能分开。

整体性

一般广告语标题在设计上一般采用基本字体，或者略加变化，而不宜太花，要力求醒目、易读，符合广告的表现意图，在标题文字的形式要有一定的象征意义，粗壮有利的黑体给人感到清秀，适用于电器和轻工商品;圆头黑体带有曲线，适宜妇女和儿童的商品应用;端庄敦厚的老宋体，用于传统商品标识稳重而带有历史感;典雅秀丽的新宋，适用于服装、化妆品，而斜体字给画面带来了风感、带来了动感，

(引用网文)

标题文字设计尽量用相同的字体，在平面设计上标题文字要凸显于版面上，所以标题的整体性尤为重要，如果碰到过多的文字，如果整体结合性不强，那么在点多于面的视觉上就会显得松散没力，压不住场。更多的时候，标题其实最好是一个面。展现几个正面不同风格的范例：

字体数最好统一在1-2种，以英文作为线的组合

主副标题的结合

娱乐性比较强的标题设计，在清楚的前提下，无论背景多么复杂，都

能凸显整体的标题，这时其中一种简单的技法:

看几个值得注意的例子：

修改前

做设计总应该把眼光放远，不然会把自己拘束在小空间里，好像画石膏，整体定位，分立明暗，然后才是细节，其过程眼睛和构思总是不停在调动整体性。道理一样，好像以上例子，不把握住整体来设计作品，就会出现“小儿麻痹”的效果

修改后

就标题而论，起码看上去，文字的一块是整体的清楚的

超过2种中文字，没有整体的标题设计，不要说3秒抓眼球，就是慢慢看，都分不清应该读那句先，那句后;设计者和审核者都应该注意，所有展示的负面设计都是不允许发生成熟型公司的。

这里就标题的整体性对比一下几个例子：

前

后

前

后

前

后

前

后

设计标题的时候，如果文字过长应该分行，在语法停顿的地方做些关联的细节字眼，尽量把文字的点性结合成面性，加上细节上可以自己加以修饰的修饰图，那整体性和趣味感就出来了

引导性

标题在整个版面上，应该是处于最醒目的位置，应注意配合插图造型的需要，运用视觉引导，使读者的视线从标题自然地向插图、正文转移。例如美国运用篮球巨星脚穿”耐克鞋”在球场上腾空飞跃，以”谁说我不能飞!”的感叹语句，标题与照片融为一体，形象的夸耀了鞋子的质量，让人感到生动活泼，形成了自己的个性。(引用网文)

又例如，画面是一个人在大声地用扬声桶说出标题，那么标题就应该自扬声桶开始由细到大，透视上由斜到直地表现更为生动，如果只在旁边加以文字，会平淡很多，在引导上就没有前者有活力

引导性的标题需要和图片的互动比较大，也比较生动

造字的效果

在一个平面或广告上文字始终是文字，但是，我们利用自身设计者的美术感觉，把文字变化成图形，将会出现画龙点睛的效果，散字是点，排版好就是线，加上把重点字提炼出来，变化一下让他成为图，那么点线面不用我讲都知道是永恒不变的结合，自己造字其实蛮有乐趣与挑战，也有成就感，在造字的时候，首先先了解主体所变现的内容，根据内容来变化，

例如以下例子

(这个作品是初稿，整体上还是不完整的，因为前面的标题字和造字之间没有关联，这里表达的是造字的作用)

亚运会火炬叫潮流，但是设计这个主体的时候火炬两个字体与变化成火苗的形象对比，无疑是后者表现的比较生动贴切。也能达到几秒钟内铺抓眼球的效果，关键是，中国文字是极具中国特色的色基元素，值得成为中国特色设计的奠基。

我个人比较支持设计者自己运用中国字的特典造字来表现标题。

很多时候，标题的设计更多的应该是一个面，其实标题的这些特性在我们身边随便都能参考到，杂志的封面，正版游戏的封面，标题设计的逻辑性，整体性和引导性都是非常棒的，建议大家多看多想，一个设计者如果走在大街上把所看到的都能结合心中的构图，那么很容易就会把那种所以延续成你的个人风格。

篇2：商业Flash设计经验谈(视觉冲击力)

设计

四、视觉冲击力

酷眩Flash，是否有视觉冲击力是很重要的，不是晃的人眼晕就是有冲击力，视觉冲击不应该过多，而且要在合理的地方出现。那么怎样设计有冲击力的动画呢？

1、速度

高速度本身就产生了视觉冲击，但在众多高速运动的物体中，缓慢运动的物体反而更引人瞩目了。因此除了高速、变速，跟周围环境差异大的运动速度，都能给人带来一定的视觉影响。

2、面积

毫无疑问，大面积的运动能带来更大的冲击力，但一定要在不给人造成心理压力的前提下。如果面积很小而且无法扩大，高速闪动是个不错的选择。

3、动作

一般来说，高速缩放是最能带来视觉冲击的，

位移其次，其它是各种各样的特殊效果，其实这和环境的关系很大，动作特殊往往就会带来不错的效果。

4、颜色

颜色与面积关系很大，我们经常可以在影视片断当中看到这样的处理，两个片断之间，突然白屏，然后画面渐出。给人很强的视觉冲击，可以说颜色变化的越大视觉冲击就越强。我们可以经常在一些优秀作品当中看到物体往往会变白以后再移动，因为白色最亮，自然会非常抢眼。这只是一个典型的例子，颜色的变化还要依据动画的整体风格，不可生搬硬套。

说了这么多，制造又酷又眩的Flash，首先要从平面效果下手，设计合理美观的表现方式。然后利用各种动态效果和适当的元素去表达所需要传达的概念。动画设计的过程重要从节奏、速度、冲击力等几个方面去考虑！希望这篇文章能够起到抛砖引玉的作用，使大家能够更多的注意到优秀作品的科学合理性，更深层次的去挖掘适合Flash动画的表现方式！

篇3：让枯燥的标题文字来次华丽丽的变身视觉设计

2、用钢笔工具勾勒出自己想要的形式，给字体做相对应的加减法，

3、给变身过的字体做相对应的效果。一层层的叠加，这个过程可能会需要进行反复多次的效果、样式尝试。越到后面越没有耐心那就证明你就离成功不远了。（过程是苦逼的，结果是满意的，那么再苦逼的过程在满意的结果面前都是那么的不值一提）

4、达到理想效果了最后做一些素材的叠加，就圆满了。

以上就是我个人对字体效果的处理方法，PS的功能是何其强大，同一种效果可以用多种形式表现。

（以上纯属自构，如有雷同实属师出同门）

篇4：好的网站设计需要视觉和文字的和谐

文章描述：好的网站设计需要视觉和文字的和谐

原来把题目定为“视觉与文字”，但是又觉得这题目似乎有点过大，怕用了专业的标题却写出非专业的文章，而我无意暂时也没有能力去对视觉一些细节做极为专业的考究，只希望通过自己一些学习和了解来加深自己对美的判断吧。其实文字本身就是一种视觉语言，它把现实世界的所有事物，都以字的形式来进行了表现。曾经读过一篇文章，说在传统的版式设计中，设计师们更喜欢做英文的排版，因为从视觉上来看，英文很容易形成线和面的关系，且字母有节奏感，比如aby这三个字母放一起有高矮区别；而中文相对来说，单调、孤立、不流畅。特别有道理，但在此之前，我在看到一个页面只会说好不好看、怪不怪，从来没有想到过这些原因。好的网站设计需要视觉和文字的和谐，下面就是我的一些理解，当然其中也有向设计师讨教后的结论，若有不对，也是学习过程中的不可避免的吧：）

1、一致性

设计在同一产品（甚至同类产品）中应保持一致性，这样可以大大降低用户的理解成本，使用户快速上手，增加用户的使用率。这个一致性包括内容、颜色、形状、操作方式等，比如在不同的页面使用同样的翻页等，既可以降低成本，又能帮助用户形成良好的习惯，到一定的程度，甚至会提升一个品牌的认知。

•采用统一样式、大小的button（颜色、文字的内边距等）；

•文字采用统一的字体、字号、粗细等（根据不同的内容等级来决定）；

•链接不同状态文字的颜色统一（link\visited\hover\active）；

•采用统一的标点、间距、边距、行高等。

（具体可见视觉规范)

但，文字的位置要符合会员的整体阅读习惯和整体视觉效果，不一定是固定放在某个位置的。如下图，同样是“更多”，前者由于排行有3大类，一行已经占满，所以放在模块的右下角；而后者是顺着会员的思路，在右上角给出提示。

2、色彩

用户看到一个网站，首先冲击他眼球的就是界面整体的色彩，然后才是其中的内容、文字等。就好像听一首歌，首先你肯定是被这首歌的旋律所吸引，然后才想要去听清楚它的歌词，进而引起共鸣。营销学中著名的“7秒定律”就有说到：消费者会在7秒内决定其购买意愿，而在这短短7秒内色彩占67%的决定因素。所以用户对页面中色彩的关注度是非常高的，有效的运用色彩来区分信息的级别、分类等，有助于帮助用户对信息和操作产生关联，减少用户的记忆负担，

•同一页面中一般采用1种主色调，1-2种辅助色，再加1种小面积的点睛色，即同时出现的颜色一般不超过4种；

•主色调的选择由产品性格决定。色彩也是有性格和情绪的，因此会吸引不同性格的人，理解不同的情绪。在设计页面之前，经常听到有PD说我希望这个页面的风格是大气、时尚、活泼的……我想设计师一听到这些词应该马上就会在脑海里蹦出几个跟这些关键字匹配的色彩。已经有许多的视觉设计前辈，根据长期的经验和用户调研总结出了类似下图的表格，根据这些人们已认知的色彩情感，会更容易引起用户的共鸣和信赖感。因此，设计师在考虑色彩时一定要依附于产品，并注意对用户心理和文化的影响。比如口碑目前的主色调采用橙色，所代表的就是热情、活跃和热烈的感觉；

•合理搭配颜色，使用对比度明显的颜色，指导用户看到最重要的信息，如在深色的背景中使用浅色的文字；

•根据不同的产品使用场景，选择合适的颜色，如管理页面经常使用蓝色。

3、图形图标

我一直认为好的图形表达是优于文字的，有时候大段的文字解释不仅不能给用户带来帮助，还容易影响页面的美观；相对于单纯的文字，图形以及符号化的图标更符合用户的认知习惯。要表达一种信息，往往一张图片或一个标识更能让不同用户理解与接受。适当的使用图形与符号化的图标，会让用户很自然的建立起认知习惯。

但是图形如果没有把内容表示清楚，则会适得其反，给用户造成理解上的困扰。很多情况下，我们好像都很喜欢做一些很炫的icon来表达某些内容，这些的确会起到一定的吸引性，但是最重要的一点是：不让用户思考，要够直观，够明了，不对用户理解内容产生干扰，如果做不到，那还不如不要。所以：

•图形图标表意要清晰、明确，要有高度的概括性与指向性，让用户能够快速联想到对应的功能和操作；

•同类信息的图形图标，在形式和风格上应尽量保持一致；

•图形图标的使用要注意场合，避免滥用，仅在需要突出重要信息，用户可能产生理解偏差的情况下使用；

•图形图标要尽量与文本结合使用。

视觉是文案隐形的幕后推手、是文案的媒婆，2者有机的结合才能讲述给会员一个完整的故事。前面是我理解的文案在视觉中的规范，而这些则是我理解的文案与视觉更深层次的关系。他们不是简单的相互解释，而是用各自的语言来创造想象的空间，用清晰、有创意的文案和设计来引导会员的点击，教会他们在网站的习惯。

篇5：浅谈终端视觉设计中的文字运用交互设计

文字是人类用来记录语言的符号系统，随着社会的发展，文字已经摆脱了在纸张上，版面上的简单呈现模式，当下的数码产品中有着更为丰富的应用。

大家都知道，界面效果虽然日趋拟物化和平面化，但现在往往很多细节还是脱离不了文字的显示，手机终端屏幕的限制和用户的学习成本也更深一步的决定了文字的不可缺少。

只是在界面设计中，这些文字更加具有逻辑性，和类别性，看似与界面融为一体，实则有更多的考量标准，不单单是一个效果。自然界中任何一种景观奇迹也是有着他自己的科学规律。作为终端视觉设计师，也要对终端的文字规律作一定的梳理，这样才会从内涵上真正的提升设计品质，对用户更加体贴。

设计离不开生活，从生活中提炼总是浅显易懂，我们先看看生活中的文字：

1.几点？表盘数字

2.什么菜？菜谱

3.怎么走？路标

4.多少钱？价格

5.啥内容?报刊书籍

由上面我们便可以把生活中的文字划分四个类别

A指示性的：路标，表【对人的行为有明确的指导提示】

B名称性的：菜谱，文章标题【对你所需要的或了解的事物做一个名称】

C评价性的：价格,好，坏【物品的一种属性】

D内容性的：书籍，报刊【偏内容的记录】

虽然我们如此区分类别，但他们之间还是有交叉的，不同情境可能就不同。举个例子说，对一篇文章的评论，从自身角度讲它是内容性的，可针对文章它又是评价性的。由此可见，文字的相对性也是必须考虑。

以上说了那么多，其实终端界面中的文字同样可以这样划分【当屏幕空间有限，降低学习成本，文字是最好的应用】比如symbian v3的手机软件管理，之前制作就有较多这方面的考虑：

指示性的：确定，返回，安装，退出，类似于超链接的查看…

名称性的：软件名称，列表…

评价性的：文章评价，用户级别…

内容性的：软件详情，常见问题，评价正文…

可见，在一个客户端软件的生态系统里，这几个类别是必需的，

我们在设计中一定要注意文字是处在同一个视觉系统里，功能性的不一样，对颜色，字体，都会有着一定意义的区别。他自身的逻辑性要求不仅仅是好看。

从人的心理角度出发，整体可得出这样一个逻辑关系：

指示性的要有一定的突出，一定要强于名称性和评价性的文字

名称性的往往采取常规正常浏览，明确适中，清晰即可

评价性的则是在清晰的基础上加一点对比

内容性的由于文字稍微偏多，所以在行距和背景搭配上要明了清晰。

可以得出整体逻辑强度：指示>名称>评价>内容

整体的表现通常是靠文字的密集度和稀疏程度来表达，虽然【确定】，【返回】这类的色彩可能并没有列表里的名称更厚重，但他一定是在宽松的环境，来形成他的视觉焦点.可以看出整体逻辑强度是通过交互排布来完成的，与人的使用密切相关。

那么视觉设计要做的是在整体逻辑强度下，去实现特指功能的强度区分，比如在内容页面里，文字行距的运用则更为重要，使得内容更易阅读，而弱化指示性的一些东西，使人可以专心的进行本页所呈现重点的操作与浏览。从视觉上讲，当下首要进行的总是最重要的。又比如在一个列表页里，显然列表的每一行的名称更加重要，视觉上要强于【确定】【返回】这类指示性的文字。

这里所说的视觉厚度，可以包括：色彩，文字大小，描粗与否，底部button或背景的强度等，都一定意义影响我们使用的心情。

以上两个方法，我觉得是在判断完成移动终端文字逻辑强度的情况下，设计者有效处理好文字之间关系的必要方法，用来提高设计的品质。字与界面能否在效果上融为一体，我个人认为很大程度上就是这两点是否处理的恰当。

篇6：执行力强心剂之二：字体特效篇（续）视觉设计

大家好，这篇文章是-执行力强心剂的-字体特效篇第二部，如果有兴趣的同学可以查找第一篇观看，

执行力强心剂系列文章是一种直接，甚至是机械的填鸭教程，目的就是为了使我们的视觉执行能力在短期内有一个品质的提升。这个分享针对的人群可能是实习设计师至中级设计师之间，在自己的表现手法进入到一个瓶颈期的时候，用于强制突破的教程。我们的目的不在于强迫使用，而是从中吸取灵感，掌握技术。这个教程是分期的，每一期，我会针对一种设计形式进行表现手法，与拓展联想的讲解。希望设计师朋友找到自信，慢慢突破这个教程，最终达到技不压身，真正的使用创意，而不被能力绊脚。

文章中的所有范例截图来自于国外几个设计网站的表现手法教程博客，由于对应截图的文章均是一些调试效果的数据记录，太过枯燥且没有实际意义，所以我只使用截图来配合我想表达的思想，希望大家能够跟我一起分析每一个执行过程，获得收获。曾经有热心的朋友提出叫我列出文章作者的名字，其实文章就是我的，而配合的图片是一些不知名的国外设计师的作品。有的我甚至不知道他的姓名，所以十分抱歉。一定有很多人也看过类似的网站，只希望这些文章能真正的帮到有需要的设计师。至于更多出色的设计牛人，我就不板门弄斧啦。

回到正文，这次还是字体特效的分析：

缝线感觉字体效果制作：

缝线的特点就是细节灵活随意，轻松活跃。很少有画面需求适合这种效果，但只要我们遇到了，这种效果起着画龙点睛的作用，是非常加分的字体效果。

首先把背景解锁，说明我们要对背景进行编辑。

在图层效果中选择图案纹理覆盖，这个是在做画面中的布纹质感背景，所以我们需要寻找一些布纹的肌理贴图导入到纹理库中。（其实现在有非常多的PS插件可以把这个效果制作的更加逼真，比如AlienSkin EyeCandy Textures中的布纹效果插件，完全无需记录数值，所有操作可视化，最重要的是插件中模仿了多种布类的编织方法纹理，如丝绸，麻布，牛仔等等。）

展示一下背景的效果

如果是布的缝补效果，在字体的选择上面需要注意不要选择比划过于多，或者过于细的字体。我们的中文是比较吃亏的，不过复杂字体的比划其实是可以通过字体调整简化的，

而且字体要选择一些比较有剪贴效果的，举个稍微俗气一点的例子：迷你剪纸体… …

既然是锋线，肯定需要有一条车线的路径。ctrl+鼠标右键点击字体，在菜单中选择创建工作路径。在图层中观察，创建了工作路径的图层，会在图层预览图片框外面多出四条角线。这样说明创建成功了。

如果一个不小心，同学们中有不知道这个操作方法的。请一定要记起来。举一反三，创建图形路径的方式可以实现很多效果。也可以存储路径到AI甚至3D MAX中建模，是非常实用的方法。

在文字上方添加一个图层

选择笔刷，其实我们可以自己制作笔刷的，自己画一张图，储存成笔刷就好了，这样我们可以使用更加合适自己创意的笔刷。

在这里，执行者调入了实现制作好的V字形笔刷，下面的数值是关于笔刷大小，方向，和镜像密度的数值，建议同学们自己根据预览视窗调节，不必死记数据。

精髓到了，在笔刷选项中选择形状动态选项，并在角度选项中选择方向。这两部是非常重要的，这样这条V字的笔刷镜像就会按照真实自然的方向延展下去。

随想：使用这种方法，我们还可以做什么？除了缝线，一条sexy的蕾丝边都能做出来的。或者重型机枪悬挂的弹夹？或者跟着五线谱飘动的音符？

现在缝线效果生成出来了。

现在为路径描边生成的缝线制作一些体积感，使用投影效果和浮雕效果可以实现。

同样的方法我们可以使用制作画笔描绘路径的方式再制作一个单缝线的效果字。

这样，一个锋线感觉的字体效果就完成了。

这一次的第一个例子使用缝线效果主要原因是强调肌理效果在画面上的应用。当看到这个方法的时候，我不由的心中窃喜，跃跃欲试。每当我们掌握多一点执行方式的时候，我们在设计的思路上就会变得更宽。往往有时我们出创意，都会逃避自己执行上的弱点。这并不是需求给我们带来的局限，而是自己能力的局限。久而久之，自身的创意思维就会禁锢，因为自己手头的能力远远跟不上活跃的思想。这种惯性是导致设计瓶颈的元凶。