页面设计四大基本原则

简介:

设计的四大基本原则

  • 对比:避免页面上元素太过相似。
  • 重复:设计中的视觉要素在整个作品中重复出现。
  • 对齐:对齐元素能建立清晰的外观。
  • 亲密性:相关的项应该靠近,归组在一起。

亲密性

亲密性是指:将相关的项组织在一起,这样相关的项被看作为一个整体。

如果多个项之间有很近的亲密性,它们就会成为一个视觉单元,而不是多个鼓励的元素。就像实际生活中一样,亲密性意味着存在关联。

要有意识的注意你是怎样阅读的,你的视线怎样移动,从哪里开始到哪里结束;沿着怎样的路径。亲密性的根本目的是视线组织性。

对齐

任何元素都不能在页面上任意安放。每一项都应当与页面上的某个内容存在某种视觉联系。

要坚持一个原则:页面上只使用一种文本对齐,所有文本都左对齐,或右对齐,或居中对齐。

在设计中,统一性是很重要的,要让页面上的所有元素看上去统一、有联系而且彼此相关,需要在各个单独的元素之间攒在某种视觉纽带。

要避免在页面上混合多种文本对齐方式(也就是说,不要将某些文本居中,而另外一些文本右对齐)。另外,要避免居中对齐。

重复

设计的某些方面需要在整个作品中重复。重复颜元素可能是一种粗字体、一条粗线,某个项目符号、颜色、设计要素等。

重复最大的好处是使各项看起来同属一组,虽然元素看起开都不完全相同。一旦建立一组关键的重复项,就可以变换这些项并仍可保持一致的外观。

重复的目的就是统一,并增强视觉效果。

对比

对比是为页面增加视觉效果的最有效的途径,要想实现有效的对比,对比就必须强烈。

如果两个项不完全相同,就应当使之不同,而且应当是截然不同。

在页面上增加对比能吸引人的眼球。

可以通过字体选择、线宽、颜色、形状、大小、空间等等来增加对比。

【参考资料】
写给大家看的设计书

目录
相关文章
|
算法 计算机视觉 Python
python利用opencv进行相机标定获取参数,并根据畸变参数修正图像附有全部代码(流畅无痛版)
该文章详细介绍了使用Python和OpenCV进行相机标定以获取畸变参数,并提供了修正图像畸变的全部代码,包括生成棋盘图、拍摄标定图像、标定过程和畸变矫正等步骤。
python利用opencv进行相机标定获取参数,并根据畸变参数修正图像附有全部代码(流畅无痛版)
|
安全 数据安全/隐私保护 Windows
数据安全的守护者:备份工具和恢复方法详解
数据安全的守护者:备份工具和恢复方法详解
470 6
|
9月前
|
人工智能 大数据 物联网
申报开启|2025年阿里云协同育人项目申报指南
阿里云启动2025年协同育人项目申报,支持高校教学内容和课程体系改革及实践基地建设。项目涵盖人工智能通识教育、AIGC设计等领域,提供资金、云计算资源和技术培训等支持。申报截止至2025年2月28日,面向全国本科高校教师,旨在深化产教融合,共育创新人才。详情及流程见官网。
|
11月前
|
数据处理 项目管理
进度一目了然,Excel和看板的神仙联动
在项目管理中,Excel擅长结构化信息记录,但直观展示项目进度稍显不足。结合板.栗.看.板.工具,可将Excel数据同步为任务卡片,清晰显示任务状态、完成时间、负责人和优先级,实现数据与看板的双向联动,提升团队协作效率。
进度一目了然,Excel和看板的神仙联动
|
缓存 数据库
共享锁和排他锁的使用场景
【10月更文挑战第16天】共享锁和排他锁是多进程和多线程环境中常用的同步机制,它们在不同的场景下发挥着重要作用。选择合适的锁类型取决于并发需求、数据一致性要求、性能考虑和资源竞争等因素。在实际应用中,需要根据具体情况仔细评估和选择合适的锁策略,以确保系统的正确性和性能。
|
机器学习/深度学习 人工智能 缓存
基于AIGC的自动化内容生成与应用
基于AIGC的自动化内容生成与应用
526 3
|
弹性计算 运维 数据安全/隐私保护
|
存储 网络协议 API
Qt 5——文件系统操作
Qt 5——文件系统操作
522 0
Qt 5——文件系统操作
|
存储 Web App开发 消息中间件
IM开发干货分享:浅谈IM系统中离线消息、历史消息的最佳实践
本文将基于IM消息系统的技术实践,分享关于离线消息和历史消息的正确理解,以及具体的技术配合和实践,希望能为你的离线消息和历史消息技术设计带来最佳实践灵感。
1275 0
IM开发干货分享:浅谈IM系统中离线消息、历史消息的最佳实践
|
SQL Java 数据库连接
Springboot 手动分页查询,分批批量插入数据
Springboot 手动分页查询,分批批量插入数据
960 0
Springboot 手动分页查询,分批批量插入数据