收缩式底部标签栏设计 底部标签栏除了在图...
采集 7评论
查看来源 mp.weixin.qq.com
香丨仔丨君
通过花瓣采集插件采集于2023-08-16 08:45:51
收缩式底部标签栏设计
底部标签栏除了在图标设计层面发挥以外，在模块背景、造型和交互方式等层面也可以进行设计发挥。
长相思 App 底部标签栏图标设计结合手绘水墨风，不仅匹配整体风格，也体现出了图标风格的差异化。底部标签栏还进行收缩式交互设计，点击卷轴可以进行展开和隐藏。该设计表达提高了空间利用率，降低用户浏览过程中的干扰，是一个不错的设计解决方案。
细节/亮点
香丨仔丨君
好玩的动态界面设计 产品在满足底层需求之后，便会不断追求更具娱乐性的体验表达，好玩的设计往往会让用户更愿意停留和传播。 腾讯手机管家 App 在电池管理界面设计中，一只小鸭子在蓝色的海洋中游荡着，随着手机的倾斜旋转水面也会倾斜。仿佛手机就像一个水缸，小鸭子就是养在水缸里面的宠物，而电量的多少决定了水的深浅，有一种暗示就是如果你再不充电小鸭子就没有水可以游泳啦！好玩的动态界面设计体验感很棒，以娱乐性的形式表达了功能含义，也带给了用户趣味性的使用体验。
互动性的语音搜索设计 搜索已经不只是文字搜索范围了，可以语音搜索、图片搜索、色彩搜索等，搜索形式变得更为丰富，而提高搜索的体验度至关重要。 Wonder App 在通过语音搜索内容时，俏皮可爱的人偶形象增强了搜索的互动性。未开启麦克风时会比着可爱的手势进行功能引导，开启后便会比划着非常开心的动作等待用户的语音，也会配合情感化的文案进行提示。这种互动性的设计不仅提高了语音搜索的体验度，也带给用户更为情感化的感官体验。
趣味性的个人中心设计 个人中心的设计已不再是简单的功能聚合，更好玩的趣味性设计逐步普及，带给用户更有温度的体验感应运而来。 个人中心设计在顶部区域会结合丰富的视觉表达，比如精美图片、插画、动效等，而会玩 App 的个人中心根据性别设计了人偶形象。以动态的形式展示形象青春活泼的性格特征，设计表达新颖独特，呈现了差异化的视觉感知。
有礼貌的瓷片区设计 瓷片区作为非常重要的运营模块，通过视觉的冲击力吸引关注度至关重要，而动效的表达也是不错的方向选择。 好轻 App 在首页瓷片区的设计表达中，融入了三维人物形象，进入时还会有打招呼的动作。有礼貌的行为表现不仅吸引了用户的注意力，也能感受到产品的情感化体验，进而提高用户的点击欲。
打破常规的引流设计 首页作为产品功能的聚合地，各类功能都想在首页强化曝光度，达到很好的用户引流。如何在不改变当前结构的前提下强化曝光度，是产品设计师不断创新和思考的方向。 最近淘宝为了给“夜淘宝”引流，在首页右上角进行了打破常规的设计表达，没有改变功能结构，通过背景造型变化提高该模块的曝光度。白天和夜间以不同的天气图标进行设计表达，结合微动效视觉效果非常突出。点击进入详情页也会根据昼夜差别展示不同的场景，带给用户更好的感官体验，也让信息准确地得到了传递。
独特的内容展示形式 不同的内容我们会思考如何以更有创意的方式进行展示，结合内容特征和产品属性也是一个方向。 长相思 App 在赏析栏目中，根据不同诗词绘制了不同造型的团扇和场景，以独特和个性化的方式进行内容表达。不仅帮助产品建立鲜明的品牌形象，也吸引了用户的关注度。
签到设计的动态演变 签到是提高用户黏性的有效形式之一，通过签到获取积分或者奖励等，以此提高用户的参与度。 在得物 App 签到设计中，以动态演变来体现签到前后的变化，让用户直观地看到签到天数和奖励机制等。以动效的形式将签到前的日历盒子进行演变，提高了用户对签到过程的关注度。动效表达流畅自然，视觉感知清晰明了，提升了用户的签到体验。
签到设计的动态演变 签到是提高用户黏性的有效形式之一，通过签到获取积分或者奖励等，以此提高用户的参与度。 在得物 App 签到设计中，以动态演变来体现签到前后的变化，让用户直观地看到签到天数和奖励机制等。以动效的形式将签到前的日历盒子进行演变，提高了用户对签到过程的关注度。动效表达流畅自然，视觉感知清晰明了，提升了用户的签到体验。
趣味性的下拉刷新设计 通过刷新可以获得内容更新，刷新动作的设计和延展也越来越丰富，设计发挥的空间很大。 最近在体验豆果美食 App 时，下拉刷新以不同蔬菜的图形进行动效演变，以此来体现刷新反馈过程。表现形式新颖且印象深刻，在符合产品属性的同时，也带给用户趣味性的感官体验。
收缩式底部标签栏设计 底部标签栏除了在图标设计层面发挥以外，在模块背景、造型和交互方式等层面也可以进行设计发挥。 长相思 App 底部标签栏图标设计结合手绘水墨风，不仅匹配整体风格，也体现出了图标风格的差异化。底部标签栏还进行收缩式交互设计，点击卷轴可以进行展开和隐藏。该设计表达提高了空间利用率，降低用户浏览过程中的干扰，是一个不错的设计解决方案。
一、水墨风打造场景代入感 越来越多的产品在满足底层需求之后，都在追求更好的感官体验，强化视觉感和打造差异化的风格至关重要。 最近体验了长相思 App，以手绘水墨丹青中国画作为主界面背景，配合宛如清泉流淌的背景音乐。场景人物以绝美国风动画形式表达，将诗词情景重现，呈现了一场视听盛宴。
一、水墨风打造场景代入感 越来越多的产品在满足底层需求之后，都在追求更好的感官体验，强化视觉感和打造差异化的风格至关重要。 最近体验了长相思 App，以手绘水墨丹青中国画作为主界面背景，配合宛如清泉流淌的背景音乐。场景人物以绝美国风动画形式表达，将诗词情景重现，呈现了一场视听盛宴。
打破常规的 UI 设计表达 好的设计创新就隐藏在我们身边，善于发现优秀的设计表达，才能积累丰富的设计灵感。优秀的产品设计师需要具备一双发现的眼睛，也要养成体验分析的习惯，基于优秀案例之上才能创作出更好的设计解决方案。
「扇贝单词」通过「同桌」功能构建了线上的虚拟自习室 ，让用户可以寻找学习伙伴，互相监督，克服惰性，按时完成每日的打卡任务。帮助用户解决坚持学习难的痛点同时，也能提升产品的日活。推荐用户「邀请好友做同桌」，可以有效引导用户为产品拉新；「在扇贝找同桌」则可以延展产品的社交属性，让线上学习也能像在线下图书馆、自习室一样，有学习氛围，有社交场景，让学习不再枯燥孤单。 【同桌】功能将线下的环境映射到线上，同时又解决了无人监督、无人陪伴的痛点
618电商节如期到来，大家没少买吧。东西多久能送到呢？不用担心，当用户在「淘宝」下单后，「菜鸟」会对已发货订单进行送达预测，运输中的商品会显示「X%概率明天送达」提示，而查看物流详情时，则显示更精准的预计时间；用户也可以点击「全程预测」掌握订单的时效预测，需要时也可快捷联系卖家、快递。合理的送达时间预测，让用户有心理预期，提前做好取件准备，也能缓解等待的焦急情绪。另外高概率的表述，也在某种程度上提升了对即将送达商品的期待感。
「高德地图」App 不仅可以开启 3D 视界功能，更加直观地通过立体模型导航找路；还能使用「智能定向」功能，将实景扫描与地图智能结合，使导航方向校准的准确率更高。此外，在导航途中每次遇到路口需要转向时，「高德地图」都会在语音播报的同时触发体感震动提示，以确保用户及时转向，避免走错方向，真的超级贴心。
「微信」二楼新增音乐、音频和最近播放，在落地页中「音乐」可以查看朋友圈分享的音乐、推荐歌单和视频号音乐人，还可以放入「我的音乐」管理；而「音频」可以看朋友在听、所关注公众号的音频博客、推荐音频，也支持「我的音频」管理。点击右上角小图标使用小窗口模式，则能回到微信列表继续其他操作。此次更新，既方便用户对「微信」内不同渠道的音乐音频进行查询、复听和管理，也能给其他音频内容带来引流和曝光，算是微信对生态内部音频资源的整合与利用，让用户持续留在微信上，提高活跃度强化粘性，功能刚上不久，大家可以试下~
「Eagle」的官网使用教程文字底部的评价动效借鉴了现实的隐喻，即「有帮助-点头」「没帮助-摇头」，与很多「花里胡哨」的评价功能设计相比，更加简洁明了、清晰易懂，又不失趣味性。
「iOS系统」自带的 「iMessage」在海外用户量很大，功能也很丰富。除了常见的拟我表情贴纸、相机特效等功能，还隐藏着丰富的特效功能。编写信息后，按住输入框右侧「发送」图标，便会进入带效果发送页面，里面有不同的气泡和屏幕样式可供选择。在屏幕样式中，横滑可切换不同的屏幕背景效果，包括回声、聚光灯、气球、五彩纸屑、爱心、镭射光线、焰火、欢庆等。动效生动有趣，「微信」的文字彩蛋灵感是不是来源于此呢？
「微信」公众号的文章终于可以像听播客一样，实现「听文自由」了。将「微信」更新至最新版本，可以看见文章标题下方多显示了「xxx人听过」的数据信息。打开「...」，可找到「朗读」与「稍后听」两个新功能。点击「朗读」，AI会进行文章朗读并跳转至音频播放页面，用户可进行播放进度、设置倍速、转发等操作。而播放界面类似「QQ音乐」的设计，则给用户带来熟悉感，降低新功能的学习成本。如果暂时不方便听音频，还能使用「稍后听」功能，将推文先加入音频列表，待方便的时候再听。大家怎么看「微信」公众号的新功能？
同采自
mp.weixin.qq.com
该采集也在以下画板
加载更多
推荐给你的采集
采集
image.flaticon.com
Dearcolour采集到扁平/插画

