UI设计 - 值得一看

Figma 组件变体实战：做一个可复用的按钮系统（含命名与交互规则）

这是一篇可以直接照做的 Figma 按钮组件搭建教程：从 Auto Layout 结构、状态尺寸类型变体，到命名规则、交互与团队交付检查清单。按步骤做完，你会得到一个可在项目中长期复用的按钮系统。

教程分享 3小时前 0

可商用插画与图标资源清单｜20个高质量网站

这是一份“可直接收藏”的插画与图标资源清单：每个条目都给出官网链接与授权提示，便于你快速找到适合项目的可商用素材。

设计经验 5小时前 0

Figma 玻璃拟态卡片教程：从布局到导出的一套可复用流程

这是一篇可以照做的 Figma 教程：用渐变与模糊做出玻璃拟态卡片，并通过组件、约束与自动布局把它做成可复用模块，最后整理样式与导出规范，方便在真实项目中落地。

教程分享 12小时前 0

免费可商用图标与插画工具清单｜12 个高质量站点一篇收齐

想找可商用的图标、插画、UI 组件与配色资源？这份清单把常用站点按场景整理好，直接收藏备用。

设计经验 13小时前 0

Figma教程：用Auto Layout做可复用按钮组件（含变体与约束）

手把手教你在Figma里用Auto Layout做一套可复用的按钮组件：从基础尺寸与内边距开始，加入图标与文本间距规则，再用Variants做默认悬停禁用状态，并设置约束让按钮在不同容器里自适应。

教程分享 15小时前 0

12个免费插画与图标资源网站｜收藏级清单：UI设计快速出图

整理了 12 个常用的插画图标资源网站，覆盖可编辑 SVG、成套插画库与开源图标。每个条目都标注授权提示，方便你在项目里更安心地选用。

设计经验 18小时前 0

Figma 从 0 到 1：用 Variants + Auto Layout 做一套可复用按钮组件

用一套清晰的命名与结构，把按钮做成可复用组件：支持尺寸、样式、状态与图标开关，并能在项目里一键替换。本文按步骤操作即可完成。

教程分享 22小时前 0

从零搭建高可复用的设计规范：字号、间距、组件命名一次讲清

想做一套好维护的设计规范，关键不在“好看”，而在可复用、可扩展、可对齐。本文用一套从零到一的方法，把字号体系、间距栅格、颜色语义、组件命名与交付规则讲清，并给出可直接落地的模板与检查清单。

教程分享 1天前 0

为什么导出 PNG 会发虚：像素对齐与抗锯齿的十个检查点

导出 PNG 出现发虚、边缘毛、文字不清晰，很多时候不是软件问题，而是像素对齐、缩放比例、抗锯齿与导出流程的组合坑。本文给出一套可逐项排查的检查点，帮助你快速定位并修复。

设计经验 4天前 0

UI 设计里「一致性」不是死板：6 个你能立刻用上的规则

很多团队把“一致性”理解成所有页面长得一模一样，结果牺牲信息层级与效率。本文用 6 条可落地的规则解释：什么时候该一致，什么时候该刻意变化，并给出快速自检清单。

设计经验 4天前 0

配色不脏不灰：从对比到饱和度的 7 个快速修正方法

配色看起来发灰、发脏，往往不是颜色选错，而是对比关系、饱和度分配、材质与光照逻辑没统一。本文用 7 个可直接套用的修正方法，帮助你把界面与海报的颜色拉回干净、清晰、有层次的状态。

设计经验 5天前 0

12个免费图标网站清单：可商用资源与使用要点

整理12个常用免费图标网站，附网址，并说明授权与下载格式要点，适合UI 海报产品设计快速取用。

设计经验 5天前 0

为什么你做的按钮“不够清晰”？对比度与WCAG的入门科普

界面看不清往往不是“字体太小”，而是前景与背景对比度不足。WCAG给出对比度建议：正文常用4 5:1，大号文字3:1，有助于提升可读性与无障碍体验。

值得一看 7天前 0

从“好看”到“能用”：新手做UI最容易踩的10个细节坑与修正方法

把UI做得“能用”比做得“好看”更难。整理10个新手最容易踩的细节坑：对齐、间距、状态、字号、对比、触达面积、文案长度、图标一致性、导出规范、交付信息。每个坑都给可操作的修正方法。

设计经验 1个星期前 0

9个值得收藏的 Figma 插件

Figma 因拥有强大的多人实时在线协作功能，借助了这一时机，深受设计师广泛欢迎，如今 Figma 有了很多辅助插件体系，下面我将罗列出最省时高效的9个插件。

设计经验 2021-12-28 0

22款实用还免费 Figma 插件推荐

Figma已经是一个功能强大且灵活的设计工具。随着每个新版本的发布，它都在不断改进，如今有着大量的插件，不过其中的插件质量差别很大，下面是素材君筛选22款值得你收藏的Figma插件。

设计经验 2021-10-20 0

AI绘制图标，GIF操作演示

这是来自国外大神：marcedwards 用AI绘制图标的GIF操作演示图，看完不禁感叹，图标原来是这样画出来的。

设计经验 2018-06-05 0

UI设计基础指南

每一个技巧都结合案例讲解，案例中正确错误不是绝对的，做一个对比的参考作用。

设计经验 2017-04-14 0

Sketch设计提速10个使用技巧

上手新软件，许多功能都不太就手，设计一个界面可能会比在PS上耗费更多的时间。所以，掌控一些实用的小技巧就非常重要了。哪怕你是Sketch新手，下面的10个小技巧也能帮你节省不少时间。

设计经验 2016-01-04 0

#UI设计