APP推广合作
联系“鸟哥笔记小乔”
让你看看大厂的设计细节和思考
2021-04-24 09:00:00



黑马家族 产品体验日记 第 68 期

往期点击底部左下角“阅读原文

-------------------------------------------


神奇的小豪同学

北京 | UI设计师

感谢大家对黑马家族产品体验日记栏目的关注,更多日记可以点击底部左下角“阅读原文”观看。




滴滴打车 VR 引导上车点


关键词:#场景#


产品体验:

使用滴滴打车叫车,叫到车后显示车辆到上车点的路径、时间等信息。在页面右侧出现“查看上车点AR引导”的引导,点击icon按钮进入AR界面,手机对准场景后出现引导到上车点的方向。


设计思考:

相信很多打工人都有类似的使用情况场景,当信号弱或者自动定位的时候,打车用户并不能准确定位到上车点,又因为已经叫到车辆不愿意取消,这时产生了用户找不到上车点或者司机到了接客点看不到乘客的情况。


VR引导上车点的设计一定程度上解决了这种问题,一定程度上缓和了司机与乘客的在上车问题上的矛盾,减少了双方对平台的抱怨也就是增加了双方对产品的粘度和好感度。




马蜂窝阅读目录


关键词:#操作# 


产品体验:

打开产品后阅读旅行文章,可以在文章底层页左下看到目录的侧边按钮,点击目录后弹出左侧边栏。侧边栏目录中可以点击直接到达对应文章的小节,顶部点击切换标签至“文中提及的地点”直接在侧边栏中到达相关景点,点击景点进入该景点详情页。


设计思考:

对比于普通的咨询类产品,马蜂窝的文章则是游记、攻略一类,而且近年产品内的内容质量也在逐步提升,这样的文章内容不仅长,文内提及的地点也会十分的丰富,增加侧边栏的目录也就显得十分的必要了。


虽然是一个侧边栏,但是承载了两个功能,一个是文章目录另一个是文章中的地点,从设计上整合在一个侧边栏中避免了用户的分散操作,也可以让用户更精准的定位在自己想要的部分。不仅提升了用户的产品粘度减少产品之间的查阅,还简化了用户的操作,减少了不必要的划动动作。




大众点评店铺详情页的视频介绍


关键词:#好感度#


产品体验:

进入产品后浏览商家,点击进入店铺详情后顶部出现“下拉试试”的提示,下拉页面后出现店铺视频介绍。


设计思考:

越来越多的视频产品带动了视频内容的发展,视频内容也更吸引用户的眼球容易把用户留在产品中浏览。以大众点评为例,这家店铺我并没有去过也不知道有什么,但是进入页面第一眼有“下拉试试”的提示介绍视频,可以最快的了解到店铺的大概的情况,接下来可以更好的浏览页面下的基本信息等其余内容。其次下拉页面页节约了页面的空间,以近似二楼的展示方式展示视频介绍。除了提高了用户对产品的使用好感也增加了操作趣味性。




优酷短视频与长视频的联动


关键词:#流失# #留存#


产品体验:

在优酷中在底部标签栏中第二个短视频中,刷到了剧集的预告短片或者剪辑视频,在页面中部有看正剧的入口,点击后进入视频详情播放正剧长视频。


设计思考:

长短视频的结合功能对于这样的视频产品来说可以是天然的优势,没有不必要的产品间的切换导致用户的流失,用户可以在产品内完成流畅的操作,在用户体验上与其他短视频产品比要好很多,功能和有趣度也更丰富一些。在加上长页面中也增加了推荐,保证了用户在产品内的留存。




淘宝订单页视觉优化


关键词:#视觉#


产品体验:

在淘宝中点击购物车进入购物车列表。在订单页中的商品列表。


设计思考:

淘宝在2019、2020年的版本中逐渐开始在视觉中使用加粗、放大、颜色加重等通过视觉信息增加产品信息的优先级。2021年3月的优化中,淘宝这次在订单列表中的视觉优化,把列表信息中的重要信息层级的字号、加粗、字色等减小减轻,优化后的界面更加清爽,简介,重度减轻之后页面更干净,对于电商产品中的用户使用感觉更清晰明确,也并没有减轻信息的展示强度。




