首页

兰亭妙微ui设计公司分享:用实战案例吃透交互设计:尼尔森人性化帮助原则 >

清阳 交互设计及用户体验

兰亭妙微ui设计公司分享:交互设计师输出方案时,除吃透业务需求、研究用户行为与心理之外,一套成熟的交互设计原则是保障方案可用性的重要依据,尼尔森十大可用性原则就是行业最常用的设计标尺。本文结合真实项目实战,拆解其中的人性化帮助原则在业务中的落地方法。

所谓人性化帮助原则,就是在界面中通过各类功能、提示机制,辅助用户顺畅完成任务。尼尔森将帮助提示划分为三类实现形式:一次性提示、常驻提示、帮助文档。下面结合一次产品 2.0 改版项目,讲解三类提示该如何落地。

项目背景

本次迭代为产品某功能板块的 2.0 升级。前期收集用户反馈发现,大量用户的核心痛点:看不懂、不会用该板块功能。 基于业务诉求与用户痛点,我们确立改版在交互体验上两大核心目标:

  1. 让用户感知到 2.0 版本的更新与功能变化;
  2. 给用户提供有效指引,帮助用户顺利完成操作目标。

一、如何帮助用户感知新版功能

 

版本迭代后,页面入口重新整合、同时新增功能点位,新老用户进入页面很容易产生认知迷失。我们需要设计合理的引导,让用户快速读懂本次改版。

App 大版本更新,常会用全屏引导页介绍新能力;针对局部功能改版,常见方案有两种:页面定位式遮罩引导、更新弹窗,二者需要结合业务场景取舍。

  • 更新弹窗:把全部改版信息集中弹窗展示,但弹窗空间有限,信息堆砌,用户很难逐个理解各个新入口的作用;image.png
  • 页面定位引导:以遮罩锚点聚焦单个功能入口,分步讲解,用户可以对照新旧版本差异理解,还可以顺着页面核心操作流程做演示,加深对功能与流程的记忆。

    image.png

本次改版将原先零散入口收拢到同一页面,还新增了具备操作连续性的快捷入口,更适合分步聚焦讲解。因此最终选用页面定位遮罩引导,引导用户逐步认识改版后的页面结构。

二、如何帮助用户上手使用功能

理想的交互是足够直观,用户无需额外提示就能上手。但用户的产品经验参差不齐,新手、低频用户很容易在页面里陷入困惑,产生挫败感。就像逛超市,熟客清楚区域分布,而初次到访的顾客、老年用户,则需要清晰的区域标牌来指引方向。

针对不同场景,可以分别使用一次性提示、常驻提示、帮助文档三类帮助手段。

1. 一次性提示

image.png

一次性提示仅在特定时机出现:用户首次使用功能、版本更新,或是针对隐藏、不易察觉的操作;用户阅读关闭后就不再重复弹出。

场景案例 1:资料填写领优惠券弹窗 业务需要引导用户完善个人基础信息,完成后发放优惠券。最初方案是弹窗引导跳转填写,但是用户关闭弹窗、或是填写后返回页面,就再也找不到填写入口。 优化方案:用户关闭弹窗返回页面后,触发一次性气泡提示,告知用户入口位置,提示阅读完毕关闭后,就不再重复打扰。

场景案例 2:上传图片调整顺序 用户反馈:上传商品图片提交后,才发现图片排序不符合预期。为此新增拖拽调整图片顺序的能力,但该操作属于隐藏手势,用户很难主动发现。 解决方案:图片上传完成后弹出一次性气泡:「长按可调整图片位置」,用户手动关闭提示后,后续不再展示,完成操作认知传递。

2. 常驻提示

image.png

常驻提示会持续展示,多用于操作流程中必须知晓的警示、规则说明,提示文案紧贴对应的操作模块,不会自动消失。

场景案例 1:图片上传风险免责提示 用户自主上传商品图片,存在图片侵权风险。在图片上传模块下方放置常驻免责声明,持续提醒用户承担图片发布对应的相关责任,兼顾用户告知与平台风险规避。

