2 月 23 号晚已更新。

• 谜题解析
• 贴纸设计
• 其他小插曲
• 部分内容排版优化

简介

惯例先上活动链接：what-to-drink.gitee.io/2024/#/inde…

前两年我们做了一个关于奶茶人气的投票，今年也不例外，我们在农历新年前上线了这个活动的 2024 年版本 「龙年第一杯喝什么」，这表面上依然还是一个很纯粹的奶茶投票抽奖活动。

如无意外，这应该是这个投票活动的大结局篇了，我衷心地觉得在大家天天群里掰头下，今年的活动无论是视觉设计还是玩法设计都已经无法轻易被超越了，这也是三年来上线得最狼狈的一期，连朋友圈里发出去的活动介绍都是我们在地铁和的士上完成的。

今年我们的项目成员临时扩充了 100%，新增了一个策划总监和一个设计总监，设计和玩法也得到了大幅度的提升，在设计途中有非常多的故事迫不及待想和大家分享。

AIGC

AI 是 2023 年互联网领域最热的话题，恰好我们新加入了一位设计师，恰好她也对 AIGC 饶有兴趣，于是她结合我们的祝福语文案，使用 AI 设计了一套龙年的祝福语海报，最终成品可以看下面的图，团队及非常多的朋友都对其非常喜欢，这套海报也弥补了去年的活动我一直想要设计一个吉祥物却没有完成的遗憾。

我非常喜欢这一套海报的最大一个原因，可以用我最近看到的摄影师的一段话来回答「所以我恰恰不担心AI 对人情感的剥夺，技术和艺术的紧密结合从来都是答案。AI 并不残酷，它只会为故事增加一双翅膀。」

优秀的作品必然是建立在良好的审美的基础上的，AI 或者是其他工具只是反射审美的镜子，甚至说，越高效的工具，暴露出来的审美高低差异会越明显。

无账号系统

我们的投票温馨提示里提到一点：你不需要登录，也不需要关注公众号就可以进行投票，当然关注的话我会很高兴。

而今年的设计中，我们为玩家们增加了一张收集卡片，用以回顾收集到的谜底卡片、贴纸和通关总人数，这是一个需要持续记录数据的过程，上面提到的无账号系统因此在带给了我们一些困扰。

实现方式

无账号实现方式是通过 localStorage + IP 地址的方式来标识用户。

token 作为唯一的标识，每次请求都会从 localStorage 获取 token 带在接口上一起请求。

如果新用户或同一用户使用不同浏览器访问（token 不存在的情况），就会切换到使用 IP 地址来标记用户，发生请求的时候会判断数据库是否存在这个IP的记录，然后 返回对应的 token 或 生成新的 token 和记录 token 和 IP。

同时每次切换 IP（切换 WIFI 和流量） 也会动态的记录到，所以 token 和 IP 的对应方式是一对多的。考虑到可能会有 X-Forwarded-For 来伪造IP的情况，这种已经在 nginx 层面做了防护，所以无账号系统理论上是满足了既不用繁琐的登录，也能实现用记录用户信息的需求。

不用登录可靠吗？

我们回答很直接：并不可靠

神奇的进度同步

就在上线的当晚，我的 A 手机清理过了缓存（包括本地存储），接着使用 B 手机在线上验证了一遍流程，通关了全部关卡，获得了部分贴纸。这时候我重新用 A 手机打开，神奇的是 B 手机的进度同步到了 A 手机，这本来是今年没有实现的想法之一，这次属实是阴差阳错的 Bug 变成了特性。

这个问题的原因是我连的是同一个 WIFI（准确来说是同一个带宽账号分出来的网络），在服务器拿到的 IP 地址都是这带宽账号的 IP 地址，根据上面实现的方式，就出现了这样的情况。

游戏进度数据丢失

另一个出现的问题是当本地 token 失效了或 token 获取不及时并且切换了网络，就会丢失掉之前的游戏进度，这个可能会在多次在不同网络下打开会出现，而玩家们基本是相近时间段少次访问网页，所以基本没有收到任何关于这个问题的反馈，仅在团队内部发现了这个问题。

尽管出现了上面的问题，但是受益于我们活动的特殊性：少次访问及玩家体量较小，所以这个无账号的实现方式依然是相对可靠以及对玩家不造成厌恶（不需要登录）的一种形式。

