背景
随着东南亚互联网兴起,智能TV业务也成为东南亚互联网探索的重要步骤
首先,智能TV作为集合各类业务的综合平台,必然面对的群里十分多样。既平衡各类人群的使用习惯又保留各自行为特征,是设计时考虑的基点之一
其次,对于互联网刚刚发力的东南亚市场,当地用户互联网程度相较国内用户,还处于萌发和培养阶段。所以,对于TV这一全新领域,除了推广和普及已验证的成熟操作模式外,如何顺畅的把成熟经验过度到本地用户,也是设计时考虑的另一要点
最后,在收看TV时,用户多是在轻松且稳定的环境下进行,这样的使用场景,与使用其他谁被时的使用场景还是有较大的差异。所以设计时,也需要一并考虑
设计方向
从已有业务数据来看,处于主营业务的电商和游戏用户,主要集中在18-35岁的年龄段。此类人群乐于接受新鲜业务,具有年轻化、个性化的形象标签。综合业务目标,对产品体验设计需要有亲和力,为用户带来生活和情感上的共鸣,提供年轻、丰富且多元的数娱体验
设计策略
根据策略、业务需求方及人群广泛性的产品。在设计方向的基础下,确定了认知整合、内容聚焦、本土融合的设计策略
认知整合
由于产品整合了各类业务,内容模块众多。从设计角度看,整合同类内容模块,减少认知分担,保持统一性和节奏感,才能为用户提供内容丰富但结构清晰的使用体验
内容聚焦
从业务和用户角度考虑,通过多方位的设计规划,充分的展示业务内容,为业务提供合理且有效的展示空间,做到有主有次、体验流畅
本土融合
东南亚用户互联网水平还不够,作为进入生活的新领域产品,需要考虑当地用户的接受度。在体验上有要从已有操作习惯上延续,例如从移动设备的体验上延续或借鉴
首页探索
TV产品从本质上来说,是一个承载信息的功能平台,为各项业务提供入口。所以,在产品设计时,以C端产品重运营,B端产品重效率的设计方法都需要借鉴,考虑两者在产品设计上的平衡,在聚焦与放松的使用体验中无缝切换。整个设计以体验的一致性和开发的效率性为核心,在设计上使用统一框架,根据实际业务需求,进行布局上的差异化调整,简化不必要功能,保证首屏控件能最大限度发挥作用
以设计策略为准绳,在首页设计时,对导航结构、版面布局、操作流线
dao等方面做了多种尝试
导航结构
横向结构
横向结构主要通过遥控上的左右键操作,来切换界面之间内容。从空间角度看,需要使用到更多的横向空间,左右操作更符合电视界面结构。
市面上横向导航以小米盒子为主。小米盒子是综合入口型的产品定位,所以在界面观感上,每个入口的面积并不大,这样能在有效的纵向面积内集合更多的功能入口
竖向结构
纵向结构主要通过遥控上的上下键操作,来滚动界面之间内容。从空间角度看,需要使用到更多的纵向空间,上下操作更符合用户操作习惯。
市面上横向导航以视频产品出产的盒子为主。视频盒子是视频产品宣传入口型的产品定位,所以在界面观感上,鉴于竖版的优势,能为每个入口提供更大的纵向面积,这样能在有效面积内展示更多内容本身的细节信息
小结
从产品的定位出发,产品还是以宣传自有产品为主,所以在导航结构上选择上下结构。另外,考虑到本土用户在移动端上使用滚动操作信息流的方式已经适应,所以在产品初期加以延续,尽可能降低新设备的学习成本,无缝过度
版面布局
整体结构
采用“T”字布局作为主题结构。集中首屏头部面积,根据对应业务露出关键信息。减少头部空间切割,保留头部面积的完整,尽可能为内容细节的展示留出足够空间。
在工具栏和频道栏的设计上,由于暂时业务频道并不多,所以把两栏整合成综合栏,未来可根据业务需求的扩展,再把两部分拆分成两栏放置在顶部,这样能用最小成本的完整功能的扩展,并减少对结构稳定性的影响
视点节奏
从版面布局上看,模块布局是一种楼层结构的变体,楼层结构常见于电商网站。楼层的方式能很好协调不同需求与布局节奏统一的问题
由于初期内容量不够丰富,下滑滚动确定在3屏左右,所以采用“总-分”布局,“松-紧”节奏调整视点的多样性来缓解内容的单调感。根据具体业务需求,调整频率和布局,做到整体一致,又符合业务特征
操作流线
跳转路径
用户使用TV产品,大多处于愉悦且稳定的环境中,如客厅。用户一般处在放松状态,不会使用强注意力。所以在路径设计时,尽可能减少不必要的流程,让用户在最短步骤内无负担的抵达内容本身。流线扁平化处理,能只用一步就不用两步。目前来说,首页与内容页的步骤最多3步即可到达,让内容触达快速又轻松
浏览路径
TV产品与用户的交互关系是通过D-pad型的遥控器解决,对目标的聚焦需要通过遥控器的上下左右的按钮来完成。基于此操作前提,用户的浏览路径呈现“井”字型结构。而“井”字结构的疏密度,则根据业务级别和密度的不同决定
视觉探索
产品基调
大多数用户的使用场景多发生在晚上,没有自然光的环境中。所以在配色上,浅色与亮色主题需要慎重考虑,因为明亮的界面会容易导致视觉疲劳,容易损害用户体验,久而久之导致应用被抛弃。所以,在整体的配色方案上选用深色主题,主要是为了创造更轻松舒适的用户体验,防止浏览时视觉疲劳
配色方案
色彩方面以大面积深蓝色作为背景,奠定整个产品的主色基调。沿用已有的品牌橙作为要点、高亮信息色,起到品牌渗透和强调的作用。部分模块底色取半透明色值,区分与背景的层次结构。使主题内容与文字信息突出,减少阅读阻力,提供更清晰的用户体验
均匀呼吸
整体视觉框架尽可能扁平处理,减少多余元素,用模块间的自然间隔代替分割线,区隔使用统一参数,使内容更清爽干净的展示在用户面前
立体内容-结构
内容模块以不增加结构复杂性,不增加用户的认知成本,保持一致韵律感为主旨。每行模块的组合上以3、4、6为标准数,根据不同需要进行组合,尽量同场景同配置,达到简明统一的效果
由于业务差异,对应频道下内容模块处理手法会有一定的差异
就视频业务而言,以图片+富文本的形式出现,因为配置图片可能出现画面质量不可控或信息传递不到位的情况,所以需要文本进行补充说明
就电商业务而言,以纯图片的形式出现,因为电商图片一般有专业的设计资源做支撑,图片内容信息足以表达全部细节。另外,单图形式更易形成楼层的概念,保证观感上的统一,有效抓住用户注意力
立体内容-配色
除了内容模块的板式规则外,图面配色也需要有对应的规则。由于整个产品以深色为基础,常见浅色底电商内容模块做法会导致前后色差对比过强,体验欠佳。且东南亚国家地处热带,当地用户对饱和度较高的颜色会更偏爱。所以结合产品基底和本土习惯,配色上以鲜艳饱满色调为主,这样能更好的协调产品前后景关系,饱和的色彩也能更快的吸引用户的注意力
小结
设计始终围绕着如何更轻松、便捷、本土化的宗旨,从交互和视觉两个方面共6跟维度对本次设计进行了总结,以期抛砖引玉,加深对TV端设计理解,谢谢!
备注:部分图片来源于各大网络,仅做学习使用,如有侵权请及时告知,谢谢!