场景案例 2:提交审核规则提示 用户编辑完商品信息提交审核,容易产生等待焦虑,不清楚审核时长、去哪里查看结果。 我们将审核周期、结果查看路径,以常驻说明文字放在「提交审核」按钮上方。用户提交之前就能完整知晓规则,消除等待过程的心理不确定感。

3. 帮助文档

image.png

帮助文档主要承载复杂规则解释、高频 FAQ,适合体量较大、不适合放在操作流程内的内容。 调研发现部分用户甚至不理解这个板块本身的用途。我们在页面增加「操作手册」常驻入口,里面收纳板块功能介绍、完整操作步骤、高频常见问题。当用户遇到困惑,可以主动查阅文档,自主解决疑问。

总结

人性化帮助原则不是简单堆砌弹窗、提示文字,而是分层设计:

  • 改版、首次操作场景:用一次性提示做轻量化科普,避免长期打扰;
  • 风险、关键规则类信息:用常驻提示紧贴操作,确保用户操作前能够看见;
  • 复杂规则、大量 FAQ:收拢进帮助文档,供有需要的用户主动查阅。

好的帮助设计,是做用户的 “安全网”:优先做到界面本身足够易懂;在此基础上分层提供帮助,新手有指引,熟手不受干扰,遇到问题的用户可以找到解决方案。

 

转载:优设

 

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

 

image.png

 

兰亭妙微ui设计公司分享:巧用 AIGC 从零打造差异化电商品牌|大厂实战案例解析

清阳 行业趋势

前言

兰亭妙微ui设计公司分享:百度优选作为百度在 2023 年 5 月全新推出的电商业务,提出“百度优选,超会选”品牌主张,目标为广大消费者提供高效、精准、专业的消费决策参考。新品牌起步阶段,想要快速建立用户认知,设计团队借由大促营销、行业生态活动等关键事件持续输出品牌内容,层层夯实用户心智,逐步加深大众对百度优选的品牌印象。

一、新品牌基础体系搭建

LOGO 是品牌对外的一面镜子,承载品牌内核。本次设计围绕购物、亲和、优选三大核心关键词发散创意,提取购物袋、笑脸表情、代表 “优” 的字母 U&YOU、百度 “度” 首字母 D 作为视觉原型,传递轻松愉悦的购物体验感。

image.png

历经 5 轮迭代,产出 70 余套设计方案,最终确定整合 D 字母、笑脸、购物袋、U 元素的 LOGO 形态。品牌主色选用优选红,借暖色调的情绪感染力,调动消费者购物欲望,同时建立信任感。

image.png

配套完成整套品牌视觉规范:定制专属字体「百度综艺体」,输出横排、竖排多套 LOGO 组合版式,统一品牌视觉输出标准。后续依托 11.11、12.12、3.8、8.18 等核心电商大促,反复曝光品牌形象,持续强化用户认同感。

image.png

二、大促品牌心智的概念定位

image.png

伴随夜经济兴起,夜间消费需求持续释放。百度优选在 2023 双十一落地数字人直播 “日不落计划”,依靠 7×24 小时不间断数字人直播服务 C 端用户;搭配搜索端 AI 购物助手智能导购,为用户提供专业商品推荐,提升选购效率,催生全新消费业态。

image.png

基于 AI 驱动的新消费模式,设计团队确立四大心智建设方向:造场景‑节日化、造趋势‑智能化、造品质‑营销化、造记忆‑品牌化,为整个双十一大促视觉搭建顶层逻辑。

  1. 造场景:紧扣夜经济,烘托大促节日氛围感
  2. 造趋势:诠释全新消费模式,传递智能化消费感知
  3. 造品质:聚焦优质商品,用营销视角放大商品价值
  4. 造记忆:放大 IP 与品牌曝光,完成品牌化传播

三、落地:把品牌心智融入设计全链路

围绕四大心智方向提炼视觉关键词与设计元素,融合 3C 数码、食品酒水、服饰穿搭、美妆个护等主流品类,完成整套主视觉设计输出。

1. 主视觉设计理念

image.png

