日常工作中,有很多看似平凡的小细节,常被大家忽视,却影响着用户的真实体验。比如,前几天跟同事们针对产品设计中“+”功能所运用的场景、展开形式进行讨论,发现这是一个挺有意思的话题。

所以跟大家分享下,我的一些相关思考。

1. “+”的运用场景 

我们常见的产品中,采用“+”功能的场景,大致分为两种:a.(上传)内容选项;b.(聚合)快捷功能。

a.(上传)内容选项

根据“+”的直观表意,大致也能猜到它的运用跟“添加”、“上传”某个东西相关。比如:微博,点击“+”入口后,是选择所要上传的内容类型。(可以晒自己精修X小时后妈都认不出来的自拍、也可以晒逗比的小视频、或者老子就想搞一场直播)。

比如:下厨房左上角的“+”,点击后,是选择上传作品,或者创建菜谱的选项。

再比如:工具类产品:Google drive,dropbox、百度网盘、微云,点击“+”后,同样是选择上传不同文件的入口。

可以看出,这种情况下的“+”功能,多指“添加”、“上传”的含义,所承载的内容,是同一纬度下的不同选项。

b.(聚合)快捷功能。

众所周知,产品为了节省界面空间,同时避免过多功能给用户不必要的干扰,会选择把一些不常用的快捷功能收到二级展示。常见的产品中,他们选择把这些快捷功能塞进“+”里。

那么,你是不是觉得“+”功能跟“…”功能承载的内容是一样的?比如:乐趣首页右上角“...”,同样是对频率较低的功能的集合。

那为什么有的产品不直接用“...”,还是选择用“+”呢?

通过分析发现,“+”虽然也是聚合快捷功能的入口,但承载的功能有一个共性:都是围绕着用户主动打开、发起、新建...等操作进行的,因此用“+”更贴切。

比如:微信里的“+”,包含着:“发起群聊”,“添加朋友”,“扫一扫”,“收付款”,其实都跟“添加”有关。

比如:淘宝也是类似的处理方式。

再比如:爱奇艺的“+”,里面包含的也是跟“添加”,“上传”相关,像上传视频、扫一扫、我要直播….

反过来看“...”,它聚合的功能,大多是相互关联较弱,且没有主动添加、上传等含义的。因此,用一个相对模糊,没有指向性的符号诠释,更为合适。

由上可以看出,在这种情况下,“+”作为聚合快捷功能的入口,包含的是频率较低,且跟主动“新建”、“发起”、“扫描”等相关的功能。

2. “+”的展开方式 

当用户触发界面中的“+”时,常见的展开方式有3种,分别是:a.气泡弹出框;b.动态栏;c.沉浸模式。

a.气泡弹出框

气泡弹出框,这个控件又常被称为Popover,一般是由一个矩形和三角箭头组成的弹出窗口,通过点击Popover内的按钮或者非Popover的屏幕其他区域可关闭。

比如,以微信为代表的“+”的展开方式,采用的就是Popover。一般用于聚合快捷功能。优点是触发“+”到Popover的距离很近,操作顺手,效率高(更像是导航的延伸)。

b.动作栏

动作栏,这个控件官方称之为Action Sheet,是用户触发“+”后,出现的一种模态弹出框,里面包含一组与当前情景相关的选项,一般用于上传内容选项。

在iPhone屏幕上,为了便于单手持握时操作,Action Sheet通常占据屏幕底部区域。

比如:以Google drive、Dropbox为代表的产品,需要选择上传文件类型的选项。

在这个部分,同事们讨论有些争议点,在于:google drive 和 Dropbox或者微博,它们的加号本来就在底部,所以弹窗让用户感觉视线统一。

而有的产品“+”在上面,弹窗从底部出来,担心注意力切换和手指移动的路径比较长,显得割裂。

带着这个问题,我调研了下有类似情况的产品,会不会让人觉得不舒服。

