UI设计尺寸

移动端设计尺寸

iOS（苹果）系统

• 常用分辨率：iPhone SE（4英寸）、iPhone 6s/7/8（4.7英寸）、iPhone 6s/7/8 Plus（5.5英寸）、iPhone X（5.8英寸）等。
• 推荐设计尺寸：375 * 667px（适用于大部分设备），但在设计时可以使用750*1334px，以适应更高分辨率的设备。
• 字体：中文字体推荐使用PingFang SC，英文字体推荐使用Helvetica、SF UI Text或SF UI Display。
• 适配：导出切图时加后缀@2x和@3x，分别对应原始尺寸的2倍和3倍图。

Android（安卓）系统

• 常用分辨率：480×800, 480×854, 540×960, 720×1280, 1080×1920。
• 推荐设计尺寸：主流尺寸为2倍图720 * 1280以及3倍图1080 * 1920。
• 字体：中文字体推荐使用思源黑体或Noto，英文字体推荐使用Roboto。

Web端设计尺寸

网页UI设计规范

• 网页宽度：1920px，高度不限。
• 有效可视区：950px~1200px宽度，具体尺寸根据项目、客户要求以及目标用户群决定。
• 字体：
  • 中文常用字体：宋体、微软雅黑、苹方（MAC）。
  • 英文常用字体：Times New Roman、Arial、sans。
• 字号：
  • 导航文字大小：14px、16px、18px、20px。
  • 正文内容：12px、14px。
  • 标题：22px、24px、26px、28px、30px。
  • 辅助信息：12px、14px。
  • 全英文网站最小10px（如底部信息）。

设计适配与切图规范

• 在设计时，应考虑到不同设备的分辨率和屏幕尺寸，确保界面元素在不同设备上都能清晰显示。
• 切图时，应提供不同倍率的图片，以适应不同分辨率的设备，如@2x和@3x。