这是一系列自由的随想,记录下脑海里闪过的灵感,生活中的设计思考,日常的素材收集等有助于形成灵感库的内容。

 

 

设计随想 第1期:公告|蚂蚁森林|新手指引

 

关于“公告”的案例收集

 
背景:
4月4日全国为深切哀悼在抗击新冠肺炎疫情斗争牺牲烈士和逝世同胞。手游都强制停止1天,这一突发要求,发现有两个游戏公告做得比较好。

1、《和平精英》在4月3日23:00提前限制登录,避免用户玩到一半被强制退出。

2、《剑与远征》提供有倒计时的公告,明确告知用户恢复时间,有助于缓解用户等待过程的焦虑。

 

 

关于“新手指引”的案例收集

 
飞书以模拟对话的形式来设计新手引导,同时该对话的形式跟飞书本身的聊天功能相近,可以让用户更快速了解产品功能。

 

 

蚂蚁森林上线“放话”新功能

 
支付宝的蚂蚁森林新上线“放话”新功能。用户可以自定义文字或表情,当其他用户来偷能量时,会自动展示对应的内容。

 

 

设计随想 第2期:功能入口|列表设计|调研引导

 

关于“功能入口”的案例收集

 
大众点评的功能入口展示更新了。新版本聚焦到核心功能上,提升了功能的查找效率。

【原版本】
左右滑动切换功能入口的展示面积,用线框图标弱化展示非热门功能。

原版本效果如下:

【新版本】
延续左右滑动切换的方式,首屏仅保留核心功能,非核心功能用线框图标展示。
滑动切换后用页面形式展示全部功能,并做更详细的功能分类设计。

新版本效果如下:

 

 

疫情页面引发的“列表设计”思考

 
案例来自腾讯新闻疫情页面。

关于在空间有限的情况下,列表设计思考:
1. 可以用展开/收起的交互形式。
2. 展开前,仅展示核心内容或最新内容。
3. 展开后,可以用无序的列表符号分割内容。
4. 展开后,内容格式要统一。
5. 展开后,关键内容可强化展示,对于关键内容的定义全局要保持一致。

 

 

关于“调研指引”的几种形式

 
【盒马】
将调研内容直接融入到评价页。

【支付宝】
将调研内容通过运营包装后,融入支付结果页。

【京东到家】
在订单完成后,以浮层的形式,引导用户参与调研。

 

 

设计随想 第3期:阅读进度条|添加到Siri|方案决策

 

关于“阅读进度条”的案例收集

 

 

案例一:图书

 
iOS自带的图书App提供了“连续滚动”和“左右翻页”两种阅读模式,两种模式下阅读进度条有所差异。

【连续滚动模式】

点击页面唤起菜单后,直接在页面右侧展示进度条,用户可以垂直拖动进度条,快速翻阅书籍。

在翻页时,页面底部会临时展示对应的页码以及章节名称。

停止翻页后,底部菜单提供“返回第N页”的操作入口。

【左右翻页模式】

进度条的位置在页面底部,用户可以水平拖动进度条,快速翻阅书籍。

提供的页码辅助信息和撤销返回操作,与连续滚动模式保持一致。

 

案例二:Kindle

 
Kindle也提供了“连续滚动”和“左右翻页”两种阅读模式,同时设计了对应的进度条调整功能。

【连续滚动模式】

基础操作与iOS自带的图书App一致,在连续滚动的模式下,都以垂直拖动的形式调整进度条。

在细节上,Kindle的拖动触点做了强化处理,操作起来更精准一些。同时“返回至N”的回退功能与进度条结合在一起,视觉上更直观。

【左右翻页模式】

Kindle在左右翻页模式下,不仅提供了水平拖动的进度条交互形式。还提供了可视化的页面内容预览,让用户可以直观查阅某个页面/进度下的页面内容。

回退功能也做了更抢眼的展示形式,让用户可以快速在不同页码下查阅书籍内容。

 

案例二:微信读书

 
微信读书虽然提供了“连续滚动”和“左右翻页”两种阅读模式,但在阅读进度条的功能设计上无差异化设计。

仅提供水平拖动的进度条交互形式。细节上当拖动进度条时,会在原位置留下“残影”。点击“残影”小圆点可以快速回退原来的页码。

 

小结:

 
iOS自带的图书App和Kindle都为用户提供了不同模式下的阅读进度条交互形式。

因为连续滚动模式用户需要上下滑动页面,实现翻页功能。所以在该模式下,提供垂直拖动的进度条是最符合用户理解和操作的方案。

不同平台的功能设计,都挺符合背后的产品定位。

iOS自带的图书App作为系统默认提供的阅读软件,以通用性为主,设计方案整体偏向中性风格,而且功能操作以文字形式为主,适应不同语言的翻译展示需求。

Kindle作为一款专业的阅读软件,在左右翻页模式下提供了页面快速预览等扩展功能,针对阅读需求较大的用户群体,提升了查阅效果效率。

微信读书在阅读领域算是新秀,连续滚动模式也是近年跟随竞品变化而提供的,但作为一款互联网公司推出的产品,在快速迭代上有天生的优势。

近期更新还提供了“自动阅读”的功能,详细在未来,微信读书也会为连续滚动模式提供差异化的阅读进度条设计。

 

 

关于“添加到Siri”的案例收集

 
随着语音交互的发展,iOS也提供了“添加到Siri”的功能接口。通过配置后,用户可以通过Siri语音控制应用完成某项操作。

如图为百度贴吧案例示意:

 

 

遇到设计方案无法决策怎么办?

 
当团队无法决策选择A方案或B方案时,一般会通过A/B Test、用户访谈等用研方法来辅助决策。

近日高德地图更新版本后,首次进入App时,就让用户在两种不同框架中自由选择。

直接升级首页框架很容易引起用户不习惯,因此高德地图提供不同框架给用户选择。同时默认方案保持原来的框架,让忽视页面内容直接进入App的用户可以“无感”继续使用。

 

 

最后,是一个谜题
 
支付宝近期更新后,在“全部应用”页面,提供了应用的收起和展示功能。

当收起后,页面并无额外的内容展示,同时大量的空白,在视觉感受上就像加载失败一样。

这是一个谜题,至今还想不懂该功能的设计思路。

也许是个Bug?也许该页面很快就要改版了?