微信6.6.7的浮窗设计分析

相信大家一定都有在阅读微信公众号文章时来微信消息的经历,此时只能面临着两个选择:

选择继续看文章的你可说是意志力非常坚定了!

可是你就真的没有一点对于“到底是谁发来消息”的好奇吗?真的能好好阅读文章吗?


退出文章页面查看信息这可能是大多数人的选择了,毕竟求生欲强。

不过回复完信息后,还要努力想一想刚才看的是哪个公众号的哪篇文章?恐怕很多人就此放弃阅读了。

而微信官方千呼万唤始出来的解决方法大家应该都知道了:可以将文章页面缩小成圆形浮窗,随时可以点击恢复阅读。

这样的解决方案你满意吗?

下面我从价值、可用性、适用性、合意性几个方面来说一下自己的体验。


一、价值:这个设计对于用户而言是否有价值?

答案是肯定的。先不论方式是否巧妙,浮窗设计确实能解决文章开篇时我说到的痛点。同时这个功能还催生了其他的用法,产生了新的价值:边聊天边查资料/搜索/写文章。

不过被许多iOS用户诟病已久的“阅读过程中无法得知新消息内容”的问题仍然没有解决。如果你不打开声音和震动,可能根本不知道有新消息来。

在Android版本的微信中,新消息会像普通通知一样出现在顶部。

iOS的版本看来是阅读文章的重要级别优先于处理信息。不过好处是不会打扰你阅读文章。毕竟对于大多数专注力缺失的现代人来说,弹通知的方式会大大减少你看完一篇文章的概率。


二、可用性:用户完成任务是否容易?

这个功能的主要任务可以概括为:处理完信息后继续阅读文章。

首先要说到微信提供了两个方法来将文章缩放为悬浮窗:

1.点击文章页面右上角的点点点,再点击“浮窗”按钮


2.向右滑动页面并拖拽到页面右下角的扇形按钮


在处理完新信息后,用户需要返回阅读,此时只要点击界面上那个显而易见的悬浮球即可。

当然,之前的阅读进度微信也好好的保留着。正因如此方便,才能诞生出上一章提到的新的使用价值。

然后对于我这种无法忍受界面上有任何遮挡的人来说,在阅读后一定会把浮窗关掉。

关掉的方法也有两种:

1通过文章页面右上角的更多进入菜单,此时“悬浮”按钮变成了取消悬浮,点击即可。


2.拖拽悬浮球


这里的删除方法看似简单,其实相当于用户在退出阅读后还需要另外增加一个删除的操作,易用性不高。

这个交互可以有两个优化方案:

1.如用户浏览完这篇文章并退出,则自动关闭浮窗(鼓励完整阅读)

2.在右滑退出(浮窗)文章时,右下角出现取消浮窗的按钮(和拖拽时出现的样式统一)。

下图是我P过的示意图



三、适应性:用户是否能很快顺利使用这个功能?

微信并没有对这个新功能进行引导。

但假设你并不知道这个功能,你在右滑退出文章页面时,就会发现右下角多了个奇怪的扇形。

你可能不知道那是什么意思,不过你猜你会不会将手指移到上面试一试?


对于习惯左手握持手机的我来说,浮窗按钮恰好在我返回时很容易够着的位置,相比平时只多了一点移动距离,增加的操作成本可以忽略不计,可以很快适应。但对于屏幕较大的手机,可能无法够着。


至于通过页面右上角更多按钮进入菜单再点击浮窗按钮的方式,据我大胆猜测,是为了平时习惯在退出文章时点击“返回”(现在是关闭按钮)而不是向右滑动的人(无法在这一环节注意到新功能)。

他们很可能是不习惯拖拽操作的中老年人,热爱分享的他们在打算把一篇精彩文章发送给自己的儿女的时候,也许会注意到分享操作下面多了个“浮窗”的按钮。


四:合意性:界面元素是否美观,体验是否有趣?

这个功能的相关设计和微信的整体基调吻合,比较中性。

要挑毛病的话,个人认为点击浮窗放大到文章的动效不太舒服。

由于最后出现的东西最能引起注意,所以我每次视线都停留在页面四个圆角呼的变成直角的生硬转折。


并且圆形遮罩变成方形遮罩的方式让我想到Material Design,在iOS看到有些违和感。

下图是16年我给一个手机OS做的概念动效,同样也是从圆扩散为方,不过由于圆更早的变成方形,所以最后收尾时不会太突兀。不过开发实现成本较高,可能有技术壁垒。


再说说音效。

嗯?这个功能还有音效的吗。嗯,有的哦。

在文章缩回浮窗时有个像是久远年代里鼠标点击的音效,但在浮窗放大时却没有。

我不太清楚这么设计的原因,我一开始以为是环境音,然后以为是个bug,因为那个声音很小而且和缩回的动效感觉没有关联性。如果不是个bug,如果没有更好的音效选择,个人认为不如不加。

另外还有个细节是:公众号文章的悬浮窗如果放置时间过长,四周的黑圈会变成红色。这个用意我也不太明白。难道是在提醒用户赶快看完文章?


以上是我对微信这个新功能的体验,有不同观点或者不正确的地方,欢迎共同探讨~

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 219,110评论 6 508
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,443评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 165,474评论 0 356
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,881评论 1 295
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,902评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,698评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,418评论 3 419
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,332评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,796评论 1 316
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,968评论 3 337
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,110评论 1 351
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,792评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,455评论 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,003评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,130评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,348评论 3 373
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,047评论 2 355

推荐阅读更多精彩内容