b站播放界面下方设置声音、画面、播放模式等的小图标的hover状态,都有可爱的微交互小动画来反馈当前的操作。虽然都是不复杂的小动效,比如调节音量小喇叭图标会有声波震动,宽屏模式图标会有形象的拉伸效果等等,但这些小心思的加入让发生交互的过程立马变得生动有趣起来。「优设」和「优优网」也有类似的hover交互小彩蛋,大家有发现吗?
Same是一款主打年轻化的兴趣社交产品,它的web端官网简直是画风清奇,萌点满满。Same的首页放眼看去除了logo一个字符都没有,满屏的图标信息让你仿佛置身于火星文的世界。但当你把鼠标hover上去,会开启一个新世界(icon都变成文字了)。
在电脑端打开小电视家的网页,可以看见首页右侧搜索栏的下方每次刷新都会显示不同样式的小动图。将鼠标移上去,还会显示小动图的含义。点击动图,就可以直接到达动图相关的站内搜索内容了。
打开「淘票票」的网站浏览影片介绍页面,你会看到页面右上角有一个模拟关灯拉绳的「切换影片」按钮。当鼠标移动到拉绳上面,会出现拉绳下拉的微交互,点击则会切换到所有影片浏览的界面。这很容易让人联想到影院熄灯影片开始或者亮灯散场的场景。
drygital设计工作室的网站有着个性又炫酷的视觉与交互效果。团队展示界面的hover效果,就让人意想不到眼前一亮:当鼠标的光标移到单个成员的半身像时,原本正襟危坐的照片会变成另一张展示该成员个性或喜好的搞怪照片。原照片展示了团队成员在工作中严谨专业的一面,而hover效果呈现的图片则展示了成员们私下生活里幽默有趣个性鲜明的另一面。