从下拉菜单设计细节看Amazon对用户体验的把握,商品分类下拉菜单
2013-03-29 17:14
555 查看
转载:http://www.csdn.net/article/2013-03-07/2814390-breaking-down-amazons-mega-dropdown
Amazon网站分类导航的下拉菜单被使用得非常频繁,但你有没有注意过它的反应非常迅速?
当然,这在技术上并非难题,但是大多数网站下拉菜单显示子菜单有一定的延迟,这比如老版的可汗学院网站:
注意到延迟没有?这样做并非没有缘由,若不如此,斜着移动鼠标时子菜单就会消失,因此你只能小心翼翼地平移鼠标指针,非常影响用户体验:
也许你会感到疑惑,在Amazon上购物时并没有遇到这样不愉快的体验啊!这正是其设计的睿智之处:
你将鼠标光标从主菜单移向子菜单的时候,图中三角形区域会停止事件判定,很高明的解决办法?
如果你很Geek,可以自己实现这一想法,或者你不想重复发明轮子,可汗学院的工程师Ben Kamens已经开发出了这样的jQuery插件——jQuery-main-aim(MIT协议),可以直接拿来使用。下面是可汗学院使用了该插件之后的效果:
从下拉菜单设计细节看Amazon对用户体验的把握
摘要:作为世界上最大的B2C电子商务公司,Amazon用户体验设计上一直有其独到之处,最知名的莫过于“一键下单”专利,连苹果都没忍住,花钱购买了该专利的使用权。除此之外,其分类导航的下拉菜单设计也非常值得学习,看本文为你解读。
Amazon网站分类导航的下拉菜单被使用得非常频繁,但你有没有注意过它的反应非常迅速?当然,这在技术上并非难题,但是大多数网站下拉菜单显示子菜单有一定的延迟,这比如老版的可汗学院网站:
注意到延迟没有?这样做并非没有缘由,若不如此,斜着移动鼠标时子菜单就会消失,因此你只能小心翼翼地平移鼠标指针,非常影响用户体验:
也许你会感到疑惑,在Amazon上购物时并没有遇到这样不愉快的体验啊!这正是其设计的睿智之处:
你将鼠标光标从主菜单移向子菜单的时候,图中三角形区域会停止事件判定,很高明的解决办法?
如果你很Geek,可以自己实现这一想法,或者你不想重复发明轮子,可汗学院的工程师Ben Kamens已经开发出了这样的jQuery插件——jQuery-main-aim(MIT协议),可以直接拿来使用。下面是可汗学院使用了该插件之后的效果:
相关文章推荐
- 从下拉菜单设计细节看Amazon对用户体验的把握
- 从下拉菜单设计细节看Amazon对用户体验的把握
- 从下拉菜单设计细节看Amazon对用户体验的把握
- 从下拉菜单设计细节看Amazon对用户体验的把握
- 从下拉菜单设计细节看Amazon对用户体验的把握
- 用户体验收录(从下拉菜单设计细节看Amazon对用户体验的把握)(转)
- 从下拉菜单设计细节看Amazon对用户体验的把握
- 从下拉菜单设计细节看Amazon对用户体验的把握
- 分析门户网站文章的分页设计 从细节看用户体验
- [转]大型社区设计:提高用户体验的10个细节
- 设计用户体验时要把握的“平衡”
- 做好这4个细节设计,让你的移动APP 用户体验脱颖而出
- 大型社区设计:提高用户体验的10个细节
- 大型社区设计:提高用户体验的10个细节
- 大型社区设计:提高用户体验的10个细节
- 牛腩购物14:商品相关表的设计 后台增加用户管理 Eval高级应用 商品类别无限分类,外键的建立,repeater嵌套repeater
- Windows Phone界面设计中的细节鉴析- [用户体验]
- 设计用户体验时要把握的“平衡”
- 大型社区设计:提高用户体验的10个细节
- 【前端设计】网站用户体验的五大分类和76个要素