主视觉以 “夜生活” 为核心场景,还原电商 24 小时不间断经营的新业态。夜空礼花、环绕堆叠的商品渲染狂欢的大促氛围;数字人带货、智能推荐的视觉符号体现智能电商的行业新趋势;品牌 IP、超级符号反复露出加深用户记忆;高精度 3D 视觉表现,充分展示各品类商品,传递电商营销氛围感,本次双十一主题定为AI 购物狂欢节,狂欢日不落・24 小时嗨购不停

2. 品类会场:AIGC 解决业务痛点

image.png

双十一期间要上线九大品类会场,面临两大现实难题:

  • 活动频次高,物料需求量巨大,人力供给紧张;
  • 既要统一品牌调性,又要实现不同会场之间的视觉差异化。

image.png

 

AIGC 恰好成为破局关键。团队先从 LOGO 中拆解提炼出微笑曲线超级符号,把微笑服务的品牌内核植入视觉,强化品牌记忆点。

工作流升级为:超级符号 + AIGC 生成品类素材 + 人工二次创作,产出最终页面。对比传统纯人工设计,单活动页面设计效率得到显著提升,高效化解素材多、人力不足的困境。image.png

团队为九大品类会场规划五套差异化配色,在保证整体风格统一前提下,利用 AIGC 批量生成成套视觉物料。项目沉淀 80 + 可复用的品类设计组件,形成设计资产库,能够持续赋能后续运营活动,实现长期复用复利。

完成物料生产之后,将统一的主视觉风格完整覆盖搜索、商城、直播三大业务场域,落地 11 类营销玩法与全部重点资源位,保障全渠道活动视觉表达高度统一。

总结

百度优选通过多轮大促实践,持续输出品牌内容,不断扩大品牌曝光。未来,团队将继续围绕新一代智能电商平台的品牌定位持续迭代设计方案,进一步提升百度优选的用户感知与市场口碑。

 

转载:优设

 

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

 

image.png

 

兰亭妙微ui设计公司分享:那些藏在产品细节里,给用户的小惊喜

清阳 交互设计及用户体验

兰亭妙微ui设计公司分享:在产品设计中,真正打动用户的,往往不是宏大的功能,而是一个个细腻巧妙的细节。一句共情的文案、一段独特的交互、一处别出心裁的视觉表达,都可以击穿用户心理,带来超出预期的体验惊喜。

本期整理了 10 个充满巧思的产品设计案例,拆解它们的设计思路,希望能够给各位设计师带来灵感,共同交流成长。

温馨提示:文中配图均来自各产品截图,仅用于设计学习交流,如有侵权,请联系删除。

目录

一、趣味二层楼交互:下拉刷新的创意玩法 二、情感化文案:用文字唤醒沉睡用户 三、鼓励式设计:强化用户的成就感 四、双向反馈设计:让用户感知被重视 五、弹出式金刚区:高效收纳拓展功能 六、重力交互徽章:让成就展示更鲜活 七、多元头像预设:降低个性化设置门槛 八、拟人化客服入口:拉近咨询的距离 九、场景化按钮:把产品场景融入控件 十、微动效按钮:调动用户点击欲望


一、趣味性的二层楼设计:下拉刷新的创意玩法

image.png

下拉刷新 “二层楼” 已经成为移动端非常成熟的交互模式,常被用于活动营销、功能推广,玩法也不断迭代出新。

麦当劳 App 猫窝 3.0 活动,就巧妙结合猫爪视觉符号与下拉刷新动作,打造极具趣味性的二层楼营销入口。把简单的下拉动作,变成充满仪式感的趣味体验,既抓住用户眼球,也提升用户参与意愿。

二、通过情感化的文案激活用户

image.png

用户活跃度,直接决定产品功能价值能否充分释放。如何唤醒长期沉寂的用户?情感化文案是成本很低却效果出众的手段。

钉钉运动为推动捐步功能的用户参与,针对久未使用功能的用户输出共情向文案,搭配 “天降幸运” 的心理暗示,给到用户意外的小奖励,用情绪共鸣完成用户唤醒,实现产品目标。

三、鼓励式设计,放大用户成就感

image.png

闯关、刷题类产品中,鼓励式设计被广泛使用。通过正向反馈不断给予用户肯定,放大成就感,以此提升用户投入度。

