本节简介:实例演示如何将文字的层级关系梳理得更加清晰,以及按钮在层级关系中的作用。
本节课同学们做的笔记 点击播放按钮可自动定位到对应时间进行播放
文字重要与次要区分开 再分别排版处理 细节深入刻画(加 图形 英文字母 间隔线 图标 按钮 色彩 字体大小样式)
将文字图像化: 文字放在图形上。按钮: 图形+字体(前加小图标) (实心 空心 ) +颜色 提高对比度 根据内容信息: 体现颜色深浅 对比关系 差异化
文字层级区分: 文字大小 字体 颜色 材质(体现层级关系: 重要级别从上到下 颜色从深到浅)
查看详情一般用大于号,要挑不同的字体来调整大于号的型美,最好是大于号宽一些,90度角
网页中除了色块按钮,还经常用到框形按钮,颜色比较深的按钮比如:用户登入,颜色浅的按钮如:辅助文案
查看详情,旁边可以直接加小图标,更突出查看详情的文案,大于号小于号不同字体角度不同,做好使90°的角,更美观
在原来的基础上加一个线条,具有分割效果,更加直观的让信息突出
弱化说明性的文字,让它跟主标题进行对比,层次更分明
引入色彩元素,标题和图标整体变色,使整体效果更具设计感
文字的层级关系可以从以下几点来区分,大小粗细、材质、色彩深浅、字体
按钮可以根据重要级别设计,带颜色、颜色深浅、黑白灰、色块、线框、线框粗细、文字大小、字体、材质等等