菜单

PC端与移动端用户体验上的不同

来自:花火 Thinker.s 阅读数:1462 2018/07/19

所以针对这个问题,我们可以从用户体验五要素(战略层、范围层、结构层、框架层、表现层)作为切入点。全面分析下这两个终端之间体验的的差异。如有遗漏欢迎补充。

战略层
差异度:★ ★ ☆ ☆ ☆
差异点:用户需求
成功的用户体验,需要能被明确表达的战略所界定,明确企业和用户双方对产品的期许和目标,有利于用户体验各方面战略的确立和制定。
对比PC端与移动端用户对产品的期许不难发现,PC端的用户需要专业,高效的完成复杂的任务。而移动端的用户则需要及时解决身边的小问题。基于这点差异,在设计产品时,就需要区分各终端用户的需求,来进行差异化处理。
范围层
差异度:★ ★ ★ ★ ☆
差异点:产品功能
范围层可以理解为产品的功能及特性。在这个层面上两者之间功能差异化比较明显。
由于PC端需要完成高难度复杂的任务,所以功能上更加丰富、复杂,比如常见的绘图软件PS,我们可以使用它进行图片处理、绘画制图、甚至做一些简单的动效。强大且丰富的功能,可以满足我们对图形处理的一切需求。

移动端需要及时解决问题,所以功能上更加精简且更有针对性,方便用户快速解决问题。比如常见的APP美图秀秀,它的功能主要集中在快速美化图片上,相较于PS它的功能更加精简。



PS VS 美图

结构层
差异度:★ ★ ★ ★ ☆
差异点:信息架构
结构层相对比较抽象,在这个层面主要研究用户使用产品时的操作路径,以及信息如何组织呈现给用户。
由于PC端用户使用鼠标可以进行更精准快速的操作,所以页面往往横向信息更多,信息层级也更深。且浏览器新开标签也可以很高效的承载新一级内容的展现和回退,所以其导航设计时形态相对更保守。

移动端由于设备尺寸与操作场景的关系,在设计时要考虑导航位置、单手操作范围、内容承载极限、占用空间范围等问题,所以移动端导航会出现如宫格导航、标签导航等更加扁平的导航结构。

淘宝PC与移动端。
框架层
差异度:★ ★ ★ ★ ★
差异点:页面布局
页面的布局的形式受屏幕尺寸影响较大。
由于PC端屏幕更大,信息承载能力更强。所以在布局上可将页面划分为多个区域,不同区域展示不同类型的信息。常见的布局形式有两栏、三栏、多栏布局。

而移动端屏幕较小,特别是横向空间较为局促。为了承载不同类型的信息,且信息要便于阅读,所以布局时更多在纵向空间上进行组合拼接,比如常见的列表或卡片式的布局。

两栏布局vs列表、卡片
表现层
差异度:★ ★ ☆ ☆ ☆
差异点:操作控件
表现层是我们接触产品后看到的第一印象。包括产品的颜色、图标、字体、控件等。其实在视觉层面上由于产品需要统一的品牌形象,所以两个终端间的视觉差异并不是特别明显,其主要区别在于操作控件上。
PC端使用鼠标键盘操作,可以精确的点按控件。所以控件的间距要更小。

而移动端使用拇指操作,为了避免误操作,所以图标、按钮的尺寸和文字间距都要更大。

淘宝购买详情页PC与移动端


总结
用户需求(专业复杂/快捷简单)
产品功能(大而杂/精而简)
信息架构(可支持复杂结构/优先扁平结构)
页面布局(灵活多变/固定专注)
操作控件(小而密/大而疏
最后造成这些差异的矛盾点在于技术条件的限制。目前的计算机不能做到拥有小巧机身的同时兼顾更大的屏幕,以及强大的运算处理能力和续航能力。相信在不久的将来AR\VR技术的突破,电池技术的进步,我们将最终打破多终端之间的差异,达到更好的用户体验!
扩展阅读《用户体验要素》—Jesse James Garrett 著


花火公众号

关注花火公众号

回到顶部