饿了么外卖小哥的虚拟小人


关键词:#图形#


产品体验:

打开饿了么!寻找店铺点击购买付款后进入外卖行程页,出现外卖小哥的定位轨迹。当到达商家取餐时小人下车,取餐成功开始送餐时小人上车。


设计思考:

饿了么送餐小人的上下车虽对整体产品没有过多的影响,但对用户在使用中潜移默化的心理暗示还是起到了作用。


在图形有代表性的时候多数用户的大脑中识别图形的速度要比文字更快,也就是说上下车的小人就代表了外卖小哥的状态更是代表了这一单的运输状态,加上文字的加持,用户在这一环节可以快速的知道自己的订单已经到了什么程度,是对用户体验感的提升,增加了产品的有趣性惊喜度。




优酷快看短视频合集


关键词:#合集#


产品体验:

进入首页右划到快看标签。向下浏览观看短视频,可以刷到有“合集”的视频,视频下可以划动查看合集内的视频。也可以点击标题旁的“查看全部”进列表页查看。


设计思考:

优酷在视频下方设计了视频合集浏览,可以更快的点击切换合集内的视频,与长视频中的合集样式类似。同时也为喜爱向下刷的用户提供了二级列表样式的观看体验。虽然现在看来功能有点重复,但是二者的结合可以更好的看出两个方式中用户的喜爱程度,找出自己产品中更适合的设计方式,给用户更好的使用体验。




网易云音乐语音直播间引导


关键词:#引导语# #列表#


产品体验:

进入网易云音乐播放页,可以看到右上角有不固定的提示语引导点击小头像,点击头像后直接进入该主播直播间。退出主播直播间直接进入语音直播列表页。


设计思考:

产品内的引流是每个产品扩张的必经之路吧,从网易云音乐的这个按钮到年初的微信视频号都在产品内部引流。


从视觉上看,播放页的流量是很大的,也是用户停留时长比较长的页面,在这个页面中设计明显的提示框并加有吸引人的提示语,增加了用户的点击的欲望从而引导用户前往语音直播间。再者就是从这个入口进入语音直播退出的时候返回的是语音直播间列表页,并没有返回播放页,也足以看出产品对语音直播的重视度。




快手短视频中增设友情提示


关键词:#温馨提示#


产品体验:

在快手中浏览内容时,刷到有危险示意时视频都会在内容区上部增加提示标签。没有这类情况的则没有提示。



设计思考:

互联网时代的社会中每个人都可以发表自己的言论或者看法,但是这些内容在娱乐大众的情况下也有人会下意识的模仿一些动作或者跟风,难免会发生不好的事情。在快手或者是同类型的产品或功能中,很多也都加入了这个标签,以快手为例:在有可能危险的视频中,页面上部增加“危险动作,请勿轻易模仿”的温馨提示,这种提示对于用户来说是一种安全的温馨提示,对于社会来说则是一份小小的责任。




网易云音乐播放页增加运营活动入口


关键词:#引导#


产品体验:

在产品的音乐播放页面中,可以看到在唱片的拟物播放器下有一个活动点击参与的按钮,点击后进入该运营活动详情页。


设计思考:

与前天所体验语音直播间入口一样,网易云流量较大的页面之一就是播放页,也是产品的核心功能。除了将活动放置在banner等区位之外,在播放页增设活动入口并且与当前歌曲相关,除了增加了曝光率,这样的联动会让歌手的粉丝增加点击查看的欲望以产生接下来的用户行为。这种引导可以很好的让产品增加利益,且用户不会产生强烈的反感情绪。




小宇宙有趣的广场


关键词:#推荐# #趣味#


产品体验:

进入小宇宙首页,向下浏览,在排行榜功能下的运营位点击进入广场。在广场页面中手指上下左右划动,页面内容跟随手指上下左右全方向可动浏览。在页面的右上角也有提示可操作的方向。


设计思考:

随着同质化的产品越来越多,似乎没有一些有趣的点用户用着都没有什么新鲜的感觉。小宇宙的广场算是产品对内容者的一个推荐的区域,整个区域的界面并没有采取限制,例如设计中防止内容出圈的安全区(不过似乎越来越多的产品想突破这个规范)。这样的界面设计更符合产品自身的定位以及产品中的内容,会更年轻更人性化,用户在使用的体验感上也会有更好的体验感。




微博关注按钮


关键词:#关注#


产品体验:

在微博中,点击进入博主主页,可以看到页面下部的关注,点击关注按钮关注成功博主后弹出关注推荐的弹窗。


设计思考:

微博的关注按钮可以说是开发到了新感觉。首先是配合任务增加关注量和关注这个动作,其次从视觉上看除了关注两个字之外可以明显看出点击之后会发生的事情,很好的将任务活动体现出来。并且关注成功之后弹起推荐关注的弹窗引导用户继续关注从而留在微博形成小循环,除了增加了博主的关注度同时也提升了产品的活跃度。




爱彼迎不同的房间详情页


关键词:#差异化设计#


产品体验:

进入产品后浏览民宿卡片内容,点击后进入详情页。


设计思考:

对于VIP用户大家都知道会有不同的使用体验,比如爱奇艺、优酷的VIP可以看到更多的剧,同样很多产品也开始搞一些特殊化有差异的页面,类似美团、淘宝等都有这样的服务。


以爱彼迎为例,产品对于店家是否充值有明显的差异化界面设计,没有plus的用户界面展示图小,需要点击详情看大图。而有plus的用户会有明显的爱彼迎的LOGO加Plus的标识,除此之外房间的图片在界面中的占比变大,这对于一个民宿来说是最重要的,更大的图片显示效果更好,缩短了用户查看大图的用户路径,在文字上字号也增大,变的更明显更容易让用户看清楚,更快的结束大脑的分析从而点击查看可订状态的按钮,帮助房东增加订单量,也增加了产品自身的利益。




马蜂窝景点详情页的折叠


关键词:#交互设计#


产品体验:

进入产品后查找心仪的景点,点击进入查看详情页,在页面底部标签栏的位置可以看到预订门票的标题,上滑预订门票是一个类似弹窗的页面。也可以在页面正常向下浏览,到了预定门票的位置可以正常浏览。


设计思考:

如何让用户浏览阅读长页面下的内容是一个重要的问题。马蜂窝详情页的长页面交互设计应该并不是首创,但最近这种交互却有所减少使用,不过我依然认为马蜂窝用在这里是合适的解决方法,与产品需求相吻合。


首先旅游产品中景点以基础信息为主,介绍景点的地址,风景图片攻略等,虽然这些内容是主要的但是却没有直接的收入。旅行产品除去信息之外,门票、酒店都是可以取得收入的点,但是为了要让用户先取得景点的好感,把这两个优先级就要下调,这时这种交互方式可以解决用户在阅读完信息后直接查看门票、酒店,大大节省了用户的操作,提高了用户在产品内的使用范围,减少了用户长页面滑动的烦躁,使用户在查看门票酒店时离开产品去其他app中浏览的问题。




抖音拍同款


关键词:#提示#


产品体验:

进入抖音后浏览创作者发布内容,可以在页面右下角看到类似唱片的按钮转圈,同时有音符飞出。



设计思考:

抖音拍同款是比较早的一个功能,这次发现按钮增加了提示语,会在按钮旁弹出一个小提示条,进一步增加用户的点击率,提示用户该视频同款音效从这里可以进入,提升了对音效感兴趣的用户拍视频的冲动。这样的小提示也是在进一步挖掘鼓励更多潜水用户发布短视频。(提示条今天刷到了一次就消失了0-0实在是刷不出来了,不过第一次看到提示语的时候确实有点击进入查看音效的冲动)


本期产品体验日记到此结束,我们下期相遇。



感谢你的阅读支持 · 欢迎留言互动
-------------------------------------------
声明:本文内容及言论仅代表其作者之意,
并不反映任何黑马家族之意见及观点


精品高阶课程推荐




多一点行动  ·  多一分设想

黑马哥
分享到朋友圈
收藏
收藏
评分

综合评分:

我的评分
Xinstall 15天会员特权
Xinstall是专业的数据分析服务商,帮企业追踪渠道安装来源、裂变拉新统计、广告流量指导等,广泛应用于广告效果统计、APP地推与CPS/CPA归属统计等方面。
20羽毛
立即兑换
一书一课30天会员体验卡
领30天VIP会员,110+门职场大课,250+本精读好书免费学!助你提升职场力!
20羽毛
立即兑换
顺丰同城急送全国通用20元优惠券
顺丰同城急送是顺丰推出的平均1小时送全城的即时快送服务,专业安全,准时送达!
30羽毛
立即兑换
黑马哥
黑马哥
发表文章75
一群执着于设计的黑马,为你带来原创设计文章/教程/职场经验/专业拔高。
确认要消耗 羽毛购买
让你看看大厂的设计细节和思考吗?
考虑一下
很遗憾,羽毛不足
我知道了

我们致力于提供一个高质量内容的交流平台。为落实国家互联网信息办公室“依法管网、依法办网、依法上网”的要求,为完善跟帖评论自律管理,为了保护用户创造的内容、维护开放、真实、专业的平台氛围,我们团队将依据本公约中的条款对注册用户和发布在本平台的内容进行管理。平台鼓励用户创作、发布优质内容,同时也将采取必要措施管理违法、侵权或有其他不良影响的网络信息。


一、根据《网络信息内容生态治理规定》《中华人民共和国未成年人保护法》等法律法规,对以下违法、不良信息或存在危害的行为进行处理。
1. 违反法律法规的信息,主要表现为:
    1)反对宪法所确定的基本原则;
    2)危害国家安全,泄露国家秘密,颠覆国家政权,破坏国家统一,损害国家荣誉和利益;
    3)侮辱、滥用英烈形象,歪曲、丑化、亵渎、否定英雄烈士事迹和精神,以侮辱、诽谤或者其他方式侵害英雄烈士的姓名、肖像、名誉、荣誉;
    4)宣扬恐怖主义、极端主义或者煽动实施恐怖活动、极端主义活动;
    5)煽动民族仇恨、民族歧视,破坏民族团结;
    6)破坏国家宗教政策,宣扬邪教和封建迷信;
    7)散布谣言,扰乱社会秩序,破坏社会稳定;
    8)宣扬淫秽、色情、赌博、暴力、凶杀、恐怖或者教唆犯罪;
    9)煽动非法集会、结社、游行、示威、聚众扰乱社会秩序;
    10)侮辱或者诽谤他人,侵害他人名誉、隐私和其他合法权益;
    11)通过网络以文字、图片、音视频等形式,对未成年人实施侮辱、诽谤、威胁或者恶意损害未成年人形象进行网络欺凌的;
    12)危害未成年人身心健康的;
    13)含有法律、行政法规禁止的其他内容;


2. 不友善:不尊重用户及其所贡献内容的信息或行为。主要表现为:
    1)轻蔑:贬低、轻视他人及其劳动成果;
    2)诽谤:捏造、散布虚假事实,损害他人名誉;
    3)嘲讽:以比喻、夸张、侮辱性的手法对他人或其行为进行揭露或描述,以此来激怒他人;
    4)挑衅:以不友好的方式激怒他人,意图使对方对自己的言论作出回应,蓄意制造事端;
    5)羞辱:贬低他人的能力、行为、生理或身份特征,让对方难堪;
    6)谩骂:以不文明的语言对他人进行负面评价;
    7)歧视:煽动人群歧视、地域歧视等,针对他人的民族、种族、宗教、性取向、性别、年龄、地域、生理特征等身份或者归类的攻击;
    8)威胁:许诺以不良的后果来迫使他人服从自己的意志;