驾考宝典 App 就运用了这套思路:用户刷题连续答对题目时,页面会弹出连对提示给予正向激励。不断强化用户的做题成就感,驱使用户更加专注刷题,激发学习进取心。

四、通过反馈提升双向体验感

image.png

收集用户评价与反馈,是产品迭代的重要依据。当产品涉及多方角色时,一套合理的反馈链路,能够同时提升多方体验。

高德地图打车业务,会在行程前后分别收集用户评价。一方面用户的意见可以给到司机作为改进参考;另一方面用户的反馈行为本身,也会让用户感受到自己的想法被平台重视,一举两得,优化整体服务闭环。

五、弹出式金刚区功能延展

image.png

金刚区是 App 首页核心流量位,创意主要集中在图标视觉与交互形式上。

携程旅行 App 做了一次有意思的迭代:不再把全部功能平铺展示在首页金刚区,将更多功能收纳进底部弹窗。点击金刚区入口,弹窗呼出更多功能。既压缩金刚区占用版面,提升首页空间利用率,也拓展了金刚区的交互可能性。

六、趣味性的徽章展示

image.png

徽章是用户线上成就的符号,徽章的视觉表现、交互形式,会直接影响激励效果。

B 站创作中心对创作者徽章做了创意表达:采用玻璃球质感,结合重力感应动态效果。转动手机,徽章就跟随重力滚动,互动感十足。既强化徽章的视觉权重,也激励创作者持续产出内容,努力解锁更多成就。

七、丰富多样的头像预设

image.png

头像作为用户个人标识,代表着自我表达需求。完备的头像预设库,能够降低用户个性化设置的操作成本。

嘀嗒出行 App 个人中心头像设置模块,准备了风景、美食、运动、动物、植物等多风格头像素材,同时支持一键随机更换。丰富的预设,满足不同用户审美偏好,让用户无需自行上传图片,也能快速设置个性头像。

八、让在线咨询更真实

image.png

在线客服是大多数产品的标配。常规入口多为图标、文字按钮,而加入人物形象,就可以弱化机器感,拉近和用户的心理距离。

马蜂窝 App 在线咨询按钮嵌入客服头像,仅仅一处微小改动,就让客服入口更具真实的人感。降低用户咨询的心理门槛,间接提升咨询转化。很多时候体验升级,就藏在这些不起眼的小细节之中。

九、场景化的按钮设计

image.png

同质化 UI 环境下,把产品业务场景融入控件,是打破千篇一律界面的有效思路。

携程机票权益中心的按钮设计十分巧妙:控件复刻飞机舷窗轮廓与挡板形态。默认状态挡板闭合,点击之后模拟挡板推开,露出窗外风景,把坐飞机的场景直接封装进按钮交互,创意直观易懂。

十、动态按钮更有点击欲

image.png

按钮的视觉表现,直接影响用户的点击意愿。相比静态样式,微动效能够带来更强的视觉吸引力。

红果短剧 App 广告按钮就使用气泡发散的微动效,动态元素让按钮在页面中脱颖而出,有效抓住用户视线,提升点击转化。

 

转载:站酷

 

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

 

image.png


兰亭妙微|科技感在 UI 设计中的体现

涛涛 设计思维

在当下的设计工作中,"科技感" 一词对每位设计师来说都耳熟能详。科技的飞速发展如汹涌浪潮,深刻重塑了我们的生活模式,在 UI 设计领域更是占据着举足轻重的地位。在信息爆炸的当下,用户每天接触大量界面,那些展现出科技感的 UI 往往更容易在第一时间抓住眼球,激发进一步了解和使用的欲望。

兰亭妙微|UI 设计师遇到交互需求别慌 —— 火车票预订页面优化实战

涛涛 移动端UI设计文章及欣赏

很多 UI 设计师一遇到交互问题就紧张,觉得这不是自己的领域,老板能不能别给这样的需求。但在兰亭妙微的项目实践中我们发现,交互和视觉从来不是割裂的 —— 好的 UI 设计师本身就应该具备基本的交互思维。今天我们以一个 "买火车票千钧一发拼手速" 的场景为例,拆解一个信息密集型页面的优化全过程。

