鸿蒙文搜图·图猎出击：机器出题考你，60 秒反向文图匹配极限竞答

前面我们把「文搜图」玩出了检索、回忆、解谜、诗词、手账各种花样，这一篇彻底换个身份——不是你搜图，是机器出题考你。系统丢给你两三个语义线索词，你要在 60 秒内从 4 张候选图里闪电点出目标。答对越快分越高，答错零分，8 关下来按答对率评级：是「文图心电感应」还是「见习寻宝人」，一跑便知。

---

一、效果展示：一局完整的 8 关竞答

1. 开局：霓虹徽章 + 规则一览

开始页走霓虹电光竞答风：深空蓝黑底色，一枚带品红辉光的闪电徽章，「60 秒极限找图」的标题直接点题。下面三条规则用彩色胶囊排开——线索极简、越快越高、八关连击，底部一枚带发光阴影的「闪电开局」按钮。整个页面没有任何多余元素，进游戏前 3 秒就能看懂玩法。

2. 第 2 关：线索「寂静 / 夜晚」，倒计时 58 秒

进入游戏后，顶部是 8 颗进度灯（已过关卡品红、当前关电青），右上角 SCORE 0 计分胶囊。线索区用电青胶囊词给出「寂静」「夜晚」，右侧是一个环形倒计时——58 秒，剩余 ≤10 秒会变红。

下方 2×2 候选网格铺着 4 张图：猕猴、午间小憩、草地与狗、星空下的谷仓。注意这里线索词不会直接出现标题字面——线索从目标图标签里随机抽，但会排除和标题相同的词，防止秒答。

3. 第 2 关命中：青框标出「就是这张」

点选「星空下的谷仓」后判定：目标图被青柠色描边框住，左下角浮出「✓ 就是这张」角标，其余三张图透明度降到 40% 降噪。底部反馈条显示「✓ 命中目标 +100 · 11s」——11 秒答对，拿到满分 100 分（20 秒内不扣分）。右上角 SCORE 同步跳到 100。

4. 第 3 关失误：红标「你选的」，青框标出正解

第 3 关线索是「橙色 / 运动」。玩家误点了「午间小憩」，判定后：错选图左上角浮出珊瑚红「✕ 你选的」，真正的目标「冲浪者」用青框标出并附「✓ 就是这张」。底部提示「✕ 目标错误 · 正确答案已用青框标出」。

这个设计的用意是即时纠偏——答错不只是一句「错了」，而是立刻让你看到正解长什么样，形成「线索→画面」的反射记忆。

5. 第 7 关：2 秒闪电命中

第 7 关线索「温暖 / 手」，玩家 2 秒就点中「柠檬姜茶」——底部显示「✓ 命中目标 +100 · 2s」。这一局的手感已经完全起来了，看到「温暖+手」立刻映射到「捧着热饮」的画面。

6. 结算：300 分 3/8，评级「C · 见习寻宝人」

8 关结束，结算页给出三样东西：

• 大比分卡：品红 300 总分 + 青柠 3/8 答对数
• 评级胶囊：按答对率分 S/A/B/C 四档，这局 37.5% 落在 C 档「见习寻宝人」
• 逐关战绩：R1~R8 每关一行，✓/✕ + 得分 + 用时，一眼看出哪几关掉了链子（R2/R4/R5/R8 全挂）

---

二、产品立意：把文图匹配「反转」成游戏

合集里之前的工程都是人搜图：用户输入文字，系统返回图片。这个项目把方向整个反过来——机器出题考人：

传统文搜图：  文字查询 → 检索 → 返回图片
图猎出击：    图片目标 → 抽词 → 文字线索 → 人来找图

这么做的价值在于锻炼反向语义联想：给你「寂静、夜晚」，你脑子里要立刻浮现「星空、谷仓、黑夜」的画面。这正是文搜图引擎里最核心的能力——从抽象语义到具象视觉的映射，只不过这次由人脑来完成，机器负责判分。

60 秒限时 + 答错零分 + 按答对率评级，把「慢慢想」变成「闪电战」，让语义联想变成一种可以量化、可以刷分的竞技能力。

---

三、出题引擎：三个让题目「有难度但不离谱」的设计

出题引擎的核心在 buildLevel()，50 行代码里藏着三个关键决策。

1. 干扰项优先挑「标签有交集」的图

const similar = others.filter(h => h.tags.some(t => target.tags.includes(t)));
rng.shuffle(similar);
for (const s of similar) { if (distractors.length < 3) distractors.push(s); }
for (const o of others) { if (distractors.length < 3 && !distractors.includes(o)) distractors.push(o); }

如果目标是「柠檬姜茶」（标签含「温暖、饮品、手」），干扰项会优先出「热咖啡」「晨光茶歇」这种同样有「饮品/温暖」标签的图，而不是八竿子打不着的「雪山」。这样玩家不能靠「明显不像」来排除，必须真正理解线索词的语义边界。

2. 线索词排除标题字面词

const clueTags = target.tags.filter(t => !target.title.includes(t));

如果目标图标题是「星空下的谷仓」，线索里就不会出现「星空」「谷仓」这种直接写在标题上的词，而是从「夜晚、寂静、旷野」这类语义相关但不字面相同的标签里抽。这迫使玩家做真正的语义联想，而不是「找标题里有没有这个词」。

