文档章节

导航设计趋势!关于图标式导航的改进

王尘宇
 王尘宇
发布于 2017/09/07 00:05
字数 433
阅读 1
收藏 0

图标式导航的案例

这是 YouTube 的图标式导航(移动版): 为导航瘦身!关于图标式导航的改进 这是 Squarespace的图标式导航: 为导航瘦身!关于图标式导航的改进 AWARD的图标式导航不拘一格: 为导航瘦身!关于图标式导航的改进

问题所在

问题在于,点击图标式导航之后,图标本身没有任何变化。也就是说: 操作缺乏反馈为导航瘦身!关于图标式导航的改进 按钮的状态不同,样式也不同,这样才能有效引导用户。 为导航瘦身!关于图标式导航的改进 我们拿开关来举例。开关也是一种按钮,一般有两种情况:   1 打开灯; 2 关闭灯;   所以说,图标式导航的操作缺乏反馈。点击图标能实现两种功能:展示导航菜单、关闭/隐藏导航菜单。那么图标也应该有两种外观以做区分。

解决方案: 图标转换

可以采用这种方法来提供更明显的视觉线索,从而更好的引导用户操作。 这里有一个叫做 Navicon Transformicons 的演示便很棒使用了 SCSS 以及jQuery技术,其实技术上也不复杂,你若有心自己也能写出来。 为导航瘦身!关于图标式导航的改进 为导航瘦身!关于图标式导航的改进 好处便在于:   § 提供用户视觉线索; § 图标更具语义,一种图标,一种状态; § 优秀的动效转换能够吸引用户注意,让用户迅速找到导航菜单。   对比一下,更有说服力,我用这种办法对第案例3进行了改进:   更好的指引效果,其实不仅可以改变图标形状,改变图标颜色不是也可以吗?这里就不多说了,给大家一点想象的空间。 设计少不了思考,希望大家有所收获。     原文地址: http://designinstruct.com/web-design/navicon-transformicons/

© 著作权归作者所有

共有 人打赏支持
王尘宇
粉丝 1
博文 450
码字总数 469557
作品 0
西安
私信 提问
20个2013年最值得关注的网页设计趋势

日期:2013-1-29 来源:GBin1.com 在过去的一年中,我们都看到了网页设计趋势在日益增长。或许有些朋友还记得我早些时候的一些文章关于网页设计,有兴趣的可以点击来查看,现在我们可以看到其...

gbin1
2013/01/29
6.5K
29
WordPress 安卓应用 4.1 版本发布

6月中旬,WordPress发布了WordPress for Android 4.1版本,该版本重新设计了界面,告别了传统的汉堡按钮式导航菜单,换成了4个标签页进行导航,更加方便易用。目前该版本已经可以从Google市场...

oschina
2015/07/03
1K
4
CSS:响应式下的折叠菜单(条纹式)

原文:CSS: Responsive Navigation Menu 译文:CSS:响应式导航菜单 译者:dwqs 写在之前,关于如何制作响应式的下拉菜单:响应式下的下拉菜单 之前,我写了一篇关于怎么制作响应式的移动导航...

dwqs
2014/12/31
0
0
交互设计的职能:交互设计师具体做什么

Ⅰ、 先了解一下交互设计的基本概念: 交互设计是一种目标导向设计,所有的工作内容都是在围绕着用户行为去设计的。交互设计师通过设计用户的行为,让用户更方便更有效率的通过产品去完成自己...

Amamatthew
2014/09/12
0
0
bootstrap3教程

Bootstrap是Twitter推出的一个开源的用于前端开发的工具包。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。Bootstrap提供了优雅的HTML和CSS规范,它即是由动态...

harries
2015/09/24
199
0

没有更多内容

加载失败,请刷新页面

加载更多

mybatis学习(1)

JDBC连接方式: 1.底层没有使用连接池,操作数据库需要频繁的创建和关闭连接,消耗资源。 2.写原生的JDBC代码在JAVA中,一旦需要修改SQL的话(比如表增加字段),JAVA需要整体重新编译,不利...

杨健-YJ
17分钟前
0
0
怎么组织文档

可以从以下几个方面考虑组织文档: ☐ 各种分支的界面截图和对应的类及文件 ☐ 框架或类图 ☐ 流程图 ☐ 时序图 ☐ 注意事项

-___-
28分钟前
1
0
分布式之数据库和缓存双写一致性方案解析

引言 为什么写这篇文章? 首先,缓存由于其高并发和高性能的特性,已经在项目中被广泛使用。在读取缓存方面,大家没啥疑问,都是按照下图的流程来进行业务操作。 但是在更新缓存方面,对于更...

别打我会飞
30分钟前
5
0
我的oracle11G,12c OCM之路

ocm认证感悟 ---------------------- 距离拿到ocm证书已经过了1年的时间,当初拿到证书的心情到现在还记得。其实在每个DBA心里都有一个成为强者的梦想,需要被认可,我也一样。我干过开发,做...

hnairdb
31分钟前
1
1
手动部署kubernetes集群(1.13.1最新版)

一、机器规划 使用五台机子部署k8s集群,规划如下: master节点3台(同时也是etcd节点) node节点2台 ip分配如下: ip:192.168.10.101,主机名:k8s-etcd01 ip:192.168.10.102,主机名:k8s...

人在艹木中
36分钟前
28
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部