手游设计必读!细数游戏UI适配细节

发布时间:2024-05-16 15:23:12 浏览量:645次

“手游在设计的过程中,由于屏幕比例与尺寸的差异,再加上游戏需要一屏显示的整体性与艺术性,因此和普通APP相比,有着更为复杂的规则。”

本篇文章只针对横屏游戏,将从以下几个模块讲解:

  • 设计比例与尺寸
  • UI适配
  • 背景图片适配
  • 刘海与圆角适配
  • Home Indicator适配

以上模块在本质上是互相关联的,但为了方便说明,因此拆分开说明。

设计比例与尺寸

一般来说,设计时需要采用16:9的尺寸,常用的包括【1280*720】【1334*750】【1920*1080】等。

常规手游且画质要求不高的游戏使用720P完全足够,例如复古风、像素风;750-850P则更为常见,基本可以适配各种场景,不管是iPad还是模拟器均可以一个不错的质量展示,包体大小也合适;1080p适合画质要求较高的游戏,或者需要PC端的游戏。

设计比例与尺寸

在游戏立项时,以上内容都需要美术与开发进行商量,并定下设计分辨率,以后的设计过程将一直沿用此规则。

UI适配

所有的UI均满足设计规则,分为普通类和场景化界面类。

UI在引擎中的原理:所有UI都有一个锚点,即控件的坐标位置即为锚点的位置。

UI锚点示意图

锚定可以控制控件的相对位置,通过锚定一个控件,你可以控制它,无论屏幕大小如何,都将出现在相对于定位点的位置。

UI锚定示例

普通类UI适配

普通类UI按照设计,大致分为两种,普通类与场景化界面类。

A)大于16:9(iPhone X)

若屏幕比例大于16:9,则短边为适配基准。

大于16:9适配示意图

B)小于16:9(iPad)

若屏幕比例大于16:9,则长边为适配基准。

小于16:9适配示意图

无论屏幕尺寸多少,UI比例不变,按照原尺寸与相对位置设计。

场景化UI适配:此种在游

热门课程推荐

热门资讯

请绑定手机号

x

同学您好!

您已成功报名0元试学活动,老师会在第一时间与您取得联系,请保持电话畅通!
确定