兰亭妙微ui设计公司分享:超多案例|UI 设计师务必吃透的四大核心设计原则 >

清阳 交互设计及用户体验

兰亭妙微ui设计公司分享:好的 UI 作品,背后都有一套可复用的设计逻辑。优秀设计师不是靠灵感堆砌画面,而是把底层设计原则内化到每一次排版、每一个组件当中。吃透下面这四项核心原则,反复练习推敲,能够快速打通设计思路,实现设计能力的稳步提升。

一、对齐:秩序,即是视觉之美

image.png

秩序,代表把界面元素有条理、有逻辑地组织排布,形成整洁舒适的视觉观感。生活里造型优美的建筑、排列规整的物件,都是依靠秩序带来美感。映射到 UI 界面中,对齐就是构建页面秩序最基础的手段,对齐做好了,页面就不会杂乱松散。

UI 设计中对齐的两大要点

  1. 各类元素相互对齐 文字与文字、文字与数字、文字与图片、图片与图片,以及各个内容模块之间,都要建立对齐关系。严谨对齐的界面,整体观感规整克制;一旦对齐关系混乱,页面就会显得粗糙、不专业。

    image.png

  2. 保证间距体系统一 界面间距建议遵循 4pt / 8pt 倍数栅格规范(1 倍设计稿),用标准化数值约束内外边距。 例如微信聊天列表左右边距设置 16pt,京东首页采用 12pt 边距;电商场景适当收窄边距,能够留给内容更多展示空间。

    image.png

小结:对齐不只是 “把线条对上”,而是建立一套统一的视觉坐标系,奠定整个页面的基础骨架。

二、格式塔原则:理顺远近亲疏,降低用户理解成本

格式塔理论的核心:人的眼睛会自动把视觉元素做分组归纳。设计师利用这套心理规律,划分信息层级,让用户一眼读懂内容关系。它包含六大子原则:亲密性、相似性、连续性、封闭性、对称性、主体与背景。

image.png

  1. 亲密性(邻近原则) 距离更近的元素,大脑会默认为它们属于同一组。 标题和配套正文距离要近,不同模块之间拉开距离。如果标题与正文间距过大,模块边界模糊,用户就很难识别内容归属。

    image.png

  2. 相似性 形状、颜色、大小等属性相近的元素,会被感知为同类。 支付宝应用中心就是典型案例:同一功能板块下的图标,会使用相近色调,用户可以快速区分理财、生活服务、公益等不同功能分组。

    image.png

  3. 连续性 人会下意识把断开的图形脑补成连续完整的形态。 惠普、苹果的品牌 Logo 都存在缺口,但我们依然可以识别出完整图形轮廓。UI 中很多分割线、指示箭头,同样会利用连续性引导视线流动。

    image.png

  4. 封闭性 哪怕图形没有完整闭合,大脑也会自动补全轮廓。 APP 首页里,卡片只露出一小部分,我们依然能够识别这是完整卡片,暗示页面可以横向滑动浏览更多内容。

    image.png

  5. 对称性 对称的布局会带来稳定、均衡的视觉感受。 应用商店网页端,左右两个卡片区块采用对称排布,视觉平衡,阅读体验舒适。

    image.png

  6. 主体 / 背景(主次层级) 画面里视觉权重更高的对象,会成为主体,其余内容退居背景。 弹窗就是这个原则的典型应用:弹窗作为主体浮于页面之上,底层页面变暗弱化,强制用户聚焦弹窗内的核心信息。

    image.png

小结:格式塔原则本质是善用人的视觉本能,不用多余线条,仅靠位置、颜色、形状,就完成信息分组。

三、呼吸感:把控留白,让界面张弛有度

image.png

所谓呼吸感,核心就是留白与间距。 就像拥挤的城市街道让人压抑,开阔山野使人放松,界面也一样。全部元素挤在一起,信息满满当当,会带来强烈压迫感;合理留出空白,界面才会松弛通透。

