知识科普
- 渐进式披露：按需展示高阶复杂功能，不一次性堆砌全部信息，降低用户认知负荷，适配新手渐进学习。
- 自我决定理论：产品设计满足用户自主性、胜任感、归属感三大心理需求，提升使用意愿与粘性。
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
又到了分享界面改版优化的时候了，这次是近期C端学员做的体育场馆预约平台，主要用于在线预约羽毛球、网球、篮球等场馆。
下面是目前的设计图例：
学员作业
还是老规矩，我们从原设计的问题入手，然后逐步完成对它的改版优化。
问题分析：
问题的分析从不同维度入手，这里分享个最简单的分析方式，先从基础样式分析，再分析组件设计。
基础样式包含规范、字体、色彩、图片四个要素的分析，而组件设计则是检查样式的合理性为主。
首先基础样式的规范应用上，顶部状态栏和底部指示器、导航是没有太大问题的，所以我们可以直接进入下一个环节。
在字体应用上，问题就多起来了，主要还是特殊标题使用太多，且广告中的标题也和下方 UI 元素标题没有拉开差距，看起来就很别扭。而且大粗黑字体使用过多，使得信息权重被分散掉，没有对比性。
有问题的部分截图
在色彩层面，蓝色虽然是主色，但是使用过于频繁，且其它色彩的应用数量也过多，画面充斥了让人眼花缭乱的色彩，尤其色彩多的情况下图片色彩也丰富，外加一系列渐变色块，让场面变得更“错综复杂”。
使用的色彩过多
最后图片应用上，主要问题出在广告图里，图例和文字排版看起来很有年代感，加上瓷片区内的素材用图，和整体主体的关联性并不好。这里着重强调， 3D 拟人类图片素材的使用最好局限在特定运营活动物料里，不要作为正式的 UI 元素进行引用，怎么做效果都不会好。
接着分析组件样式，因为这次案例框架很简单，我们不用太多考虑组件排序依据还是产品问题，只需要每个组件孤立出来分析即可。
1 .首页顶部组件
主要问题就是广告图的设计，不符合当前应用的设计标准，字体用图排版都很简单。
2.快速入口组件
快速入口上下两排权重完全不同，虽然有大小的差异但依旧对比不够强烈，且色彩使用混乱。
3.瓷片区应用
两个页面都有瓷片区，布局过于接近，且没有实质性的内容全是装饰素材，非常影响点击欲望和观感。
4.常去场馆卡片
属于问题相对较小的模块，但标签的应用色彩不合理，而且标题也露不全，实际空间利用率没有必要的低。
5.列表卡片
列表卡片的主要问题还是和主色按钮有关，过于强调按钮的同时又要突出其它信息元素，就让卡片看起来非常聒噪，信息之间是会起冲突的。
6.底部导航
底部导航设计过于普通，且一般选项选中凸起只适合在首页选项中使用。中间添加按钮的尺寸过小，和两侧选项看起来不对齐，重心偏移。
以上就是对问题的简单总结，实际上改版就是围绕这些问题做出调整，你先分析得出问题，才能聚焦到具体设计的过程和细节。
基础规范是整体，而我们设计过程中大多从细节出发，所以我们对优化的内容解释就要反过来从组件开始。
1.顶部模块设计
首先调整顶部模块的设计，优化图例，使用比较突出的字体标题和更有冲击力的配图，符合运动类应用的主基调。同时因为之前主色用太多，这次顶部直接不加主色类背景。
2.快速入口的设计
快速入口设计上使用两种图标体系，上方用偏扁平插画型的风格（素材示意），下方用面性图标风格，弱化它们的权重。同时第二个页面的快速入口使用摄影图型图标，避免一直出现不同风格的图标。
3.瓷片区设计
瓷片区做大就需要有内容展示，但这些主体值得展示的内容并不是太多且需要那么大空间，所以缩小尺寸不会让设计那么难处理，也让画面更精致一点。
4.其它模块设计
因为首页上方已经有很花哨的模块了，所以常去场馆就不应该再花哨下去，可以务实点的设计，不再用复杂的外边框套娃。
第二个页面其它模块相对简单，拼团功能又重要所以可以突出它用包边型的组件设计。
5.列表模块设计
两个页面下方的列表模块，都移除原来主色的按钮，只保留关键信息，让卡片视觉看起来更简约和谐一点。
6.底部导航栏设计
放大中间的按钮，同时优化第一个选项选中的设计，可以更突出（时间够就做LOGO进去了）更强调选中。
完成这些处理以后，最后合并起来可以整体再调整一番进行最终输出。我们可以看看下面改版前后的对比，你们可以自己感受是否有差异：
这是纯视觉方向的优化，在新手阶段，不要过度去使用色彩和字体，实现样式的落差要通过组件样式和图片、素材应用的差异来塑造。
转载：优设
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
| 组件 | 选择逻辑 | 核心特点 | 生效方式 | 最佳使用场景 |
|---|---|---|---|---|
| 开关 | 二元独立切换 | 单功能、无关联 | 操作立即生效 | 单独功能开启 / 关闭 |
| 复选框 | 可多选、可全不选 | 同组关联、支持全选半选 | 多为统一确认生效 | 关联选项批量勾选 |
| 单选按钮 | 互斥单选、必选其一 | 组内唯一、排他选择 | 选定即锁定选项 | 多选项只能选一个 |
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
登录页不只是入口，更是认知与信任的第一触点。本文系统梳理12种登录页设计切入点，从色彩、构图到情绪表达，揭示如何通过界面设计实现用户引导、品牌传达与转化效率的协同优化，是一次关于“界面战略”的深度解析。
我们设计师是不是最害怕众口难调，今天兰亭妙微UI设计公司，跟大家分享登录页的12种设计切入点，相信总有一款会入甲方爸爸的心。
作为设计师，我们常常面临一个窘境：要面对各式各样客户审美的挑剔，有时候被虐的都怀疑人生。
但找参考时，思维又容易被局限在常见的几种形式里，我通过分析大量优秀的登录页，总结了12个高级的设计切入点，希望能为你打开新思路。
设计解析：
设计解析：
设计解析：
设计解析：
设计解析：
设计解析：
设计解析：
设计解析：
设计解析：
设计解析：
设计解析：
设计解析：
通过以上12个案例的系统性拆解，我们发现B端登录页的设计可以有如此丰富的切入点。
它绝不仅仅是摆放表单的简单任务，而是一个融合了品牌战略、用户体验、视觉营销和技术表达的综合性设计挑战。
希望这10个切入点的详细分析，能成为您应对登录页设计挑战的灵感源泉和实用工具箱。
一个高级的设计，其最高境界是让用户感觉不到“设计”的存在，却能高效、愉悦地完成目标，并对品牌留下积极而深刻的印象。
转载：人人都是产品经理
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
今天，兰亭妙微UI设计公司分享的是「常见的交互设计套路」。
不知道大家有没有过这种体验，睡前拿起手机刷短视频，原本打算看几条视频就睡觉，结果刷着刷着一两个小时就过去了。
那么我们为什么会忍不住一直“刷刷刷”呢，这种设计背后藏着哪些交互逻辑。今天就来好好聊聊这个话题。
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
今天兰亭妙微UI设计公司，来讲解 B 端产品界面的视觉风格，聊聊在整个行业当中视觉风格的变化与目前的现状。以及给大家说说未来应该如何选择自己产品的视觉风格～
我们会将整体分为行业初期，萌芽期、成长期、野蛮发展期、新阶段 ，每一个阶段给大家总结一个最为流行的风格，并分析这个风格出现的原因，方便大家进行理解。
我们把时间拉回到 2012 年。在那时，Ant Design 还没有出现，也没有什么 Element、Semi Design，行业当中最早的 B 端系统都是以客户端的形式进行呈现。
整体风格也非常老旧，像是那会儿的 Office、SAP、Salesforce，你可以看到都是他们青涩的模样。
在经典传统的设计风格当中，会使用大面积的白色作为底色，同时在页面中用灰色进行分割，使得整个页面散乱抢眼，导致整体的视觉很难被大众所接受，总体感觉信息较散，难以进行聚焦。
而在早期，出现这些老旧风格主要有三个原因：
1.技术框架限制：因为当中成熟的前端框架较少，没有太多技术栈提供给到开发进行使用，因此没有精力将页面做得漂亮
2.认知不足：设计师对于客户端、网页端的设计理解认知本身不够，做得较为粗糙，比如当时的 Office 的界面设计也大致是如此的模样
3.风格一致：早期 Windows 系统就是这样的风格，与 Windows 一致更容易被大众所接受，因此就很难进行创新
关于这类风格的产品，大家不要觉得这夸张，其实在目前依旧有很多产品会延续这个风格。比如 医疗类产品、工业生产类系统，对于他们而言，能用即可，不必纠结太多。
但随着时间的推移，行业中对于 B 端设计的要求也在逐渐变高。
我们将时间推移到 2015 年前后，随着行业不断发展，在国外 Fiori、Salesforce 的出现让大家意识到，这类型的 B 端产品也是需要设计的。
因此国内外的很多系统都是在这一时间面世，像是 Ant Design 、Element 都相继发布。
由于这些设计系统的诞生，你会发现大家对于整个 B 端设计有了一点自己的想法。
在设计上，会去考虑使用 区块划分，将整个页面进行规整呈现。
比如 SAP 在使用了 Fiori 过后，就会使整个界面更干净。
同样非常老牌的 Salesforce 在2015年的时候。也带来了相当大的视觉变化。整体都能感受到，整个页面会通过不断的分层颜色的划分通过黑白灰的方式去呈现页面当中的基本信息。
我们的时间来到 2018 年前后，在这个时间节点，很多产品都推出了自己的设计系统，对于 B 端设计风格而言，也会提出更高的要求。
比如 Teambition 产品当中，它们提供了自己的设计系统的内容去指导整个产品来进行迭代和优化。同样 Ant Design它们也推出了自己的 Ant Design Pro 来演示使用设计系统过后，能够搭建出什么样的产品。
同样，这个时段很多产品也开始进行自己产品的视觉优化，这时候整体的风格是以：黑色侧边导航为主，然后内容形态进行延展。
比如像有赞、Coding、微盟、飞书，之前都是这样的设计风格来进行呈现。
你会发现它们在整体的设计上都会更加重视页面的分块颜色的区隔，整体页面的识别效率。同时这段时间爆发出来非常多的 B 端产品，随后国内都会按照侧边黑色导航的样式进行进一步设计，这一定程度上提高了国内 B 端设计的下限～
我们随后将时间推移到 2019 年后，在这时诞生了新拟态设计风格。
它最早是乌克兰设计师 Alexander Plyuto 在追波和 ins 发布的一副系列作品，随后大家发现非常奇特，所以得到广泛的关注。
新拟态的设计风格是以立体效果与浮雕元素，呈现更为三维立体的效果，会给人一种奇特、梦幻的界面体验。
随后就会有很多产品都开始进行跟进，比如 智能家居的产品、金融类产品都有所涉及，甚至很多B端产品也勇敢尝试，但大多数设计师设计完过后，整体评价都不算太高。
为什么没有大规模的推行，我觉得有 3 点原因：
1.因为新拟态风格整体所占面积较大，比较浪费空间。像是一个按钮，都需要使用较大空间才能呈现。
2.需要大面积的留白，但是对于 B 端设计来说无法做到，因此很难进行使用。
3.同时很多用户刚开始觉得好看，但随着时间的推移，出现审美疲劳，因此就不太喜欢。
现在还会使用新拟态风格的界面设计越来越少，大多数只会在官网设计的局部进行使用，这样可以转换视觉感受，给到用户更好的视觉冲击～
时间来到 2022-2024 年左右，你会发现很多产品都开始在这个时间节点进行更新。
像我们熟知的 飞书、有赞、微盟、ONES、Coding，再到 Ant Design 、Salesforce，你会发现非常多的产品都在进行界面风格上的迭代。
对于这个风格，我们愿意叫它为 灰白风。
整体页面是以 灰色和白色 进行的页面划分，在分布上灰色占据弱侧信息，白色占据核心信息，进而形成对页面内容的划分。
聊到这里，可能有部分同学不太理解，这里我们以飞书管理后台的迭代作为示例，给大家进行讲解。
在 2018年，飞书管理后台的第一个版本，采取的就是沉稳侧黑风，
在 2022 年，飞书的管理后台开始改变为灰白风格
由于业务的叠加，2023 年时，在此基础上增加了顶部导航的业务维度，最终形成了现在这样的界面。
为什么这类型的风格会大受追捧，我觉得有以下几个原因
1.减少信息层级，给用户减负：之前沉稳侧黑风格，会发现页面明显进行大面积的分割，导致视觉感受出现较大差异。现在只用灰色作为底，去区分主副信息这样会更简单的突出主要信息内容。
2.平台型产品更容易嵌入：因为国内 B 端产品大多需要依附“钉钉、企微、飞书”三大平台，因此使用灰白风能够让自己产品快速嵌入，不需要过多调整。如果你的产品是沉稳侧黑风，那结果想都不敢想…
3.更容易进行适配：针对多产品的业务，也能够使用同一套业务完整呈现才会更加合理。比如飞书的灰白风，在飞书的其他很多产品里面也会存在
转载：人人都是产品经理
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
兰亭妙微UI设计公司，本次分享主要的工具也都是 AI 相关，有工业和产品 3D 设计 AI 平台 3flow，语音转社交媒体图片的 AI APP，面向 AI 创作者和开发者的在线社区 B150，专业的 AI 图像生成与编辑平台 APImage，Win95 风格 AI 创作者交流社区，以及荣获黑客松大奖的 AI 编程配置的超强 Skill。
3Flow AI 是一个面向产品设计的 AI 工具，可以在浏览器里直接使用。它的核心能力是把「想法」快速变成设计图，甚至直接生成 3D 模型，帮助设计师从灵感到初步原型的过程大幅提速。相比传统设计软件，它更偏向创意阶段，让你几秒钟就能看到一个产品雏形。
在功能方面，3Flow AI 是非常突出的，生成速度非常快（几秒内出图）、支持从 2D 图像一键转成 3D 模型、可以对局部设计做修改（比如换材质、颜色），以及自动生成多种设计变体用于对比。整体上，它把「画图 + 建模 + 修改」的流程整合在一个工具里，减少反复切换软件的成本。
3Flow AI 彻底降低了 3D 和工业设计的门槛，你不需要会复杂的 CAD 或 3D 建模，也能快速把想法变成可视化甚至可打印的模型。对于做产品、内容创作或创业的用户来说，它可以显著缩短从创意到验证的时间，让「想一个东西并做出来」变得更容易、更便宜。
Reframe 能将你的语音笔记转换成专业的 Instagram / LinkedIn / Facebook / X 上展示的轮播图，当然这可以发到微博/小红书/小绿书/朋友圈。你只需说出你的想法——AI 会自动构建框架、设计每个幻灯片，并保留你真实的语气。无需任何设计技能。
简单来说，Reframe 是一款专为创作者设计的 AI 社交媒体排版应用，它的核心理念是将用户的「语音」直接转化为具有专业设计感的轮播图和文字贴文，帮助创作者在没有专业团队和设计师的情况下快速制作内容。
Reframe 核心优势是「语音转图文」与「对话式编辑」。你只需录制几十秒的语音表达想法，内置 AI 就会自动编写出高吸引力的文案，并生成带排版的轮播图草稿。你可以通过与 AI 聊天来微调文字内容，还能自由套用精美的预设模板、修改字体和颜色，最后支持一键导出为图片或 PDF。
Reframe 极大降低了内容创作的门槛与时间成本，无论是在通勤路上还是灵光一现时，只需动动嘴就能把零碎的灵感瞬间变成高质量的社交传播素材。它完美解救了不擅长写文案和做排版的新手，让每个人都能轻松像专业博主一样高效产出爆款图文，提升个人影响力。
B150 是一款专为 AI 开发者、创作者和创业者打造的「专业社交网络」与社区平台。它致力于成为那些利用 AI 技术进行编程、设计、影视制作、游戏开发等领域的「实干家」们的聚集地，帮助他们将大胆的想法转化为真实落地的项目。
B150 提供了以项目为驱动的在线社交体验，AI 创作者不仅可以在信息流中展示自己的作品、获取早期种子用户和真实的反馈，还能在这里寻找志同道合的合作者。此外，它集成了 AI 工具及资源探索、AI 人才与工作机会招聘看板，以及专属的工具折扣市场，全方位覆盖从产品构思到发布落地的各种需求。
对于普通的 AI 爱好者和创作者而言，B150 提供了一个高浓度的专业学习和互助圈层。它打破了传统社交媒体的杂音，让你能专注于看别人是如何利用最新的 AI 工具来解决实际问题的。不仅能帮你少走弯路，还能让你在发布自己的「副业」或项目时，快速找到第一批支持者，真正将「想法」变成「事业」。
APImage 是一款专业的 AI 图像生成与编辑平台，专为电商团队、企业和创作者打造。它能够将简单的文字提示迅速转化为高质量、可直接用于商业生产的视觉素材，如产品展示图、生活方式插图或品牌创意海报，只需几秒钟即可完成。
APImage 的核心优势在于强大的「视觉一致性控制」及全面的编辑工具，不仅具备文本生图、一键抠图和局部重绘功能，最亮眼的是允许用户建立专属资产库。这意味着您可以在不同场景中反复生成拥有完全相同人物面孔、产品细节或特定背景的图片。此外，它还支持 API 接入和各类自动化工作流整合。
对普通用户、电商小卖家和自媒体人而言，APImage 彻底打破了专业摄影和设计的门槛。无需租借影棚或聘请专业模特，仅靠打字就能稳定地产出成套的、风格统一的高端商业大片，并且它就是为这样的场景而创造的。APImage 解决了传统 AI 绘图「每次结果都随机、难以连贯」的痛点，让个人也能轻松拥有专业级的视觉生产力。
链接：https://www.ideaboard95.com/
IdeaBoard95 是一款主打复古风格的公开创意灵感看板网站。它的界面被精心设计成了经典的 Windows 95 操作系统风格，为独立开发者、创作者和普通用户提供了一个展示产品想法、寻找灵感以及进行社区交流的公共空间。
IdeaBoard95 将复古视觉与极简交互结合，用户可以使用 Google 账号快捷登录，在看板上发布有关 App、网站或 AI 的产品点子，也可以为别人的好主意点赞投票。尽管外表怀旧，但它底层具备优秀的现代用户体验，在电脑和手机端都能清晰浏览，并支持通过标签快速筛选感兴趣的内容。
IdeaBoard95 提供了一个轻量化、充满趣味的「想法展示区」，它避免了零散的灵感在复杂的笔记工具中吃灰，并用这种没有压力的怀旧方式降低了分享的门槛。这让每个人都能轻松地把脑海中的奇思妙想贴在「公屏」上，纯粹地碰撞思维火花并验证点子的可行性。
链接：https://github.com/affaan-m/everything-claude-code
Everything Claude Code 是由 Anthropic 黑客松获胜者开源的一款极具人气的 AI 编程配置库。它并非独立软件，而是专为 Claude Code、Cursor 等 AI 智能体打造的「性能增强与工具扩展包」。
这个 Skill 提供了一套开箱即用的精密架构，内置了大量专家级的 Agents、按需加载的 Skills 以及自动化规则。它全面支持多语言环境，并具备记忆持久化、持续学习和安全审查等高级功能。这些配置能有效优化大模型的 Token 消耗，让 AI 像资深工程师一样精准拆解并自主执行复杂任务。
哪怕你是纯粹的新手小白，你也可以轻松使用它，因为它彻底免去了耗时费力的「AI 调教」过程。只需简单引入这套经过实战检验的配置，就能让原本基础的 AI 助手瞬间掌握数百种专业开发技能。它极大地降低了高效开发的门槛，让没有深厚技术积累的人，也能以几倍的速度搭建出高质量的应用程序。
转载：优设
兰亭妙微（蓝蓝设计）www.lanlanwork.com 是一家专注而深入的界面设计公司，为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计，以及相关的软件开发服务，咨询电话：01063334945。
蓝蓝设计的小编 http://www.lanlanwork.com