ZHAO WANSU

Font Dance · 字体设计工具

A toolkit for finding and using type

项目归属
团队共创
项目类型
字体工具设计 / 网页与插件
项目年份
2026
我的工作
团队共同确定功能范围与界面方案,借助 Codex 完成插件开发与迭代。

项目背景

团队内部的字体授权信息分散在合同、采购记录和协作文档中,更新口径不一。设计师在 Figma 中选字时,难以同步确认适用场景、授权地区与到期时间,设计使用与授权核验相互脱节。Font Dance 以 Figma 插件为载体,将字体查询、使用核验与替换操作连接到日常设计流程中,让设计师在使用字体时就能完成检查。

选好字体之后,还要到别处查授权。

做 App 界面、品牌物料或广告时,字体好看只是第一步,还要确认它能不能用于这次项目。相关信息分散在字体库、授权表格和协作文档里,设计师需要离开 Figma,查用途、地区和有效期。如果交付前才发现不适用,就得回来重新选字、调整排版。

这个项目从日常设计中的字体核验需求出发。我们希望把「查授权、看限制、找替换」放进 Figma 插件,让设计师在选字时就能查看这些信息。

原来的操作

Figma 选字 ↗ 查授权资料 ↗ 核对用途 ↙ 返回换字

使用 Font Dance

选中文字 → 查看用途与授权 → 选择替代字体

把原本跨工具完成的检查和替换,集中在一个面板里。

02 / FONT LIBRARY · 网页字体库

找字、比较、收藏,在一个页面里完成。

选字需要看得全,也需要看得清。网页字体库把筛选放在左侧,搜索和试字放在顶部,用大幅字形样张展示差别。

收录 10,583 款可预览字体,按风格、语言与使用范围筛选,查看授权记录,收藏合适的候选。

Font Dance / 字体库
独立打开
01 / FIND

先缩小选择范围

搜索字体名或字体公司,再结合风格、语言和使用场景筛选,快速找到一组候选。

02 / COMPARE

在同一句样张里比较

调整字号,切换列表与卡片视图,对照真实字形。样张保留少量默认字符,便于轻量浏览。

03 / KEEP

核对记录,留下候选

展开字体信息查看来源授权记录,收藏合适的字体,也可以导出样张用于排版对比。

字体库参考 FontHub 的目录与筛选方式;字体资料与样张版本:2026.09.16。

设计思路

项目先梳理授权字段、使用场景与状态规则,再将字体识别、记录查询、用途核对和选区替换组织进一个独立面板。界面优先呈现字体名称与当前状态,详情和替代建议按需展开;借助 Codex 完成插件开发,并加入艺术字案例浏览与提示词编辑,衔接字体管理与标题创作。沿用同一套视觉,延展网页字体库,补充浏览、筛选、字形比较与收藏,让选字之前和使用之后的需求都有相应入口。

03 / IN FIGMA

选好字之后,在设计中检查。

在 Figma 中选中文字并运行插件,查看识别到的字体;选择本次用途,核对授权范围;需要换字时,比较候选字形,再确认替换。

Font Dance / Playground字体检查 · AI 艺术字
LESS SWITCHING. MORE CREATING.FONT DANCE
T   Make space for type

Make type move.

查字体授权,也能直接找替换。

在「字体检查」里核对用途、选择替换;在「AI 艺术字」里选择文字描述或参考图,探索艺术字图片效果。

FONT IN USE思源宋体

字形载入中…

真实字形样张 · 切换字体,看看区别

从字体库比较字形并选择替换,或从艺术字案例中寻找方向、编辑提示词。选区读取与字体替换在 Figma 中完成。

插件设计与开发

我们先整理使用场景和判断规则,形成需求文档,再用 Codex 协助拆解任务、实现功能。团队负责确定功能范围、设计界面,并根据实际操作反馈持续调整。

  1. 01 / 需求文档

    明确要查什么、查完能做什么

    先写产品需求文档(PRD),列出使用场景、授权字段和状态规则。例如,同一字体用于 App 或广告时要分别判断;没有匹配记录时显示「待确认」。

  2. 02 / 开发准备

    拆出最小功能和验证项

    先拆出选区读取、记录匹配与状态展示,再补上字体替换。另写技术验证计划,列出混合字体、多选、缺失字体等情况,明确插件能力的限制。

  3. 03 / 功能实现

    从界面设计做到 Figma 插件包

    借助 Codex 先搭建可交互的界面,再实现 Figma 选区扫描、字体识别和替换逻辑,整理成可以本地导入 Figma 的插件包。

  4. 04 / 迭代与交接

    按界面反馈修改,整理交付材料

    围绕面板布局、状态提示和展开操作逐轮调整,并补充 AI 艺术字的探索。最后整理源码、插件包、数据说明和交接文档,方便后续维护与迭代。

设计问题与取舍

遇到的问题设计选择具体处理
原生字体栏无法直接加入版权提示独立面板将版权提示放入独立面板,运行后跟随 Figma 选区更新字体信息。
授权字段多,重点不容易找到信息分层优先展示字体名称和授权状态;版权详情与替代字体按需展开,减少重复的控制项。
文字描述难以准确传达视觉风格两种创作入口区分文生字与图生字,将案例、风格筛选与提示词编辑放在一起。文字确定内容,参考图表达字形、材质与氛围。
比较字形,无需加载完整字库轻量预览每款保留少量默认字形,以统一样张比较差异;列表随浏览逐步加载,需要完整字体时再前往来源网站。
AI LETTERING / 从一个案例开始选案例 → 改文案 → 整理提示词

06 / AI 艺术字探索

AI 艺术字探索

字体自查解决的是已有字体的使用问题,AI 艺术字则用于尝试新的标题效果。输入文案、选择风格,也可以加入参考图来表达方向。文生字和图生字分别对应从文字描述出发、从视觉参考出发的两条创作路径。

115 个艺术字案例,支持关键词搜索、风格筛选和提示词编辑。图片与提示词来源于 AI 字体生成库。实时生图尚未接入。

07 / RESULT

项目产出

完成 Figma 字体检查与替换插件,并延展网页字体库及艺术字参考库。

产品需求文档Figma 插件与源码网页字体库插件交付包开发交接文档