AI 行业的爆发始于2022年 ChatGPT 和 Midjouney 的发布,到现在已经快4年了,整个发展过程用突飞猛进、日新月异形容一点都不过分。
但不管它过去还是现在,发展得有多迅猛,都依旧处于行业早期的开荒和发展阶段,离真正成熟的理想形态还有很长的一段路要走,这是我们首先要达成的共识。
而之所以有这样的结论,原因就是 AI 的发展速度是超过现实世界匹配它的速度的,这造成了一种经济和机会成本上的巨大阻力。
简单来说,我们可以把 AI 技术的应用拆分成上、中、下游三个层,上层是 AI 的核心,主要是算法、大模型,中游是负责运行AI模型的硬件和支撑,即 AI 芯片、光模块 CPO、高速内存 HBM、服务器液冷、特高压电路等,下游即 AI 具体的应用工具,包括 AI 软件、硬件、智能体等。
这是一个非常庞大且复杂的产业链,它们之间是需要相互耦合,才能顺利应用到具体的使用场景中。
简单来说,就是 AI 模型厂商需要根据技术路线和成本选择硬件并购买算力中心,以及消耗海量的电力来训练自己的模型并维持它的正常运转。虽然这些背后的基建作为普通用户可能感受不深,但头部厂商的竞争已经到了白热化的阶段。
比如大模型的开发必然要关注硬件规格和架构,大洋彼岸除了英伟达外,还陆续推出了谷歌 TPU、微软 Maia、英特尔 Gaudi 等芯片,它们代表了不同的技术方案,应用在了不同的模型上。
而因为贸易和地缘政治的因素,国内是无法进口这些高端芯片,所以我们只能自研生产以满足国产大模型的需求。如阿里在自研并应用自家的真武系列芯片, DeepSeek 近期更新缓慢的重要原因就是因为要适配华为的昇腾系列芯片等。
之所以要提这点,是因为 AI 大模型的发展也适用马太效应,赢家通吃。在接近性能和水平下谁家应用的算力、电力成本最低,谁就具备了最大的优势。
而每家大模型厂商都要面临技术路线的选择,并投入海量的成本孤注一掷做基建,很难走回头路。这种发展路径注定会让行业发展充满波折和动荡,会有很多企业倒在半路上,连带着它们提供的产品和服务一起逐渐消亡。
比如文生图的 OG Midjounery,已经无法跟上大厂的技术和训练规模掉队,在今天已经无人问津,而一年多前网上还到处都是用 MJ 生成UI界面设计,UI 设计师要下岗的帖子。
强如 OpenAI,也要应对 Google、X AI、Anthropic、Seedance 的冲击和成本管理失控(GPT5 训练量需要消耗一个中等规模城市1年用电量),也在近期放弃旗下的文生视频工具 Sora。
模型和硬件端都充满了巨大的不确定性,因为技术的发展是需要“试”出来的,总有前浪会被拍死在沙滩上。至于谁会被拍死在沙滩上就不是站在今天的视角上能回答的。
再回到我们今天的主角 Anthropic,这是一家非常务实的 AI 公司,专注于开发有商业应用场景的大模型,是写作、编程等领域中的最佳选择。与之相对的则是类似 ChatGPT、Gemini 这类全能多模态大模型。
因为其模型可用性极高,所以从去年开始付费用户量暴增,在今年初预估年化收益已经超过300亿美元,不仅用户付费率远高于 OpenAI,且运行成本也远比它低。
而这家公司想要年底要上市(估值8000亿美金),产品矩阵的拓展就成为非常重要的资本策略。通过发布 Claude Design,能很好的和 Claude Code 实现联动,完成使用 AI 开发软件的闭环。
至于现阶段 Claude Design 够不够用不重要,毕竟故事和逻辑是成立的,作为初版它也有后续升级迭代和优化的空间。在我们目前的试用中,它的生成效果也就那样,但消耗的 Token 量(你最好确保自己有个足够鼓的钱包)……
Claude Design 有新上市的光环风头正盛,那是否还记发布也还不久的Google Stitch、OpenClaw、FigmaMake、Rive、Pencil 等等。
再往前是否还记得使用 StableDiffusion 训练 Lora 和 Checkpoint 的工作流?
工具一直在更新,即使今天还很粗糙。但用发展的眼光看问题的话,终有一天它生成的质量会足够高足够智能足够可控,甚至通过脑机接口 BMI 实现所想即所得的水平(又到了做梦的时候)。
但是,那天是什么时候?
以及,和你现在设计的界面有什么关系?
作为设计师一定要搞清楚的逻辑,就是 AI 生成界面和图像的过程,只是一种工具的发展和进步,提升了设计师的设计效率。就像人类发明了电脑和软件,取代了尺规作图,同样也大幅度降低了设计的效率和成本,但设计师这个岗位并没有消失。
因为使用工具的人之间的差异,会直接影响最终的输出效果,就像用同一个 AI 生成工具你可能就是做不出网上高赞帖子的案例,都用美图秀秀不用 PS 去 P 图你也 P 不过有一定专业积累的摄影师。
而且任何工具使用都有门槛,就一个简单的 Claude Design、Google Stitch 安装和使用都需要学习和适应,生成结果还要做大量的调节和校准,这些就不是工作量,老板和产品经理也一定能闲得每天学习新工具并且直接自己干?
我相信有很多公司现在都很热衷于拥抱 AI,强行推进 AI 的工作流,从企业战略和发展的角度来讲是能够理解的,但在实际执行层面上却不会像想的那么美好。其中最大的问题就是前面提到的整个产业的不确定性,产品还都有各自的局限。
每个团队在搭建 AI 工作流的时候需要做技术的选型,以及围绕自己的实际生产场景优化工具的使用方式。往往为了一个简单的工作结果就要耗费大量的精力去搭建工作流,而这个工作流很可能是一次性的,因为之后的工作场景发生改变这套工作流就用不了了。
有些同学可能心态好点觉得这种过程可以收获宝贵的经验,但最不幸的,就是工具的升级和更新(甚至关闭)可以直接颠覆掉原来的做法,让原先的成果毫无意义。
在我朋友中普遍得到的反馈,就是在稍微复杂的专业场景中,强行适配 AI 的结果往往只有增加工作量,原先目标的降本增效,实际导致了更长的工作时间和更晚下班,从去年到现在在不同 AI 工具中做研究疲于奔命。
换个角度思考,其实就是工作过程变成今天用 PS,明天用 Figma,后天用 Excel 或 PPT 进行设计,每一阵子换个工具设计相同的东西,而它们又不能解决设计过程中最复杂的决策部分。
也就是我们一直在使用充满不确定性的工具去寻求相对确定的结果。
这就是今天 AI 工具在 UI 行业中应用的真相,不管我们怎么用逻辑还是格局去判断未来 AI 要实现一切,但起码不是今天和最近,就是变得更强了,也依旧需要有人去操作和控制。
而我们现在要做的是关注最终输出的结果,而不是和别人炫耀 Figma 用的好,还是 Sketch、XD、即时、Pixso 用的好。等到市场竞争格局基本确认,通用的工具也普及以后,再去掌握和学习也不会低人一等(门槛不会高到哪里去)。
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

