Vieka

交互&动效设计

腾讯云视频点播示例

Vieka是什么?

Vieka是在2020年3月推出的一款Vlog、短视频剪辑编辑工具,同时提供了海量视频模版,满足小白/进阶/专业用户对不同场景下的照片视频编辑、社交分享等需求。

为什么要改版?

Vieka海外版与2020年3月上线,由最初的东南亚(菲律宾、印度尼西亚、新加坡、马来西亚等)地区逐步拓展到美国、德国、澳大利亚、新西兰、土耳其、沙特阿拉伯等发达国家,旧版框架布局、交互体验、视觉感受、功能使用、内容方向等方面都不能满足目前业务的高速发展,为了满足用户诉求与业务功能拓展,对此我们进行了新的探索设计。

用户数据分析

根据用户数据分析,vieka主要用户群体集中在小白用户与部分进阶用户,年龄以18-30岁青年为主,90%用户使用剪同款功能对照片视频进行快速导出,分享到社交媒体,只有10%进阶、资深用户会使用专业性更强的编辑器进行视频剪辑编辑处理。

现有问题分析

For you(首页)

模版页

编辑器入口

*交互问题梳理

1.产品结构框架比较混乱,功能优先级需要调整,信息层级不够明显,并没有突出产品重要功能卖点。

2.剪同款功能步骤繁琐,缺少有效引导,增加用户操作难度,影响模版平均完成率与使用时长。

3.内容分发效率低,模版展示率低下,不能快速命中用户喜好,导致产品吸引力不够。

*动效问题梳理

1.交互动效类,动效时长、运动曲线、运动方式(例如页面间转场动效,控件动效,引导类动效)没有统一的设计规范,产品交互细节混乱。
2.视觉类动效(运营活动,动态banner,动态付费页)设计风格不一致,动态展示效果弱,缺少品牌内核传递。

改版方向

01

功能流程优化

优化产品整体交互逻辑,减少主流程步骤,
增加首次引导功能,降低用户操作难度,
无障碍快速导出模版。

02

产品布局改进

重新梳理功能结构,调整主要功能优先
级,减少低频次功能露出干扰用户判断,
增加内容露出占比。

03

动效规范定义

建立交互动效规范,定义动效时长、
曲线、动态方式,融合品牌元素,
形成统一的交互视觉体验。

主流程交互梳理

首页调整

腾讯云视频点播示例

第一版首页调整

腾讯云视频点播示例

最终版调整

腾讯云视频点播示例

模版详情页

1.全屏显示,增加沉浸感。
2.右侧功能简化,只保留点赞,分享高频功能。
3.添加辅助信息(模版类型标签、片段、时长
提示)帮助用户决策。
4.增加使用按钮动效,引导用户点击。

相册页

1.去掉时间标签,减少空白空间。
2.增加横纵切换按钮,方便快速筛选照片。
3.增加下滑显示动态时间标签。

模版编辑页

1.收起编辑功能,减少用户编辑欲望,达到快速导出的目的。
2.全屏浏览,使用户聚焦视频内容

动效部分

交互动效优化

转场动效
控件动效
引导动效

视觉动效优化

运营动效
产品启动页视频
Appstore & GP推广视频

动效规范定义

重新定义产品交互动效运动曲线与时长,根据交互特性划分了典型应用场景,保证产品使用体验的一致性与合理性,为开发
提供了有效的数值依据,从而保证产品还原度。

腾讯云视频点播示例

常规入场

常规出场

跨层入场

淡入淡出

控件动效

腾讯云视频点播示例

输出质量选择

完成提示动效

加载动效

运营动效

腾讯云视频点播示例

回归奖励动效

折扣活动动效

折扣活动动效

活动倒计时入口

回报奖励

回报奖励

腾讯云视频点播示例

新用户引导

可交互原型测试

在设计过程中,使用可交互原型工具(protopie)进行快速测试。