产品体验日记—UI笔记【月刊】

北京/设计爱好者/5年前/270浏览
产品体验日记—UI笔记【月刊】
木子芝

不断学习,持续输出与总结。



01、闲鱼-鱼塘-最近访问

鱼塘页面左上角有一个最近访问按钮,可以让用户更迅速的找到经常访问的鱼塘,节省用户时间成本,缩短用户体验路径。

undefined

02、36氪-首页-快讯

这里最新快讯用红色文字显示,并且所有快讯的时间也提出来放在了标题左边,体现出APP的属性,比较看中时间,视觉上也更直观清晰,一目了然,方便用户浏览操作。

undefined

03、36氪-首页-关注

搜索更多主题,右边“开始吧”按钮文案设计更人性化,点击进入全部主题,可以直接选择感兴趣的主题,添加主题的按钮交互形式也更加醒目,设计上增加了弥散投影,提高了用户的点击频率。

undefined

04、微信读书-看一看中的已关注公众号文章

看一看里面的文章关联了用户关注的微信公众号文章,准确抓住了用户想看的内容,提升了关注度,增强与用户之间的粘性。

undefined05、微信读书-书城(摇一摇)

在书城的右上角有摇一摇功能,通过摇一摇,然后给用户推荐想看的书,该功能设计增强了与用户之间的互动性,其加载动画也很有趣味性。


06、微信读书-设置

在微信读书设置中有一个关闭看一看的文章推荐按钮,关闭之后,在看一看中仅显示推荐的书籍,使得用户更关注于选择想要看的好书。在用户角度看不会被别的文章所干扰,很贴心的设计。

undefined

07、微信读书-书架(私密阅读)

点击书架中的编辑,可以选择书籍设置为私密阅读,设置为私密阅读之后阅读记录将不会被公开,这个小功能的设计很好的保护了用户的隐私性,并增强阅读体验的好感度。

undefined

08、微信读书-首页(翻一翻)

微信读书更新之后新增了翻一翻功能,这种游戏式的交互设计,通过翻卡片来获得好书,激发用户的好奇心和探索未知的欲望,增强了与用户之间的互动性,非常值得借鉴学习。

undefined

09、知乎-首页右上角加号(发布)

点击右上角加号出现提问题页面,上滑出现卡片形式的问答,左滑是不感兴趣,右滑是稍后答,提升了与用户之间的互动性。这种大卡片和大按钮的设计使得页面更专注于内容,而右滑的手势更符合用户操作习惯,使得用户会下意识的右滑,从而提升用户作答率。

undefined

10、知乎-我的-回答问题(交互形式)

在我的页面回答问题板块中 卡片形式的设计和左右滑动的交互形式与首页中发布页面回答问题的设计形成统一性,从而加深用户记忆,培养用户操作习惯。

undefined

11、百度网盘-共享-网盘小飞机

在百度网盘APP中的共享页面左上角有一个“网盘小飞机”的功能,通过这种游戏的形式来分享文件,每次打中天空的飞机就可以看到别人分享的文件,每次弹出的文件内容不一样,这种游戏式的共享设计提高了与用户的互动性,并且十分有趣。

undefined

12、考拉海购-启动页

考拉海购的启动页每一页都融入了品牌元素,让用户潜移默化地加深品牌印象。

undefined

13、抖音-我的背景图裁剪

在我的页面修改背景图时,裁剪好图片会显示整个页面布局结构,相当于一个预览页面,最后确认效果之后点击完成就可以了。 这个小设计可以帮助用户减少反复修改的时间成本。

undefined

14、美团-定位

美团在切换定位的页面,热门城市加入了角标,标注当地的特色景点,从而提高该城市的点击率。上下滑动页面的时候屏幕中间会出现当前的类别,让用户更直观清晰的了解当前所处位置。

undefined

15、喜马拉雅-助眠解压

首页金刚区图标“助眠解压”采用了微动效设计突出此版块的功能,进入助眠解压页面后可以看到这一板块的slogan:“沉浸式助眠,把大自然搬到你的枕边”,非常具有亲和力。页面设计风格也十分极简,展示了主要功能,让用户真正在体验上感觉到放松,和slogan完美契合。

undefined

16、喜马拉雅-通知栏显示

在喜马拉雅选择好要听的文章之后返回手机桌面,会看到在通知栏有显示当前播放的内容标题,并且左右两边还有倒退和前进15秒的功能按钮,避免用户走神没听明白可以在当前页面直接倒退回去重新听,省去重新打开APP操作的时间。

undefined


17、哔哩哔哩-视频播放页面

在观看视频的时候,右下角会显示下一节的内容,点击之后可以看到视频目录,展示在页面的下方,横排展示,不影响当前播放页面,方便用户更清晰直观的了解视频内容。

