浅谈移动端和桌面端的区别(上)

Recommand
深圳/UI设计师/3年前/736浏览
浅谈移动端和桌面端的区别(上)Recommand

好久没有更新了,先预热一下,由移动端转向桌面端已经有几个月了,做下总结,浅谈一下两者的区别

前言:

2008年之前,那时候还是主要是以桌面端,但随着3G网络的普遍和移动端手机的普及,几乎达到人手一台手机,从以前只有电脑能用的软件,搬到了小巧的 移动端,互联网用户暴增,从那时候开始移动端和桌面端就开始了酣战,到现在市面上几乎被手机端占领,做桌面端的设计师越来越少了,大部分都在做移动端。

开门见山,移动端和桌面端最根本的区别就是屏幕的大小。屏幕的大小决定的信息的容纳量,pc端一个页面可以展示完全的信息可能需要移动端好几个页面来承载。 这就导致了移动端的界面多又深,桌面端的界面少有浅,但有的设计师就会感觉小屏到大屏,大屏到小屏做一下自适应就好了,(比如如果把桌面端做成响应式 显示在移动端,但是由于屏幕的限制导致信息的承载量有限,移动端的页面就会相对加长,显然这是一个很简单的处理方式,但是大部分设计师都忽略了一个问题 ,用户愿不愿意滑动,这样就会导致一些重要的信息无法一屏显示,相继导致曝光率和点击量就会大幅度下降,如果是一些比较重要的内容,那就得不偿失了,所以设计不能偷懒。

场景差异:

桌面端产品使用起来场景更加正式,移动端产品更多的碎片化时间。PC端使用场景,室内、桌椅、长时间;移动端使用场景,任何时间、任何地点。如果只是看几分钟,用户 一般不会选择打开电脑,而是直接在手机操作满足自己一定的需求。随着5g网络的普及,4g资费的下调,人们在等车、坐车、排队时碎片化的使用方式一定会增加。这时用手 机填满自己碎片化时间的次数越来越多,但是桌面端也有他不可替代的一面,比如一些比较重的软件,简单举例(Ps,Ai,等一些设计软件),都是以桌面端为载体,桌面端 画图更精细,鼠标更灵活,使用起来更方便,用户体验更好。(所以说各有各的优点,总结来说桌面端就是胖客户端,手机端就是瘦客户端)一个比较重,一个比较轻巧。

操作步骤:

移动端: 一个页面,一个任务,因为移动端用户使用环境更加的复杂多变,更容易受到干扰,所以必须保证界面信息的简单直观。 页面承载量有限,如果在一个页面信息过多 操作起来不方便,容易让用户混乱 这里所说信息量并不是指绝对信息量,更准确的说法应该是用户主观感受上的信息量。同样的几个输入框,可能在pc端只占了页面的1/4左右 而在移动端就需要一整个页面来承载这1/4的信息,给用户的感观是完全不一样的。如果页面塞的满满当当,容易让用户焦虑,还会导致用户不断地操作滑动页面,更容易产生 焦虑心里。

桌面端: 一个页面,多个任务,桌面端毋庸置疑,屏幕大,信息承载量大,操作步骤都会呈现再一个页面上,无需跳转界面,直接可以就地操作,几乎可以覆盖大部分的中小型 功能,在硬件得限制下,设计上还是和移动端区别很大。

前几天看到关于桌面端的文章,借用文章的一句话用到此处,大致可以总结为,移动端,界面多又深,桌面端,界面少又浅,但是又有人问了,移动端这么多步骤,用户不会焦 虑吗?难道不害怕内容多吗?不会,在操作步骤时,页面的内容量用户一眼都能看出来,并且不知道有多少步骤,不知不觉中就已经操作完了,有一句话说的好,无知无畏,因 为无知,所以无畏。

交互差异:

移动端: 移动端特有的交互方式,触屏滑动操作,相对来说没那么精准,现在的智能手机还有很多手势交互,比如屏幕或者页面之间自由滑动切换,滑动条目进行删除,滑动解锁,侧滑呼出菜单等,还要要考虑屏幕尺寸及布局方式的不同,特别说交互方式采用手指点击的交互方式而非鼠标,考虑拇指的最小触控范围,交互方式的设计也各有千秋。移动端还有各种传感器,比如录音、拍照、录视频、蓝牙、wifi、LBS、NFC、GPS、重力感应、push推送、定位精度等,pc端都不具备的。

桌面端: 用户和界面是通过鼠标和键盘进行交互,点击精准,交互方式比较多,比如最常见的单击、双击、右击、hover、拖拽、框选、滚轮滚动、长按拖拽滚动,以及鼠标箭头的各种状态等等,交互方式多样,键盘输入的话对比移动端的软键盘来说更方便,有更多的快捷键,方便用户使用,用户的输入成本更低。

设计上需要考虑: 比如一个简单的按钮,需要做一个默认、一个hover(悬停)、一个点击、一个置灰,但是一般情况下只需要做两态就行,默认和悬停,还有就是有各种的导航体系,如网站地图、树状导航、面包屑导航等,还可以开发新的体系,他没有一个固定的规范,但是移动端呢又恰恰相反,移动端 app交互设计需要参考平台操作系统的设计规范,基于ios和android上来说,基本上都是google和Apple制定的标准说的算,移动端上的导航呢就会有标签栏代替。

布局差异:

移动端布局是纵向排版,桌面端横向排版纵向排版都会有,简单来说,就说移动端是一维布局,桌面端是二维布局,手机屏幕展示内容有限,内容一般都是纵向排,桌面端 屏幕空间大,能容纳的信息量也多,布局上也更多样,不仅有纵向,还会有横向,但是大多是以横向排版为主,避免像移动端一样多次进行跳转,从而达到就地操作。

再同一个软件,同一个功能下,移动端可桌面端的展现,和排版也是各有千秋,移动端需要多次跳转,需要多个页面,多个页面的排版布局又不一样,桌面端的话就比较简单 了,交互上来说不需要多次跳转,界面上只需要进行横向排版就行,也不一定都是横向排版,简单来说是二维布局吧,也就是桌面端经常说的多栏布局(为了更好的展示给大 家,就以微信收藏功能为例,很明显可以看出,移动端需要的三张界面,而桌面端只需要一张就能很明了表达给用户)

结语:

桌面端和移动端两个不同的载体,设计语言和用户的使用习惯都相差较大,所以在设计时还是要注意这些差异性,先总结一部分,后边会在

就两个平台的的设计规范上进行具体的分析,谢谢大家观看~

7
Report
|
6
Share
相关推荐
永中优云App 设计
Recommanded by editor
2020-2021作品集
Recommanded by editor
识趣
识趣
识趣
识趣
作品收藏夹
会跳舞的-花瓶
Homepage recommendation
文章内容含视频
照⽚抠3D 真的成了
Homepage recommendation
文章内容含视频
世界正在-失去⾊彩吗?
Homepage recommendation
文章内容含视频
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
You may like
LOGO.LOGO. LOGO.
Homepage recommendation
2025 Annual Portfolio
Homepage recommendation
相关收藏夹
识趣
识趣
识趣
识趣
作品收藏夹
文章
文章
文章
文章
作品收藏夹
《阿凡达3》来了
《阿凡达3》来了
《阿凡达3》来了
《阿凡达3》来了
精选收藏夹
作品收藏夹
茶包装
茶包装
茶包装
茶包装
精选收藏夹
作品收藏夹
白酒包装 酒产品
白酒包装 酒产品
白酒包装 酒产品
白酒包装 酒产品
精选收藏夹
作品收藏夹
IP形象及IP内容
IP形象及IP内容
IP形象及IP内容
IP形象及IP内容
精选收藏夹
作品收藏夹
大家都在看
Log in