AIGC · Portfolio Prototype

← 返回目录

01 · AI PRODUCT

AI Product

AI 产品设计相关的探索与实践

Case Study AIHom

画布重构：深色 → 浅色

拖动中间的把手，查看画布从深色主题切换到浅色主题后的变化——浅色画布让家具材质与色彩更接近真实居家观感。

AIHOM DEMO

拖动手柄手动对比

深色画布浅色画布

AIHom Modern Minimalist Living Room · v3

AI Chat

Make my living room brighter, Scandinavian style

Lighting and materials updated — here’s the result →

Describe the space you want…

Generate

AIHom Modern Minimalist Living Room · v3

AI Chat

Make my living room brighter, Scandinavian style

Lighting and materials updated — here’s the result →

Describe the space you want…

Generate

画布背景改为浅色，贴近真实居家光照观感，不再像“夜间模式”

家具 / 材质色彩还原更准确：深色底容易让色彩显脏、失真

左侧工具栏改用浅色 + 描边区分选中态，替代深色下的强对比色块

右侧对话面板文字对比度提升，长时间阅读更不费眼

示意界面，非真实产品截图（公司内部 demo 需要保密）

项目背景

产品上线一个季度后，新用户激活率未达预期。在对 Draft.ai 等竞品的画布设计，以及市面主流 AI 生成类工具的界面形态进行调研分析后，提出增加浅色画布功能的设想，作为提升激活率的优化方向之一。

项目职责

结合产品的用户行为数据与用户访谈结果，分析用户在深色画布下的使用痛点与流失信号，论证并提出增加浅色画布设置的需求，推动方案进入产品评审流程。

项目成果

与产品经理共同完成浅色画布的方案设计，功能通过 A/B 测试验证效果并评审通过，已完成排期，进入正式上线阶段。

假设与验证

核心假设：浅色画布能降低视觉认知负担、让家具材质与色彩更接近真实观感，从而提升用户在画布上的停留时长与创建项目的意愿，带动新用户激活率回升。围绕这个假设，评审阶段圈定了几个要看的维度：

画布停留时长人均新建项目数功能发现 / 入口点击率护栏：交互异常率

上线与运营

灰度测试

小流量 A/B

收集反馈

用户访谈 + 数据

全量上线

排期发布

效果观察

持续跟踪

用户端文案

“Canvas just got an upgrade — switch to Light Mode to see material details more clearly. Try it in Settings.”

效果数据因公司内部数据涉密，此处仅展示脱敏后的小部分示例数据

画布停留时长

5.6分钟

上线前 4.2 分钟

↑ 33%

人均新建项目数

2.4个/人

上线前 1.8 个/人

↑ 33%

功能发现 / 入口点击率

34%

上线前 22%

↑ 12pt

护栏：交互异常率

1.5%

上线前 1.8%

↓ 0.3pt

← 返回目录

02 · AI WORKFLOW

AI Workflow

如何将 AI 应用到日常工作中

YouTube 舆情简报

抓取 YouTube 评论，AI 生成可视化简报

点击查看详情 →

数据推送机器人

自动抓取数据，推送异常解读到微信

点击查看详情 →

简历排版小助手

粘贴 Markdown，一键排版导出 PDF 简历

点击查看详情 →

02 · AI WORKFLOW

YouTube 舆情简报

抓取 YouTube 视频评论区数据，用 Claude Skill 自动归纳主题洞察，生成可视化 HTML 简报

工作流程

Laptop · Python 脚本 （可反复运行，每次换一个主题）

STEP 1 · 输入

输入想调研的主题

任意产品 / 品牌 / 话题关键词

→

STEP 2 · 抓取

脚本调用 YouTube 官方 API

拉取相关视频的评论数据

youtube_raw.json ↓ 把生成的数据文件发给 Claude

Claude 已安装 Skill

STEP 3 · 识别

Skill 自动识别任务

按预设规则读取 json、归类打标签

→

STEP 4 · 归纳

主题分类 + 情绪判断

🟢正面 / 🟡分歧 / 🔵值得关注

→

STEP 5 · 输出

