Reading——The Non-Designer's Design Book
看这本书的时候真的好恨没有CS7在手》《,不然我百度几张图来模拟下,体验下设计的快感。
人们总是很容易注意到在他们潜意识里存在的东西,比如说这个图:
我们很容易联想到微信,但是3
岁的小孩子就没这个概念,他们
很容易忽略掉这个图标。所以设
计的时候,要挑选容易被大众认
知的元素。
优秀的设计就那么简单^ ^!
4大基本原则:
一、亲密性
彼此相关的项应当靠近,归组在一起。如果多个项相互之间存在很近的亲密性,他们就会成为一个视觉单元,而不是多个孤立的元素。另外,要利用好空白来划分空间,划分视觉单元。
亲密性的根本目的是实现组织性,使得信息更容易阅读,也更容易被记住。你要有意识地注意你是怎样阅读的,你的视线怎么移动,从哪里开始,沿着什么路径,到哪里结束。这是设计师必备的观察能力。
二、对齐性
任何的元素都不能在页面上随意摆放。每个元素应当与页面的另外一个元素存在某种视觉联系。对齐的目的是使页面统一而且有条理。其效果类似于把客厅里四处零落的洋娃娃捡起来,并把它们放在一个玩具箱中。要着力避免居中对齐,除非你有意识地想要创建一种比较正式、稳重的表示。
三、重复性
设计中视觉元素的重复可以将作品中的各部分连在一起,从而统一并增强整个作品。重复的目的在于统一,并增强视觉效果,例如多处重复使用粗体字要突出标题或概述性的内容。但是要避免太多地重复一个元素,重复太多会让人讨厌。
四、对比性
在页面上增加对比能吸引人的眼球。我们的眼睛喜欢看到对比的事物。要实现有效的对比,这两个元素必须截然不同。我们可以通过字体选择、线宽、颜色、形状、大小、空间等等来增加对比。
做设计不要畏畏缩缩
1、不要害怕在设计中留有空白,这能让你的眼睛稍作休息。
2、不要害怕设计是不对称的,使用非居中的格式,不居中往往能使效果更强烈。
3、不要害怕把单词设置得非常大或非常小,不要担心说话声太大或者太小。在合适的场合这都是可以的。
4、只要最后的结果能支持或强调你的设计或观点,不要害怕让图片太大或太小。
让你的思维像骏马般奔腾吧~
颜色的应用
1、色轮的基础是红、黄、蓝,如果有一盒水彩,你知道可以混合蓝色和黄色来得到绿色,但是你没有办法通过混合其他颜色来得到纯黄、纯红或纯蓝色。
2、12色轮有三种阶级的颜色:
三原色:
三间色:
第三色:

三间色由相邻的三原色组成,第三色由相邻的颜色组成。
3、三色组:可以旋转黑色叉,很协调的颜色哦

4、分裂互补三色组:可以旋转这个黑色的叉,还是很协调的颜色哦

