← 薛淘 / 作品集

01 / BRAND & VISUAL · 2026

雾生青MISTGREEN

把植物香气与身体触感,
转化为一套安静、清晰的品牌视觉。

个人概念项目 / 品牌视觉、包装概念、主视觉延展

浏览最终品牌网站 ↗
雾生青身体护理系列的包装概念展示
产品与场景为概念视觉,包含 AI 辅助生成。

项目目标

从同一个品牌,延展出不同用途的画面。

为一个虚构的植物香气身体护理品牌建立识别:用松绿、雾白、纤维纸与植物场景组织画面。既让日常系列保持统一,也让春季限定「苔光」有自己的主题。

这次补充的重点,是把主视觉转化为可导出的手机竖版、活动横幅和产品详情模块,让不同尺寸各自有清楚的信息层级。

个人职责
品牌方向与文案、字体和配色选择、包装视觉方向、素材筛选与迭代、物料版式检查及网站内容整理。
工具与方法
AI 辅助生成产品与场景素材;Photoshop 用于图像处理练习;网页使用 HTML / CSS 呈现,三种延展物料采用可编辑版式并导出 PNG。
项目边界
个人概念练习,无真实客户。包装为视觉提案,未打样;物料为本次设计输出,未投放,不包含销量或用户验证结论。

02 / PROCESS

制作过程

从方向设定、素材迭代,到尺寸与信息调整。

01

设定视觉方向

以植物香气和慢下来的日常为主题,用深松绿承载识别、雾白保留留白。中文品牌字与英文辅助信息分层,避免所有内容同时争夺注意力。

02

统一包装材料表现

比较不同包装图后,将厚重的表面纹理调整为冷白纤维纸,收窄产品色带;检查护手霜的金属反光,调整为更符合系列的非金属软管表现。

03

建立苔光主题

沿用松绿与纸感,加入湿苔、石面与林间光。用「苔光」竖排字形和叠层标签区分限定系列,再筛选产品形态、光线和文字可读性较一致的素材。

04

按用途重排物料

从原主视觉中取产品所在区域,保留主题字形与颜色。竖版集中主题、横幅缩短文案、详情模块补充香调与标签层级,再检查原尺寸导出和移动端展示。

雾生青包装早期方案,纸张与材质表现尚未统一
调整前 / 早期系列的材料与色彩方案
雾生青包装迭代后,以冷白纤维纸与窄色带统一系列
调整后 / 冷白纤维纸、窄色带与非金属软管

松绿 / #123B30

纸白 / #F5F1E8

苔灰 / #A9AF9B

原品牌的基底色贯穿各物料;产品色带与文字层级承担区分,减少额外装饰。

03 / MOSS GLOW

苔光 · 三种交付物

同一张主视觉,针对阅读场景重新安排图像、信息量与文案。

苔光原主视觉:湿苔与石面上的身体乳,竖排主题字
原主视觉 / 作为延展的图像与字形基础
苔光手机竖版:上方品牌与主题、中部产品、下方短文案

01 / 1080 × 1920 PX

手机竖版

一次只讲一个主题。顶部显示系列字形,中段保留完整产品,下方用两行主文案与香调收尾;文字避开上下边缘,便于手机阅读。

下载 PNG ↓
苔光产品详情模块:产品介绍、三段香调和双层标签概念

03 / 1080 × 1600 PX

产品详情模块

读者有更长的停留时间。把产品名称、香调和标签概念拆为三个区域,用短标题与说明建立顺序;展示设计设定,不添加未经验证的功效承诺。

下载 PNG ↓
尺寸变化带来的设计调整
用途优先内容文案与构图调整
手机竖版系列主题 → 产品 → 香调上下分层;压缩段落;保留边缘留白。
活动横幅主题 + 一句主张 + 入口并排构图;减少信息;在横向扫视中识别品牌。
详情模块名称 → 香调 → 包装设定增加解释;分区阅读;把概念与真实商品信息区分。

三张文件均为可实际导出的概念设计物料,未做商业投放。下载完整物料与可编辑版式 ↓

04 / FINAL PRESENTATION

在完整网站里看品牌。

原品牌网站保留为最终展示,串联系列产品、苔光主题与使用场景。

打开雾生青品牌网站 ↗返回全部作品