在 UI 设计中,PC 端和移动端有什么区别?体现在哪些方面?
面试遇到了个问题,面试官问我 PC 端的设计和移动端的设计有什么区别…因为觉得这个问题做设计的都大都懂,可是我的回答面试官好像有不一样的看法,所以想请教各位大佬,谢谢
回答·31
最热
最新
- 1、屏幕宽度:移动端的屏幕小,在小屏幕上显示的内容,应当适当增加大小,让用户能够轻松阅读和消化。 2、交互不同:pc 端主要以鼠标事件为主,移动端主要是触碰操作,快速无缝的加载和即点即用的交互是用户的首要需求,配合移动端碎片化的使用时间,所以去掉毫无意义的动效。效率和可用性是原则。 3、精简界面布局:移动端尽量简化层级,保证页面信息的简单直观,突出重要信息,做到一个界面只完成一项任务即可,学会给界面做减法!
- 巨大差别,20 号字体在 app 里特别小,但在 web 端偏大很多,导航栏基本 16.18 像素。 技术实现不同,与你搭档的安卓,ios 开发做不了定位,设计实现不了,但 web 端有定位算好盒子间距即可。 如果你说的是网页在两者之间区别,那就很明显移动端设计形式跟 web 端区别很大,移动端卡片式设计居多,web 端同一内容却可以一屏展示;移动端一排两项都很多,但 web 端可以最多放五项了;交互上区别也蛮大,滑动不用在移动端设计,但操作形式更丰富,左划右划切换页面常有,但在 web 端很少见到
- 屏幕尺寸差异:PC 端的可视范围整体比移动端大,需要考虑的是单一设备下界面元素在不同视窗的适配,比如说在 16:9 宽屏及 21:9 超宽屏下的体验,及视窗宽度范围对 UI 组件、字体、布局和体验的影响;移动端可视范围小,对文本的可读性和稳定性要求更高,主要以竖屏为主,横屏为辅,更多的是考虑不同设备之间屏幕尺寸的适配。 交互方式差异:PC 端以键鼠为主要的输入设备,以精确交互为主,遵循 WIMP 范式,基于鼠标的交互事件有 hover 状态,允许更大幅度的 Drag&Drop 操作和鼠标手势,特有的命令行界面配合键盘快捷键可以非常高效的完成文本输入任务及宏交互;移动端以触摸屏为主要的输入设备,更适合粗放型的交互任务,比如滑动,滚动、按压等,触发区域至少要 44px,较不适合长距离的拖动交互,竖屏单手操作区域集中在屏幕下方,横屏双手操作区域分布在左右两侧,精确交互需要手写笔作为辅助。 信息架构差异:PC 端由于屏幕尺寸优势,一屏可以展示更多的内容,信息层级宽而浅,因此 PC 端比移动端天然适合多任务多视窗操作,充分利用大屏优势提高操作效率,通过占据用户一段持续的完整时间来获得沉浸式体验;移动端相反,趋向于每屏聚焦于一个任务,信息层级窄而深。因屏幕空间有限,它较适合单任务操作,更提倡“随时随地,用完即走”,充分利用用户的碎片化时间,UI 设计以简洁为主,尽量减少用户的思考及界面对用户的干扰。 应用场景差异:PC 端因设备物理体积和电源限制,通常需要用户在固定的场合(如学校图书馆、办公室、家中或咖啡厅)与设备进行交互;移动端刚好相反,设备体积小,可以不插电工作,因此不受场合限制,随时随地使用,同时也因为电力的限制不适合执行高性能高并发密集性操作。 最后,随着科技水平的发展,设备本身的限制、PC 端与移动端的边界将来也许会被打破,重构终端用户体验。所以这里描述的区别未来未必适用,了解历史,保持探索,关注趋势,才能更好的理解和驱动设计。
- 1,分辨率不同, 2,交互手段不同 3,交互逻辑不同。 4,用户群体不同
- 简单的说,设计规范不一样
- 1.尺寸不同 PC 尺寸都比较大,因浏览器分辨率不同,需要采用响应式设计; 移动端尺寸小,虽然现在也有大屏,但相比 PC 端还是偏小,所以设计时候要突出优先级高的内容。 2.交互方式不同 尺寸不同也导致了用户的操作,交互方式不一样。PC 端,鼠标滑过,精准控制点击位置;移动端丰富的手势操作,较难精准控制点击位置。 3.网络环境不同 PC 端一般使用 WIFI,网络环境比较稳定 移动端 WIFI/3G4G 等网络环境比较复杂,也更重视网络异常情况下的场景错误提示,以及如何恢复;需要耗多流量时需要提醒用户,得到用户允许才可以继续。 4.使用环境不同 PC 端使用环境相对安静封闭,用户更为专注;移动端用户碎片化使用场景多些,用户很容易被环境影响,所以设计时页面要重点突出优先级高的内容,界面篇幅不宜过长。
- 1、屏幕尺寸,Pc 尺寸屏幕大,一屏可以承载很多东西,移动端 ping 幕小,需要重新梳理信息架构,一页表达一个任务,次级信息放到下一层级。 2、交互方式不同,Pc 端使用鼠标可以更精准的点击目标,特有悬浮特效。移动端用手指,点击按钮要大些,点击范围偏向右下方,方便单手操作。特有的传感器和手势交互。 3、使用场景,Pc 端,固定场景长时间。移动端,不固定场景碎片化时间。
- 1 分辨率不同,PC 端分辨率相较于移动端更大,显示内容多,承载的任务更多。 2 网络环境不同,pc 端一般用宽带和 wifi 网络比较稳定,移动端会由环境内网络基础设施情况 5g\4g\3g 切换,网络使用情况交互复杂。 3 使用场景不同,PC 端不易携带固定办公,移动端使用场景丰富,短平快场景的产品更适合行动端。 4 设计方法不同,pc 端分辨率差异大,需要做响应式设计,一个会存在多个任务;移动端适配有倍数规律,单个页面承载一个任务,突出重要信息,引导性更强。 5 交互方式不同,pc 端针对鼠标发生交互,移动端通过触碰发生交互,交互点多,产品结构层级相对浅,移动端交互方式更复杂,设计时更复杂。
- 1.承载 Ui 的设备不同。PC 端主要是电脑,移动端主要是手机,在适配上会有布局和功能的差异 2.交互方式不同。PC 端使用鼠标操作,操作基本为滑动,双击,单击等,相对于移动端来说,操作方式较为单一,移动端的操作会更丰富 3.设计的规范不同。PC 端 ppi 与手机端不一样,所以文字间距等规范是不一样的。
- 1.网页载体是浏览器,开发语言是 HTML,因此需要遵循浏览器和 HTML 的规范,解决适配问题和兼容性题。但由于限制比较少,能够完成的效果比 APP 要多。但由于浏览器的款式太多,屏幕尺寸也较多,在适配和兼容性上考虑会较为复杂。其次是交互行为跟 APP 路有不同,用户操作基于鼠标和键盘 2.APP 载体是手机,开发语言多数为 OS 和 Android 程序,两个平台都制定自己的开发规范和设计规范。因此在设计和开发上会比网页简单一些。但 APP 的交互行为和屏幕尺寸较多,适配问题会比网页大,设计工作较多。交互行为基于手指,可操作性较少,但手机感应器较多,各种特殊功能比网页多
相似问题
推荐关注
正在加载中...