1343009.png (512×512)

20

Dearcolour 采集到
扁平/插画
采集
uocook.com
木鱼泡泡采集到Icon - APP大图标

写实UI图标

14

木鱼泡泡 采集到
Icon - APP大图标
采集
小牧童采集到banner设计

banner 金融

53

小牧童 采集到
banner设计
采集
dribbble.com
TannerWe采集到App

1211

74

TannerWe 采集到
App
采集
Y、Lisa酱采集到App.闪屏设计

1011

Y、Lisa酱 采集到
App.闪屏设计
采集
长刺的年糕采集到引导页

明日之子 《大首发日》活动

100

长刺的年糕 采集到
引导页
采集
不文不问-wen采集到ui

818多嘴节 八一八那些美食的八卦

59

不文不问-wen 采集到
ui
采集
dribbble.com
暴走布布采集到UI-web

演示

2391

暴走布布 采集到
UI-web
采集
淑怡部屋采集到APP

天气界面

112

淑怡部屋 采集到
APP
采集
25xt.com
莫楠德采集到ui app icon

抖音直播礼物UI设计欣赏

91

莫楠德 采集到
ui app icon
采集
iguoguo.net
爱果果采集到酷站欣赏

It Will Glow - 爱果果

64

爱果果 采集到
酷站欣赏
采集
zcool.com.cn
让我飞升采集到UI-特效

