hupan-hero.png 放进同目录即可自动替换
湖畔教研院 · IP 形象与文创产品开发
从小畔的世界观设定、造型三视图，到表情与配色规范——一套完整的角色提案。点击可放大查看细节。
把数字模型做成能拿在手里的东西——白模打印、打磨、手涂上色，最后装进铁盒，作为提案的实物呈现。
提案里最容易被忽略的一步，是让它真的站在桌上。从三视图转成 3D 模型，打样、修件、逐层上色， 再配上颜料管、苔藓底座与收藏卡，装进金属铁盒——开盒即是一整套「小畔画室」。
从公仔、器物到纸品、木作与包装，31 款主力周边，覆盖徐汇、静安两个校区的线下渠道。
「湖小畔的美好生活」13 枚日常语汇，冬、夏两季各成一组；微信表情开放平台上架，添加一次，整套装进聊天框。
表情包是最便宜的一次「见面」。把提案里的性格拆成 13 个具体动作——好冷、下雨、疑惑、被表扬—— 让它在群聊里先活起来，比任何一页设定图都更容易被记住。
从「想租一台冰箱」到「按下支付」，中间隔着押金、品质、退租三道坎。整套稿子的做法是：把三道坎拆到五屏里，一屏只解决一件事。
ALIPAY · 二手家电租赁 / 视觉分析
先把用户最在意的三件事摆出来，再决定用什么视觉语言回应它们。支付宝蓝只是壳，信任感才是要反复说的东西。
整页有 1194pt，塞进一张图就什么都看不清。所以按信息层级拆成三段看：头部回答「这是哪」，分类回答「有没有」，内容流回答「值不值」。
渐变头部压到 26%，搜索贴顶，0 元租紧随其后——先回答有没有，再谈优惠。
五等分宫格一线排开不换行，促销让位给分类：先让他找到，再让他心动。
双列商品卡，一屏容得下两个对比项；价格用「/月」与数字同色，避免被读成买断价。
单列 390pt，四段自上而下：头部 → 权益卡 → 分类 → 内容流。商品卡双列、间距 12pt。
五块按「找 → 诱 → 选」排序：搜索、0 元租、分类宫格、双促销、热门家电。首屏不放要滑动的信息。
五等分，一线五个、不换行，1:1 圆角容器 + 2pt 线性图标 + 三字标签，第五格固定「更多」保栅格。
头部 #1677FF → #4E9BFF 渐变，卡片 10pt 圆角、1px 描边、零投影，价格用橙红 #F5591F。
五个阶段串成一条线，每个阶段都指向一个能被验证的产出，不是形容词。
按「发现 → 比较 → 决策 → 确认 → 履约」的用户旅程搭骨架，五个页面各接一段旅程，不重复、不遗漏。
把二手家电的租赁流程压进支付宝小程序：5 屏跑完发现、比价、下单、履约。目标用户是刚搬家、预算有限、但不想买新机的人。
三个顾虑不该只被说出来，从文案层提到结构层：
产品 一级页面 功能模块
5 个页面 · 16 个模块｜一级页面与上面那段用户旅程一一对应，不设「频道页」当门面。
颜色只承担两件事：蓝负责信任，橙负责价格。字号阶梯只有四档，任何页面都能从这四档里选。
主色沿用支付宝蓝，不改品牌资产；橙红是全场唯一的「热」色，只给价格与优惠用；渐变从 #1677FF 到 #8FC1FF，只出现在页面头部。
| 画布 | 390 × 844 pt · 单列 | iPhone 14 |
| 边距 | 左右 16 · 卡片间 12 | 4 的倍数 |
| 圆角 | 卡片 10 · 弹层 20 | pt |
| 描边 | 1px · 深色 10% | 卡片零投影 |
| 层级 | 预览 | 字号 / 字重 |
|---|---|---|
| 标题 1 | 二手家电租赁 | 32 / Semibold |
| 标题 2 | 品质二手 0 元起租 | 24 / Medium |
| 正文 1 | 信用免押 · 顺丰包邮到家 | 15 / Regular |
| 正文 2 | 一级能效 · 9 成新 | 13 / Regular |
| 辅助 | 查看全部 | 11 / Regular |
把五个阶段的目标、行为、触点、顾虑平铺开，情绪最低的两处就是必须先解决的：比价、退租。
左右滑动查看五个阶段 →
| 产生需求 | 挑选机器 | 比价决策 | 下单支付 | 履约归还 | |
|---|---|---|---|---|---|
| 用户目标 | 搬家缺家电，先看看能不能租 | 确认这台机器的成色与能效 | 判断租是不是比买划算 | 少掏押金、别多付一笔 | 按时归还、别被扣押金 |
| 用户行为 | 刷到投放 → 搜索「租冰箱」 | 逛分类 → 列表扫读 → 进详情 | 切四档租期算总价 | 填地址 → 看费用明细 → 付首月 | 查进度 → 预约归还 → 确认退款 |
| 接触点 | 投放页 / 首页搜索 | 分类五宫格 / 列表卡 | 详情页租期条 | 确认订单 / 支付结果 | 租赁中心 / 客服 |
| 想法 | 「租是不是很麻烦？」 | 「九成新到底是多新？」 | 「59 一个月，一年也七百了」 | 「押金会不会退不回来？」 | 「坏了算谁的？」 |
| 情绪 |
|
||||
| 痛点 | 不知道有这个渠道 | 成色只能靠文字描述 | 月租与总价换算费脑 | 押金条款藏在折叠区 | 归还流程与责任边界模糊 |
三类人租家电的理由完全不同：过渡、增量、配齐。他们的共同点只有一个——都不想为一年以内的使用期付全款。
「用一年就搬走，买一台不划算。」
「二手的怕不干净，能上门装最好。」
「四台一起租，账要能开出来。」
五屏各司其职，六个决定全部落在看得见的地方。图上的编号对应下面的条目——先看图，再读那一行。
同一套方法，换到「卖」的语境：用户的顾虑从「怕被坑」变成「怕被压价」。估价、上门、结算这三段要压进五屏里讲完，版块与样式已经就位，稿子补齐后直接接入。
TEACHING PRACTICE｜教学 · 实践 · 成长 FLAVIA · PORTFOLIO｜教学记录
Teaching is handing the method over
以设计为核心，融合AI工具，培养具有创新能力的复合型人才。
|CURRICULUM DEVELOPMENT & STUDENT WORKS & EXHIBITION|
TEACHING PHILOSOPHY
比完成一份作品，更重要的是学会思考。
从模仿到创造 · 从执行到表达 · 从学习到独立思考
22 个教学周、四门课、每门 33 节。大纲听起来复杂，骨架是同一套：先给判断标准，再拆成能练的小块，最后让学生自己讲一遍。
2025–2026 第一学期，传媒专业 4 门课、132 节课序，其中三门由我执笔。真正的功夫在每次作业只练一个变量。
二十三件都是课堂作业，不是精修过的作品集。选它们的理由只有一个：能看出哪一步想清楚了。
看学生作品，我更看第二版和第一版差在哪：是换了配色，还是终于想明白要先回答谁的问题。
插画 · 图形语言
同一组静物画四遍，只换底色与花器：黄、粉、绿、红各成一季。亮点是先锁版式再换色相，一套版撑起四种情绪。
包装设计
热带花卉与人物剪影拼成满版图形，压黄底做产品全家福、压橙底做场景。亮点是一张插画在瓶标、罐标、盒型上分别裁切，仍认得出是同一个品牌。
品牌设计
给牛角包加上表情当主角，粗描边平涂配奶油粉与橙。亮点是纸袋、立牌、盒型共用一条橙色腰带，把「现烤」的松弛感做成了规则。
插画 · 周边
仕女与山水做主线，一套克制、一套浓烈；罐身、纸袋、唱片封套、折纸各自重新构图。亮点是每个载体都单独排过，不是一张图套到底。
长页 / H5
宋式青绿叠牡丹金线，卷轴与云纹分区，优惠券、视频、歌手卡逐屏递进。亮点是传统纹样当版式骨架用，不是贴边装饰。
长页 / H5
水墨山水打底，汤圆与红日做主视觉，签到、邀请、会员券三卡并置。亮点是手写标题与印章立住节日，信息模块仍然整齐可扫。
长页 / H5
大面积留白，山形做分隔，折扣券做成旗帜卡，歌单用专辑封面承载。亮点是敢把画面让给空白，靠几处朱红把视线拽回来。
文创 / 图形 · 许欣筠
荷鲁斯之眼、圣甲虫、纸莎草织进猫的轮廓，金粉夜空与满版纹样两版。亮点是两版不是换色，是换叙事：一版神性，一版日常。
长页 / H5
朱红宫墙配卷轴，竖排小字排成档案感，非遗项目三卡并列，票价做成木牌。亮点是卷轴既是装饰也是容器，滚动像在展开一幅画。
活动页 / H5
奶油底手绘小猫，活动规则拆成四张信纸卡，胶带与便签做视觉锚点。亮点是把枯燥的征文条款排成能读到底的清单。
联名 / 周边 · 龙蕴嘉
把鸟角色压到三笔画，做成徽章、贴纸、纸袋、小票。亮点是拿真实订单小票当版式元素，让联名落进消费现场。
3D / 海报
黏土质感花栗鼠、拍立得相框、马卡龙与云朵，标题做成充气糖果字。亮点是材质统一——都软、都哑光，所以甜而不腻。
拼贴海报 · 汪艺琪
旧报纸做底，霸王龙、火山、鹦鹉螺撕纸拼贴，哥特粗黑压标题。亮点是用撕纸白边当描边，把不同年代的素材缝进同一张纸。
拼贴海报 · 顾沈博
曼联红做底，三个时期的 C 罗叠在同一片草皮，7 号与反歧视标语做锚点。亮点是用同一球员的不同年代讲成长。
拼贴海报 · 吕文轩
武康大楼做主体，半调网点统一照片质感，相机、飞机、白鸽做旅行切片。亮点是网点尺寸统一，元素再多也不散。
拼贴海报 · 佘圣佳
撕纸边配粉调，发夹、电子宠物机、蝴蝶夹、十字心挂满画面。亮点是道具都长在人物身上，有叙事，不是贴纸堆。
AI 图像
石膏胸像开花，绿蝶环绕，玉坠点睛。亮点是三层绿——荧光蝶、苔藓、玉——压住大面积白，干净里还有呼吸。
AI 图像
单侧硬光打出石膏的转折，项链落在锁骨的高光处。亮点是让古典雕塑当模特，光比控得住，产品不抢戏。
AI 图像
眼睛占满画面，吊坠悬在下方做对照。亮点是皮肤质感与金属高光同时保住，商业感来自克制。
拼贴 / 版式 · 田雨萱
银框、深红玫瑰、珍珠、手写体，把浪漫拆成可数的道具。亮点是文字当图形用，标题的连笔与藤蔓同构。
品牌 / 长页 · 任妍
六章结构：境、色、香、叙法、清和、样；茶汤色做成色卡，冲泡流程做成八格。亮点是用目录页管住一条很长的滚动。
作品集 / UI · 60 页
从调研、竞品、信息架构到高保真与组件，一本走完；界面旁标了「为什么这样改」。亮点是把设计过程也当作品展示。
作品集 / 平面 · 66 页
海报、VI、包装、陈列、社媒五条线并置，项目跨度大但版式统一。亮点是靠网格与留白收住，翻页节奏稳。
把作业搬出教室，标准会自己提高一档——因为要面对不认识的观众。展览不是把画挂上墙，是再设计一遍观看顺序。
展名《青素》，2024 学年的结课展。17 张现场照按展场 / 作品 / 互动 / 观众四组归档：先看空间怎么排，再看东西怎么被拿起来，最后看人。
前言墙、诗句墙与花艺装置：先让空间替作品开口。
05 FRAMES把课堂作业做成能带走的东西：徽章、卡片、丝巾、抱枕。
06 FRAMES签名、回答问题、写字：观众留下的痕迹也是展品。
03 FRAMES作品第一次被陌生人看见，紧张也是展览的一部分。
03 FRAMES最后这页很短。教学这件事，说三句就够，多了是自我感动。
设计不只是把东西做漂亮，
是学会怎么想、怎么试、怎么讲清楚。
Design is not only about making things beautiful — it is about learning how to think, to explore, and to explain.
学生缺的常常不是软件操作，是「什么算好」。
改太多，就不知道是哪一步起了作用。
讲不清的地方，就是还没想清的地方。
插画、个人创作、个人视觉实验。
About Me — 关于我05 / Profile
FLAVIA FENG
求职意向教研管理/课程研发/教学管理
五年设计教学与教研经验，前后带过 3000 多位学员。在湖畔教育负责课程大纲、师资协作与校园 IP 文创，累计落地 50 余万元、约 20 种产品；更早之前在互联网公司做 UI 视觉，服务过京东、支付宝与肯德基。
一件事能做成，通常要同时跑通教学、内容、落地与人。
A
承担平面设计、品牌设计、UI 设计三类课程，参与教学大纲编写与迭代，把商业项目拆成能练的案例。
B
主导学校 IP 形象从创意构思到产品落地的全流程，规划并推进 IP 衍生品与校园文创开发。
C
独立对接供应商、调整样品、跟到制作交付，覆盖上海市中心校区教室用品等真实使用场景。
D
负责教师面试，日常协助同事解决设计与教学问题，把课程协作真正推到落地。
从做设计，到教设计、管项目。
2021.10 — 至今上海
课程教研 / 师资管理 / IP 文创统筹
2020.07 — 2021.10上海
品牌电商 · 界面视觉
2018.07 — 2020.03北京
互联网业务 · 界面设计
我们可以一起做点什么~
