麦可IP在AI项目中的应用推广

科技   2023-09-27 16:54   江苏  

品牌形象往往能加速拉近平台与商家间的距离,串联产品操作与运营活动。为了让用户更好地认知到我们的产品定位,在AI项目的这个契机下,我们同时着手对“麦可”这一IP形象进行一次深度结合AI项目的IP推广。

• 项目背景

在MIC平台推出,供平台供应商使用,以外贸出口供应商的业务员需求场景为深耕,通过帮助业务员在外贸场景提效为导向的AI类型产品。

• 为什么需要IP
在AI项目初期,我们将MIC的AI应用定义为供应商的智能助手。为了让用户更好地认知到我们的产品定位,我们认为助手应该具有拟人的形象,能够进行自然语言的交互。所以我们的设计策略是定位出MIC的AI形象。
为什么是麦可
考虑到MIC已有的IP形象——麦可,如果能在原有的形象上进行延展,可以降低认知的门槛。且能让麦可这个IP形象与业务场景有更多的结合,赋予其更深的含义,便于后续品牌的宣传及拓展。
• 创新思路 — “AI麦可”上线!
在供应商后台中利用IP形象,打造一个有生命力的AI插件。在不同的页面场景下,麦可以不同形态出现,引导用户操作。

#01 应用场景

  • 供应商后台 麦可“插件”

在供应商后台中利用IP形象,打造一个有生命力的AI插件。在不同的页面场景下,麦可以不同形态出现,引导用户操作。


能力外化的视觉打造
随着产品功能的逐渐扩展,麦可的“能力”也在逐渐变强。我们为不同“技能”下的麦可,绘制了与之呼应的外观皮肤。
如图使用图片处理类功能时,换装为“美工麦可”;使用文本生成类功能时,化身为“作家麦可”;帮助供应商分析和拓展商机时,又变装为“数智麦可”
情感化表现
相比常规的功能引导,我们创新采用对话式引导,利用AI麦可IP形象,更加自然、人性化地引导供应商使用平台AI功能;

麦可浮点动效


鼠标点击麦可,麦可有挥手动作,后续可增加更多交互动作;在生成中和生成成功时,麦可有对应的动作和背景,视觉上的变化以缓解用户在等待中的焦虑,给到明确的状态提示。



  • 麦可平台 数智员工

麦可是一个具备“思想”可以有规律地按照指令,自动化帮助供应商处理日常工作的智慧形象

首页仪表盘👆
操作台👆
如图麦可带上数字眼镜,供应商可以与其对话,点击时会有相应的动作,后台的功能文案也与其形象呼应,如操作台、运行日志等。


  • 市场宣发物料

此外我们还为“AI麦可”设计了专属的宣传落地页、朋友圈宣传图,为员工和供应商制作了“AI麦可”的线下实体周边礼物等。


AI麦可宣传落地页👆

AI麦可朋友圈宣传图👆

抱枕、冰箱贴,桌面摆件等👆


#02 技术应用

为什么选择DragonBones ?

动画更流畅

骨骼动画使用差值算法计算中间帧,使得动画保持流畅效果。


设计效率提升

骨骼动画由一块块小的部件组成,不需要绘制动画中的每一帧,也能形成一个完成流畅的动画。


更新替换更方便

只需要替换骨骼中的图片资源,就可以实现更新替换。


文件体积更小

帧动画需要提供每一帧图片。而骨骼动画只需要少量的图片资源,最终保存在一个体积非常小的 json 文件中。


交互形式丰富

可以通过代码控制动画,比如点击麦可,麦可可以招手;鼠标移入麦可,可以让它眼神跟随等等。骨骼动画由一块块小的部件组成,不需要绘制动画中的每一帧,也能形成一个完成流畅的动画。


支持动画叠加

不同的动画可以被结合到一起。比如麦可可以在手部点赞的时候,同时面部表情变化。


传统的GIF是通过帧动画实现,动画的流畅性和平滑效果都取决于帧数的多少。而骨骼动画则是把角色的各部分身体部件图片 绑定到互相连接的“骨头”上,通过控制这些骨骼的位置、旋转方向和放大缩小,从而生成的动画。它们需要的图片资源各不相同。

• 帧动画  所有动画序列占用262M的空间

• 骨骼动画  所有动画只占用200K的空间
传统的GIF每增加有一个使用场景都需要单独导出相应尺寸的GIF动效,并重复占用大量内存,复用效率极低。
龙骨导出的json文件可以实现全尺寸,多场景重复利用,真正实现了:更全的场景覆盖、更少的美术资源、更少的体积、更好的流畅性、程序控制动画等优势。
供应商后台插件👆
AI麦可首页仪表盘👆
AI麦可操作台👆
不同场景、不同尺寸、不同皮肤都只占用一套动效资源
点个赞再走吧
↓↓↓

中国制造网UED
这里是中国制造网UED公众号,我们是一个专注于用户体验研究领域和前瞻技术的团队,我们致力于为大家提供最新、最实用的设计资讯、前端技术和案例分享。通过优秀的用户体验来传递美好。