前端的UI设计与交互之色彩篇
一、颜色
Red
热情、警示
Green
成功、通过、安全
Blue
专业、科技
Pink
典雅、明快、女性
Orange
醒目、温暖
Purple
高雅、浪漫
Yellow
活力、提示
Cyan
清新、冷静、结构化
Grey
平稳、中性
二、色彩应用
1、品牌色的应用
品牌色是体现产品特性和传播理念最直观的视觉元素之一
2、中性色的应用
灰色作为中性色,它的使用有利于关键内容的衬托和功能的引导。这类色彩主要体现在导航框架、背景底色、描边、或次级操作等等。
3、功能色的应用
这类色彩起到传递功能信息、代表某种状态等作用。主要应用于消息通知、反馈提醒、表单校验这类场景中的成功、出错、失败、提醒、链接等状态。
blue链接说明色
green成功色
yellow警告色
red失败色
4、视觉层次
将品牌色赋予在重要信息或关键主动点上,并衬以大面积的中性色,可以让用户更聚焦到任务本身,从而提高任务的执行效率。
注:界面用色建议不超过三种(数据图表和图形类插画除外)。
5、色彩的易识别性
操作类的色彩搭配都应满足颜色对比值 3:1 的最低标准。
色彩对比值校验工具
前端的UI设计与交互之色彩篇的更多相关文章
- 前端的UI设计与交互之布局篇
布局是页面构成的前提,是后续展开交互和视觉设计的基础.设计者在选择布局之前,需要注意以下几点原则:明确用户在此场景中完成的主要任务和需获取的决策信息.明确决策信息和操作的优先级及内容特点,选择合理布局 ...
- 前端的UI设计与交互之文案篇
在界面中,我们需要通过对话的方式与用户产生共鸣.精准.清晰的语言会更容易让用户理解,合适的语气更容易让用户建立信任感.因此在界面设计时,文案也应当被重视. 在使用和书写文案时有以下几点需要注意:从用户 ...
- 前端的UI设计与交互之数据录入篇
数据录入是获取对象信息的重要交互方式,用户会频繁的增加.修改或删除信息.多种多样的文本录入和选择录入方式帮助用户更加清晰和高效的完成这项体验.设计者应当注意这几点:为初级用户/偶尔访问的用户提供简单易 ...
- 前端的UI设计与交互之字体篇
跨平台的字体设定,力求在各个操作系统下都有最佳展示效果.字体是界面设计中最重要的基本构成之一,用户通过文本来消化内容和完成工作,优雅的字体将大大提升用户的阅读体验及工作效率.在满足不同终端始终保持良好 ...
- 前端的UI设计与交互之图标篇
图标是具有指代意义的图形,也是一种标识.通过使用图标表达命令,强调状态,表示产品或类别.为了系统及跨平台之间图形认知保持一致, 图标在设计和使用时有以下两个原则点需要注意:简单的图形语言以及高辨识度. ...
- 前端的UI设计与交互之导航篇
在广义上,任何告知用户他在哪里,他能去什么地方以及如何到达那里的方式,都可以称之为导航.当设计者使用导航或者自定义一些导航结构时,请注意:尽可能提供标识.上下文线索,避免用户迷路:保持导航样式和行为一 ...
- 前端的UI设计与交互之设计原则篇
1.亲密性 a)纵向间距示例这三种规格分别为:8px(小号间距).16px(中号间距).24px(大号间距). b)在这三种规格不适用的情况下,可以通过加减『基础间距』的倍数,或者增加元素来拉开信息层 ...
- 前端的UI设计与交互之反馈示篇
为了帮助用户了解应用当前要做什么,也给用户的下一步行为做参考,以及了解操作后所产生的结果 ,当用户和系统需要交互时,使用不同的模式来反馈信息或结果.当设计者使用反馈或者自定义一些反馈时,请注意:为用户 ...
- 前端的UI设计与交互之数据展示篇
合适的数据展示方式可以帮助用户快速地定位和浏览数据,以及更高效得协同工作.在设计时有以下几点需要注意:依据信息的重要等级.操作频率和关联程度来编排展示的顺序.注意极端情况下的引导.如数据信息过长,内容 ...
随机推荐
- Perfect Pth Powers poj1730
Perfect Pth Powers Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 16383 Accepted: 37 ...
- bzoj1806 [Ioi2007]Miners矿工配餐
[bzoj1806][Ioi2007]Miners 矿工配餐 2014年7月10日1,7870 Description 现有两个煤矿,每个煤矿都雇用一组矿工.采煤工作很辛苦,所以矿工们需要良好饮食.每 ...
- Docker镜像加速
安装好Docker后接下来就是愉快的玩耍了,可是实际情况并不愉快 因为docker的默认镜像源在国外,鉴于国内特殊的网络原因访问起来往往很慢或者完全访问不了,幸好国内有类似的镜像源可以使用,我使用的是 ...
- ZOJ2150 Raising Modulo Numbers 快速幂
ZOJ2150 快速幂,但是用递归式的好像会栈溢出. #include<cstdio> #include<cstdlib> #include<iostream> # ...
- 51nod 1510 最小化序列 | DP 贪心
题目描述 现在有一个长度为n的数组A,另外还有一个整数k.数组下标从1开始. 现在你需要把数组的顺序重新排列一下使得下面这个的式子的值尽可能小. ∑|A[i]−A[i+k]| 特别的,你也可以不对数组 ...
- scala PartialFunction
1.orElse和andThen的区别 源码如下,区别很明显,orElse是并列的关系,而andThen是调用者的结果作为k的输入. trait PartialFunction[-A, +B] ext ...
- Android模拟器检测常用方法
在Android开发过程中,防作弊一直是老生常谈的问题,而模拟器的检测往往是防作弊中的重要一环,接下来有关于模拟器的检测方法,和大家进行一个简单的分享. 1.传统的检测方法. 传统的检测方法主要是对模 ...
- Java多线程——创建线程的两种方式
创建线程方式一:继承Thread类. 步骤:1,定义一个类继承Thread类.2,覆盖Thread类中的run方法.3,直接创建Thread的子类对象创建线程.4,调用start方法开启线程并调用线程 ...
- Windows 10新功能
Windows 10 中面向开发人员的新增功能 Windows 10 及新增的开发人员工具将提供新通用 Windows 平台支持的工具.功能和体验.在 Windows 10 上安装完工具和 SDK后, ...
- Linux 可运行进程 Runnable Process Definition
From : http://www.linfo.org/runnable_process.html 一个可运行的进程是指该进程的进程状态为TASK_RUNNING. 进程,也可被称为任务,是指一个程序 ...