迷题设计

在今年的谜题设计中，我们的讨论中反复出现最多的一句话绝对是在 3Blue1Brown 频道中说难不难说简单不简单的大风车问题 出现过的一句话：

没有一个人可以准确说出自己的出题难度

核心设计要点

• 谜题都要跟格子有关
• 每个谜题都要有常规的解法和非常规解法（非常规解法在团队内称呼其为 Trick）
• 提示要同时提示常规解法和 Trick
• 谜题设计要更大众化向
• 谜题的设计要像残局（完成步数要少）

以格子为主题的基础谜题

第 1 关

第 1 关以大家都很熟悉的井字棋作为谜题，很简单，通关率有 85%。

Trick 解读：本关的提示文案里的「它」，既是指上方的格子，也是指「它」这个字本身。

但第一关远比谜题设计更重要的是它的引导作用，它无形中传达的内容有：

• 初次呈现整体谜题视觉，区分可交互和不可交互的部分
• 传达明显的格子可以点击
• 传达加粗的文本也可以点击，也是 Trick 的视觉特征之一
• 按钮上方的文字内容会提示过关的方式，同时也指示了本关上方不一样的格子是可以点击的
• 点击格子后，然后点击提交，是关卡的基本交互

第 2 关

有了第 1 关的基础，第二关的就可以开始更关注在谜题设计本身了。

谜题本身来自于绘图方块，详细的介绍可以见去年的文章，过关方式是红色的格子满足对应行列的数字要求。

Trick 解读：数字代表了什么？既然常规方式是要根据数字代表的含义来解读，那么反过来想，如果不存在数字，就不用关心数字代表什么了，所以这关的 Trick 方式是点击数字，让数字消失，就算通关了。

第 3 关

第 3 关也是一个经典游戏，9 宫格的关灯最少需要 5 步，而上面提到我们需要一个残局向的游戏，所以我们选了一个关灯游戏的残局，只需要 2 步就可以完成。尽管如此，我们预计这依然是会难倒不少人，所以我们留了一个极其简单的过关方式。

Trick 解读：关灯吧

常规方式是要关掉格子里的灯，但 5s 后界面上会出现一根拉绳，拉了绳子后就会直接关灯，这是最容易发现的 Trick，因为我们不想让玩家们卡在这里。

点灯游戏更多的玩法和介绍可以看这个链接：www.geogebra.org/m/JexnDJpt#…

第 4 个谜题

有一些玩家和我反馈第 4 关入口不容易找到，这是我们特意设计的，前三关的各种设计都只是吸引玩家们去寻找隐藏起来的第 4 关，所以上面我们才提到不想让玩家们卡在前 3 关。

第四关的入口提示有几处：

• 首页标题中小六的问号
• 首页底部的图形
• 收集卡片中的未收集时的图形

入口的提示代表了多次点击标题中的小六，至于为什么是这个答案，可以观察一下标题中小六的细节。

第 4 关的谜题核心设计是：一个6*6 的格子数字谜题，谜面和奶茶投票格子情况关联变化，即谜面会随着不同的投票结果变化，但是最终答案保持一致的谜题。

旧排名系统的影响

最初的谜题设计是获取 Level 8, Level 7, Level 6 的奶茶的位置，把这 3 个位置对应的数字答案按顺序拼起来作为答案。不过很快发现因为旧排名系统的影响不得不改变设计。

在去年的文章我们写到：

等级计算规则是在去除最高与最低票数后，计算出平均票数，当前项是平均数的多少倍即为多少级，以此保证每一项都有一个确定排名，这个处理方式同时也产生了一个问题，每个等级的数目不固定。

也就是说一共 8 个等级，最高票和最低票分别是 Level 8 和 Level 1。只要有票数差异也就肯定会有这 2 个等级，但中间的 2-7 级数目会十分地随机。

举个例子：按照上面的计算方式可能出现 1 个 Level 8，2 个 Level 4，33 个 Level 1，这个情况下无法确保 6 , 7 , 8 这 3 个等级可以一直出现，以至于最开始的谜题设计思路走不通了。

截止到写文章的这个时间点，场上排名分布情况是：

• Level 8 * 1
• Level 7 * 2
• Level 4 * 1
• Level 3 * 4
• Level 2 * 27
• Level 1 * 1