谈论 AI 就绕不开大模型,它是 AI 技术应用的核心。
简单解释 AI 大模型,就是一个通过特定方法和大量数据训练出来的 “自主化程序”,这个程序可以根据用户输入的指令自己做出 “判断和思考” 后再进行回复。
传统程序虽然也可以执行用户的指令,但回复的内容和方式不会超出一开始预设的范围,非常有限。
而 AI 大模型则大大拓展了这个边界,我们不用提前预设各种条件和逻辑,它就会自己去理解问题再决定给出什么结果。
当然,这个边界只是不能生成图片(截止到2026年初)。而 Google 开发的 Gemini 大模型则是多模态模型,可以生成图片和视频等内容。
不同模型会有不同的表现和优劣,但因为大模型的开发需要尖端的技术和庞大的规模(训练),门槛极高,所以市面上主流的大模型数量并不多,可以简单分为国内和国外两个阵营。
国外的主流大模型包括 OpenAi 开发的 ChatGPT,Google 开发的 Gemini,Anthropic 开发的 Claude,xAI 的 Grok 等。
国内的主流大模型则包括字节开发的豆包,阿里开发的千问 Qwen,深度求索开发的 Deepseek,月之暗面开发的 Kimi 等。
因为前面说过大模型的局限性,所以为了应对不同的应用场景,团队就会将它们裂变出不同的版本。比如千问既有 Max 语言大模型,还有 Omni 全模态(文字、图片、音频、视频)大模型,针对处理问题的难易度又分成了 Max、Plus、Flash、Lite 等版本。
完整的大模型体积和参数都非常庞大,需要部署到专属的算力中心,并通过云服务来实现用户的访问和使用。也就是需要联网使用,但因为国内网络服务的限制(不可抗力),我们无法通过国内电信访问国外的主流大模型。
虽然说国内大模型的水平在这几年突飞猛进,但离国外的大模型还有一定的差距,在实际工作场景中多数应用的也是国外大模型,所以访问它们就需要大家自己发挥主观能动性解决了。
顺便再解释一个基础的问题,大模型除了远程访问以外,也可以在本地进行安装。部分团队(如千问)会在网上开源自己的大模型供其它人下载和使用,当我们下载到本地后就可以用 GPU 来运行它。但因为大模型对性能的要求极高(旗舰显卡起步),所以本地运行的效果要大打折扣。
而一些企业内部或行业专属的大模型,往往都是使用这些开源大模型进行二次训练和调试后的结果。还有一些针对特定硬件(如手机、眼镜)和特殊应用场景开发的小模型,就暂时不在我们的讨论范围之内。
前面讲过大模型可以类比成一种 “程序”,且它还是后端服务器上运行的程序。想要对这个程序实现命令的输入并返回它处理的结果,就需要应用前端的工具来实现。
比如我们打开豆包的官网,就可以使用这个网页对豆包大模型提出问题和要求,然后网页上就会返回它处理后的结果。这个网页就是使用大模型的工具,而这只是 AI 工具的其中一种形式,还可以是本地应用程序、手机 APP、小程序、硬件定制系统等等。
我们大多数人开始接触 AI 大模型,都是从这些官方的工具开始,它们最基本的功能就是根据指令返回文字或图片信息,我们会把它们当成是一种可以对话的人工智能客服。
但实际上它们可以发挥的作用远不止于此,比如帮你整理本地的文件夹清理重复的文件,帮你自动修图并完成动态相片的剪辑,帮你编写程序并自己运行和检测等等。想要实现对话以外的其它功能,就需要借助特定的工具才能实现。
所以除了最基础的对话工具外,行业还衍生出了很多激发大模型潜力的 AI 工具。它们可以借助大模型完成程序开发、视频剪辑、操作托管、热点整理、消息推送等等。
到这里我们就要清楚,AI 大模型是大模型,工具是工具,大模型是基座,而工具是大模型的具体表现和应用形式。
我们更进一步认识 AI 工具,就可以把AI工具分成官方工具和第三方工具两个种类。
官方工具就是 OpenAI、Google 等大模型企业自己开发并绑定自家大模型的产品,而第三方工具则是其它团队开发,再接入到大模型进行使用的工具。
比如本地聊天机器人 Cherry Studio,它本身只是个简单的聊天对话工具,可以自己创建对话角色/助手,但需要接入大模型以后才能进行对话。还有著名的AI编程工具 Cusror,只有接入大模型以后,它才可以实现 AI 编程和代码管理。还有前阵子火遍全球的龙虾 Openclaw,也只是个本地工具,需要接入大模型后才能识别本地的文件和执行命令。
官方能提供的 AI 工具与服务往往很有限,所以在真实项目流程中,我们就会混合使用多种工具来完成工作。就像以前做一套项目除了用 Figma以外,还要结合使用 Adobe PS、AI、C4D、AE 等软件。
而第三方工具和官方不同的是,官方工具默认连接自家的大模型,用户直接登录就能使用。而第三方工具要接入大模型,就需要进行额外的配置,也就是添加大模型的 —— API。
API 就是接口,是前端工具连接后端服务器的通道,而这个通道默认是上锁的,还需要提供对应的密钥(API Key)才能正常访问。
部分工具会自己接入各大模型的 API,用户只能选择它提供的模型,并只需要对这个工具进行付费即可。
另一部分工具则需要用户自己选择模型和配置 API,需要我们访问大模型的 API 开放平台进行申请,然后再将它们生成的 API Key 填入到工具中完成连接。
API Key 就像是一个电话号码,当我们申请完并进行使用,就会产生一定的 “流量”,而 AI 产生的流量用专业术语形容叫词元 Token。
使用 API 完成的任意 AI 服务,都会消耗 Token,且因为 AI 的计算成本极高,所以主流大模型都会针对 Token 消耗量进行收费。就像电信运营商一样,既有包月服务附带一部分流量,超出部分还要按量计费。
在实际的 AI 工具使用过程中,Token 的消耗是极其巨大的,往往会造成沉重的成本,而这个市场也遵循一分钱一分货的真理,越好的大模型价格就越贵。以最适合编程的大模型 Claude Opus 为例, 一个程序员高频使用消耗的 Token 账单可以从数千到数万元不等。所以我们也会从性价比的角度出发,来搭配不同的模型进行使用。
总结我们应用 AI 的本质,就是通过工具来操作大模型。而工具的作用不同,大模型本身的特性和价格也不同,就导致我们在面对一个复杂的任务时,需要选择多种 AI 工具和不同大模型来实现。
学习使用 AI,和传统的单一软件教学不同,不是只学会某个工具的功能和操作方法,而是了解不同的 AI 工具以及大模型的特性,通过组合它们来实现自己目标的方式。这不是设计或产品思维,而是工程思维的具体应用。
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

