《APP移动终端决胜之道视觉设计艺术》学习笔记
1.20-2.9
1.合理的层级化
2.信息的整合(短信收发件箱),信息的整合就像创建文件夹,可以将相关的东西放在一起,以便于使用者搜索与查找
3.(微信聊天界面)相比之下使用了对话框图形的界面,元素更加丰富,界面也更加美观,最重要的是,它能使不同的信息得到更加明显的区分,对话框图形就像把不同的专属空间给了不同的信息,以此来方便用户对于不同信息的识别。
4.(instgram滤镜界面),可视化设计,将抽象的东西具体化,带来了便捷与简单的用户体验,让用户有明显的点击与操控感
5.格式塔理论
格式塔理论都为视觉感知现象,其中接近性、相似性、共同命运与我们的视觉系统会有着给对象进行分组来感知事物的倾向相关;与我们的视觉系统会通过解析模糊或者以查漏补缺的方式来感知整体事物的倾向相关
(1)接近性原理:利用接近性原理,调整各部分物件远近的摆放距离,使各板块形成视觉上的组(利用底色区分板块,不能过分使用,利用线条区分板块,不能过粗)
(2)相似性原理:用线或面(色块,即不同背景色)分隔,线面结合,在分隔两个东西时不要既用线又用面
(3)连续性原理:适当添加小图形,添加背景,添加标识符号与说明
(4)封闭性原理:封闭or非封闭
(5)简化对称性原理
(6)主体与背景原理
(7)共同命运
6.视觉优化
(1)经验影响感知
(2)环境影响感知
(3)目标与感知:我们的视觉感知会忽略与目标无关的信息,因此,主要信息与次要信息的明显程度(例如让次要信息以弹框的形式出现来引起注意)
(4)结构化与感知:结构化能使文字信息变得精简(将信息整理,例如将纯文字文本转成车次信息:出行时间:等等),图形化的添加能让信息表现得到进一步优化,另外,应该通过交互设计隐藏过多的界面信息,,并通过颜色与图标区分不同的信息、板块,且应该添加线条分隔空间;对于长串的数字可以采用特定符号或空格来分隔数字,除此之外,在进行移动UI视觉设计时,也可以将文字信息分隔,加入图形、改变文字颜色等等来提起人们对于文字的阅读兴趣,过分拥挤死板的文字会增添用户的阅读负担。
7.
(1)别让信息设计影响阅读:MV,MUSIC VIDEO;不要轻易改变已经建立的用户阅读习惯
(2)当界面中拥有过多的文字信息时,我们应该尝试着将文字信息浓缩或是分散在不同的用户界面中,而不是通过缩小,这是种会让用户产生阅读障碍的方式(过小的文字会使得用户很难注意到这些信息)
(3)注意文字信息的识别与清晰度:例如与背景的颜色对比(但是也应该注意不能用过于强烈的对比),同时背景也不应该过于花哨
(4)注意文字信息的对齐方式:在阅读文字信息过程中,我们的视线会自动回到与上行文字相同的水平位置,若使用居中或右对齐,这样的经验便会让我们看向错误的位置,因此我们需要慎用文字对齐的方式,尤其是分点的信息,不太适用于居中对齐
(5)将信息放在用户能看见的位置:推测用户的视线走向,将想要用户看到的东西移动到离视力的中心凹更近的地方
(6)利用图形元素增强用户的感知(红色和提示符号,如红色错误,绿色对勾等等)
(7)利用对比在区别中突出重点信息;使用便于用户识别的颜色(蓝-黄,红-绿,黑-白);色彩搭配中的深浅度、面积大小与远近关系;不要使用过于刺激的颜色搭配;注意与界面环境色彩的搭配
8.可操控性体验
(1)用户点击控件时,一般不很精准,许多次的点击都在控件按钮以外,因此我们可以扩大控件的感应区域与范围,并根据控件左右位置的不同,设计控件的感应范围应向左侧扩展或是向右侧扩展(对于左侧的控件偏右,对于右侧的控件偏左)
(2)不同的功能或对象操作越一致,对于用户的长期记忆而言便越轻松
(3)有头便有尾,我们需要考虑到用户很有可能会忘记扫尾的工作,应尽量加入能帮助或提醒用户进行收尾工作的元素
《APP移动终端决胜之道视觉设计艺术》学习笔记的更多相关文章
- js学习笔记:webpack基础入门(一)
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- PHP-自定义模板-学习笔记
1. 开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2. 整体架构图 ...
- PHP-会员登录与注册例子解析-学习笔记
1.开始 最近开始学习李炎恢老师的<PHP第二季度视频>中的“章节5:使用OOP注册会员”,做一个学习笔记,通过绘制基本页面流程和UML类图,来对加深理解. 2.基本页面流程 3.通过UM ...
- 2014年暑假c#学习笔记目录
2014年暑假c#学习笔记 一.C#编程基础 1. c#编程基础之枚举 2. c#编程基础之函数可变参数 3. c#编程基础之字符串基础 4. c#编程基础之字符串函数 5.c#编程基础之ref.ou ...
- JAVA GUI编程学习笔记目录
2014年暑假JAVA GUI编程学习笔记目录 1.JAVA之GUI编程概述 2.JAVA之GUI编程布局 3.JAVA之GUI编程Frame窗口 4.JAVA之GUI编程事件监听机制 5.JAVA之 ...
- seaJs学习笔记2 – seaJs组建库的使用
原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...
- CSS学习笔记
CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...
- HTML学习笔记
HTML学习笔记 2016年12月15日整理 Chapter1 URL(scheme://host.domain:port/path/filename) scheme: 定义因特网服务的类型,常见的为 ...
- DirectX Graphics Infrastructure(DXGI):最佳范例 学习笔记
今天要学习的这篇文章写的算是比较早的了,大概在DX11时代就写好了,当时龙书11版看得很潦草,并没有注意这篇文章,现在看12,觉得是跳不过去的一篇文章,地址如下: https://msdn.micro ...
- ucos实时操作系统学习笔记——任务间通信(消息)
ucos另一种任务间通信的机制是消息(mbox),个人感觉是它是queue中只有一个信息的特殊情况,从代码中可以很清楚的看到,因为之前有关于queue的学习笔记,所以一并讲一下mbox.为什么有了qu ...
随机推荐
- 常见的错误:FTP连接时出现“227 Entering Passive Mode”
FTP的主动模式(PORT Mode)及被动模式(Passive Mode) FTP的特殊性: 大多数的TCP服务是使用单个的连接,一般是客户向服务器的一个周知端口发起连接,然后使用这个连接进行通讯. ...
- 造一个轮子然后安装到pypi上
之前写了一个爬虫的包,主要是根据自己写爬虫的情况总结一下. 因为每次都要重复写一些代码,所以提炼出来,类似一个框架的样子吧. 开始是放在自己的项目里引用,但如果换了一个项目,就得重新拷一遍,很麻烦. ...
- Mac系统升级至OS X Mavericks后Genymotion出现的问题及解决方法
Apple的系统升级终于免费了,可开心满满地升级到OS X Mavericks后,Android模拟器之王Genymotion罢工了.遇到两个问题:1. Unable to load VirtualB ...
- SVN无法读取cruuent修复方法
解决方法:在网上百度和google了一大圈之后,终于得知是断电时current和txn-current文件没有写入当前最新版本号和最新版本的路径问题 当时非常抓狂,项目刷新一直为空. 1.先把curr ...
- lambda modern C++
Lambda expressions (since C++11) Syntax [ captures ] <tparams>(optional)(c++20) ( params ) s ...
- 由UI刷新谈到线程安全和Android单线程模型
1.为什么说invalidate()不能直接在线程中调用? Android提供了Invalidate方法实现界面刷新,但是Invalidate不能直接在非UI主线程中调用,因为他是违背了单线程模型:A ...
- Ubuntu 16.04 RTL8111/8168/8411 PCI Express Gigabit Ethernet Controller” 不能上网
来源:http://forum.ubuntu.org.cn/viewtopic.php?f=116&t=463646 1.执行如下命令 uname -a sudo lspci -knn sud ...
- Tomcat8-启动脚本分析
1. Tomcat也是一个java程序 最终的入口启动文件:org.apache.catalina.startup.Bootstrap 最后一条命令: start "Tomcat" ...
- JAR,WAR,EAR的使用与区别
WAR(Web Archive file)网络应用程序文件 是与平台无关的文件格式,它允许将许多文件组合成一个压缩文件.为 J2EE 应用程序创建的 JAR 文件是 EAR 文件(企业 JAR 文 ...
- Android6.0.1 移植:显示系统(一)--测试framebuffer
#include <stdio.h> #include <unistd.h> #include <sys/types.h> #include <sys/sta ...