Hello.

欢迎进来看看。

FEI · AI 产品项目

你好,我是 FEI。

我在 LibTV 亲手完成 AIGC 短片,把创作中对素材关系的观察带进 KOOZHEN Studio 的体验设计,也参与了公司官网升级。Figma、ChatGPT 与 Codex 帮我把想法做成可检查的界面;产品目标、取舍和验收由我负责。

01主案例创作工作流 × 产品 UX

从 LibTV 的
连线画布,
到 Studio 的
资源关系可视化。

我先在 LibTV 中完成脚本、设定、分镜与视频,再把创作中看见的依赖关系带进 Studio UX。从早期 Figma 概念到实际界面,设计与产品持续相互校正。

播放成片 ·《番茄鸡蛋面》

亲自创作 · LibTV

连线让素材关系
看得见。

在《小洛的周末早餐》中,我使用不同 AI 模型完成脚本、角色与场景一致性设定、分镜和视频片段。连线帮助我追溯结果来源,也看清修改会影响哪里。

独立创作者 / 产品体验者

LibTV · Canvas
打开公开画布 ↗

从使用中发现参考、素材与结果有了可追溯的关系。我据此在 Studio Pro 的 Figma 方案中画出素材与可玩原型的连线。

产品场景

一个人,就能开始做游戏。

KOOZHEN Studio 是面向个人游戏创作的智能体工作台。创作者从一个想法开始,逐步形成可以运行、试玩和继续修改的游戏。

Figma → KOOZHEN Studio

从设计图,
走进实际产品。

同一个 Figma 文件从简化概念逐步细化。每组左边是 Figma,右边是对应的 Studio 测试界面。点击图片可放大;详细帧属于后续迭代,不作为最初交付稿。

结构概念

先画清楚节点与结果。

简化画布明确节点、连线和创作结果的关系;右侧记录了实际 Pro 画布的界面框架。

BEFORE · Figma 早期概念
Studio Canvas 早期 Figma 概念图
AFTER · Studio 测试画布
KOOZHEN Studio 实际 Pro 画布初始状态
引导模式

先看到可玩的结果。

预览放在中心,素材留在一侧。创作者可以先试玩,再决定是否展开更多控制。

BEFORE · Figma 引导模式
Studio 引导模式 Figma 设计
AFTER · Studio 引导模式
Studio 引导模式实际界面,中央为可玩原型预览,右侧是素材栏
Pro 模式

让素材连向可玩原型。

左侧 Figma 细化了素材、引用连线与可玩结果的关系;右侧为当时测试项目的 Pro 画布初始状态。

BEFORE · Figma Pro 模式
Studio Pro 模式 Figma 设计
AFTER · Studio Pro 测试界面
Studio Pro 模式实际界面的初始空画布状态

从设计到产品

设计进入产品后,
我继续用实际项目验收。

我负责产品判断、UX/Figma、需求定义与验收;工程师负责源码打包。我借助 Codex 继续实现、定位问题,并用真实项目检查操作是否连贯。

我的判断
模式划分、信息层级、使用路径与验收
Codex 参与
读取现有实现、协助改动、排查与回归检查
KOOZHEN Studio 实际运行界面,显示创作计划、预览区与素材轨
实际运行界面 · KOOZHEN Studio公开测试项目的引导模式初始状态。

落地与复盘

已落地、已定位、仍需验证。

进入产品

引导 / Pro 模式、画布工具重排、项目文件回填与可玩预览链路。

一次具体诊断

“生成文件没有出现在画布”最终定位到项目目录与索引链路,而不只是显示问题。

仍需验证

真实用户效率、跨素材一致性与更长周期的创作行为。

02次案例信息架构 × 网站设计

为初创团队
重做官网。
讲清产品,
用作品建立信任。

初版由领导完成。我重新梳理信息架构与视觉,制作图片素材,并与 Codex 协作完成页面实现和跨设备验收。

Before + After

同一屏内容,
升级前后差在哪里?

旧版先给出宏大表达;升级后先说明身份,再用作品证据和明确的合作入口帮助访客继续判断。

拖动图片中线,查看改版前后 ↔

KOOZHEN 官网升级版首屏
KOOZHEN 官网初版首屏
BEFOREAFTER

HOW I WORK WITH AI

我把 ChatGPT / Codex
放进工作流,
判断仍由我负责。

AI 进入思路、Figma、代码和验证;目标、约束、取舍与最终判断仍由我负责。

  1. 01
    从真实问题开始

    先亲手使用产品,找到具体阻力,再确定目标和公开边界。

  2. 02
    把判断做进设计

    我在 Figma 定义信息层级与交互;Codex 插件协助读取现有界面、补全状态和映射实现。

  3. 03
    让 Codex 进入实现

    给出约束与验收标准,让它阅读项目、修改代码、定位错误并运行检查。

  4. 04
    回到界面继续修正

    我逐轮体验产品,指出偏差,判断哪些已经完成、哪些仍需验证。

一个真实任务

“生成项目文件未出现在画布”看似是 UI 问题。与 Codex 协作排查后,问题落到项目目录和索引链路;修复后再用项目回填与预览行为验证。

ABOUT FEI

我喜欢从亲手试过的事情里,
找到值得重新设计的地方。