留白不是无意义的空白,它是界面的组成部分。它隔开不同模块,区分信息层级,缓解视觉疲劳,同时突出核心内容。很多精致的移动端界面,组件之间预留充足留白,整体干净清爽,就是呼吸感的直观体现。

误区提醒:呼吸感不等于一味拉大间距,留白需要和内容体量匹配,平衡信息密度与视觉舒适。

四、配图与图标精细化:细节决定页面质感

image.png

图片与图标是 UI 页面的重要加分项,细节处理不到位,会直接拉低整套设计的品质。

配图

圈内有句玩笑话:“做设计一小时,找图四十分钟”,足以说明配图的重要性。优质配图拥有完整的构图、光影与层次,能够烘托页面氛围;劣质图片会破坏整体调性,再精致的排版也会被抵消。

图标

图标是功能的可视化入口。清晰易懂、绘制精致的图标,能够引导用户操作,提升转化;反之表意模糊、细节粗糙的图标,会让用户产生困惑,阻碍信息传递。

image.png

建议使用标准化「图标盒子」工具规范图标输出,统一圆形、方形、扁形、高挑型图标视觉尺寸,保证整套图标视觉重量均衡。工具提供 PSD、Sketch 两种格式,方便设计师落地使用。

转载:优设

 

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

 

image.png

兰亭妙微|用户体验设计中的主要心理现象

涛涛 交互设计及用户体验

用户体验设计与心理学有着根深蒂固的联系 —— 社会心理学、行为心理学和认知心理学,共同构成了理解用户行为的底层框架。兰亭妙微在近期的设计研读中,系统梳理了七个对体验设计影响深远的心理现象,与大家分享。

兰亭妙微|交互设计如何影响公司的发展

涛涛 交互设计及用户体验

很多设计师都有过这样的体验:决策层直接拍板要做某个产品、加某些功能,前期目标就是快速研发、对标竞品,先做出来再说。这样做也许偶尔会成功,但更多时候会失败。大公司有试错的资本,小公司哪里耗得起。

兰亭妙微ui设计公司分享:WWDC26 落幕,Apple 系统图标迎来迭代:36 款原生 App 图标深度解析 >

清阳 行业趋势

兰亭妙微ui设计公司分享:每年 WWDC 大会落幕,除了新功能与交互逻辑,系统 App 图标总是设计师群体最先捕捉到的变化点。图标虽只是方寸之间的视觉载体,却完整折射出整套系统的设计语言走向 —— 色彩倾向、玻璃质感强弱、边缘锐利度、图层层级,每一处细节,都在重塑用户对系统整体气质的感知。

随着 WWDC26 召开,iOS 27 与 macOS Golden Gate Beta 版本上线,共计 36 款苹果原生应用图标完成迭代。新版图标依旧延续Liquid Glass 液态玻璃设计体系,但在视觉表达上做出明显转向:色彩饱和度更高、画面对比更强;厚重的玻璃折射效果被削弱,整体趋向轻盈扁平;图标边缘轮廓更加利落,图层层级关系清晰分明,全平台视觉一致性进一步提升。

image.png

需要注意,当前仅为 Beta 测试版本,部分图标细节仍有调整空间,锐利边缘、弱化玻璃光晕等特征,既可能是苹果确定的设计方向,也属于测试阶段的过渡效果。下文将结合新旧版本对比,拆解各款 App 图标的具体改动。

核心设计四大变化

  1. 视觉表现更大胆:色彩更深,画面对比度显著增强;
  2. 质感趋向更轻盈:弱化厚重玻璃渲染,减少过度折射,整体更扁平;
  3. 细节刻画更清晰:图标边缘锐化,图层层级边界明确,识别度提升;
  4. 风格一致性增强:统一贴合 iOS、macOS 全新系统界面语言。

重点 App 图标改动详情

Mail(邮件)

image.png

图标内部文字缩写由 California 调整为 CA,原先粗重的轮廓线条优化为细线条,整体更干净利落。

Maps(地图)

image.png

定位底座与建筑元素改为玻璃透视材质,原本粗犷的白色轮廓线条做细化处理,符号精致度提升。

Photos(照片)

image.png