生成可视化 HTML 简报

带缩略图、来源链接，开箱即用

这套流程可复用于任意主题 — 换个关键词重新跑一遍脚本，就能得到一份全新的洞察简报

示例效果

点击下方按钮，模拟 Claude 处理完 youtube_raw.json 后生成的简报效果

youtube_briefing_iphone17.html

等待生成…

示例简报基于真实抓取的公开评论数据整理，仅作个人研究用途，数据来源见简报底部

02 · AI WORKFLOW

数据推送机器人

每天定时抓取内部数据看板，自动计算环比 + 异常检测，生成一句话解读并推送到企业微信运营群

工作流程

STEP 1 · 触发

每天定时自动运行

例如每日 09:00 触发

→

STEP 2 · 取数

拉取内部数据看板

付费用户数 / 国家分布 / 金额

→

STEP 3 · 处理

计算环比 + 异常检测

AI 生成一句话解读

→

STEP 4 · 推送

发送到企业微信运营群

机器人自动播报，无需人工打开看板

示例效果

点击下方按钮，模拟机器人每天 09:00 自动推送到企业微信运营群的效果

‹

运营数据播报群128人

今天 09:00

数据播报机器人

付费用户日报 · 8月17日

付费用户数14▲ +2 较昨日

当日流水$96▲ +$11 较昨日

国家分布 🏟🏙日本 · 🇦🇦沙特 · 🇹🇭泰国 · 🇺🇸美国

解读：今日订单集中在日本和中东地区，东南亚（泰国/印尼）贡献稳定，美国有零星付费。

以上均为示例模拟数据，非真实业务数字

02 · AI WORKFLOW

简历排版小助手

粘贴 Markdown 简历文本，一键排版为 A4 简历，支持字体/间距微调与 PDF 导出

在线体验

下方是可直接操作的产品原型 — 默认加载的是一份虚构示例简历，你可以随意编辑、调整排版，不会影响或读取任何真实数据

简历排版器 — 示例数据

以上为可交互产品原型，始终展示虚构示例简历数据，不加载或保存任何真实简历信息

← 返回目录

03 · AI CREATIVE

AI Creative

AI 创意实验与内容创作

AI 社媒运营

AI Social Media

AI 生图 + 生视频制作短视频内容，运营 5 个海外社媒渠道

点击查看详情 →

AI 动漫视频

AI Anime Video

AI 生成的动漫短片

点击查看详情 →

AI 漫画

AI Comic

探索 AI 漫画工业化出图的标准流程，单人一天完成 3 页黑白漫画

点击查看详情 →

AI 展览

AI Exhibition

360imx 展览 — 代码驱动的沉浸式动态装置

点击查看详情 →

03 · AI CREATIVE

AI 社媒运营

用 AI 生图与 AI 生视频制作短视频内容，独立搭建并运营 5 个海外社媒渠道

InstagramYouTubeXFacebookTikTok

项目介绍

从选题、脚本到成片，全部通过 AI 生图与 AI 生视频工具制作短视频内容，独立策划、搭建并运营 Instagram、YouTube、X、Facebook、TikTok 五个海外社媒渠道，独立策划及制作 18 条产品内容，各社媒渠道累计获得 30,000+ 次观看。

5海外社媒渠道

18独立策划制作内容

30,000+累计 Views

my dream living room makeover🤍🤎

01 / 08

02 / 08

03 / 08

04 / 08

05 / 08

06 / 08

07 / 08

08 / 08

01 / 08

02 / 08

03 / 08

04 / 08

05 / 08

06 / 08

07 / 08

08 / 08

03 · AI CREATIVE

AI 动漫视频

《第六次东渡》— AI 生成的水墨风动画短片，用 AIGC 全链路技术重构传统文化叙事

Runway Gen-3Dreamina ProVideo ConsistencyIP-Adapter

故事介绍

中国留学生周航因毕设瓶颈和延毕压力倍感焦虑。他在唐招提寺礼拜鉴真像时深受感动，从大师历经六次东渡、双目失明仍不懈努力的精神中汲取灵感，创作出作品《第六次东渡》，最终化解危机，顺利毕业。