后来发现,不会的。原因在于我们常用的、拥有10亿+用户的微信,发朋友圈时操作就是这样,而我们并没有感觉很割裂,反而已经习惯。

同样,iPhone自带的“提醒事项”App,也是这样处理。

后来看了规范发现,iOS确实意识到在iPad上,如果继续将Action Sheet显示在屏幕底部,如果频繁操作使用会比较累。因此,做了特殊处理。而手机屏幕上以底部为主,同时点击空白区域取消的操作,也是系统用户所熟知的。

总的来说,操作栏适合承载同一纬度下的内容选项,同时,就算“+”在顶部,采用底部动态栏,体验上也是没问题的。

c.沉浸模式

沉浸模式,指的是当触发“+”时,用户在全局蒙层上进行功能操作,同样适用于上传内容选项。

优点是拓展性更强,体现在:1.提升收益;2.品牌认知;3.内容运营。

1.提升收益

比如:微博,采用沉浸模式,下面是上传不同状态类型的入口,上面可以增加广告收入。

再比如:微云,在沉浸模式下,可以植入自己的“会员”广告,从而提升会员转化。

2.品牌认知

比如:有道云笔记,在顶部的空间内,宣传自己的品牌slogn:“记录,成为更好的自己”,是一种品牌情感化的传递。

3.内容运营

像“好好住”,它们在这个页面加入“话题”运营推广。从而给UGC内容模块带节奏。

大多数产品都想营造社区氛围,建立用户关系,从而增加用户粘性,提升产品留存。

但要想拥有浓厚的社区氛围,首先要有内容、才有人愿意看、才有人在里面互动。

现实问题是,有很多用户有想发状态的心,但不知道发啥,从而放弃。因此,我们应该作出相应的引导。

比如,“好好住”在发布环节,增加话题运营“#每天一张生活日常#”入口,就是解决刚才说的“用户不知道发什么”的问题。运营同学想点子、造话题、带节奏,从而提升用户的发布量。

因此可以看出,“沉浸模式”,对于那些有拓展需求(收益、品牌、运营)的产品更适用。

不知道你有没有发现,相比国外,国内采用这种“沉浸模式”的产品偏多。或许在中国这个互联网竞争如此激烈的大环境下,大家不愿意放弃任何一个能够运营或留住用户的机会。

总结  

总的来说,在常见的产品中“+”功能的运用场景有:(上传)内容选项、(聚合)快捷功能;它的展开方式可分为:气泡弹出框(适合承载快捷功能)、操作栏(适合容纳内容选项)、沉浸模式(容纳内容选项的同时,拓展性更强)。其实,交互形式没有好坏之分,只有哪个更适合自己的内容需求和产品目标,正如Louis Sullivan所说:“形式追随功能”。

小tips:日常工作中有太多类似“+”这种,看似一个不起眼的小功能,被大家忽略。我们习惯性看一下竞品,拍脑袋决定方案。

但是,慢慢你会发现,只有深挖和分析这些所谓的“小细节”,才能知道别人这么做背后的原因、才能举一反三的去运用、才能更好的兼顾统一性和拓展性,而不是停留在浮于表面的模仿。

希望这篇文章对你有所帮助。

编辑:千锋UI设计

作者:苏大牙

UI中国主页:http://i.ui.cn/ucenter/103490.html