花瓣图案采用玻璃扭曲堆叠的视觉处理,去掉厚重的实感,整体视觉重量变得更加轻盈通透。

Camera(相机)

image.png

镜头反光效果重新绘制,渲染效果更强烈,不少网友调侃新版镜头看起来酷似滚筒洗衣机。

Reminders(提醒事项)

image.png

圆点配色进一步加深,移除内部投影效果,图标一体化、扁平化特征更加突出。

Podcasts(播客)

image.png

弱化朦胧模糊的玻璃高光,圆环结构边界变得干脆利落,从柔和半透明过渡为锐利干净的液态玻璃质感。

Settings(设置)

image.png

强化齿轮外轮廓,优化齿轮内外层级,机械结构的辨识度进一步提高。

Siri App

image.png

iOS27 中 Siri 获得独立 App 图标,抛弃旧版多彩渐变底色,采用白底搭配渐变金属环,视觉风格彻底革新。

Messages(信息)

image.png

气泡造型做简化处理,去除多余柔和渐变,图标与背景对比度更高,观感直接干净。

Phone(电话)

image.png

听筒符号高度简化,去掉多余过渡渐变,轮廓干净,内部冗余细节大幅删减。

Find My(查找)

image.png

放弃柔和朦胧的透明分层,改用色块分区设计,雷达环与中心定位点一眼即可识别。

Finder(访达,macOS)

image.png

人脸图标鼻子造型更加圆润,隐隐复刻早期 macOS 访达的经典设计气质。

App Store

image.png

蓝色底色加深,渐变效果减弱,图标通透度提升,整体质感更轻量化。

Books(书籍)

image.png

书页细节做删减,书本主体居中对齐,图标识别更加干脆,但丢失了旧版柔和的层次氛围感。

其他代表性应用

  • Chess 国际象棋:强化马棋子主体视觉,弱化棋盘元素,识别更直接,但空间立体感有所削弱;

    image.png

  • Passwords 密码:钥匙的实体细节减少,色彩填充更加扎实,从写实物件转向符号化表达;
  • Image Playgrounds 图像乐园:图标完成主题切换,从抽象 AI 创作符号,改为气泡包裹的风景画面,视觉重心由工具转向生成结果;
  • Time Machine 时间机器:时钟与箭头轮廓加重,视觉重心从圆盘载体转移到备份恢复符号本身;
  • iPhone Mirroring(iPhone 镜像):删除手机屏幕内部细节,聚焦两台设备交叠轮廓,镜像的概念表达更加抽象直白。

还有大量应用(时钟、音乐、天气、备忘录、Safari 浏览器、FaceTime 等)改动幅度较小,大多仅微调刻度、明暗层次、边缘过渡,保留原本核心造型。

写在最后

这套全新图标设计,留给我们两个值得思考的命题:一是在真实手机桌面场景下,新版图标能否拥有更高的辨识度;二是这套 Liquid Glass 迭代后的视觉语言,能不能在 iOS、macOS 等多系统之间,维持高度统一的表现。

从评论区反馈也能看到两极分化的评价:有用户认为玻璃质感不断轻量化是有趣的演进方向;也有不少用户觉得新版图标显得生硬,过度扁平化削弱拟物质感,部分旧版的温润氛围感不复存在。

究竟你更偏爱旧版温润厚重的玻璃质感,还是新版锐利、轻盈的设计风格?

 

转载:优设

 

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

 

image.png

 

兰亭妙微ui设计公司分享:钉钉 LOGO 品牌升级案例复盘

清阳 平面设计

兰亭妙微ui设计公司分享数字化浪潮持续演进,钉钉的品牌理念历经多次迭代:从最初「一个工作方式」,到「让工作学习更简单」,再到全新的品牌主张「钉钉,让进步发生」。伴随品牌战略的转向,钉钉也完成了一次完整的品牌视觉焕新,把全新的品牌心智落地到 LOGO 与整套品牌视觉体系之中优设网。

核心设计思路

image.png