这时候依旧没有 Level 6 的出现，说明 7 和 4 的票数等级相差得太多了。

最终设计方案

根据上面的情况，我们调整了这一个谜题的设计方案，以必然出现的 Level 8 展开设计，使用 Level 8 和其相关的另一个格子作为答案。

提示图表达的意思则是：Level 8 本身所在的位置 + Level 8 所在的列的最下面的的一个位置（箭头所指位置），拼起来就是最终答案。

我们对另外两个情况做了处理，保证本关答案的统一：

• 如果 Level 8 出现在最后一行，提示图的箭头会变成向上，指向第一行。
• 如果有多个 Level 8，那么每个 Level 8 当列的最下（上）一个的格子也会变成一样的数字

最后一点是，在第 4 关我们没有设计 Trick 的过关方式，但是也有其他方法可以解出来，这点在最后会提及。

第 5 个谜题

事实上，我们还留了第五个谜题，在拿到前 4 关过关的数字卡片后，界面上的排列顺序并不是最终的答案顺序，你还需要重新排列顺序后才能拿到最终的密码。

当我在考虑怎么提示玩家们需要重新排列的时候，我的脑海竟然想起了童年时的看过的《龙珠》漫画的书脊设计，于是迅速地把原来的横版卡片修改成了竖版，这就是最后一个谜题的灵感来源。

文案

祝福语

今年出于多了一位策划，我们更新了大部分祝福语，保留自去年的几条祝福语就不重复写了（上面的海报展示了一遍）。

任你行：马路戏院商店天空海阔 任你行

来自陈奕迅的《任我行》。

创造美好：Make Something Wonderful

英文原句来自乔布斯。

敬自己：敬我们自己！敬触网而起的网球！

前半句灵感来自于上海彩虹室内合唱团《醉鬼的敬酒曲》，后半句来自于《飙马野郎》，关于触网而起的网球是这样的一个故事：

这句话出自漫画后半段主角两人因为一些原因失去了几乎所有东西，两人在大雪中喝起唯一剩下的一瓶酒时，说出了这段话。

它其中一点想表达的是因触网而起的网球，会落到哪一侧，是谁也无法知晓的，颇有一种敬未知的前路的意味，再在放到漫画里的情境，极具浪漫主义色彩。

健康靓丽：腰不酸了 腿不疼了 一口气上五楼 不费劲儿

来自新盖中钙广告词。

相爱吧：相爱吧 终有一散的人们

来自声音碎片乐队的歌曲《优美的低于生活》。

多生发：逐渐生发又得 立即生发又得 得咗

灵感来自于美源发彩的经典广告词「逐渐变黑又得，立即变黑又得，得咗」。

摸大鱼：指指点点提意见 安安静静摸大鱼 是对的

去年写出自前同事，今年可以写出自我们新加入的设计师。

拥抱自己：从此我不再希求幸福 我自己便是幸福

来自惠特曼《大路之歌》。

平平淡淡：日出又日落深处再深处 一张小方桌有一荤一素

来自毛不易《一荤一素》，很期待他的下一张专辑。

有惊无险：有惊无险 失而复得 虚惊一场 这应该是人生最美妙最快乐的事情

来自李健演唱会 Talking，对这句话我只能说，确实。

卷个锤子：当一个卷王当道时代的不卷王者

灵感来自锤子科技的坚果 Pro 收集的广告文案「圆滑当道的锐丽异类」。

自然醒：一觉睡到自然醒过来 不管这个胡闹时代到底有多坏

来自林宥嘉的《自然醒》。

勿拖延：小孩不能有拖延症 否则会变拖孩

出自小红书，再深一步出处没有考究。

必发大财：吃我祥龙十八掌 命里必定发大财

也出自小红书，再深一步出处也没有考究。

纯真未变：友共情从难扭转 心内那热暖 仍是纯真未变

来自古巨基《友共情》。

有勇气：被人想念的时候不要心慌，想念别人的时候不要害怕

来自安溥演出 Talking 部分，这是我最想看的几位歌手的现场之一，希望今年有机会买到票。

问题不大：只要还活着 就不会有坏结局 我们仍然在故事的中途

