求《形式感+》网页视觉设计创意拓展与形式表现快速表现 PDF电子书完整版

来源：蜘蛛抓取(WebSpider) 时间：2018-07-10 05:42 标签： 网页视觉设计创意拓展与快速表现

　　网页设计师从早年的综合性工作中分化出来，形成了相对独立的专业岗位，网页设计也不再是单纯的软件应用，它衍生出了许多独立的研究方向，当网站策划、交互体验都逐渐独立之后，形式感的突破和表现成为网页视觉设计的一项重要工作。随着时代的发展，网页设计更接近于一门艺术。网络带宽和硬件的发展为网页提供了使用更大图片、动画甚至视频的权利，而这些也为视觉设计师提供了更多表现的空间。另外多终端用户屏幕（主要是各种移动设备，手机、平板等）的出现，它让网页视觉设计师不得不重新定义原有的视觉规范。这些变化都趋使着设计师对新形式的渴望与进一步的探索。 　　本书就是这样一本速食的设计创意与技巧手册。本书可以帮助有一定基础的网页设计初学者或在职者，在遇到设计创意瓶颈时，能够在较短的时间内解决设计上的创意和视觉形式感的问题。不论是应对紧急的工作需求或是求职面试都能够给观者一个新颖的视觉表现。 　　本书读者是网页设计师，包含狭义的、广义的、“圈养”的、“野生”的，以及网站开发其他环节需要了解网页视觉设计或与之协作的人员（如用户体验设计师、前端页面开发人员等）。 网页设计师从早年的综合性工作中分化出来，形成了相对独立的专业岗位，网页设计也不再是单纯的软件应用，它衍生出了许多独立的研究方向，当网站策划、交互体验都逐渐独立之后，形式感的突破和表现成为网页视觉设计的一项重要工作。随着时代的发展，网页设计更近于一门艺术。网络带宽和硬件的发展为网页提供了使用更大图片、动画甚至视频的权利，而这些也为视觉设计师提供了更多表现的空间。另外多终端用户屏幕（主要是各种移动设备，手机、平板等）的出现，它让网页视觉设计师不得不重新定义原有的视觉规范。这些变化都趋使着设计师对新形式的渴望与一步的探索。

　　本书就是这样一本速食的设计创意与技巧手册。本书可以帮助有一定基础的网页设计初学者或在职者，在遇到设计创意瓶颈时，能够在较短的时间内解决设计上的创意和视觉形式感的问题。不论是应对紧急的工作需求或是求职面试都能够给观者一个新颖的视觉表现。

　　本书读者是网页设计师，包含狭义的、广义的、“圈养”的、“野生”的，以及网站发其他环节需要了解网页视觉设计或与之协作的人员（如用户体验设计师、前端页面发人员等）。

网页设计图书还大都停留在10年前的水平上，远远落后与我们的当前设计真实水准，个中缘由这里不深究。老编认为，这本书是13年策划生涯中遇到的*好的一本网页视觉设计书，设计是前沿的设计，文笔是通透的文笔，作者小彦文武双全，德才兼备，乃设计师中的韩寒，作家中的林志玲。这本书，错不了。

　　清华大学出版社 栾大成

网站蓝图--Axure RP高保真网页原型制作（配光盘）（高效、低成本制作足以乱真的网站模型！）

Dreamweaver ASP网站创建课堂实录（配光盘）（课堂实录）(Dreamweaver网页设计与网站建设初学者门**，订制视频教学让你在家享受专业级课堂式培训) 

Dreamweaver CS6网页设计与网站建设课堂实录（配光盘）（课堂实录）(Dreamweaver网页设计与网站建设初学者门**，订制视频教学让你在家享受专业级课堂式培训) 

　　一个网页设计手艺人，行早年曾与朋友一同组建工作室经历过两年不太专业的野生派设计生活，后受圈养于国内游戏公司。从三位一体的技术混沌派到团队合作的专业分工体系，从单纯的视觉执行到系统的品牌包装，从标准化的PC端网页到多样化的移动设备网页，经历了不同时期不同形式的网页视觉变化，至今仍然执迷不悟的驻足于网页设计阵营，始终关注网页形式变化，未曾改嫁。在这六年的网页设计工作中积累了一些值得分享的经验，部分文章在网络上获得了设计同行的认可和大量转发。现受圈于腾讯游戏官方设计团队TGideas

这本书说实话并不是给做产品的人看的，是给设计师看的，而且还是游戏产品相关的设计师。不过因为这本书写的足够入门，作者总结的一些思路蛮不错的，所以面向的阅读对象也可以很广，所以推荐的阅读对象是：专门从事设计工作的同学、产品同学、交互设计同学、还有就是经常做PPT的同学。
“形式感”我理解就是在做平面设计的时候的套路，这个套路让你区分于随机出作品的设计大师，而让你更机械和更标准化的输出一份设计作品，然后获得顺利验收。如果要提高生产率，让工作输出保持稳定的水准，形式感是必须要学的套路。
这本书总结了10种让你的网页设计保持形式感的方法，我可以再分分类：1-3章节是从无到有的创作方式、4-6章节是有趣的创造性表现方式、7-10是专门的处理方案，比如7是设计与屏幕关系、8是设计中文字的处理、9是数字可视化处理、10是设计里的小物件。
接下来就没个章节概要内容进行下梳理，让这本读后感能同时做一本读书笔记是好事情~

