AIKL 品牌角色 · 2D 动画

② 悬浮小助手 —— MascotBuddy

固定停靠右下角，点击头像展开对话气泡。适合挂到根 layout 做全站引导。

怎么用

安装（monorepo 内已经接好，独立项目用 npm install @aikl/mascot）

npm install @aikl/mascot
npx aikl-mascot-assets            # 把立绘复制到 public/aikl-mascot

嵌入舞台

import { MascotStage, AIKL_CHARACTERS, AIKL_STARTER_LINES } from "@aikl/mascot";

export function OnboardingPage() {
  return (
    <MascotStage
      characters={[AIKL_CHARACTERS.ivy, AIKL_CHARACTERS.lumi]}
      lines={AIKL_STARTER_LINES}
      colorScheme="auto"        // 跟随站点主题
      characterHeight={300}
      minHeight={460}
      keyboard                  // 允许空格 / 方向键推进
    />
  );
}

全局悬浮助手

// 挂在根 layout 上，全站可见
import { MascotBuddy, AIKL_CHARACTERS } from "@aikl/mascot";

<MascotBuddy
  character={AIKL_CHARACTERS.ivy}
  messages={["需要帮忙吗？", "点我可以看使用引导哦～"]}
  position="bottom-right"
/>