5、有时类似色用来做网页设计也不错~
发个链接:http://www.colorsontheweb.com/
网页设计切记
1、空白也是设计元素,要像组织信息那样,有意识地组织空白。
2、重复原则在网页设计中尤为重要,可以重复一种颜色方案,使用同样的字体或按钮,或者在每一页的同一个位置放置风格类似的图片元素。总之,你必须使游客知道他们仍然在同一个网站中。
3、不要让访问者在页面上移动滚动条来查看导航链接,这样会让人唾弃你的网站。
4、不要让文本紧挨着浏览器窗口的左边界,这样不美观。
5、不要对文本或图片链接使用默认的蓝色,这是业余水平页面的标志
6、正文不要采用粗体,也不要占据整个页面宽度。
7、不要使用荧光背景色,特别是不要使用荧光文字。
8、页面的最大宽度不要超过800px,表的宽度不要超过600px,否则访问者想打印页面时会很恼火。
9、保证录入页面和主页在800px宽、600px高的范围内。
10、不要在网页用宋体,这样显得很死板。
设计的过程:
1、确立一个中心点(你希望用户首先看见什么)
2、将信息按逻辑分组
3、建立并维护明确的对齐
4、创建重复,可以使用粗字体、线、装饰符号或者某种空间布局
5、避免冲突(元素之间两两不完全相同),强调对比(元素之间两两完全不同)
6、暖色是趋进的,冷色是后退的,不建议用大幅度的暖色作为背景
Reading——The Non-Designer's Design Book的更多相关文章
- Altium Designer 15 --- Design PCB Frame by Rhinoceros
step 1: Draw a PCB shape and the main component placed in the PCB. The drawing sheet should be in th ...
- java 并发官方教程
http://docs.oracle.com/javase/tutorial/essential/concurrency/index.html Concurrency Computer users t ...
- Devexpress VCL Build v2013 vol 14.1.3 发布
我修,我修,修修修. New Major Features in 14.1 What's New in VCL Products 14.1 Breaking Changes To learn abou ...
- 行为驱动开发iOS <收藏>
前段时间在design+code购买了一个学习iOS设计和编码在线课程,使用Sketch设计App,然后使用Swift语言实现Designer News客户端.作者Meng To已经开源到Github ...
- Javascript基础回顾 之(三) 面向对象
本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...
- Indy FTP 警告:Only one TIdAntiFreeze can be active in an application
> Should I use a AntiFreeze component on every form I have a TIdTCPClient > component? Or is ...
- 【翻译二十三】java-并发程序之随机数和参考资料与问题(本系列完)
Concurrent Random Numbers In JDK 7, java.util.concurrent includes a convenience class, ThreadLocalRa ...
- Code Simplicity–The Science of Software Development 书摘
Chapter1 Introduction That is the art and talent involved in programming—reducing complexity to simp ...
- Java 设计模式学习总结(上)
在编写和维护公司的现有代码的时候,我经常思考的问题是:怎样的系统算一个好的系统?如何设计具有扩展.可维护.复用的系统,它能最大限度的应对产品经理不断变化的需求.答案似乎是:设计模式. Remember ...
- Cortex-M3 Context Switching
http://www.embedded.com/design/embedded/4231326/Taking-advantage-of-the-Cortex-M3-s-pre-emptive-cont ...
随机推荐
- ①HttpURLConnection通过报文提交
在进行短信发送的接口,因厂家不同,有的厂家会采用报文的格式进行短信请求的发送与接收.本文主要介绍利用HttpURLConnection进行短信报文的请求与响应. 一般的url请求分为两种,一种是GET ...
- Jython引用Java类
Ubuntu下如下指令安装Jython:$ sudo apt-get install jython下面的指令用于查看Jython版本:$ jython --version下面的代码是一个简单的Java ...
- jinja2的一些用法
1.split用法以及乘法运算 {% set user_list=l.users.split(',') %} <tr> <td>{{ l.name }}</td> ...
- sed 相关
sed中,a命令是指在匹配的位置后面插入新的内容. c命令是说将在匹配模式空间的指定行用新文本加以替代.
- Python3 的urllib实例
在Python3中合并了 urllib 和 urllib2, 统一命名为 urllib 了,我觉得这样更加合理了.让我们可以像读取本地文件一样读取WEB上的数据.封装了一个类,供以后方便使用吧!并附带 ...
- Xdebug日志文件不显示
Xdebug是一个很强大的调试php的软件,安装也很简单. 1.php_xdebug.dll 放入php目录下的ext文件中 2.php.ini中开启 [Xdebug] extension = &qu ...
- 微信扫码支付PHP接入总结
微信扫码支付分为两种模式, 模式一比较复杂,需要公众号配置回调地址. 模式二比较简单,只需要在代码中配置回调地址就可以了. 我这次使用的是模式二. 需要配置参数, const APPID = 'xxx ...
- tomcat7.0在centos7下中文乱码问题解决汇总
1. 系统级的中文设置 Centos7跟之前的6和5安装的中文字符命令都不一样 [root@iZ25bdzgev8Z ~]# locale #查看当前系统的语言环境 [root@iZ25bdzgev8 ...
- php各版本编译好的扩展模块下载地址
php各版本[,x86/64 v9/v11/v14 nts/ts]编译好的扩展模块下载地址: https://windows.php.net/downloads/pecl/releases/ ht ...
- Pandas统计计算和描述
Pandas统计计算和描述 示例代码: import numpy as np import pandas as pd df_obj = pd.DataFrame(np.random.randn(5,4 ...