3. 种子随机保证每局题目不同

SeededRandom 用线性同余 + Fisher-Yates 洗牌，种子取自 Date.now()。同一台设备上连开两局，题目顺序、干扰项组合、线索词都不一样，避免背答案。

---

四、计分模型：快者满分，慢者递减，错者归零

计分规则一句话：20 秒内答对得 100 分，每超 1 秒扣 4 分，下限 20；答错或超时 0 分。

用时	得分	说明
≤ 20s	100	满分区，鼓励闪电反应
25s	80	每超 1 秒 -4
40s	20	下限保底
60s	20	超时前压哨答对也有保底
答错/超时	0	零容错

8 关满分 800，结算按答对率（不是总分）评级：

评级	答对率	称号
S	≥ 90%	文图心电感应
A	≥ 70%	语义侦探
B	≥ 50%	线索猎人
C	< 50%	见习寻宝人

用答对率而不是总分评级，是为了奖励稳定命中而不是「偶尔快一次」。你可以每关都压哨 20 分拿 160 总分，但只要答对率够高照样上 S——稳比快更重要。

---

五、核心实现：60 秒倒计时与一次性判定

倒计时：setInterval + 超时自动判负

private startTimer(): void {
  this.timerId = setInterval(() => {
    this.remain = this.service.remainSeconds();
    if (this.remain <= 0) {
      this.stopTimer();
      this.judge('');   // 空 id = 超时判负
    }
  }, 1000);
}

每秒刷新剩余秒数，剩 ≤10 秒时环形倒计时变红施压。归零时自动调用 judge('')——空字符串 id 不会匹配任何图，等价于答错。

一次性判定：防连点刷分

private judge(id: string): void {
  if (this.phase !== 'playing') return;  // 已判定则忽略
  this.stopTimer();
  const res = this.service.pick(id);
  this.phase = 'judged';
}

phase 状态机保证每关只判一次：判定后 phase 变为 judged，后续点击被 enabled(this.phase === 'playing') 直接禁用，杜绝连点刷分。

判定反馈：三元视觉降噪

判定后 4 张图分三类处理：

• 目标图：青柠描边 +「✓ 就是这张」角标
• 错选图：珊瑚红「✕ 你选的」角标
• 其余图：透明度降到 40%，视觉退场

一眼就能看清「对的在哪、我点了哪、其他不重要」。

---

六、交互细节：霓虹竞答风的快节奏反馈

整套 UI 围绕「竞答感」设计：

• 进度灯条：8 颗圆点，已过品红、当前电青、未到灰蓝，当前关的灯拉长成胶囊形，一眼定位进度
• 环形倒计时：比数字更直观的「时间流逝感」，≤10 秒变红是经典的施压手法
• SCORE 胶囊：右上角常驻，等宽字体 + 青柠色，每次答对实时跳动，给即时正反馈
• 霓虹发光阴影：主按钮和徽章都带 shadow: { radius: 24, color: C_HOT }，在深空底上营造「霓虹灯管」的悬浮感
• 底部反馈抽屉：判定结果和「下一回合」按钮收在底部圆角抽屉里，视线自然落在最后操作的位置

---

七、验证：截图数据与代码逻辑逐项核对

截图	关键数据	代码验证
02-round2	倒计时 58s，SCORE 0	remainSeconds() = 60 - elapsed，第 2 关刚开始 2 秒
03-round2-hit	+100 · 11s	11s ≤ 20s，满分 100 ✓
04-round3-wrong	SCORE 100 不变	答错 0 分，总分不加 ✓
05-round7-hit	+100 · 2s，SCORE 300	2s ≤ 20s 满分；100(R2) + 0(R3) + 100(R?) + 100(R7) = 300 ✓
06-final	300 分 3/8，C 评级	3/8 = 37.5% < 50%，C 档「见习寻宝人」✓

逐关战绩列表里 R1 ✓ 100 分 · 11s、R2 ✕、R3 ✓ 100 分 · 7s……与判定逻辑完全吻合。

---

八、已知边界

诚实说明当前版本的能力边界：

1. 图卡与标签为内置预置（12 张），未接入相册导入或端侧语义模型，题目规模有限
2. 计分为线性规则，未做连击加成或难度递增曲线——第 1 关和第 8 关的干扰项迷惑性相同
3. 未实现本地最高分持久化，关掉应用后战绩不保留
4. 线索词为标签随机抽取，偶尔会出现「温暖和手」这种需要一点联想跳跃的组合（虽然这正是游戏性的来源）

这些边界都有明确的演进路径：接入端侧语义模型扩大图库、加连击倍率、用 Preferences 存最高分、引入难度递增的干扰项策略。

---

九、小结

「图猎出击」是文搜图合集中的反向竞技篇——机器出题、人来找图、限时计分、按答对率评级。它把文图匹配从「检索工具」变成「反应游戏」，用最简单的 2×2 网格 + 60 秒倒计时，逼迫玩家在电光石火间完成语义到视觉的映射。全程端侧、零网络零权限，模拟器即可完整游玩。