Arena
AI助手形象设计

TikTok Platform

史雨芊
Arena AI 助手产品界面
Arena AI 助手 Rena

项目背景

围绕 “Arena,Rena,AI” 的视觉形象展开,强调“效率、智能、可靠”,与 Backstage 侧 Bax 保持相同基调,构建公会 AI 助手视觉语言的一致性和延续性,产出两个主要的可选方案。

Rena 形象Rena
Bax 形象Bax

设计目标

01

Rena 在不同工作阶段应具备清晰可辨的视觉状态,让用户能够在使用中感知 AI 状态。

02

形象需在产品 UI、对话气泡等多场景下稳定输出,并满足全球语境下的中立性与专业感。

方案一 Rena 主形象
PLAN 01

提取品牌最具识别度的字母“R”作为视觉主体,通过拟人手法将其转化为 AI 智能助手。在保留经典字母轮廓的基础上,叠加微表情变化。

Rena 字母 R 形态推导
  • Identifiable
  • Reliable
  • Smart
Think、Doubt、Finish、Generate 四种状态
方案一在 Arena 产品中的应用
方案二 Rena 主形象
Rena
PLAN 02

提取 Arena Logo 的核心几何形态进行重组,演变为拟人化助手形象,通过轻量化的“表情动态”与“信号源”的微变化表达 AI 在不同工作状态下的改变。

Arena Logo 几何形态推导
方案二思考、疑惑与完成状态 DEFAULT
方案二在 Arena 产品中的应用

经过多轮投票和评审,Prefer PLAN 1

设计决策

形象优化迭代基于 PLAN 1 进行迭代,强化其与 Arena 品牌调性的契合度
结构与适配提升微调造型比例,增强轮廓的方正感与规范性,大幅提升多场景应用的适配度
动态与延展优化丰富形象在多场景下的工作状态,延续并保留其原有的灵动感
AI 助手交互策略页面
AI 助手多场景应用
数据页面中的 AI 助手应用
AI 助手应用界面一 AI 助手应用界面二
完成状态动效 摸鱼状态动效 空闲状态动效 通知状态动效

总结复盘

“如何建立一套让用户理解 AI、感知 AI 状态的视觉语言”

动态不只是让 IP “动起来”,而是帮助用户理解 AI 正在做什么。相比一个普通的 Loading,AI 形象本身可以成为状态反馈的一部分。因此在动效设计中,我开始重点思考如何让用户快速感知 AI 工作状态。动效的价值不只在于增强表现力,更在于提供持续的状态反馈,从而缩短用户的感知等待时长。

Rena 最终形象