品牌升级并不等于全盘推翻旧视觉。翅膀与闪电,是用户心中对钉钉最深刻的视觉符号记忆。本次升级的核心逻辑:保留用户固有视觉记忆,在原有识别基础之上,把全新品牌理念转化为可感知的视觉语言,实现传承与革新的平衡优设网。
新品牌理念拆解为三层内核:科技普惠、科技向实、技术平权。既要延续钉钉与生俱来「高效敏锐」的工具属性,又要传递向前成长、开放包容、谦逊服务者的全新品牌姿态。

一、守住视觉记忆,优化细节表达

image.png

 

翅膀与闪电,承载着钉钉长期以来「高效敏捷、极致效率」的产品初心。新版本没有抛弃这套符号,而是对形态做精细化打磨,赋予图形更多层次的内涵。
  1. 闪电细节调整:蓄势待发的力量感image.png
     
    微调闪电图形的倾斜角度,整体造型更加紧凑利落,传递出蓄势待发的动态势能,保留效率属性的同时,强化向前迸发的视觉感受优设网。
  2. 翅膀形态重构:更自然,更亲和

    image.png

     
    设计团队参考真实鸟类羽毛的生长形态,重新优化翅膀的弧度、羽毛分层与转折角度。相比旧版偏硬朗的线条,新版翅膀线条更加柔和自然,以此传递钉钉作为数字化服务者谦逊、亲和的品牌姿态优设网。

二、品牌心智具象化,把 “进步” 画进 LOGO

如何用图形去诠释「进步」这一抽象概念?设计团队经过多轮创意发散,最终锁定箭头「>」这一符号。
 
箭头代表方向、前行、突破与向上生长;可以是路标指引前路,可以是候鸟迁徙的编队,也可以是山峰向上崛起的尖顶。有趣的是,这个箭头意象,早已潜藏在旧版 LOGO 的轮廓线条之中,本次升级将它显性化、强化表达。
  • 强化向前的箭头意象:将原本偏朝上的视觉趋势,调整为朝前指向,强化前行、奔赴进步的方向感,让 “进步” 的概念一眼可感知。

    image.png

     

  • 校正视觉重心:修复旧 LOGO“头重脚轻、视觉后倒” 的问题,新版 LOGO 视觉重心均衡稳定,图形观感更加舒展稳重优设网。image.png
  • 去掉圆形外框,释放开放的力量

    image.png

    旧 LOGO 的圆形外框装饰属性大于功能。新版直接移除外框,图形可视面积扩大至原来 1.5 倍,图形识别度大幅提升。这一改动,也隐喻钉钉打破边界、开放破圈,践行数字化普惠,服务每一个组织与个体的品牌决心优设网。

三、字体同步迭代:为品牌注入动态张力

字体是 LOGO 体系不可分割的一部分。

image.png

 
旧版钉钉字体方正严肃,偏向传统 B 端工具的稳重感;新版定制「钉钉发生体」,字体增加 7° 微倾斜,竖勾位置做弯曲弧度处理,整体拥有更强动态感与向前的张力,与图形部分的前进意象形成完整呼应,整套 LOGO 图形与字体气质高度统一优设网。

结语

image.png

从效率工具,走向数字化普惠;从 “让工作学习更简单”,升级为 “让进步发生”。本次 LOGO 品牌升级,只是钉钉品牌视觉体系迭代的起点。通过视觉语言,向用户与生态伙伴传递品牌内核,搭建属于所有人共同进步的数字化平台,是钉钉持续探索的方向优设网。
 

 

转载:优设

兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

关键词:UI咨询、UI设计服务公司、软件界面设计公司、界面设计公司、UI设计公司、UI交互设计公司、数据可视化设计公司、用户体验公司、高端网站设计公司、银行金融软件UI界面设计、能源及监控软件UI界面设计、气象行业UI界面设计、轨道交通界面设计、地理信息系统GIS UI界面设计、航天军工软件UI界面设计、医疗行业软件UI界面设计、教育行业软件UI界面设计、企业信息化UI界面设计、软件qt开发、软件wpf开发、软件vue开发.

我们建立了一个微信群,每天分享国内外优秀的设计,有兴趣请加入一起学习成长,咨询及进群请加蓝小助微信ben_lanlan。

 

image.png

 

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档