有些设计主题可以直接通过现实生活原貌来激发灵感。让抽象的主题通过实体表达出来，并以之作为信息载体，从而在视觉上直观体现核心内容并突出主题。
具体步骤是“减法-分块-加法”。减法就是将复杂和细节化的物体进行抽象化，通过轮廓及关键元素让一眼知道这只有简单几笔构成的物体是什么，然后进行信息分块，考虑需要展示的信息如何结合，最后通过加法，添加一些配饰、物件让版面更有趣和生动。这一类做法在球类、棋牌、建筑等方面运用比较多。

圆形、方形与三角形是网页造型结构中得精髓元素的归纳，我们可以利用它进行网页框架的打造。

圆是可爱的、灵动的、有亲和力的画面想象；
方适合在信息量较大的页面中，或者庄重、严肃、情感内敛的主题中；
三角带来刺激的、运动的、时尚的、尖锐的。 设计的三步为“打大框架-为内容进行布局调整-摆文字和图片”。

因为残缺，有了与众不同的故事和特点，它的主题和目标性相比完美的东西更显得强烈。
断臂的做法有删除局部、选取局部、替换局部三种方式。具体步骤是“置入主题-断臂处理-信息排布”。这种方案在角色扮演类游戏和人物广告中运用的比较多。

再到处充满加法的地方，我们可以使用减法让主题突出。包括留空白、长页面展示、多层级页面展示三种方式。
过于频繁的单一的使用加法往往会把自己逼上绝路，这点很有感触。想要简洁高大上？想要保持较好的可读性？那真应该尝试下这种方式。

乾坤大挪移就是对页面进行整体的旋转和平移，这是改变视觉的快速有效方法。包括整体旋转、背景旋转和综合旋转。操作步骤为“旋转板式-主视觉设定-信息排布”。平移则包含上下格局、左右格局、混合格局的平移，让页面开合有度，避免背景与文字信息的打架。
关于旋转有几个注意点：
1）非内容必要原因，文字尽量保持一定的规律排布对齐。
2）非内容必要原因，并列内容尽量使用同一变换角度。

杂志具有轻薄质感、节奏感强、图片大视觉等特点。常见的做法是背景大图、信息图形化、文字配图。这个适合在BANNER图上应用，BANNER常常是人一眼看到一个网站、APP的第一映像来源（谁让它那么显眼呢），所以在放置信息入口的时候要兼顾品牌信息的传递，这个在大厂做的比较好。

显示器分辨率越来越高，所以设计师也开始思考如何满足更大屏幕用户的需求-当然也要兼顾原有的小屏幕。作者提出可以用大图平铺自适应、中心定位两侧自适应、单侧定位中心延展、小切糕全屏响应式等方式来解决大屏幕与小屏幕的适应问题。这方面在游戏活动、产品宣传等注重品牌美誉度的方面应用的比较多。

这一章节专门介绍设计页面中文字如何处理的问题。文字展示经常包含标题、副标题、小标题、序号、内容说明、提示说明、关键词、图示、按钮等内容。作者给出解决方案应该“大关系、分要点、小字眼”。
·“大关系”就是为了还击大篇幅文字对阅读造成恐惧，应该理清段落之间的关系（并列、流程等）。
·“分要点”就是标识段落里的结构，提取信息段落里的主要元素，从大到小，从重到清。
·“小字眼”就是关键要点，比如数字、时间、地点、奖励等。通常会标红或安置在特殊的位置。

讲完了文字布局，作者继续讲解数据图形化展示方式，分为并列型、对比型、流程型。并列型常见的就是饼图、环形图、地图；对比型常见的是柱状图、折线图；流程型常见是任务流程、分支流程、循环流程等。
可视化其实在总结、产品对比、时间任务等方面经常用到。这方面有很多专门的书籍，有很大的学问。

钉钉柳柳指网页中的小装饰，它并非主体的形式感或者大的UI，而是网页设计中非主体的装饰，比如一个小图标，或者一些小装饰。
文中介绍了小图标、小序号、小字与小手绘。小的图标很难被我们关注，但是却在潜意识里为整体页面的易用性、舒适性、节奏感和亲切度默默加分。

至此，本书已经基本看完。这本书讲的道理比较浅显，是速成快餐。但是看完这本书后才知道这些只是皮毛而已，更难的地方在于创意的诞生以及如何制造视觉焦点、让整体有节奏感，这些都是本书没有涉及的。
另外，本书如果改版，可以增加动效设计。

我要回帖

更多关于 网页视觉设计创意拓展与快速表现 的文章

 

随机推荐