来自日剧《火花》，剧中的最后一句台词，拖拉至今年才看完了最后几集，我看过的最好的日剧不为过，但节奏之慢和题材的缘故我觉得不是每个人都能看得下去，但它依然值得我在这里特意推荐。

贴纸

今年的贴纸都是上线前一天设计的，上线的压力让我的设计力胡乱膨胀，整出了一些怪异的贴纸，果然越靠近 Deadline 生产力越强，是对的。

以下顺序为从左往右从上往下。

• 我全都要：投了 5 个品牌以上就能获得。这是唯一一张保留了去年设计基础的贴纸，在此之上增加了褶皱、褪色和划线的效果，有一种从去年贴到现在的感觉，希望大家去年的不能全都要的话，今年继续全都要。

• 蝙蝠侠：0-5 点投票就能获得，梗来自于《蝙蝠侠》，设计上使用了一张经典 meme 图。

• Always：投了单个品牌 5 次以上就能获得，名称来自于《哈利波特》电影，但是原意有点悲伤，后来我改成了使用不同颜色的爱心 emoji 来设计。

• 小菜鸡：累计点击了格子 21 次就会获得，设计致敬了侏罗纪公园的电影 logo。

• 醒醒：在游戏内玩了 5 分钟就能获得。设计上使用了像素风格，形象来自于《超级马力欧 惊奇》的闲聊花花，这是我去年玩过最具创意和最让人快乐的游戏，如果你有 Switch，尤其是设计师，绝不应该错过这个游戏。

• 有电东西：1 次回答出最终答案就能获得。本来叫「有点东西」，后来因为我先定好了设计就改成了现在这个名字。

• 科学怪人：5 次及以内回答正确就能获得。5 次是我们预计的次数，但看了数据发现没竟然有多少玩家获得这张贴纸，设计上使用了弗兰坎斯坦的形象。

• 你再想想：5 次回答错误就能获得。这是设计得最艰难的一张贴纸，我想模仿早期显示器的显像管效果及蓝屏界面（最后改成了绿色）。

• 过度思考：10 次回答错误就能获得。一个发愁的大卫，一半设计来自于助手 DALL·E 2。

最终答案

至于最终答案是什么，以及最终答案有什么含义，去年也有一些朋友来问过我，我直接来揭晓一下今年我们决定最终答案的方式：

有兴趣的朋友看到这里可以重新再去试试解答，再发一次地址：what-to-drink.gitee.io/2024/#/inde…

一些有趣的小插曲

大众化向的设计

去年的谜题设计基本是由我来操刀设计，主要还是偏向于解谜，可以说很具有个人化色彩。

而在今年团队不仅加入了两位新的成员，我也戏说我可以「放弃原则」，活动想做什么内容都可以。于是我们四人常在群里掰头，不断地推翻已有的设计，也让我反复去思考怎么做一个大家都能玩得愉快的游戏。

现在再回顾起来，无论是 Trick 的提议，还是各种流程的优化也好，都让活动减少了「我」的味道，往大众化设计走去，这是他们做得非常好的一件事。

那些被我们废弃的谜题

关于谜题的设计，我们讨论的内容远多于最终呈现出来的，我们曾讨论或设计过但最终没有使用上的谜题，包括但不仅限于以下：

• 扫雷
• 接水管
• 扑克谜题
• 二进制谜题
• 五子棋
• 黑白棋

后续应该会再写一篇关于这些谜题的不使用理由。

Trick 之外的更多解答方式

除了我们上面提到的谜题的常规解答和 Trick 的方式，其实还有一些规解答方式，这也是我们预料之中及允许的解答方式：

• 通过文字提示理解了第 4 关的首个数字后，通过枚举法来试出最后一位数；
• 获得前三关的卡片后并明白需要排序后，通过枚举法试出来最后一个数字；
• 通过修改域名的方式进入第 4 关；

这些从设计或者开发上都很容易限制，但我们认为让玩家们觉得自己「独辟蹊径」也是很不错的一件事情。

最后

在今年，我们几乎是已经做成了一个微型游戏，这相比于去年设计单个谜题来说又是一种新的设计体验。就如文章最开始所说，这应该是大结局篇了，松了一口气的是明年终于不用想设计什么了，但也伴随着一点担忧，那明年放假的前几天上班摸鱼做什么呢？

最后，谢谢大家来参与投票，谢谢玩我们的游戏，以后我们有机会再见。