AI + 向量检索，做一个“懂你”的 icon 推荐服务

背景

在 AntV 信息图设计中，图标承担着将抽象文本“可视化”的作用。

为提升图文匹配效率，提出一个结合大语言模型（LLM）和多模态向量检索技术，实现一个“自动理解用户意图 → 智能推荐图标”服务。

整体流程

结合了 LLM 的语义理解能力与向量检索的高效匹配能力，整体流程如下：

文本解析：从文字到“可视图形”概念

第一步是深度理解用户意图。

我们面临的挑战是，用户的意图是抽象的，如“可持续发展”，而图标的检索是具象的，它依赖于具体的、预设的标签，如“叶子”、“循环”、“地球”。这种不匹配导致检索结果难以精准满足用户需求。

比如：

❝

用户输入：“为了降低碳排放，城市开始增加绿化和公共交通。”

❞

传统的关键词分词，可能会拆解出“降低”、“城市”、“增加”等一堆词，但哪些才是最适合用图形表达的核心概念呢？

这正是我们引入大语言模型（LLM）的原因。我们没有采用机械的分词，而是利用 LLM 强大的上下文理解能力。它像一个资深编辑，能通读整个句子，分析其结构和语义权重，精准地识别出那些最核心、最“可视化”的元素。

对于上面的例子，LLM 会告诉你，关键的视觉概念是 “碳排放”、“绿化”和“公共交通”。这些词汇具有明确的、可被图形化的指代对象，「提取出一个关键词列表」

[碳排放, 绿化, 公共交通]

为了让后续的模型能发挥最大效力，我们还会「将这些中文概念统一翻译成英文」，以对齐业界领先的多模态模型（如 CLIP）的预训练语料，为精准匹配打下坚实基础。

[carbon emission, urban greenery, public transportation]

语义向量化：构建图文“通用语言”

理解用户意图之后，我们要做的，是用模型把这些关键词变成“语义向量”。

我们用的是 OpenAI 的 CLIP（Contrastive Language-Image Pre-training）模型。它通过在海量图文对上进行对比学习，将 “文本” 「和」 “图像” 映射至同一高维 “语义向量空间”：

❝

可以这样理解： 在这个空间里，无论是文字“香蕉”，还是一张香蕉的图片 🍌，它们都会被编码成一个向量（一串数字），并且它们在空间中的“位置”会非常接近。而“苹果”🍎 会离它们近一些，“小猫”🐱 则会离得很远。

❞

通过这种方式，我们可以用数学上的“距离”（这里用的是余弦相似度）来衡量任意文本和任意图标之间的语义相关性。距离越近，相似度得分越高，代表它们在意义上越“贴合”。

实时推荐：向量数据库与 HNSW 算法

理论已经完美，但现实是我们的图标库拥有数十万甚至数百万的图标。当用户输入文本后，如果我们将生成的文本向量与库中每一个图标向量都计算一次相似度，那将是一场性能灾难。

为了实现“实时推荐”，我们必须让检索过程毫秒级响应。这里用到了向量数据库和 HNSW (Hierarchical Navigable Small World) 算法。

离线处理与索引构建：把图标库提前准备好

为了让推荐过程够快、够准，我们提前对图标进行预处理：

首先，对图标做「标准化处理」，比如统一尺寸、去背景等；

其次，用 CLIP 把每个图标都编码成「向量」，并记录它的标签、风格等信息；

{
  "id": "icon_1023",
  "tags": ["urban", "tree", "greenery"],
  "style": "flat",
  "embedding": [0.12, -0.34, ..., 0.08] 
}

最后，把所有这些数据都存进了向量数据库，并建立好索引。

有了这些“预先计算好”的图标向量，我们就能在用户发起查询时，直接对比向量，快速返回结果。

在线推理：从文本到向量的实时匹配

当用户输入文本后，进入在线推理阶段：

将解析出的关键词（如 "urban greenery"）输入 CLIP Text Encoder，实时生成一个文本向量 text_embedding。

text_embedding = clip.encode_text("urban greenery")
image_embedding = clip.encode_image(icon.png)

通过计算文本向量与数据库中所有图标向量的「余弦相似度」来评估匹配程度。该值范围在 0 到 1 之间，得分越接近 1，代表两个向量在方向上越一致，即语义越相关。

similarity = cosine_similarity(text_embedding, image_embedding)

我们通过一个直观例子来解释这个过程：

❝

用户输入，“我想要一个水果相关的图标，比如香蕉”

❞

首先用 CLIP 对输入进行处理生成的 text_embedding 是一个维度为 300 的向量，例如

[0.34, 2.35, 8.34, ..., -1.23]

相当于下图，把 “Banana” 这个词投射到了语义向量空间的某一个点。

系统会在已编码的图标向量中执行最近邻检索，计算每个图标与 banana 向量之间的余弦相似度

在语义空间中，距离 banana 向量最近的图标向量会获得最高分数。例如图中：