二次元界面UI风格|UI|游戏UI|波波大 - 原创作品 - ()

1

让我飞升 采集到
UI-特效
采集
龙小夜采集到【插图】APP加载页/启动页/引导页

#插画##闪屏##原创##节气##立夏##夏天# 大海 蓝天 闪屏 专题 http://w...

1051

龙小夜 采集到
【插图】APP加载页/启动页/引导页
该采集待公开
采集
img.hb.aicdn.com
Χ_i__a采集到✿_WEB

dd48e1594d4931599495c493c6a2c65163ca1f227ba98...

44

Χ_i__a 采集到
✿_WEB
采集
乔莉拿起笔采集到运营-banner

五重礼banner @这样重这样轻 作品

72

乔莉拿起笔 采集到
运营-banner
采集
夜色如水采集到活动专题

双十二

54

夜色如水 采集到
活动专题
采集
weibo.com
今天的春雪采集到ui

#dribbble每日精选# Ivan Bobrov的多彩小动物LOGO 兔子

24

今天的春雪 采集到
ui
采集
16sucai.com
bird-yan采集到icon区

简约线性图标设计矢量素材 - 素材中国16素材网

186

bird-yan 采集到
icon区
采集
zcool.com.cn
Penry_Chen采集到灵感 - 表情/插画

郑州地铁票卡设计

1222

Penry_Chen 采集到
灵感 - 表情/插画