作品核心难点在于大跨度转场中保持视觉资产的效果一致性 — 通过 Dreamina 模型的深度应用并结合 IP-Adapter 技术，实现了从二维水墨意象到三维写实光影的平滑过渡。

作品预览

下方为实际成片片段的在线播放

创作流程

03 · AI CREATIVE

AI 漫画

《公园20分钟》— 探索 AI 漫画工业化出图的标准流程，单人一天完成 3 页黑白漫画

DreaminaCharacter ConsistencyWorkflow DesignManga Script

故事介绍

刚来日本留学的女孩阳菜（Hina），面对周围的一切都感到陌生而孤独。一天，她想起曾读过的"20分钟公园理论"，便决定去附近的公园坐坐。就在那时，一位素不相识的日本女孩突然走上前，想给她拍一张照片。看着这张照片，阳菜第一次产生了一种归属感，并下定决心不再消极等待，而是要主动出击，去拥抱这座陌生的城市。

利用 Dreamina 的智能画布功能精准控制人物体态与构图，辅以特定角色的一致性训练，解决了 AIGC 创作中"角色脸崩"的痛点。

分镜画稿

共 3 页，拖动横向滑动查看

创作流程

03 · AI CREATIVE

AI 展览

360imx 展览 — 人机协作开发的典型案例，用代码为 AIGC 视觉母版注入动态叙事

Claude Code GenWebGL / CanvasPrompt EngineeringInteractive Web

项目介绍

通过与 Claude 的深度沟通，利用代码驱动 WebGL 渲染，在 AIGC 生成的视觉母版基础上，注入了动态的时间轴系统。该项目展示了如何将 AI 从单一的绘图工具，转化为协同解决复杂前端交互的"研发伙伴"。

现场影像

展览在一个 360° 的曲面空间内展开，拖动横向滑动查看全景

动态设计效果

时间轴、火焰、金箔等动态视觉呈现

技术实现

这些动态效果的展示全部借助 Claude 的编程能力完成

04 · ABOUT ME

About Me 关于我 Nora

Liu Haonan 刘浩男

AI × Visual Designer

Hi，我是Nora！新加坡国立大学日本视觉文化方向在读硕士，同时也是一名 AI 创作者。在实际的设计与创作工作中，我更在意 AI 能不能真正解决问题、提升效率：把它嵌入到日常工作流里，用来处理重复性的环节、加快从想法到成品的速度，把更多精力留给真正需要判断力和创造力的部分。

OfficeFigmaSeedanceJianyingClaude

✉ 1312940267@qq.com 📞 +86 18653638337

Education 教育经历

National University of Singapore

08/2025 – PRESENT

Master of Arts in Japanese Visual Culture

新加坡国立大学（硕士）· 日本视觉文化

Yanbian University

09/2020 – 06/2024

Bachelor of Arts in Japanese Language and Literature (Minor in Law)

延边大学（学士）· 日语语言文学-法学（双学位）

Internship Experience 实习经历

中国联通淄博市分公司

市场部运营类实习生

个人日语教育自媒体

内容运营

杭州群核科技有限公司（上海）

海外产品运营实习生

Portfolio

Menu

AI Product

AI Workflow

AI Creative

AI Product

画布重构：深色 → 浅色

项目背景

项目职责

项目成果

AI Workflow

YouTube 舆情简报

数据推送机器人

简历排版小助手

YouTube 舆情简报

输入想调研的主题

脚本调用 YouTube 官方 API

Skill 自动识别任务

主题分类 + 情绪判断

生成可视化 HTML 简报

iPhone 17 用户评论洞察简报

数据推送机器人

每天定时自动运行

拉取内部数据看板

计算环比 + 异常检测

发送到企业微信运营群

简历排版小助手

AI Creative

AI 社媒运营

AI 动漫视频

AI 漫画

AI 展览

AI 动漫视频

AI 漫画

AI 展览

About Me

About Me 关于我 Nora

Liu Haonan 刘浩男

National University of Singapore

Yanbian University