做UI/UX设计的同学几乎每天都要和切换类组件打交道,但很多人总会在开关、复选框、单选按钮之间踩坑——要么用错场景,要么给用户造成认知混淆,甚至引发操作失误。
苹果HIG (人机界面指南) 里明确把开关、复选框、单选按钮这三类,都归为「切换开关」组件。它们的核心共性是让用户在对立的状态间做选择,通过差异化的视觉形态清晰区分选中/未选中的状态。
开关是用来瞬间切换单个功能/设置的开启/关闭状态的组件,一次只能控制一个设置的开关,工作逻辑和我们家里的物理电灯开关完全一致,能让用户一眼看清当前的生效状态。
开关的结构非常简洁,核心分为3个部分:
如果要添加辅助图标,必须选表意清晰、强二元对立的样式,千万别用含义模糊、没有明确正反属性的图标(比如月亮、编辑图标),用户没法一眼对应开/关状态。
开关的核心交互逻辑是操作后立即生效,不需要用户额外点击确认按钮,切换状态时,可配合手柄尺寸的微动效强化操作反馈。
开关必须和描述控制功能的标签搭配使用,标签要简洁直白,不要把文字放到开关内部。这样会压缩视觉空间,还会破坏组件通用性,增加用户识别成本。
复选框的核心定位,是支持用户对一组关联选项,做单项或多项的选中/取消操作。
记住一个核心原则:当用户可以在一个列表里选择多个选项时就用复选框,不用开关或单选按钮。单选按钮的语义是「请选其中一个」,而复选框的语义是「可以选多个,也可以全不选」,二者的底层逻辑不同。
复选框的结构清晰,核心就是选择容器+选中状态图标,通过勾选/未勾选的视觉差异,直观传递用户的选择结果。
如果选项列表较长,建议添加「全选父复选框」提升操作效率,它的交互逻辑有明确的行业规范:
处理一组有关联的多选项时优先用复选框,而非一堆独立的开关。
一方面,复选框能天然传递「选项之间互相关联」的语义,另一方面,它比开关占用的视觉空间更小,页面会更整洁有序。
单选按钮的核心是互斥单选。在一组选项里,用户有且只能选择一个,选中新选项后之前选中的选项会自动取消。
它的语义非常明确:这一组选项里,「你必须、只能选一个」和复选框的「可多选、可全不选」形成了清晰的边界。
单选按钮的结构核心是选中/未选中的状态图标+对应的选项标签。行业通用的视觉规范是:用实心圆点表示选中,空心圆圈表示未选中,保证用户的视觉识别度。
不能打破互斥单选的核心逻辑,更不能让单选按钮出现布局重叠,否则会完全颠覆用户的固有认知,造成操作混乱。
如果选项数量较多、屏幕空间有限,可用下拉菜单替代单选按钮。
但要注意:下拉菜单需要用户多一步点击展开的操作,会增加交互成本,也没法让用户一眼看到全量选项,降低认知效率。因此选项较少时,优先用单选按钮。
垂直排列时每个选项的图标和标签对应关系更清晰,用户不会看错;水平排列不仅容易让页面拥挤、可读性下降,还会破坏布局一致性,在响应式适配中也更容易出问题。
前面讲了每个组件的细节,这里给大家整理了最简使用规则,设计时直接对照即可。
开关、复选框、单选按钮,都是设计里最基础、最常用的组件。设计时要先看场景、定语义,再选对应的组件,而不是凭感觉、看颜值随便乱用。
当然,我们也会看到一些特殊的设计案例,比如iOS在深色模式的选择里,用了圆形复选框,和我们今天说的常规用法不一样。这种情况,要么是为了整个系统的设计语言统一,要么是有特殊的产品考量,不建议盲目照搬。对于设计师来说,先搞懂这些基础组件的用法、可用性底层逻辑,才是做好设计的根基!
转载自 优设网
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

