技术干货:Applewatch APP设计规范

如题所述

第1个回答  2022-06-11
一、规范概要

1. 导航形式

层级式,通过当前页面点击跳转到另外页面的形式。适合应用于复杂产品,需要层层递进。

页面式,页面切换,滑动,类似轮播

Apple Watch导航形式任选其一,不得同时存在。

2. 交互方式

轻触:列表、按钮、切换等控件的操作

手势:纵向轻扫,界面滚动;横向轻扫,界面导航之间的查看;从屏幕左侧边缘向右轻扫,返回父级界面。

压力触控:唤出当前页面情景菜单

实体控件(手表旋钮):长页面浏览,避免手指长时间轻扫界面何遮挡界面

3. 色彩

使用黑色作为APP的背景色,或者深色且高斯模糊的图片作为背景

高对比度的颜色使用于文字、图标、界面

4文字

SF和苹方

5. 图标

通知图标、首屏图标和长看图标、短看图标

情景图标(App内功能图标)

6. 布局

并排放置的图标一行不要超过三个

布局优先采用左对齐

二、设计尺寸

1.1屏幕尺寸

38mm(272*340px)

42mm(312*390px)

1.2图标尺寸

通知图标48PX(38mm)55px(42mm)

首屏图标和常看图标80px(38mm)88px(42mm)

短看图标172px(38mm)196px(42mm)

菜单情景图标(App内的功能图标)

图标大小70px,实际图标大小46px。(38mm)

图标大小80px,实际图标大小54px。(42mm)

图标线宽不得小于4px

1.3图标

1.3.1

通知图标,系统通知弹出的图标

1.3.2

首屏图标,如下图所示。首屏图标80px(38mm)88px(42mm)

1.3.3长看图标,如下所示,左上角图标。常看图标80px(38mm)88px(42mm)

1.3.4短看图标,如下图所示。短看图标172px(38mm)196px(42mm)

2.字体和文字

2.1字体

SF和苹方

2.2文字(字号,常见字号单位是PT和PX,PT是开发单位,PX是设计单位,在@2X下换算关系1PT=2PX)

标题headline 18PT

正文标题caption 15PT

正文body 15PT

备注、脚注、辅助文字footnote 12PT、13PT

3. 颜色

高对比度的颜色使用于文字、图标、界面

1.主色,如下图所示

2.辅助色、点睛色(控件、按钮)

按钮控件在设计中通常带有透明度

3.字体颜色和透明度

4. 布局

1状态栏和下方图片和列表布局间距

38mm(30px),42mm(32px)

2状态栏和列表按钮布局间距

38mm(11px),42mm(13px)

3状态栏和下方文本布局间距

38mm(46px),42mm(50px)

4文字边距和分割线按钮列表图片边距

38mm和42mm边距相同

5.图片和按钮到屏幕两边距离

38mm和42mm边距相同

5.控件和列表

1单行控件和列表布局尺寸

38mm

42mm

2.双行控件和列表布局尺寸

2.1正文+备注

38mm

42mm

2.2双行正文

38mm

42mm

3.三行控件和列表布局尺寸

38mm

42mm

4. 多行控件和列表布局尺寸

38mm

42mm

5.控件和列表类型

相关了解……

你可能感兴趣的内容

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 非常风气网