产品设计中那个“+”是用来干嘛的?相关推荐

  1. 大话PM|产品设计中常被忽视的业务异常

    本文为PMCAFF作者 iamxiarui 于社区发布 由于疫情影响,在延长的假期中抽空回顾了近一年多来的产品工作.收获之于发现了一个比较明显且出现率很高的问题:产品部署上线后,经常会出现未曾预见但又 ...

  2. 产品设计中的点线面法则

    上一篇文章主要讲的是如何从零搭建起一个信息系统的方法,但实际上甚少有产品人员会参与到系统搭建的工作,因为系统架构往往是在产品的初期,大部分的情况下都是已经搭建好的系统再去根据不同的需求增加不同的流程或 ...

  3. 【干货】实用案例|产品设计中的恰到好处

    之前写过一篇文章<像做发布会那样做产品>,文中主要写通过有意利用产品中的魅力需求来提高用户满意度,达到口碑宣传的效果.而今天写的文章与之类似,主要来写产品设计中的通过对用户使用场景的理解, ...

  4. 产品设计美学案例分析_美学在产品设计中的重要性

    产品设计美学案例分析 重点 (Top highlight) In one of my previous jobs, I had really interesting debates with the ...

  5. 产品设计中的五个层次需求,你知道吗?

    产品设计的重要性很明显,好的产品设计可以给客户带来户带来便利,让产品在市场上脱颖而出.那么,产品设计中的设计需求水平是什么呢?下面详细介绍这五个层次的需求. 一,作用 产品设计首先要实现一定的功能,解 ...

  6. 【设计灵感】产品设计中的灵感来源于日常生活

    很多初学者设计师在入门环节欠缺工作经验,对产品外观设计欠缺控制力.在产品设计阶段时,不清楚怎么开始,也没有灵感.实际上,产品设计中比较好的设计灵感来源于日常生活,我们应该如何得到设计灵感? 1.最先, ...

  7. 插图 引用 同一行两个插图_案例研究产品设计中的动画插图

    插图 引用 同一行两个插图 At the beginning of this year I was working on a new feature for the Undo app. It is a ...

  8. 产品设计中重要的用户体验_为什么好的设计对任何产品都重要?

    产品设计中重要的用户体验 设计,设计层次 (Design, Layers of design) Good design is always been a clear success to many o ...

  9. 数字时代下表单产品设计中的数据研究

    导语:伴随着各行各业和人们生产生活中出现的数据化转型趋势,数据设计显得愈发重要.这篇文章主要讨论了数据的概念.分类,以及数据与指标的关系,在表单产品中数据设计的注意事项.推荐对表单设计感兴趣的同学阅读 ...

最新文章

  1. Linux下ps查找进程用kill终止命令
  2. Spring Boot 2.6.1 发布:为 Spring Cloud 2021铺路!
  3. 【一张图系列】理解安全上下文
  4. python获取当前线程名称_python使用标准库根据进程名如何获取进程的pid详解
  5. 【Python面试】 说说Python可变与不可变数据类型?
  6. Java线程中关于Synchronized的用法
  7. [Node.js] 模块化 -- 爬虫
  8. 【248天】跃迁之路——程序员高效学习方法论探索系列(实验阶段06-2017.10.11)...
  9. Yahoo Web UIs——Java开发者丰富的Web UI
  10. win10系统eclipse中整合hadoop错误
  11. linux光盘游戏,Linux下五个好玩的即时战略游戏
  12. 关于笔记本WLAN(无线)口共享给以太网口
  13. Unbuntu下U盘突然权限只读,无法重命名和复制粘贴文件的问题修复
  14. Antelope与 Barracude MYSQL 文件格式
  15. 二十九、K8s最小服务漏洞3-gVisor沙箱
  16. 微信端H5的相关问题总结
  17. 基于2D-3D直线对应关系的单目摄像机定位
  18. 简单易懂的10折交叉法
  19. http中get/put/post区别
  20. 妙赞大讲糖:降糖为何要动“刀”

热门文章

  1. uni-app支付宝微信支付
  2. html怎么让div换行,如何强制div换行
  3. dlsym 如何查看一个so里面的_Android so 文件进阶二 从dlsym()源码看android 动态链接过程...
  4. ucms通用建站系统php,UCMS通用建站系统
  5. dojo dojo中的事件处理
  6. 数字化资产的时代,如何使用软件工具管理知识资产,这6款工具别错过!
  7. 开源IM可以开发哪些产品和功能
  8. 新手怎么开始学习3Dmax?学习MAX的七个建议,不再迷茫!
  9. centos7.9安装ifconfig命令
  10. python去水印如何制作mask_浅谈图像处理中掩膜(mask)的意义