火山引擎视觉探索

让 Logo 的山形,成为可交互的「AI 云」

类型官网视觉探索|交互原型
负责内容视觉设计|动效设计|前端实现

项目背景

从火山引擎 Logo 的尖峰、斜边与叠合关系出发,将平面山形转成持续流动、响应鼠标的光场。保留官网的产品信息与构建路径,通过首尾山形呼应、滚动入场和字符扰动,让「你的 AI 云」有可辨认、可操作的视觉表达。

火山引擎首页 · 默认深色

01 从 Logo 的几何秩序推演主视觉

从品牌标识出发,确定视觉起点。

保留 Logo 中的尖峰、斜边与叠合关系,以集中排列的山形作为推演起点,让主视觉的形态具有明确的品牌来源。

火山引擎 你的AI云
模型、工具、应用到云底座,企业 AI 一站构建
立即构建立即构建

07 平衡品牌表达与内容曝光

先建立品牌印象,再承接产品与资讯。

保留「立即构建」入口与前段资讯曝光,通过主视觉和资讯区域的连续承接组织浏览节奏。标题与大块内容先建立视觉焦点,正文与说明文字再顺着阅读方向展开,内容呈现后保持稳定。

原页面的主视觉、立即构建入口与资讯
原页面
品牌主视觉与资讯的承接页面,保留立即构建入口
品牌主视觉与资讯的承接
标题与大块内容:逐步建立视觉焦点,让重点先被看见。
正文与说明文字:顺着阅读方向呈现,保持信息边界与阅读秩序。

08 以字符光场延展技术语境

将命令行语境转化为交互反馈。

沿用原卡片的标题、命令与服务入口,将蓝青色字符组织为动态光场。鼠标移入时显现并产生局部扰动,移开后渐隐,使技术感从静态表达延伸到交互体验。

原网页中的火山方舟服务卡片
原页面

通过 火山方舟 开启一站式大模型服务

通过方舟 CLI 在终端或 Agent 中快速开始

npm i @volcengine/ark-cli@latest -g

获取 API KEY

进入火山方舟

体验

推理

训练

应用

探索页面 · 字符光场交互