undefined

18、大众点评-首页回到顶部

在大众点评首页有两个回到顶部按钮,tab栏首页图标在页面下滑的时候会变成回到顶部图标,在右上角也有一个回到顶部。由于用户视觉线一般在页面的中上游,所以在右上角也添加一个回到顶部按钮这样可以减少用户思考的时间,更快速的满足用户需求。

undefined

19、大众点评-加号(写点评)

点击tab栏中加号,进入写点评页面,为了使用户拍摄照片更方便,把相机横过来之后,页面的功能按钮文字也跟着横了过来,更方便用户进行操作。

undefined

20、饿了么-点餐提醒

在我的页面有个点餐提醒功能,点击进入该页面,会被头部的插画以及文案所吸引,“主人的胃,我来守护”这样情感化设计的文字会让用户感觉到十分亲切,体验感非常好。

undefined

21、TOPYS-启动页及首页

打开TOPYS启动页会看到十分可爱的四个拟人化的小图标,用来展示app的几个主要功能,让用户有个初步的了解,进入首页之后头部有个小卡片,采用了简笔画的卡通人物来吸引用户进一步了解整个app,建立用户认知。如果不需要了解可以随时关闭,很方便。

undefined

22、猫耳FM-tab栏交互

当开始播放音频的时候,tab栏的小猫会左右摇摆脑袋唱歌,停止播放的时候它就会躺着睡觉,这个小交互设计非常生动形象,很有趣味性。

undefined

23、猫耳FM-播放进度条

在播放页面的进度条上有一个小猫的脑袋,非常好的融入了品牌形象,加深用户的品牌印象。在进度条的下面还有一个投食的按钮,图标是小鱼,和小猫的形象相关联,点击会显示已投食,代表着给这个音频点赞。非常有趣的互动形式。

undefined


24、猫耳FM-启动音

这个启动音也算是猫耳FM-app的一个特色了,在我的页面点击启动音就可以选择自己喜欢的启动页形式,有不同的卡通形象和不同的音色,非常好玩,同时增强了与用户之间的互动性。

undefined

25、网易云音乐-分享方式

网易云音乐在歌词分享的时候可以选择多种方式:定制卡片、歌词视频、歌词图片、歌曲海报等,每种方式都可以自定义编辑,提高与用户的互动性,同时新颖的方式选择更能促进用户主动分享。

undefined

26、网易云音乐-驾驶模式

在音乐播放页面更多中有一个打开驾驶模式功能,打开之后界面只显示主要的几个功能,并且图标都很大,便于点击,这个小功能照顾到了很多开车的用户。

undefined

27、每日优鲜-空状态

有趣味的情感化设计会给用户带来非常好的体验感,降低用户烦躁心理,每日优鲜的空状态设计文案上用了拟人的语气,小插画上融入了品牌IP形象,从而加深用户的记忆。

undefined

28、哔哩哔哩-历史记录

哔哩哔哩的历史记录页面,看过的但是没关注的会在右边显示+关注,这样直接在本页面就可以完成关注,节省了用户路径,并且提高点击率。


undefined

29、鹅说-内容介绍

鹅说首页进去是每日推荐的知识卡片,左右滑动进行切换,点击进入内容简介,采用翻转效果会看到卡片背面的解说内容,并且右侧会显示内容相关的知识点,点击可以直接跳转到新的卡片去了解。

undefined

30、不背单词-全屏式设计

全屏式极简的设计风格让用户专注于内容本身,达到沉浸式学习体验。毛玻璃的使用使整个页面视觉上更加和谐,具有高级感。新手提示的文案和小头像也比较具有亲和力,用加油鼓励的语气引导用户。

2
Report
|
收藏
Share
相关推荐
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
双座丨品牌视觉设计
Homepage recommendation
相关收藏夹
【作品集】优秀作品鉴
【作品集】优秀作品鉴
【作品集】优秀作品鉴
【作品集】优秀作品鉴
精选收藏夹
作品收藏夹
IP形象及IP内容
IP形象及IP内容
IP形象及IP内容
IP形象及IP内容
精选收藏夹
作品收藏夹
品牌vi完整思路and呈现方式
品牌vi完整思路and呈现方式
品牌vi完整思路and呈现方式
品牌vi完整思路and呈现方式
精选收藏夹
作品收藏夹
餐饮案例
餐饮案例
餐饮案例
餐饮案例
精选收藏夹
作品收藏夹
拟人化
拟人化
拟人化
拟人化
精选收藏夹
作品收藏夹
C君精选-吉祥物设计
C君精选-吉祥物设计
C君精选-吉祥物设计
C君精选-吉祥物设计
精选收藏夹
作品收藏夹
大家都在看
Log in