一、 前言在前幾天的文章中，我們的「AI 酒館」已經具備了精美的暗色調介面，並且透過瀏覽器原生的 Web Speech API 實現了「聽（STT）」與「說（TTS）」的能力。不過，眼尖的讀者可能會發現：此時的 NPC 講的依然是事先寫好的固定台詞。 既然名為「AI 酒館」，怎麼能少了真正的大腦呢？今天的核心任務就是把 Google Gemini API 引入專案，讓調酒師與吟遊詩人擁有即時生成對話、甚至維持角色人設（System Instruction）的能力！

二、 為什麼選擇 Google Gemini API？在眾多 LLM 服務中，選擇 Gemini 作為酒館大腦的原因非常契合我們的專案定位：慷慨的免費額度（Free Tier）：對於個人開發與鐵人賽專案來說，Google AI Studio 提供的免費 API 額度非常夠用，完美延續我們「零成本、輕量化」的開發哲學。強大的多模態與輕量模型：透過 gemini-2.5-flash 等快速且高性價比的模型，能確保前端直接發送請求時，NPC 的回應速度流暢不卡頓。優異的 Role-play（角色扮演）能力：Gemini 對於複雜的 System Instruction（系統提示詞）有很好的遵循能力，能精準呈現冷酷調酒師與熱情吟遊詩人的獨特語氣。

三、 實作步驟與核心程式碼下達 Vibe Coding 需求我們透過 AI 助手在專案中引入 Gemini 呼叫邏輯，並為不同的 NPC 設定專屬的個性背景：核心 API 呼叫與人設綁定前端發送請求的核心邏輯大致如下：TypeScriptimport { GoogleGenAI } from '@google/genai';

// 初始化 Gemini 客戶端
const ai = new GoogleGenAI({ apiKey: import.meta.env.VITE_GEMINI_API_KEY });

export async function getCharacterResponse(characterId: string, userMessage: string) {
// 根據角色設定不同的人設
const systemInstructions = {
mark: "你是一位冷酷、專業、偶爾帶點溫柔的酒館調酒師 Mark。說話精煉、充滿人生歷練。",
bard: "你是一位熱情、浪漫、背著吉他的吟遊詩人 Bard。說話喜歡帶點詩意與音樂的浪漫。"
};

const response = await ai.models.generateContent({
model: 'gemini-2.5-flash',
contents: userMessage,
config: {
systemInstruction: systemInstructions[characterId] || "你是一位酒館的客人。",
}
});

return response.text;
}
前端互動整合當玩家點擊送出（或語音輸入完成）後，系統會自動帶入對應 NPC 的角色靈魂，將對話交由 Gemini 即時生成，讓整個酒館的互動體驗瞬間活了過來！

四、 今日心得與預告今日心得：當看到調酒師 Mark 開始用符合人設的語氣，即時回應玩家天馬行空的問題時，那種成就感真的無法言喻！這就是 Vibe Coding 的魅力——把繁雜的架構交給 AI，我們專注於打造有趣的核心體驗。明日預告 (Day 06)：【優化】酒館氛圍營造！為對話加入打字機特效（Typing Effect）與聊天室自動捲動，讓沉浸感再次升級！