这是一篇关于交互的备忘录,我尽力把每天看到的优秀体验的设计细节更新进来,跟大家一起分享探讨,大家如果有发现好的设计,一起留言交流吧!努力把它创建成所有人通用的交互备忘录,每日更新,欢迎加收藏
好的设计有一个共通点——留白
好的文章也应该如此
首页 滑动后2015.9.24
2015.6.29
1.Archiduchesse wap页面
这个wap页面android浏览器的导航背景色与产品颜色保持一致
2.想去网的交互小细节
[1]外链登录页面与弹框登录页保持一样的框架布局,细节补充,让两种都很高频的页面有相同的操作路径
登录外链页面[2]首页的二级导航上将最新上架的产品放在最左边,用户可以容易关注到,同时以自然语言描述了新产品数量,吸引用户点进去查看
首页二级导航[3]很多瀑布流网站或屏数较多的页面右侧都有回到顶部的按钮,这里用了一个弹簧动效很有心意
回到顶部动效后 回到顶部动效前[4]用户未登录时,将“我的”等与个人账户相关的页签放出来,用户尝试点击就以弹框引导用户登录
[5] 上滑后将主导航位隐藏,让用户更关注此时的二级导航“我的”“发现”
前 后2015.6.25开篇
1.百度百科的导航
百度百科的导航通过float层将二级导航全部展示出来,对于以多维度分类内容时,可以采用这种形式,方便用户快速定位适合自己的页签
2.ebay deals
ebay deals的导航以汉堡包展开侧边导航,使内容区排列空间增大,首屏内容展示更多,排列更加灵活
3.ebay注册引导
这里注册引导前加上4个词短语,高效直达产品价值,冲击用户需求,且紧跟输入框,没有花哨的视觉干扰。
4.页面名称上的引流
每一个页面的命名是交互设计师容易忽略的一块部分,但在用户体验的感知中也是不可忽略的细节,好的名字能够给用户带来信赖感,增加黏度
5.gmail发送邮件
gmail新建邮件的输入框尺寸较小,当内容超过当前区域时,会自动拉高,且不会超过邮箱列表高度。
邮件未输入内容时 邮件输入内容超过当前框架时自动拉高6.[单页设计]DISQUS
这是DISQUS的功能介绍页面,首屏为主要功能区,闪烁关键点联动放大功能介绍;点击后或关闭文字介绍回到首页;上滑页面,主导航与logo注册区撞击,并展示产品使用步骤;继续上滑,与导航页签联动,方便定位。
DISQUS首屏 导航像纸片一样,与google的新视觉一致 导航联动效果7 Youtube加载动画
youtube app加载刷新时,会以不同形态的喵扒拉在那——我们平时的加载动画也可以通过动画随机的形式;让加载更有趣味性,缓解用户的不满情绪
youtube加载喵
网友评论