大家一定经常听说 UI 设计师需要具备产品思维,但又不知道产品思维具体是什么,尤其是很多同学只把产品思维当成是产品经理做需求的能力。
兰亭妙微UI设计公司:今天我们的主题就是分享产品思维的具体思考方式和应用
产品思维一句话总结,就是——通过规划产品形式来解决产品问题的思考模式。
这里我们先明确 “产品问题” 是什么,它是一个非常宽泛的概念,可以说所有产品相关的问题都可以是产品问题,包括但不局限于功能、交互、体验、视觉、技术、服务等领域。
在产品的研发和运营过程中,产品团队总会发现和积累出各式各样的问题,比如功能太简陋不能满足用户需求、交互太复杂用户用不懂、逻辑太复杂技术实现不出来等等。这些问题当然需要被解决,而解决的方式有两种,一种就是直接使用相关领域的 “技术方案” 解决,另一种就是提供新的 “产品方案” 来解决。
这里技术方案是泛指,指产品以外的其它类岗位使用自身专业技能来解决问题的方案。比如用户觉得页面信息混乱,设计师通过布局、尺寸、间距、色彩的视觉调整,就能解决这个问题。或者某些交互设计需要非常复杂的编程方案,前端自己通过钻研技术,来实现这个效果。
比如下面这些就是纯粹的视觉优化方案:
产品方案则是指通过制定或调整产品的功能、服务、表现形式,来解决相关的问题。比如上面觉得信息混乱,不再是改设计,而是直接优化和增减字段信息。交互设计开发起来太难,那就直接调整产品功能,分拆交互步骤降低开发难度。
比如下面这个就是对产品的形式做出了一定的调整:
两种方案各有优劣,但在真实项目中,产品是先于设计和开发的,好的产品方案不仅能提高产品的实际表现,同时还可以大大降低技术实现的成本。所以在解决问题时,团队必然会倾向先使用产品思维来创建产品方案,然后再去实施。
总结起来,产品方案就是涉及对产品本身的调整方案。原则上,这种方案是由产品经理提供,设计师只要跟着产品的要求去做设计就好了。
但在真实项目中,产品不可能考虑到所有问题,尤其是和体验、交互、视觉高度相关的部分。
每当我们每做界面或功能时,碰到所有和产品有关的问题,都需要反馈给产品经理再等它做决策,那么他必然是处理不过来的,项目肯定也做不下去。所以设计师需要在自己力所能及的范围里,尽量自己去解决这些问题,提高项目整体运转的效率和质量。
尤其在一些对视觉要求不是特别严苛的环境中,UI设计的成果往往“能看”就够了,领导或者面试官对设计价值的定义就不会在视觉上,往往会聚焦在产品方案上。就是因为设计师自己有产品思维具备解决产品问题的能力时,可以极大的填补产品经理层面的空缺,还可以提高产品质量和研发效率。
但是,产品方案不是只提供解决方案就行了,还需要合理、有效,所以就要综合各方面的制约与影响,才能输出优质的结果,这就是一个非常综合性的分析过程,我很难用简单的语言进行归纳和总结。
所以,下面就通过前面的案例,来展示产品思维的具体思考过程
在原有两步路路线详情页中,顶部的大图和信息区域是我重点调整的区域之一。
之所以重点关注,不仅仅是因为它 “不好看”,而是这个大图的缺陷很多。作为浏览用户,图片的关注度不是没有但绝对不是重点,往往只是草草快速浏览一遍就够了,但现在的轮播形式就没办法高效看完相关图例,且占据的篇幅又过大,挤占下方的其它关键信息点。
当然也有同学可能会觉得看图怎么会不重要,你们看小红书找旅游地不就是被图吸引然后再点击进入做出选择的嘛?
不排除这种情况是存在的,但这不是小红书,这是一个比较硬核的徒步社区,不是给用户看大图就有问题,而是在发布用户这一侧,硬核优质的分享者(是去走或跑几十公里不是到打卡点自拍)大多不具备那种拍“美照”的能力,最终呈现的路线图景多数就是随手一拍的质量,浏览用户压根没必要仔细欣赏。
再进一步考虑,有很多经典线路本身景色就不是特别好,尤其是偏越野跑的线路往往杂乱又逼仄,照片带来的作用更多是一种对路线的概括(功能性),而不是作为吸引人的美照。在这个限制下面,大篇幅展示封面就不会获得常规以图片为导向的应用的结果。
这些就是针对问题的分析,而这里面既有体验的问题,也有产品的问题,甚至还有运营的问题,但具体去区分它们没有意义,只要它们不是纯粹的视觉问题我们都可以统一归纳为它们是产品问题。
基于这些问题去思考解决方案时,就可以问自己一个简单的问题,是不是只做视觉调整,如优化布局、更改尺寸、添加投影、增加圆角之类操作就能解决。如果不能,那就要涉及到对产品形式的调整了,也就是涉及功能、信息的改动。
这里我们先看改完之后的结果:
为了减少图片的面积和提高观看效率,我选择缩小图片并做成左右滑动的列表,把发布用户信息做到上面,合理利用空间且突出收藏、分享等操作。但光改这个依旧只是一个简单的视觉调整,缺乏深度和细节,没有什么解释的空间。
所以再往深一点挖掘,一屏只能展示一张图多一点,理由不是图片比例的问题,而是因为用户发布路线最小可以添加的封面图只有一张。如果只有一张,那么右侧留空显然是不能接受的,这样的方案也就做不了。而且只展示图片实在是有点不够看。
我会再想到链家之类看房软件的顶部区域,除了展示摄影图以外,还会添加固定的房型图,应用了多种图片类型。而在两步路中,如果发布路线,除了封面图外,路线图本身肯定也是能直接生成图片的,可以生成类似跑步软件的那种路径图。
顶部图片也可以不止有用户自己拍的摄影图,还可以添加路线生成图,同时这张图因为是静态的,就可以在生成过程中添加一些数据信息或标注内容等,和下方可交互的地图路线展示区分开来。并且在下方区域添加一个类似电商中 “商品图/视频” 切换的标签快速选择。
甚至再仔细想想,当我进入路线详情页时其实更关注的是路线本身,第一张图直接放路线图而不是放在最后,可能对相当一部分用户来说也是更实用的做法。但这么做就有点激进,需要给出初步设计以后再套一些真实内容做出页面看效果,这就是内部评审或用户测试要做的事情了。
到这里这个模块基本解释的就差不多了,而我们为了优化它已经做出了一些超出视觉设计外的变更,且需要考虑尽可能多的细节,照顾到方方面面,这就是产品思维应用的过程。
再往下的路线模块改动也同理,我就不多做展开,你们可以自己深入解构一下:
设计过程中对产品思维的应用,不是成为产品经理构思新的功能需求,而是维持原先目标的不变的情况下,给出新的、更完整、更合理的产品方案。
而产品方案当然不是你们想怎么输出就怎么输出,这些方案还需要再后续经过团队的评审(我要验牌),也就是说服其他人同意你的设计方案。而光看图肯定不够,所以要进行解释说明,从一开始的问题分析出发,到如何完成这个结果的考虑过程。
在这个场景中只看设计图效果是最没价值的,如果你能说服团队通过,那这套方案就是好方案,如果不行,那不管你想的如何天花乱坠还是视觉做得多花里胡哨都没用。所以方案构建逻辑性是非常重要的,因为没有逻辑就没有说服力。
产品思维本身就是一种比较抽象的思维,提升这种底层思维能力需要通过自己大量的积累。我们后续还会陆续做一些相关的案例分享(这应该才是最有用的)。
同时,面对真实工作场景里产品思维很多时候会沦为一种过稿的武器,是一种职场“诡辩”的技术,毕竟上线有没有用无所谓,领导、客户觉得好,才是真的好……
转载自优设网
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。
列表页就是以展示列表 List 为主的页面,所以我们需要先理解列表是什么。
列表源自编程术语,是一种数据结构,即按照线性顺序排列的数据项集合(有限序列)。说人话,就是按照一定顺序展示数据的形式。
我们再用UI设计的角度来理解它,可以把它分为 “列” 和 “表” 两个部分。我们先理解表,表就是“表格”的意思,这也是计算机中存储数据最基础的形式(关系型),我们在页面中看见的多数内容都以这种形式记录。
列则是动词 “排列” 的意思,用一定的逻辑、方法、顺序将表格排列出来。这种排列是要经过设计和调整的,不会和原来的表格完全一致。
也就是说,列表设计是种对表格的转换,是种对数据的可视化呈现形式。
之所以要强调这个,就是因为想要做好列表设计就离不开对数据的理解,一个专业的列表设计不是做一个好看整齐的重复性组件,而是将数据表格清晰有效的反映出来。
数据表格对列表的影响包含下面几个要素:
1. 属性字段的影响
属性字段就是列表内要放的具体信息点,也就是数据表格中的表头。比如一个商品列表中,要放商品图片、商品名、品牌标签、节日标签、营销标签、销售量、好评率、价格、原价……每个独立的信息就是一个字段。
而一个真实的项目列表内,往往会包含非常多的字段,所以开始设计前要先搞清楚数量和明细,以及它们各自的含义。一方面是设计中不能有字段的缺失,另一方面是字段中包含对应的权重、分类,是设计前必须要确定的信息。
比如下面的列表内容,就包含了大量的字段信息,而这些字段既有权重的强弱,也有分类的整理,是经过设计师的专业分析和设计的结果。
2. 属性值的影响
属性值就是每个属性具体放什么内容,有什么限制。比如商品名,肯定是放商品名称的文本,但文本一般是什么样的,最长支持多少字,这些就是属性值的基本信息。
属性值在开发环境中只能是文本(字符串),但在设计中这个值就不一定只是文本,可能还是图片、图标、符号等内容,中间会有转化过程。比如用户列表中,用户有不同的 VIP 等级,数据中记录的等级肯定是文本性质的,而展示出来却可能是专属的黄金、白银、青铜图标。
属性值的认识同样非常重要,决定了列表的设计是否准确,符合产品的规划。
3. 字段状态的影响
最后字段的状态,就是字段展示的逻辑,简单解释起来就是字段什么情况下出现,什么时候隐藏,出现的时候显示什么内容这三个问题。
比如美团的列表中,有美团商家列表中,运输标签有美团快送、专送、全城送、商家自配等不同类型,而下方的配送时间也在样式上会有差异,这就是对字段状态的表达。
而越是复杂的列表,包含的字段状态差异就越大,往往会直接影响列表的样式,所以设计过程中就要体现尽可能多的样式状态,也就是设计它的不同变体,确保在各种场景中它们能正确显示。
想要设计好列表,就要面对上面提到的三个问题。优秀的列表不止是一种视觉结果,而是一种能兼容相关数据展示的容器规则。
接着我们来理解列表页的主要框架和布局形式,入门它的基本设计要点。
首先列表页不是只有列表一种组件,多数还会包含对列表数据进行搜索、筛选、排序的组件。
除此之外,部分重要的列表页还可能在顶部放运营模块,用来展示一些热门推荐内容或单纯作为广告位。
运营内容放顶部且篇幅较小是因为页面形式的限制,不能在顶部放太多内容让列表被顶到第二屏去。所以目前的设计为了更好的塞入内容,就会选择在列表中插入其它数据,比如纯运营广告,也可能是内容推荐,或者是模块入口等。
总结起来,列表页的主要框架就是顶部搜索栏、特殊模块、筛选排序栏、列表区域的组合。
而最关键的列表区域,可以使用不同的列表来展示信息,我们可以简单分成“单列”和“多列”两个布局大类。下面我们就分别对这两个分类类型做个解析。
1. 单列列表
单列列表就是一行只有一个数据对象的列表形式。而单列列表模式中还区分两种类型的列表,一种是引导型,一种是展示型。
引导型就是引导用户点击进入查看详情,比如商品列表、酒店列表,是为了让我们在列表中找到感兴趣的内容点击进入详情页面。
而展示型,就是直接在列表中展示主要信息,让用户直接顺着列表的顺序查看主要的内容,而不是进入到详情页查看。最有代表性的展示型列表,就是朋友圈这类动态列表了。
单列列表对单个数据对象的展示空间较大,但是单屏浏览数据量就会减少,适用于数据对象字段较多的场景。
2. 多列列表
多列列表就是一行会展示多个数据对象的列表形式。通常移动端的多列列表只有两列,在少数情况下才会出现三列。而两列模式中,也包含两种布局形式,一种是等高展示,一种是瀑布流。
等高展示就是列表内数据对象的高度是保持一致的,每个数据对象的尺寸统一左右对齐,适用于字段类型、内容相对统一变化小的场景。
而瀑布流,则是数据对象高度不一致的多列布局形式,相对更灵活适用面更广,适合字段类型、内容变化较大,不同数据对象的差异极大的场景。
转载自优设网
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。
我想这是很多新手设计师都有过的感受,明明懂了很多设计知识,但到真正设计的时候还是会出现迷茫或者没思路的情况。
造成这种情况的主要原因是,虽然我们每天看了大量的设计文章或者技法,但没有第一时间应用到设计实践中。
换句话说就是,我们每天看的设计内容可能跟我们实际做的工作需求不够搭边,这样就很容易造成拿到一个新需求后没有想法,感觉之前看了很多设计图或者文章都没派上用场,不得不重新找竞品找参考才能展开设计。
就像学了一节新课程,如果没有第一时间做配套的练习题,等过了一周再做练习题发现根本不会做,因为之前学的课程早都忘得差不多了。
北京兰亭妙微UI设计公司:下面展开讲讲如何避免这种情况,建立自己的设计成长体系。
对于设计技法vs设计原理的问题,我觉得对于设计师来说同等重要,但具体要结合你现在的工作情况找到一个侧重点。
举个例子,比如当前的工作偏UI视觉多一点,需要常做一些运营活动图,那么日常就可以多侧重练练技法,多做视觉练习;如果当前的工作偏向纯UI,那么就可以多重视设计理论,多思考产品规划、交互流程、用户使用体验等等这些产品交互相关的知识,用理论支撑起我们的设计方案。
这样既能保证我们能很好地胜任当前的工作,还能让我们在持续的工作中不断有进步有提高。
对于平面能力差的问题,我觉得平面设计能力是基础。可能很多同学在大学时有过这种体验,无论你的专业是视传、数媒、产设,甚至摄影,都需要经历平面设计这一关。排版、手绘、字体、后期合成等等这些平面能力需要我们不断练习实践。
现在AI绘画工具的出图效果都不错,大家可以好好利用起来辅助出图,补齐UI设计师在平面设计上的短板。
总的来说,平面能力要多练习多积累,日常工作中还是建议灵活运用“AI+设计”的形式,也能打造出好的效果图,没必要为了某个视觉效果死磕PS而浪费太多工作时间。
针对看了很多设计但做需求还是没想法,以及到底怎么学UI、建立自己的设计体系这些情况,我结合自己的经历总结一下,希望能对你有帮助:
首先还是多积累,多看好的设计,审美需要一直提高。比如每天早上我都会拿出半小时的固定时间去Pinterest或者花瓣里去看各种各样的设计图。
需要注意的是,这里的看也分为两个方向:一个是日常看图,一个是专项看图。
其次,每天看的图很多,就需要把图都整理一下,这个时候就需要建立一个系统性的设计素材库。
拿花瓣举个例子,在花瓣里可以创建各种各样的分组。
比如APP是一个大的分组,在这个APP的分组里面可以建各种各样的画板,像APP-首页、APP-导航栏、APP-标签设计等等;再比如网页设计是一个大的分组,我可以在网页设计底下创建网站首页设计、网站登录页设计这些画板。
这样整理的好处一个是让我们每天看的图更加清晰有条理;另一个是有了分组/画板后,接到新的设计需求后就可以直接定位到某个分组里,看看我们之前创建的画板里有没有类似的一些参考图,省去了从0~1再重新找参考图的这种过程。
而且看到自己采集的参考图突然派上了用场的过程,对于设计师来说特别棒!这说明我们每天看的内容有价值,不只是在收藏夹里吃灰。
比如要设计一个UI标签,我们可能需要反复去创建的素材画板里看各种各样的标签设计,这样不止一次地反复看收集的素材,看的多了之后我们就对这些素材图特别熟悉,这样就不怕后面的设计再没思路。
现在每天网络上都有特别多的零碎信息,所以这种清晰的整理是一个特别有效的成长方法。经过这种「先整理再回看再设计」反复练习的过程,会有一个更清晰的设计体系和工作流,设计能力肯定会有一个质的提升。
转载自优设网
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。
我们的世界正在快速的数字化,这也是为什么UI界面在近10年来一直都是热门话题,同时,这也意味着,作为设计师的我们比以往任何时候都要专注打造高素质的UI,以及让用户欲罢不能的用户体验。我们需要好的UI和优秀的设计。
兰亭妙微设计公司,一直在追求好设计,优秀的设计,让人难忘的设计,能够脱颖而出的设计。我们相信设计是有迹可循的,有成熟的、可考量的标准来衡量,它甚至可以作为我们设计的方向而存在。
从网站到手机,从家用的恒温控制器到汽车的控制面板,所有的这些UI构成了我们的日常数字体验。越来越多的屏幕和日渐庞大的数字化内容,使得我们对于优质的UI设计越来越渴望。
虽然好设计的原则是老生常谈,但是我们还是要经常总结,结合自己的设计,三省吾身。
优秀的UI界面是隐形的,华丽的装饰和不必要的元素都已经被剔除,简单直接的页面逻辑和直观必要的元素构成了这样的UI界面。设计UI的时候,你在添加任何元素的时候,都最好问一下自己“这个功能是否会影响用户现有的任务?它是否真的必要?”先将你的UI内的元素限定为必须的,专注于核心的用户体验。
如何设计一个简单的UI界面,Maaemo 的产品在这方面就做的很突出。这个挪威餐厅的网站上,你看到的是预订的表单,其他次重要的内容被隐藏在汉堡菜单当中,避免引起混乱。用户不用浪费时间去来回浏览扫视,直接进入预订的环节。
清晰应该是所有UI界面都具备的基本属性。请记住,你的UI界面存在的目的是让用户能够更便捷地同你的系统进行交互,为此,它需要能够清晰地同用户进行沟通,如果用户无法弄明白界面的使用,会因此感到沮丧。
保持清晰的UI界面设计并不难,首先要保证一点:按钮和操作的标签文字指向性要明确,保持清晰的信息传递,让用户能够快速弄明白交互的指向性。
这个时候,你也别忘了开头的“简单”的原则。尽量不要在UI中使用冗长、复杂、难以记住的文本标签,你的用户不会花费时间去读,也不会去欣赏它们,越复杂越“独特”,就越会影响整体的用户体验。
一个词能解释清楚的事情,千万不要用更多的语言去表述。保持简明能够让你的界面更加清晰,节省用户的阅读时间,降低认知疲劳。可能精简出直观又易于识别的文本很难,但是做好了是很有价值的,对于整体体验的加分很多。
不论是哪个设计师,都会希望自己的设计能给用户带来一致的体验的吧?一致的设计能够让用户对于你的设计模式更快认知、熟悉,并且在此基础上快速适应整体的体验。人们渴望规律,追求一致性,也希望在实际操作中验证自己所“发现”的一致性。
所以,用户是期望借助自己习得的经验,来探索更多的内容的,而探索能否有效就得看设计的一致性是否够好了。在整个UI设计中保持一致的语言、布局和设计规律,整个用户体验会显得更加“通透”。
用户体验设计的一个重要的目标是要让用户能够凭借直觉来操作UI界面。那么,怎么才能让用户更加“直觉”地完成交互呢?用户要能够自然地理解其中的内容,操作自然就不难了,也就是说,你要让用户对你的界面产生“熟悉感”。所以,你要充分利用用户对于你的设计所熟悉的部分。
当用户对UI界面抱有熟悉感的时候,通常意味着他们对于这个设计有所了解,甚至知道怎么交互,他们明白操作之后大概会发生什么,也知道哪些事情不应该做。所以,如果你能利用好用户对于交互和界面模式的熟悉来进行设计的话,能让你的用户更快上手操作。
汉堡图标就是这样的典型。现在当用户看到汉堡图标的时候,就会明白这代表着菜单。当用户在界面中找不到预期的功能或者服务的时候,会主动地寻找汉堡图标,希望能在其中找到需要的东西。
Born Shoes 这个网站也充分利用了这一点,将熟悉的图标放在熟悉的位置,用户上手就知道怎么用了。
UI界面的视觉层次是非常重要且常常被忽视的一个属性,它能够帮助用户专注重要的内容。如果你想让界面中每个内容都看起来很重要,那么只会单纯地让信息过载,让每个元素都分摊用户的注意力,最终只会让整个设计显得混乱不堪。不同尺寸的字体、不同的色彩和不同的控件最终应该是相互搭配,构成层次,有轻重缓急地呈现给用户,将复杂的结构简单化,帮助用户完成任务。
Budnitz Bicycles 的网站就很好地使用色彩营造出视觉层次,吸引用户关注到网站的特定部分。网站中的按钮在整个设计中显得非常显眼,引导访客点击。
你的UI界面最终的目标是要带着用户完成任务,达成目标,或者去他们要去的页面。不同的流程要求不同,但是最优秀的UI设计有个共通的特征:高效。提升界面效率最有效的方法是进行任务分析。
熟悉用户的流程,了解用户的目标,然后在此基础上尽量简化流程,使得用户能够便捷快速的达成目标。在此过程中,仔细考虑每个功能细节,规避可能存在的漏洞,帮助用户快速完成用户流程。
Mulberry 在他们的活动页面上提升了用户效率,帮助用户更快地挑选节日礼物,降低繁复的搜寻和思考过程。
UI界面响应牵涉到体验的方方面面。首先,UI界面的响应应该是迅速的,它背后的整个系统应该能够快速反应,否则不够快速的响应会让用户感到沮丧,缓慢的网页加载过程会令人抓狂。
事实上,如果你的网站没有在3秒内加载完成,就会开始有访客因此而流失。根据 Kissmetrics 的统计,超过40%的访客会在加载速度超过3s之后而离开,而加载时长的增加,更多的用户会随之离去。
此外,UI界面的响应是否合理,是否足够“人性化”。当用户点击界面元素的时候,用户希望知道他们的操作是否成功,而这个时候,合理而快速的界面反馈就显得很重要了。比如,当用户点击一个按钮,按钮的状态变化,又或者界面加载时的加载进度条,都能够让用户明白状态的改变,以及他们操作的结果。
界面的合理响应让UI更为富有人性,减少错误的发生,并且让交互进入真正良性的循环。
转载自优设网
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。
兰亭妙微UI设计公司:你会发现现在的移动端UI界面中极简风的设计越来越多了。极简主义设计风之所以能够如此的受欢迎,很大程度是源自于它对于设计、开发的友好,它不仅让APP的加载速度更快,让APP对于不同屏幕的兼容性更加优异。与此同时,越来越多的用户也开始青睐极简风的设计,极简风的UI界面不仅漂亮,而且在可用性上也非常的突出:它易于导航,并且具备强大的视觉表现力。
降低用户完成任务之时所需耗费的精力。
你为APP的每一屏都应当承载一个对用户有用、有价值的交互或者任务,一次完成一个任务,且只能有一个任务,其中应该不包含超过1次的行为召唤(CTA)。这样的设计能让用户更轻松地学习,更便捷地使用,在设计上也更容易添加删减以及构建。
以Uber为例,Uber 清楚地知道用户的目的是乘坐出租车,所以,应用程序不会一次给用户太多的信息,会根据地理信息自动检测用户的位置,而Uber 提供给用户的每一个界面的交互都是单个的,用户只需要选取位置,下单即可。

