本文主要针对爱奇艺、优酷、腾讯视频的网页版首页部分进行分析，希望通过竞品分析发现同类产品的功能亮点，发现其传递品牌文化和产品理念的方式。

研究对象：腾讯视频、爱奇艺、优酷网页版首页。

研究内容：

用户人群画像：

主流视频网站近期百度指数

通过百度指数可以发现视频类产品用户主要分布的南方地区，中年男性居多

这些元素在设计上可以借鉴的是：

圆形标注表示差异点，矩形表示相同部分。

（1）腾讯视频

腾讯视频焦点图适配对比

焦点图：

文案：

分类：

可借鉴的地方：

（2）爱奇艺视频

爱奇艺 焦点图.png

焦点图：

文案：

分类： 小屏时显示为三行，大屏时变成两行。

顶部按钮： 小屏时只显示图标，大屏时显示图标跟文案。

可借鉴的地方：小屏幕时，只显示图标，大屏时显示图标跟文案。

（3）优酷视频

优酷 焦点图.png

焦点图：共7张，选中状态显示两行。

可借鉴的地方：

优酷：

最小宽度：1292px

最大宽度：1830px

焦点图：左右和上面加蒙版

导航：增加减少内容、入口

缩略图：大小变化、增加内容

广告：通栏广告宽度变化，多广告位大小变化

腾讯视频：

最小宽度：1280px

最大宽度：1790px

焦点图：左右和上面加蒙版

导航：增加较少内容，小屏时不限时分类图标

缩略图：大小变化、增加内容

广告：通栏广告右侧增加广告位，且有比例变化

爱奇艺：

最小宽度：1055px

最大宽度：1765px

焦点图：左右加蒙版

导航：内容不增减，小屏时三行展示，宽屏时两行

缩略图：大小变化、增加内容

广告：通栏广告宽度变化、多广告位大小变化，规则同缩略图

3个网站的大致相同，均为LOGO、搜索、个人中心入口及功能、下载客户端等功能。

顶部导航栏对比.png

腾讯视频：

爱奇艺：

优酷：

可借鉴的地方：

腾讯、优酷、爱奇艺均做了分类，选择时更清晰，腾讯视频在一级频道后增加了二级标签，层级更加清晰。 且3个网站在频道入口鼠标悬浮状态时会出现频道下的热门推荐，爱奇艺用了图片+标题的展示形式，但只能展示4个内容，腾讯和优酷用标题展示，可展示较多信息。

顶部分类展开.png

顶部浮层.png

可借鉴的地方：

腾讯视频首页特色模块.png

腾讯视频首页特色模块

可借鉴的地方：

爱奇艺首页特色模块.png

爱奇艺视频首页特色模块：

可借鉴的地方： 第一个视频位可翻页，可展示更多信息。

优酷视频首页特色模块.png

优酷首页特色模块：

可借鉴的地方：

腾讯视频 卡片样式.png

（1）腾讯视频

卡片样式多样化，多视频可以快速预览（9张图），影片介绍有更多分类：金马奖、豆瓣高分等标签，综艺相关短视频还会出现内容海报（通过短视频带动长视频）。

可借鉴的地方：

爱奇艺 卡片样式.png

（2）爱奇艺

卡片样式上有更多可以交互的部分：可以顶、踩来进行交互，操作简单容易，在用户使用的时候看到曾经看过但是不好看的片子可以顺手踩一下 在卡片上遇到喜欢的剧集可以直接收藏，喜欢的自媒体账号也可以直接关注 用户有更多互动的机会，感觉参与度、自主权更高一些。

可借鉴的地方：

优酷 卡片样式.png

（3）优酷

可借鉴的地方： 优酷视频的优势就是，可以直接切换tab展示，快速浏览。

排行榜对比.png

可借鉴的地方：可加入对应的图片。

右侧功能栏：功能方便，不同的产品，有不同的功能，均以意见反馈和回到顶部为主。

右侧快捷键.png

网页底部模块.png

爱奇艺的页面底部模块，让用户感到被挽留。

可借鉴的地方：

网站宣传语.png

对比可发现，优酷的宣传语是带声音的，而且朗朗上口，很容易给人留下印象；哔哩哔哩的宣传语很适合产品的定位，让用户有归宿感。

可借鉴的地方：宣传语简短、容易记忆、体现品牌定位

尝试通过页面布局、内容分布，反推产品的定位。

模块对比.png

腾讯视频：结构清晰，不同模块类型穿插，样式不单一

爱奇艺：图片间距近，信息量巨大，图片颜色多，相对艳丽一些

优酷：图片比较大，样式相对单一，但是能看出品牌色-蓝色、红色更为突出

可借鉴的地方：

视频网站图片很重要，如果视频截图选择的更好，视觉效果会有更大的提升。

下面是同一部剧集不同网站的对比图：

头图效果对比.png

头图效果对比2.png

同一个片子，每家的图片色系都不同 腾讯更有质感、爱奇艺饱和度高，偏紫色、优酷偏冷色（蓝色），都在偏向自家的主题色。

对比可以看出，优酷的图片更清晰、饱和度更高。

目前主流的视频网站在设计上逐渐趋同，如果可以把移动端的沉浸式+瀑布流的概念引入到网页端，可能会带来更好的观影体验。

于是有了以下一些想法：

概念稿 01.png

概念稿 02.png

概念稿 03.png

这次只是初步的分析，都是浮于表面现象，接下来会针对局部的功能进行更深入的分析，敬请期待~

本文由 @赵星星爱冒险 原创发布于人人都是产品经理。未经许可，禁止转载

题图来自Unsplash，基于CC0协议