• 🍌 Banana 图标 → 相似度 0.95 ✅
• 🍎 Apple 图标 → 相似度 0.78 ✅
• 🐔 Chicken 图标 → 相似度 0.13 ❌
• 🐱 Cat 图标 → 相似度 0.09 ❌

最终返回一个图标列表，按语义相关性降序排列：

将前几个高相关图标展示给用户。

「向量检索：毫秒级的精准匹配」

当图标库规模达到数十万甚至数百万时，暴力遍历计算相似度是不可行的。因此，我们采用专业的向量数据库。

数据库内部采用 HNSW (Hierarchical Navigable Small World) 算法构建索引。HNSW 是一种高效的近似最近邻 (Approximate Nearest Neighbor, ANN) 搜索算法，它通过构建层级化的图结构，能够在保证极高召回率的同时，将检索速度从线性扫描的 O(N) 复杂度降低到对数级的 O(log N)，实现毫秒级响应。

就像上图所示，

• 它会 「先建立一个图结构」，可以理解为把所有数据点按相似度连成一张“地图”。
• 这个图是 “分层” 的——上面的层级连接远距离点，下面的层级连接近距离点。
• 这样，在查找时你可以 「先从高层快速跳跃接近目标，再在底层细找」，就像先坐飞机到一个城市，再打车去目的地，既快又准。

混合查询：条件过滤 + 语义匹配

但光靠向量相似还不够，实际需求往往还伴随着额外条件。比如：

❝

“想找跟公共交通相关的图标，但风格必须是扁平化的。”

❞

这时候我们会发起一个「混合查询」，采用 “先过滤，后搜索”（Pre-filtering）的策略

• 首先，根据style = 'flat'等结构化条件筛选出候选子集；
• 把“公共交通”转换成文本向量，在该子集内执行语义相似度检索；

这样筛出来的图标，既语义贴合，又风格匹配，用起来精准又顺手。

效果展示

最后，让我们给文章首图中提取的内容“销售收入减少，核心产品市场份额下滑导致收入下降12%”推荐一组合适的图标：

推荐效果到底好不好？

为了验证推荐的实际表现，我们设计了一套由「离线评测 + A/B 实验 + 长期监测」构成的评估体系，从主观感受与客观数据两个维度出发，衡量推荐准确性。

人工 + AI 评测，从“感觉像不像”入手

我们构建了一个 100 条真实语句的测试集，覆盖了从抽象概念（如“可持续发展”）到具体事物（如“香蕉”）的多元化场景。

随后，邀请多位内部评审员对每条语句的推荐结果进行主观盲评。评分标准如下：

最终得分汇总如下：

• 「人工平均评分：4.06」
• 「AI 评分：4.09」（这里调用的是图文多模态模型 Qwen2.5-VL-72B-Instruct）

❝

两者高度一致，从另外一个维度上说明 AI 在“懂你”这件事上，已经迈出稳定的一步。

❞

后续，我们将持续扩充和丰富测试集，采用 AI 评测的方式对大数据量的测试集进行评测。

A/B 对比实验

为了量化不同技术方案带来的实际影响，我们还针对多个核心环节设计了 A/B 测试，以数据驱动决策。

测试变量包括：

• 是否使用 LLM 进行关键词理解：LLM 提取核心视觉概念的效果略高于不分词，100 条语料集评分从 4.0 提升到 4.09。

后续还计划进行不同嵌入模型对匹配质量的影响、不同向量检索参数的性能等。

通过对比实验，我们能够科学地选择最优技术组合，确保每一次迭代都能带来可衡量的业务价值提升。

用户行为追踪

最终，用户的真实行为是检验其价值的黄金标准。

随着信息图应用在业务中上线，我们还将接入真实用户行为数据进行效果追踪。当用户不满意当前推荐图标时，可以进入编辑态，自行更换图标：

这个过程中我们关注以下指标：

• 「替换率 (Replacement Rate)」：用户不采纳推荐图标，手动更换为其他图标的比例。这是一个关键的负向指标，高替换率直接反映了用户对推荐结果的不满。
• 「Top-K 采纳率 (Top-K Adoption Rate)」：用户采纳的图标在推荐列表中的位置分布。该指标帮助我们评估排序模型的优劣，理想情况下，用户的采纳应高度集中在 Top-1 或 Top-3。

这些来自一线的真实数据将成为后续策略调整的第一手参考，帮助我们打造一个真正“越用越懂你”的推荐引擎。

通过这套多维度评估体系，我们能系统性地回答这个问题：

❝

“这个系统真的懂你吗？”

❞

从初步结果来看，语义理解 + 多模态向量检索的组合，已能在绝大多数场景下做到高质量匹配。未来我们还会持续扩大语料、优化策略、引入用户反馈闭环，推动推荐结果从“相关”迈向“准确”与“好用”。

参考资料

https://milvus.io/blog/what-is-a-vector-database.md

https://medium.com/@serkan_ozal/vector-similarity-search-53ed42b951d9

https://mlops.community/vector-similarity-search-from-basics-to-production/