3. 发布垃圾广告信息:以推广曝光为目的,发布影响用户体验、扰乱本网站秩序的内容,或进行相关行为。主要表现为:
    1)多次发布包含售卖产品、提供服务、宣传推广内容的垃圾广告。包括但不限于以下几种形式:
    2)单个帐号多次发布包含垃圾广告的内容;
    3)多个广告帐号互相配合发布、传播包含垃圾广告的内容;
    4)多次发布包含欺骗性外链的内容,如未注明的淘宝客链接、跳转网站等,诱骗用户点击链接
    5)发布大量包含推广链接、产品、品牌等内容获取搜索引擎中的不正当曝光;
    6)购买或出售帐号之间虚假地互动,发布干扰网站秩序的推广内容及相关交易。
    7)发布包含欺骗性的恶意营销内容,如通过伪造经历、冒充他人等方式进行恶意营销;
    8)使用特殊符号、图片等方式规避垃圾广告内容审核的广告内容。


4. 色情低俗信息,主要表现为:
    1)包含自己或他人性经验的细节描述或露骨的感受描述;
    2)涉及色情段子、两性笑话的低俗内容;
    3)配图、头图中包含庸俗或挑逗性图片的内容;
    4)带有性暗示、性挑逗等易使人产生性联想;
    5)展现血腥、惊悚、残忍等致人身心不适;
    6)炒作绯闻、丑闻、劣迹等;
    7)宣扬低俗、庸俗、媚俗内容。


5. 不实信息,主要表现为:
    1)可能存在事实性错误或者造谣等内容;
    2)存在事实夸大、伪造虚假经历等误导他人的内容;
    3)伪造身份、冒充他人,通过头像、用户名等个人信息暗示自己具有特定身份,或与特定机构或个人存在关联。


6. 传播封建迷信,主要表现为:
    1)找人算命、测字、占卜、解梦、化解厄运、使用迷信方式治病;
    2)求推荐算命看相大师;
    3)针对具体风水等问题进行求助或咨询;
    4)问自己或他人的八字、六爻、星盘、手相、面相、五行缺失,包括通过占卜方法问婚姻、前程、运势,东西宠物丢了能不能找回、取名改名等;


7. 文章标题党,主要表现为:
    1)以各种夸张、猎奇、不合常理的表现手法等行为来诱导用户;
    2)内容与标题之间存在严重不实或者原意扭曲;
    3)使用夸张标题,内容与标题严重不符的。


8.「饭圈」乱象行为,主要表现为:
    1)诱导未成年人应援集资、高额消费、投票打榜
    2)粉丝互撕谩骂、拉踩引战、造谣攻击、人肉搜索、侵犯隐私
    3)鼓动「饭圈」粉丝攀比炫富、奢靡享乐等行为
    4)以号召粉丝、雇用网络水军、「养号」形式刷量控评等行为
    5)通过「蹭热点」、制造话题等形式干扰舆论,影响传播秩序


9. 其他危害行为或内容,主要表现为:
    1)可能引发未成年人模仿不安全行为和违反社会公德行为、诱导未成年人不良嗜好影响未成年人身心健康的;
    2)不当评述自然灾害、重大事故等灾难的;
    3)美化、粉饰侵略战争行为的;
    4)法律、行政法规禁止,或可能对网络生态造成不良影响的其他内容。


二、违规处罚
本网站通过主动发现和接受用户举报两种方式收集违规行为信息。所有有意的降低内容质量、伤害平台氛围及欺凌未成年人或危害未成年人身心健康的行为都是不能容忍的。
当一个用户发布违规内容时,本网站将依据相关用户违规情节严重程度,对帐号进行禁言 1 天、7 天、15 天直至永久禁言或封停账号的处罚。当涉及欺凌未成年人、危害未成年人身心健康、通过作弊手段注册、使用帐号,或者滥用多个帐号发布违规内容时,本网站将加重处罚。


三、申诉
随着平台管理经验的不断丰富,本网站出于维护本网站氛围和秩序的目的,将不断完善本公约。
如果本网站用户对本网站基于本公约规定做出的处理有异议,可以通过「建议反馈」功能向本网站进行反馈。
(规则的最终解释权归属本网站所有)

我知道了
恭喜你~答对了
+5羽毛
下一次认真读哦
成功推荐给其他人
+ 10羽毛
评论成功且进入审核!审核通过后,您将获得10羽毛的奖励。分享本文章给好友阅读最高再得15羽毛~
(羽毛可至 "羽毛精选" 兑换礼品)
好友微信扫一扫
复制链接