TW洞见 | 熊子川:设计师的视觉设计五项修炼

我的职责通常是产品战略和设计方向的规划,很少参与具体的设计细节,但我一直相信基础设计技能对于设计思维的影响,以下五条是我认为页面设计最基础的技能要求。没有经历任何艺术教育的设计师(比如我)也可以通过对以下五项修炼的培养迅速提高基础设计能力。

草绘

无论前端技术发展成什么样,在自然交互界面没有大行其道,只要图形界面依然是交互设计的主流,网页设计的基础还是版式设计。换句话说,很多人的设计感不好来源于对于版式设计的基础并不了解。

在传统的印刷物或图形设计领域,一件作品的创造过程通常经历4个基础步骤:

  • Sketch草绘:也叫做Thumbnail Sketch,通过大量的设计草绘逐渐形成设计概念(如下图);
  • Layout初版:初版主要构建基础的元素以及体现元素间的主次关系;
  • Comp精版:在精版中一部分展示更多的细节;
  • Finish完成:完成最终设计。

源于传统平面设计领域的页面设计同样也应该遵循草绘、初版、精版、完成的过程。可惜的是很多页面设计师因为种种原因,并没有养成从草图开始逐步细化的职业设计习惯。事实上,我只是从2012年时开始练习草绘的,在此之前我也有上手就是PS或者代码的习惯,下面这张图是我自己练习的第一张草绘图:

经过三个月的练习,逐渐可以达到草绘场景图、信息图、Sketchnote等水平,当场景图都能熟练表达的时候,绘制一个页面就变得非常简单了,如下面的图:

值得提的是我并没有接受过专业的美术训练,只是很小的时候喜欢画画而已,在短时间内,只要不断进行练习,相信在最多不到6个月的时间内,就能完全掌握草绘的技能。关于草绘,可以参考Alistpast的文章《Sketching: the Visual Thinking Power Tool》,在之前的文章中也提到了草绘重要的文具选择,请参考文章《敏捷UX文具指南》。

使用网格

草绘是最基础的页面设计技能,而对网格(或栅格系统)的使用更是被很多设计师忽视。同样作为平面设计重要的工具之一,早在1629年,法王路易十四命令成立一个管理印刷的皇家特别委员会,由数学家尼古拉斯·加宗(Nicolas Jaugeon)担任领导。委员会提出了新字体设计建议:以罗马体为基础,采用方格为设计依据,每个字体方格分为64个基本方格单位,每个方格单位再分成36小格,这样,一个印刷版面就由2304个小格组成。这是世上最早对字体和版面进行科学实验的活动。也是栅格系统的雏形(下图)。

原文发布于微信公众号 - 思特沃克(ThoughtWorks)

原文发表时间:2015-01-21

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏程序员叨叨叨

【转】从零开始手敲次世代游戏引擎(序)

大家好。我“正式”从事软件工程师这个职业已经快15年了。至于编程的历史则更长,有20余年了。记忆当中第一次编程的机器里只有ROM BASIC,用“*”打了个金字...

13540
来自专栏互联网杂技

重回80年代!为网页注入迷人的孟菲斯设计风

复古一直在流行,这也是为什么过去许多设计趋势常常会沉寂若干年之后,又再次走到潮流的最前线。今天,我们要聊的是孟菲斯设计风(Memphis Design),这种设...

36180
来自专栏量子位

深度学习get新技能:能分辨48种野生动物,准确率92%

李杉 编译自 NewScientist 量子位 报道 | 公众号 QbitAI 春天来了,万物复苏。在坦桑尼亚西北部的塞伦盖蒂大草原上,计算机们正在履行它们的职...

45370
来自专栏钱塘大数据

【揭秘】复联中的灭霸原来是这么设计出来的!

票房屡创新高,观众好评如潮,《复联3》可谓是当下最热门的电影。作为漫威系列电影第一段的终结,迪士尼和漫威公司在这部电影上豪赌一把,76个漫威角色齐聚一堂。然而汇...

24750
来自专栏安恒信息

全新iPhone概念:这八边形造型

国外Designed by M设计工作室的设计师为我们带来了一款全新的作品。 他们将这款iPhone命名为“6m”,从概念图中我们可以看到iPhone 6m运行...

29570
来自专栏CDA数据分析师

这16个数据可视化案例,惊艳了全球数据行业

本文转自网络,如涉侵权请及时联系我们 数据可视化可以帮你更容易的解释趋势和统计数据。 数据是非常强大的。当然,如果你能真正理解它想告诉你的内容,那它的强大之处就...

35160
来自专栏量子位

谷歌这个AI“吵架预防器”,可带你提前远离杠精们

回想一下,你在微博上针对问题提出看法,几小时后发现一队人马@你排队挑衅,他们奉行“只对人不对事”和“以抬杠为己任”的基本原则,试图和你吵架。

9930
来自专栏PPV课数据科学社区

有哪些惊艳全球数据行业的16个数据可视化例子?

数据是非常强大的。当然,如果你能真正理解它想告诉你的内容,那它的强大之处就更能体现出来了。   通过观察数字和统计数据的转换以获得清晰的结论并不是一件容易的事。...

29460
来自专栏罗超频道

Material 还是扁平化?开发者还有第三个答案

2011年,拉里·佩奇担纲谷歌CEO之后,改变谷歌工程师主导的文化,其中一项重要行动便是,下令谷歌设计师将谷歌旗下所有产品重新设计。谷歌启动“肯尼迪”项目,召集...

36060
来自专栏腾讯高校合作

从VR的全世界走过—SIGGRAPH Asia 2016游记2

前言 Virtual Reality的展厅为我们带来了全球VR领域的顶级科学家们的最新研究成果,其中有多种多样的产品展示:无人机、VR设备、体感游戏、人脸识别、...

365120

扫码关注云+社区

领取腾讯云代金券