内容即是界面。
专注于内容,并且尽量删除不必要的元素,这样可以缩短用户集中注意力的时间,用户将会更快地被引导到他们正在搜寻的内容,而内容本身正是一个隐形的界面。最典型的就是Google 地图。在重新设计的时候,Google 地图删除了所有不必要的面板和按钮,地图本身就是最好的界面。

使用负空间让重要的内容吸引用户的注意力。
留白,或者负空间,指的是页面设计布局中的空白部分,或者空白元素,它们常常被忽略和忽视,虽然许多设计师认为这样的设计会浪费屏幕的空间,但是留白本身就是设计的基本元素之一。
留白可以提升可读性和内容的优先级,在页面布局中也发挥着重要的作用。因此,它可以合理地简化UI并提升用户体验。
导航应该是每个APP当中优先级最高的组成部分。移动端APP中导航应当容易被发现,可访问的,且尽可能少的占用屏幕空间。由于小屏幕的限制以及内容优先级的需要,移动端导航的可访问性设计一直是一个挑战。
标签栏和导航栏是非常适合用来展现较少的导航选项的,它们非常适合用来展示主要的导航选项,一个简单的点击就能流畅地切换到不同的页面。
让你的设计兼容更大的屏幕。
关于用户如何握持手机,下面的图为你展现了最常见的三种模式:
通过观察可以发现,85%的用户使用单手握持他们的手机,下面的热图展示了从2007年一来,各种不同尺寸的iPhone 的拇指操作区域。毫无疑问,随着屏幕尺寸的增加,拇指能够触及的区域的比例正在逐步降低。所以,移动端界面的用户体验设计应当进行调整,尝试让你的APP 能够在手机上面能够单手操作,将导航置于用户的拇指可以触及的区域之内。
不要让用户等待内容呈现
试图让程序的响应速度提升起来。许多任务尽量在后台跑起来,让前台的展现速度显得很快。将一部分操作打包到后台运行有两个好处:让一些等待和加载过程不再展现在用户面前,并且可以让许多操作在用户请求之前就发生。一个很好的例子就是 Instagram 中上传图片,当用户选择要共享的图片之时,上传就已经开始。
在推送信息之前请三思。
每天用户都会被无数无用的推送通知所轰炸,被分散注意力,这也使得通知常常会显得颇为恼人。根据调研,超过70%的受访者表示,令人烦躁的推送信息是促使他们卸载应用的主要原因。
所以,要做好移动端设计,需要用好每一次的信息推送。不要为了吸引用户而推送消息,这往往会适得其反。你需要将对于用户有价值的信息推送出去,这样才合适。
有效的移动端APP信息推送策略是采用多种类型的信息推送机制,推送通知,电子邮件,应用内通知,新闻Feed等。多样化的信息推送通过合理的协调,创造良好的用户体验。
转载自优设网
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。
设计组件库是提升设计效率和一致性的重要工具,但如何在频繁迭代和动态调整中高效赋能业务设计交付,一直是行业面临的挑战。兰亭妙微UI设计公司,分享了他们在设计组件库建设中的新思考和实践,供大家参考学习。
本文将分享我们对于“什么是好的设计组件”的看法,并给出一种搭建复杂组件的实用思路。我们还会从资产消费的角度,提供一些优化建议。虽然过程中会涉及不少基于Figma软件的操作细节,但核心思路就像一把“万能钥匙”,无论在哪个设计平台都行之有效,希望这些内容能给广大设计师们带来一些新的启发。
兰亭妙微(蓝蓝设计)www.lanlanwork.com 是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的大数据可视化界面设计、B端界面设计、桌面端界面设计、APP界面设计、图标定制、用户体验设计、交互设计、UI咨询、高端网站设计、平面设计,以及相关的软件开发服务,咨询电话:01063334945。

当服务类预约 App 还困在 “浅白杂乱” 与 “功能冗余” 的窠臼中时,兰亭妙微这款暗黑系预约管理工具,用「高对比信息层」与「场景化功能闭环」,把服务商家的 “接单、排期、统计” 需求压缩成移动端的 “一键操作流”。这不仅是一个界面,更是服务从业者 &ldqu...
蓝蓝设计的小编 http://www.lanlanwork.com