AppleWatch界面设计规范
- 格式:docx
- 大小:3.86 MB
- 文档页数:38
苹果gui设计原则-回复苹果GUI设计原则苹果GUI(图形用户界面)设计原则是用于指导开发者在苹果设备上创建用户友好的应用程序界面的设计准则。
苹果一直以来都致力于提供出色的用户体验,并将此视为其成功的重要组成部分。
因此,他们发展了一系列设计原则,以确保他们的产品在可视化方面具有一致性、易用性和直观性。
本文将探讨几个关键的苹果GUI设计原则,并提供一些实际应用的示例。
1. 清晰简洁苹果GUI设计原则的核心是清晰简洁。
设计应力求简化,使用户界面仅显示与用户当前任务直接相关的信息和功能,避免过度装饰和不必要的复杂性。
这可以通过移除多余的图标、按钮和文字来实现。
一个好的设计是让用户专注于自己的任务,而不是被不必要的干扰所分散注意力。
例如,苹果的手机应用程序界面通常只显示当前的任务或内容,并使用清晰简洁的图标和按钮进行导航。
应用程序的设置选项通常被隐藏在菜单中,以避免干扰用户视线。
2. 强调直观性苹果GUI设计强调直观性,即使没有任何指导,用户也能够直觉地理解和使用应用程序。
这可以通过以下方式实现:- 使用熟悉的图标和符号:苹果的设计准则鼓励使用熟悉的图标和符号,以便用户能够快速理解它们的含义。
例如,使用垃圾桶图标表示删除,使用放大镜图标表示搜索等。
- 合理的布局:设计应遵循用户的阅读和浏览习惯,例如从左到右阅读或从上到下阅读。
同时,布局应该有明确的结构,使用户能够快速找到所需的信息和功能。
- 自然的动作和转换:应用程序的过渡和动画效果应该与现实世界中的行为类似,以增加用户的直观性。
比如,当用户点击按钮时,按钮应该显示按下的效果,以模拟物理按钮被按下的行为。
3. 一致性和持续性一致性和持续性是苹果GUI设计原则的基础。
应用程序的不同部分应该在外观和功能上保持一致,以提供用户熟悉的体验。
这可以通过以下方式实现:- 使用通用元素:设计应该使用通用的界面元素,例如标签、滑块和按钮,以便用户可以将其与其他应用程序进行比较和对比。
ui尺寸规范UI(User Interface,用户界面)尺寸规范是制定UI设计时所遵循的一系列规定,以保证设计的一致性和可用性。
下面是一些常见的UI尺寸规范,共计1000字:1. 分辨率:在设计UI时,应该考虑不同设备和屏幕的分辨率。
常见的分辨率包括:320x568(iPhone 5/SE),375x667(iPhone 6/7/8),414x736(iPhone 6/7/8 Plus),375x812(iPhone X/XS/11 Pro),414x896(iPhone XR/XS Max/11/11 Pro Max),1024x768(iPad),1366x768(台式电脑屏幕)等。
2. 设备尺寸:UI设计的尺寸应该适配不同的设备尺寸。
在移动设备中,常见的屏幕尺寸包括:4英寸,4.7英寸,5.5英寸,5.8英寸,6.1英寸,6.5英寸等。
而在桌面设备中,常见的尺寸是13英寸,15.6英寸等。
3. 图标尺寸:在设计图标时,应该考虑不同尺寸的需求。
一般来说,图标应该提供三个尺寸:16x16像素,32x32像素和48x48像素。
这样可以确保图标在不同大小的显示区域中都能清晰显示。
4. 字体尺寸:设计中,字体的尺寸应该根据不同的显示区域和内容需求做出调整。
一般来说,主标题的尺寸应该在18-24像素之间,副标题在14-18像素之间,正文内容在12-16像素之间,小标签和按钮文字在10-14像素之间。
5. 边距和间距:设计中,边距和间距的尺寸应该能够提供足够的空间来区分不同的元素和模块,并且保证用户的点击和浏览体验。
一般来说,边距的尺寸应该在8-16像素之间,间距的尺寸应该在16-32像素之间。
6. 图片尺寸:在设计UI时,考虑到图片在不同尺寸的设备上的显示效果,应该提供多个不同尺寸的图片。
根据不同的需求,图片的尺寸应该在相应的范围内调整,如头像图片一般为50x50像素,轮播图图片一般为750x400像素等。
干货速递!APPLE WATCH人机交互指南之UI设计基础(2)UI设计基础的内容占据了Apple Watch人机交互指南文档中40%的篇幅,它不仅详细解释了UI设计的规则,还仔细讲述了这么设计的原因所在,你可以从这些稍显拗口的文字中看到Apple Watch的另一个侧面:严谨。
这些深思熟虑的细节(哪怕你不喜欢),和那些野生的“智能手表”有着巨大的差别。
上一部分人机交互指南:《干货速递!APPLE WATCH人机交互指南之UI设计基础(1)》5、Modal SheetsModal Sheets 的优缺点都很明显。
它让用户可以无干扰地完成任务、获取信息或者继续在Force Touch菜单中做选择。
为了实现这一点,Modal Sheets会暂时阻止用户同APP的其他部分进行交互。
在设计的时候,你最好能将APP的模式体验尽可能最小化,一般而言,在以下情况下可考虑创建模式内容:・当吸引用户的注意力成为至关重要的事情・当为了避免用户数据处于模棱两可的状态,而需要完成一个独立的任务,或者需要明确地放弃某个任务的时候模式界面包含单个屏幕界面,或者包含多个分页屏幕界面。
两种界面唯一的区别是后者在分页底部有小圆点指示。
在模式界面的左上方的位置留给关闭按钮。
当用户点击点击左上角这个按钮(或者在做边缘互动操作的时候),系统会关闭模式界面而不会进行更多的操作。
关闭按钮是系统强制显示的,不会被隐藏,但是你可以改变显示的内容(比如close改成cancel)。
这也意外着你无需再往下方的内容主体中再单独添加关闭按钮,尤其是当左上方的按钮显示的是“关闭”或者“取消”的时候。
左上方按钮通常是白色的。
如果所涉及任务需要确认或者接受,那么可以在模式界面的内容主体中添加“接受”或者“确认”按钮。
除了执行适当的操作之外,点击了这些按钮之后还会解除当前的模式界面。
尽量确保任务界面简单直接。
避免从一个模式界面跳转到第二个模式界面。
6、布局布局指南限制界面中并排控件的数目。
Appl e Watch界面设计规范– 模态表单
编者语:之前有介绍apple watch的基础规范,这边是介绍模态表单的
模态表单有利也有弊。
模态表单可以临时性的阻断用户与应用其他部分的互动,使他们不受干扰的完成任务、获取信息,或是在由按压手势唤出的情境菜单中完成选项流程。
要使应用中的模态体验保持在最少的程度。
通常,只在这些情况下考虑使用模态表单:
获取用户的注意力在当前环节是至关重要的。
某个独立的任务必须被完成,或是被显性的放弃,否则用户数据将处于模棱两可的状态。
模态界面通常由单一界面构成,或者也可以由一系列基于页面式导航的界面构成。
呈现方式上唯一的区别就在于底部是否有页码指示符。
模态界面的左上角用来放置关闭按钮。
当用户点击该按钮时(或从屏幕左边缘向右轻扫),系统会将模态界面关闭掉,不再有相关的后续操作。
关闭按钮的呈现是强制性的,不过你可以定制其标题。
你也不需要在内容当中另外添加关闭按钮了。
关闭按钮的典型标题有“关闭”和“取消”,字色始终保持白色。
1/ 2
如果任务当中需要“接受”操作,你还需要在模态界面当中添加接受按钮。
请使用标准的接受按钮。
点击该按钮后,模态界面同样会被关闭,然后后续行为得到执行。
保持模态任务的简练。
不要在初始的模态界面中再次显示一个新的模态界面。
原文
2/ 2。
快速、轻量的人机互动正如我们这些年在iPhone上体验到的各种简洁而专注的应用,Apple Watch的体验设计目标也是如此;实际上,“也是如此”仍然不够,对Watch来说,交互体验要更快、更轻量。
设计的关键要点在于如何聚焦在诸如Glance或Short Look这些高度情境化的模式上面,使应用在最恰当的时间和地点为用户带来最恰当的信息和体验。
快速轻量,意味着交互方式的高度聚焦。
你不必担心例如双指捏合一类的手势,它们根本不被支持。
通过有意义的动效将操作与信息连接起来,使用动效预渲染技术来提升性能与速度。
3.Glances、Short Look与Long Look对于手表来说,偶尔的抬手一瞥(Glace)或是注目查看都是很自然的互动方式;对Apple Watch也不例外,实际上,这是目前Watch上大多数应用的主要交互模式。
Glance是一种由用户主动发起的互动,可以基于当前情境将数据信息从相关应用当中提取出来并显示在视图当中。
Short Look可以通过最简洁的方式将即时的、情境化的通知信息推送给用户。
如果用户保持手腕抬起的姿势,Watch会认为用户需要深入了解当前的通知信息,继而将Short Look切换为Long Look模式,以提供更详细的信息,并包含相关操作选项。
4.按压(Force Touch)按压是Apple Watch带来的全新交互方式。
在屏幕空间如此狭小的设备当中,通过按压而不是某种可视化的交互元素来唤出情境菜单是一种很重要的交互特性。
相比于默认显性的按钮来说,情境化菜单可以将一些与当前界面内容或状态相关的操作功能隐藏起来,为那些默认需要显示的信息节省出更多的空间。
5.配色很重要当然,这个原则适用于任何类型的设计工作;但对于Apple Watch这种情境不固定、屏幕尺寸极小、交互极其轻快的设备来说就更加重要了。
在内容当中使用高对比度的配色,可以使文字更加清晰易读,简单一瞥即可获取信息。
Apple Watch界面设计规范(9) - 品牌
成功的品牌塑造不仅在于向应用当中放置与品牌相关的图形资源。
优秀的应用应该将品牌形象与独特的界面外观及操作感整合起来,带给用户愉悦而印象深刻的体验。
你可以通过很多方式来塑造应用的品牌认知,例如图标、色彩、定制化按钮、定制化字体和文案等等。
当你为应用设计图形元素的时候,不仅要使它们各自表现良好,同时还要使它们看上去彼此协调与统一,无论对于定制化元素还是系统标准控件来说都是如此。
将品牌元素优雅平滑的融入界面设计当中。
人们用你的产品是为了完成任务或得到消遣,他们不希望自己像是在被迫看广告一样。
为了打造更平滑的体验,你要尽量潜移默化的通过自体、色彩和图形元素向用户传达品牌信息。
不要在应用内或Glance当中显示logo。
Apple Watch上的显示空间寸土寸金,logo图形中的每一个元素都在占用用户希望看到的实际内容的空间。
此外,在Watch应用当中展示logo并不能达到在网页上那样的效果:用户在浏览传统网页时,一开始很可能并不了解当前页面所属网站或品牌;而人们在移动设备上打开某应用时通常都是依靠应用图标和logo来定位的,你无需再在应用内部展示。
Apple Watch界面设计规范(10) - 标签(Labels) 标签用来显示静态文字。
标签具有以下特性:
可以显示任意数量的静态文字
不支持用户交互
可以由程序来更新内容
可以包括多行文字
标签是应用当中最常用的界面元素之一。
你可以使用标签向用户展示文字信息。
标签最适用于呈现相对少量的文本内容。
要确保标签的清晰可读。
使用高对比度的字色,通过动态字体功能确保用户看到的标签字号是合理的。
推荐使用系统内置的字体,它们可以使文字在Apple
Watch上呈现出最佳的可读性。
如果你选择使用自定义字体,一定不要为了追求花哨的字形与配色而牺牲文本的清晰度。
更多相关信息请参考色彩与文字。
尽可能使用系统内置的字体风格。
内置的字体风格是专门针对在Apple Watch 上实现高可读性和易用性而设计的。
Apple Watch界面设计规范(预发布版本)本文来自Be For Web英文原文:https:///译者信息: C7210 - UX玩家、交互设计师、猫奴、guitar fucker,现就职于腾讯ISUX(上海)UI设计基础Apple Watch体现着如下几个方面的主题思想:∙个人。
Apple Watch是面向穿戴而设计的,所以其UI需要与佩戴者自身相协调。
抬起手腕的动作可以使Apple Watch显示当前时间及通知信息。
通过Digital Touch来“传心跳”或“传画” - 这些全新的沟通方式是极具个人色彩的。
加速感应器和心率传感器可以日复一日的向佩戴者提供其运动行为方面的个人数据。
苹果推出的其他任何设备都不曾与用户建立起如此紧密的关联。
在你为Apple Watch设计应用的时候,时刻留意这种个人化的关联是非常重要的。
∙整体。
Apple Watch旨在使硬件与软件的边界更加模糊。
数码表冠是经过精心打造的实体控件,帮助用户在软件当中进行精巧的导航操作。
Taptic Engine可以与提示信息或界面操作结合起来,为用户提供微妙的触觉反馈。
Force Touch - 一种可以由硬件感知按压力度的触摸方式- 为软件的情境化控制方式带来了一个全新的维度。
即便是Retina显示屏的物理边缘也被考虑了进来- 隐性的边缘渲染方式允许你打造出“边到边”的全屏UI设计。
上乘的应用设计方案需要贯彻这种软、硬件一体的体验原则。
∙轻量。
Apple Watch应用在设计上要注重快速、轻量的交互流程,并充分利用屏幕显示空间及其位于手腕位置的这一重要特性。
出于隐私和可用性方面的考虑,界面当中信息的获取和移除方式都应该是非常快捷的。
举个例子,Apple Watch上的Short Look信息提示方式的设计原则,就是首先以最小化的方式提供少量提示信息,如果用户持续关注,再为其展示更全面的信息。
Glance则是通过一种易访问的、可通过轻扫手势操作的界面形式将应用内部的信息呈现出来。
图像对象展示单张静态图像或多张动态图像。
没有必要建立非Retina图像。
3、群组群组是将内容正确布置在你界面中的重要工具。
群组像是其他对象的容器。
群组自身没有默认外观,不过用户可以自定义背景颜色或图像。
群组还拥有定义位置、尺寸、边距及其他布局相关的属性。
群组:– 可以将元件水平或垂直排列– 包含一个或多个其他界面元素– 有定义边距及群组元素之间间距的属性– 可以将图像或纯色设为背景– 可以为其背景或内容设置圆角半径群组是你在Xcode中实现设计的主要工具。
然而,鉴于群组可以拥有自己的背景颜色或图像的这一事实,你也可以将其用为视觉元素。
不要在群组中放置群组以创建复杂布局你可以将某些内容水平布置,而另一些垂直布置。
你也可以嵌套群组以利用外层群组的边距或间距。
为不同的Apple Watch实际显示尺寸建立不同的背景图像不要试图为不同屏幕尺寸拉伸或压缩图像。
保证图像资源的像素尺寸对其底层设备是正确的。
4、表格表格在单一列中分行展现数据。
使用表格呈现会动态改变的内容。
表格对象:– 支持多行类型– 是可滚动的– 可以拥有背景颜色或图像你要在设计的时候为你的表格行类型定义布局。
所有行都要预先设计。
在运行时,你可以选择你实际想要使用的行类型。
使用一致的行类型你可以创建不同的行类型来实现你的内容、头部、页脚。
在使用那些行的时候保持一致。
避免将明显不同类的内容混在行内当呈现内容时,使用一致的行类型呈现内容。
只有在需要做分节符或组织内容行时使用其他行类型。
为内容使用相同的行类型可以确保行尺寸一致,并易于导航。
限制同时呈现的表格的行数超过20行内容的表格会变得不好滚动。
只呈现直接相关行的子集,并为用户提供加载更多行的选项。
不要在群组中嵌入表格表格会根据其包含的行数动态调整大小。
因此,表格忽视所有群组对它们的高度限制。
5、按钮按钮执行一个应用定义操作。
按钮– 有可自定义的背景– 有圆角– 可以包含标签或群组对象按钮的背景就是所谓的盘(Platter)。
ios 界面设计规范iOS界面设计规范是一套指导开发者在开发iOS应用时遵循的设计规范和原则。
这些规范和原则旨在提供一种一致且美观的用户界面体验,使用户能够轻松地使用和理解应用程序。
以下是iOS界面设计规范的一些重要原则和指导:1. 平面化设计:iOS界面设计倾向于平面化,注重简洁和清晰。
这意味着使用简单的几何形状、清晰的线条和明亮的颜色来创建界面元素,并避免过度复杂或过渡华丽的效果。
2. 一致性:iOS界面应该保持一致性,使用户能够轻松地通过熟悉的界面元素和操作感到舒适。
例如,导航栏和工具栏的位置应一致,按钮的样式和位置也应一致。
3. 响应式:iOS界面应该对用户的操作做出即时响应,以提供互动和良好的用户体验。
按钮应该在被点击时立即显示反馈,滚动和拖动操作应该流畅且实时。
4. 导航:iOS界面使用导航栏和标签栏来帮助用户浏览和导航应用。
导航栏位于屏幕顶部,并提供应用的标题、返回按钮和其他导航控件。
标签栏位于屏幕底部,并提供应用的主要功能入口。
5. 布局:iOS界面的布局应该简洁明了,避免过多的元素或信息。
使用间距、对齐和层次结构来提高可读性和可用性。
布局应该适应不同的屏幕尺寸和方向,以便在不同设备上提供一致的界面体验。
6. 字体和颜色:iOS界面应该使用清晰易读的字体,并避免使用过小或不易辨认的字体。
颜色应该搭配合理,避免使用过多的鲜艳颜色,以确保用户界面的易读性和可用性。
7. 图标和图片:iOS界面的图标和图片应该是清晰、易识别和易记忆的。
图标应该使用简化的几何形状和明确的线条来表达应用的功能或内容。
图片应该清晰且高质量,以保证在不同设备上的显示效果。
8. 用户输入:iOS界面应该提供直观且易于理解的用户输入方式。
文本输入框和按钮应该明确表达其功能,使用户了解他们需要输入什么或者点击什么。
键盘应该根据输入内容的类型和上下文进行切换,以提高用户输入的效率和准确性。
9. 无障碍性:iOS界面应该考虑到残障用户的需求,并提供合适的功能和可访问性选项。
Apple Watch界面设计规范(13) - 列表(Tables) 列表会以单列的形式分行呈现数据。
要使用列表来呈现那些会动态变化的数据内容。
列表对象具有以下特性:
支持多行内容展示
可滚动
可以设置背景色或背景图片
你需要在设计阶段规划好列表行中的内容布局。
所有的布局类型都需要提前设计好。
实际运行时,你可以通过程序选择使用哪种类型的列表行。
列表行的使用方式要具有持续性。
你可能会创建多种列表行模式来展示不同类型的数据。
在使用过程中,对列表行类型的选择要遵守持续性原则。
不要将不同类型的列表行混杂在一起显示。
显示内容时,要保持列表形式的一致性。
不同的列表section当中可以使用各自的列表行类型。
保持列表行形式的统一,可以使内容的显示规格保持一致,更易浏览。
对每次显示的列表行数进行控制。
超过20行的列表会使浏览操作变得困难。
可以只取相关性最强的一部分内容默认显示,同时为用户提供加载更多列表行的选项。
不要在分组(Groups)当中嵌套列表。
列表对象会根据数据行数的不同而动态伸缩,所以会忽略掉分组容器当中所设置的高度限定。
Apple Watch 的设计专注于以下三个方面:・个人。
由于Apple Watch被设计为可穿戴设备,所以它的UI设计应该适应出穿戴者的存在。
当用户抬起手腕的时候,(Apple Watch)应显示时间和提醒。
数字触摸功能——尤其是心率和草图功能——提供了更为个人的全新沟通方式。
内置的加速度传感器和心率传感器为每个用户提供了个性化的活动信息。
从未有任何苹果设备能够像Apple Watch这样同佩戴者连接在一起。
当你在为Apple Watch设计APP的时候,在脑中时刻保有这种意识是非常重要的。
・整体。
Apple Watch 旨在模糊物理设备和软件之间的便捷。
Apple Watch的侧面旋钮,也就是Digital Crown,是一个微小的硬件控制机构,能对软件进行细致入微的导航操控。
内置的Taptic 引擎能够针对提醒和屏幕交互产生精细的物理反馈。
使用硬件控制物理手势的Force Touch技术则使得Apple Watch 的软件控制上升到一个新的层面。
Apple Watch所使用的Retina屏幕也使得UI设计的物理边界不再存在。
体贴的APP设计使得硬件和软件的体验难以辨别。
・轻量级。
Apple Watch上的APP应当具备有快速轻便的交互,能最大限度地发挥出手腕上这块屏幕的优势。
信息的访问、操作应该快速而便捷,确保私密性和可用性。
Short Look 旨在为用户提供最小化的提醒,用户需要点击操作才能查看更多信息。
而 Glances 则为用户提供了来自APP的易于访问,可滑动操作的界面。
为Apple Watch所设计的APP应该遵循佩戴者的使用状况:简明、快速以及小屏幕显示。
Apple Watch上的APP应该是iOS APP的补充,而非替代者。
假使你在iOS设备上进行一个操作需要几分钟的时间,那么你在Apple Watch上仅需几秒就可以完成。
因此,交互必须简短,界面必须简单。
2、APP 剖析界面风格Apple Watch的APP支持两种导航模式:・分层模式(Hierarchical)。
ios 设计规范iOS 设计规范是Apple为开发者提供的使用规范和指导,以确保应用程序在iOS平台上具有一致性和良好的用户体验。
以下是一些关键的iOS设计规范:1. 设计语言:Apple鼓励使用清晰、简单和直观的设计语言来创建iOS应用程序。
设计要素包括透明度、层次结构、线条和颜色。
2. 导航:在iOS应用程序中,导航是非常重要的。
设计应该确保用户可以轻松地找到并浏览应用程序中的各个部分。
常用的导航模式包括导航栏、标签栏和侧边菜单。
3. 布局:应用程序的布局应该简洁、整齐和易于理解。
设计应该遵循层次结构和平衡的原则,确保内容和功能被正确组织和呈现。
应避免过度使用动画和过于复杂的布局。
4. 图标和图像:iOS应用程序通常使用图标和图像来表示特定的功能或内容。
设计应界定清晰且易于理解的图标,避免使用过于复杂的图像。
使用符合iOS设计语言的风格和颜色。
5. 文字:文字在iOS设计中起到重要的作用。
应用程序中的文字应该易于阅读和理解,并与应用程序的风格保持一致。
字体大小应足够大,以适应各种屏幕尺寸。
6. 颜色:颜色在iOS设计中也非常重要。
应该使用适度的颜色,避免使用过于多彩和刺眼的颜色。
使用颜色来突出重要的界面元素,并与应用程序的整体风格保持一致。
7. 响应式设计:iOS应用程序应该具有响应式设计,以适应不同的设备和屏幕尺寸。
设计应该自动调整和重新布局,以确保应用程序在不同的设备上具有一致的外观和体验。
8. 交互设计:交互设计是指用户与应用程序进行交互的方式和方式。
设计应该注重用户友好性,确保操作和功能易于使用和理解。
应用程序应该提供清晰和直观的反馈,以便用户知道他们的操作被接受和执行。
9. 无障碍性:设计应该考虑到使用不同设备和能力的用户。
应用程序应提供无障碍功能,如大字体、语音识别和辅助功能。
设计应该确保所有用户都能够轻松地访问和使用应用程序。
10. 安全性:设计应该考虑到数据和隐私的安全性。
应用程序应采取必要的安全措施来保护用户的个人信息和敏感数据。
层级式非常适合相对复杂的应用,类似很多现存iPhone应用,用户在其中需要进行一系列的选择,然后到达结束界面。
牢记Apple预期用户在10秒内突击使用手表,所以别在手表上照搬现成应用,应该将它升华。
页面式通过横向滑动,让用户在多个页面间穿梭。
如果各页数据并不依赖其他页面,这种导航方式更佳。
开始设计时,想清楚什么数据对用户最重要,相互关系如何,然后选择最适于体现数据的导航结构。
GlanceGlance是一系列可浏览的内容,基于时间或环境,穿戴者从最喜欢的应用中挑选而出。
在Apple Watch上上滑可以触发Glance,然后可以水平滑动。
Glance不是必须的,所以并非所有应用都具有,或者需要。
Glance被限制在无法滚动的一屏中,所以你得把最有用、最重要的信息展现在屏幕上,可以通过颜色、不同字号和图片来在视觉上区别你的Glance。
在Glance上点击任何地方,会打开手表应用。
所以要避免在其中包含按钮、滑块和菜单这样的操作项。
最后,Glance基于一些模版。
所以你的设计要选择一种最能体现数据意义的形式。
Apple提供了一系列模版,适用于上半屏和下半屏。
通知Apple Watch应用有两种通知状态,分别叫做short-look和long-look界面。
用户首次收到通知时,short-look通知会出现,持续较短一段时间。
用户可以降低手腕忽略通知,也可以抬起手腕或点击short-look通知,进入long-look查看详细信息和功能。
由于手表始终戴在手腕上,你得对通知有所限制,只推送最有用的信息。
如果你持续被不重要的消息打断,那是很令人厌烦的。
最好的通知会使用用户的环境信息——比如位置、时间或活动——来提供实时、相关的信息。
short-look界面包含应用图标、应用名称和通知的标题。
由于标题是你唯一能控制的东西,它需要为通知的内容提供简短的提示。
所有应用的long-look界面结构都是一样的。
顶部显示应用图标和名称(也可以自定义这一条的颜色),底部是忽略按钮。
Apple Watch界面设计规范(4) - 通知作为快速、轻量的互动功能,Apple Watch上的通知由两部分组成:Short Look 与Long Look。
当有本地或远程通知需要呈现给用户时,Short Look会首先出现。
Short Look当中包含着最少量的必要信息- 这也是出于隐私方面的考虑。
如果佩戴者放低手腕,Short Look便会消失。
如果佩戴者保持手腕姿势,或是在Short Look的界面上轻点,那么Long Look视图便会呈现。
它会提供更加详细的信息及更多的功能,而且只能由佩戴者主动关闭。
要注意向用户发送通知的频率。
用户有可能将频繁发送的通知视为干扰,并在Apple Watch上禁止你的应用发送通知。
一定要确保通知信息与用户期望具有相关性。
Short Look通知-----------------------------------------------------------------------------------------------------Short Look可以让用户了解到哪个应用接收到了通知消息,并且只会向用户呈现简要信息。
Short Look的界面是基于固定模板的,其中包含应用的名称和图标,以及通知的标题。
系统会将应用名称渲染成该应用自身的关键色。
保持通知标题的简短、易聚焦。
可供展示通知标题的空间很小,所以要尽量保持言简意赅。
标题无需展现通知信息当中的详情,只进行大致的示意即可。
可定制的Long Look通知-----------------------------------------------------------------------------------------------------Long Look会显示通知信息当中的更多详情。
系统为Long Look提供了一套默认外观,但是你的应用可以对其进行定制,例如展示定制化的图形元素或品牌信息。
Apple Watch界面设计规范(12)- 分组(Groups) 分组是一种用来布局界面内容的重要工具。
对于其他界面元素来说,它扮演着容器的角色。
分组本身不包含任何默认的内容,但是你可以为其设置背景色或背景图片。
分组还具有一些例如位置、尺寸、边距等与界面布局相关的属性。
分组对象具有以下特性:
可以横向或纵向布局元素
可以容纳一个或多个其他类型的界面元素
可以通过属性来设定边距和分组当中的元素间距
可以设置背景图片或背景色
可以设置容器背景的圆角半径
分组的主要作用是在Xcode当中对界面元素进行布局。
但是,由于具有背景色和背景图片的属性,所以你也可以将其作为一种显性的视觉元素来使用。
通过在分组中嵌套分组来打造复杂的布局。
你也许需要通过这种方式将一组元素组向排列,同时将另一组元素横向排列。
此外,你也可能需要通过嵌套分组来利用外层容器的外边距或内间距属性去实现特定的设计需求。
为不同规格的Apple Watch创建不同尺寸的背景图片。
不要为了适配不同的屏幕规格而对图片进行拉伸或压缩。
要对应着每种屏幕规格提供尺寸最为精确的图片素材。
Apple Watch界面设计规范(预发布版本)本文来自Be For Web英文原文:https:///译者信息: C7210 - UX玩家、交互设计师、猫奴、guitar fucker,现就职于腾讯ISUX(上海)UI设计基础Apple Watch体现着如下几个方面的主题思想:•个人。
Apple Watch是面向穿戴而设计的,所以其UI需要与佩戴者自身相协调。
抬起手腕的动作可以使Apple Watch显示当前时间及通知信息。
通过Digital Touch来“传心跳”或“传画” - 这些全新的沟通方式是极具个人色彩的。
加速感应器和心率传感器可以日复一日的向佩戴者提供其运动行为方面的个人数据。
苹果推出的其他任何设备都不曾与用户建立起如此紧密的关联。
在你为Apple Watch设计应用的时候,时刻留意这种个人化的关联是非常重要的。
•整体。
Apple Watch旨在使硬件与软件的边界更加模糊。
数码表冠是经过精心打造的实体控件,帮助用户在软件当中进行精巧的导航操作。
Taptic Engine可以与提示信息或界面操作结合起来,为用户提供微妙的触觉反馈。
Force Touch - 一种可以由硬件感知按压力度的触摸方式 - 为软件的情境化控制方式带来了一个全新的维度。
即便是Retina显示屏的物理边缘也被考虑了进来 - 隐性的边缘渲染方式允许你打造出“边到边”的全屏UI设计。
上乘的应用设计方案需要贯彻这种软、硬件一体的体验原则。
•轻量。
Apple Watch应用在设计上要注重快速、轻量的交互流程,并充分利用屏幕显示空间及其位于手腕位置的这一重要特性。
出于隐私和可用性方面的考虑,界面当中信息的获取和移除方式都应该是非常快捷的。
举个例子,Apple Watch上的Short Look信息提示方式的设计原则,就是首先以最小化的方式提供少量提示信息,如果用户持续关注,再为其展示更全面的信息。
Glance则是通过一种易访问的、可通过轻扫手势操作的界面形式将应用内部的信息呈现出来。
为Apple Watch设计应用时,要遵从于佩戴者使用该设备时的体验情境,例如短暂而高频次的交互会话,以及狭小的屏幕显示空间等等。
Watch应用是对iOS应用的补充,而非替代品。
如果说我们能以“分钟”来度量iOS应用的人机会话时间,那么对于Watch应用来说则需以“秒”计。
交互流程必须简短快捷,界面必须简单易懂。
pple Watch必须配合用户的iPhone才可以运行你的应用。
界面风格Watch应用支持两种导航方式:•层级式。
这种方式与iOS的导航风格相吻合,最适用于拥有层级化信息结构的应用。
在层级式导航的应用当中,用户在每屏当中只能做出一个选择,直到他们到达目标位置。
要继续导航到其他地方,用户需要折返一部份或是全部的层级来做出不同的选择。
对于交互流程较为复杂的应用来说,层级式导航比扁平化的、基于页面的导航机制更加适用。
•页面式。
基于页面的界面形式允许用户通过横向轻扫的手势在不同的内容页之间进行导航。
这种模式最适用于那些数据模型简单、且不同页面之间不存在直接数据关联的应用。
界面底部的圆点指示符可以让用户了解目前所处的位置。
要尽可能将页面总数控制在很小的范围内,使导航保持简便快捷。
你不能将以上两种导航方式组合起来使用。
在设计阶段,必须从两者当中选择一种最适于你的应用内容的方式,并以此为基础进行设计。
无论使用哪种导航方式,你的应用都可以模态化的呈现内容。
模态化界面可以使用户不受干扰的完成任务或获取信息,但是相应的,他们将暂时无法与应用当中的其他部分进行互动。
更多相关信息请参考模态表单。
交互方式•基于行为的事件。
轻点(单击)是用户与应用进行互动的主要方式。
列表行、按钮、切换等控件都是通过轻点来进行操作的。
这些事件接下来会被传递到WatchKit扩展的代码当中。
•手势。
你不能在应用中添加任何定制化的手势。
系统已经代你制定了标准的手势行为:o通过纵向轻扫使当前界面滚动。
o通过横向轻扫在基于页面导航的界面之间前后查看。
o从屏幕左边缘向右轻扫,可以返回父级界面。
o轻点选项控件或其他交互元素。
轻点事件会由系统处理并传递到WatchKit扩展的相关行为方法当中。
Apple Watch不支持多指手势,例如捏合等。
•按压(Force Touch)。
如此小屏只能容纳为数不多的界面控件,因此苹果带来了一种全新的交互方式:按压。
正如可以感知到普通的轻点,Watch的Retina屏幕同样可以灵敏的感知到按压。
按压用来唤出与当前界面相关的情境化菜单(如果有)。
你可以在应用中使用这种菜单来展示与当前内容相关的各种操作选项。
更多相关信息请参考菜单。
•数码表冠(The Digital Crown)。
可以精准滚动的实体控件,使浏览长页面等任务变得更加轻松,而且屏幕不会被手指遮挡。
Glance是Apple Watch当中的一种快捷视图功能,它能将应用当中的重要信息提取出来,并以简明的形式呈现。
理想情况下,Glance具有适时性和情境关联性。
成组的Glance(s)汇总了用户最为关注的应用当中的重要信息。
Glance采用的是拉取机制,而非推送。
所以,与推送提示有所不同,是否通过Glance访问信息是由佩戴者自己决定的。
Glance具有以下几方面的特性:•基于模板。
Glance界面的上下两部分有各自独立的模板。
你可以在Xcode当中挑选合适的模板,并按照相应的规格设计你的内容。
•不可滚动。
所有信息都要集中呈现在一屏当中。
•只读。
轻点Glance界面当中的任何地方都会打开相应的应用。
•非强制。
不是所有的应用都需要Glance视图,用户可以自主选择在Glance(s)中显示哪些应用的信息。
Glance界面的底部区域是预留给点状页码指示符的。
根据用户当前所处情境来配置Glance的信息。
滞后的或是不相关的信息会使Glance失去价值。
通过时间和地点信息来传达相关性。
Glance可以与其对应的应用建立深度关联。
利用Handoff功能,Glance可以在用户轻点的时候,向与其对应的应用传递当前视图中显示的信息;应用启动之后,便可以根据这些信息来呈现不同的界面或是在已有界面当中进行相应的配置调整。
Glance必须向用户提供有用的信息。
不要只是为了给你的应用增加一个启动入口而提供Glance视图。
作为快速、轻量的互动功能,Apple Watch上的通知由两部分组成:Short Look与Long Look。
当有本地或远程通知需要呈现给用户时,Short Look会首先出现。
Short Look当中包含着最少量的必要信息 - 这也是出于隐私方面的考虑。
如果佩戴者放低手腕,Short Look便会消失。
如果佩戴者保持手腕姿势,或是在Short Look的界面上轻点,那么Long Look视图便会呈现。
它会提供更加详细的信息及更多的功能,而且只能由佩戴者主动关闭。
要注意向用户发送通知的频率。
用户有可能将频繁发送的通知视为干扰,并在Apple Watch上禁止你的应用发送通知。
一定要确保通知信息与用户期望具有相关性。
Short Look通知Short Look可以让用户了解到哪个应用接收到了通知消息,并且只会向用户呈现简要信息。
Short Look的界面是基于固定模板的,其中包含应用的名称和图标,以及通知的标题。
系统会将应用名称渲染成该应用自身的关键色。
保持通知标题的简短、易聚焦。
可供展示通知标题的空间很小,所以要尽量保持言简意赅。
标题无需展现通知信息当中的详情,只进行大致的示意即可。
可定制的Long Look通知Long Look会显示通知信息当中的更多详情。
系统为Long Look提供了一套默认外观,但是你的应用可以对其进行定制,例如展示定制化的图形元素或品牌信息。
所有应用的Long Look在结构上都是一致的。
系统提供了一套标准的头部框,其中包括应用图标及名称。
底部则是关闭按钮及若干应用自身定制的按钮。
头部和底部之间就是你的定制化内容所显示的区域。
模态表单有利也有弊。
模态表单可以临时性的阻断用户与应用其他部分的互动,使他们不受干扰的完成任务、获取信息,或是在由按压手势唤出的情境菜单中完成选项流程。
要使应用中的模态体验保持在最少的程度。
通常,只在这些情况下考虑使用模态表单:•获取用户的注意力在当前环节是至关重要的。
•某个独立的任务必须被完成,或是被显性的放弃,否则用户数据将处于模棱两可的状态。
模态界面通常由单一界面构成,或者也可以由一系列基于页面式导航的界面构成。
呈现方式上唯一的区别就在于底部是否有页码指示符。
模态界面的左上角用来放置关闭按钮。
当用户点击该按钮时(或从屏幕左边缘向右轻扫),系统会将模态界面关闭掉,不再有相关的后续操作。
关闭按钮的呈现是强制性的,不过你可以定制其标题。
你也不需要在内容当中另外添加关闭按钮了。
关闭按钮的典型标题有“关闭”和“取消”,字色始终保持白色。
如果任务当中需要“接受”操作,你还需要在模态界面当中添加接受按钮。
请使用标准的接受按钮。
点击该按钮后,模态界面同样会被关闭,然后后续行为得到执行。
保持模态任务的简练。
不要在初始的模态界面中再次显示一个新的模态界面。
应用内容可以被头部框所覆盖,也可以与其下边缘相接。
对于照片和其他图形类的内容,你可以让它们默认被头部框覆盖。
而对于以文字内容为主的通知信息,则要在Xcode当中选中“Offset Notification Content”,使内容从头部框下边缘以下开始显示。
对于定制化的Long Look界面,应用必须提供一套静态界面,在某些时候也可能需要提供动态界面。
相比于静态界面,动态界面具有更灵活的可配置性,但两者本质上都是使用你的图形与品牌元素来展示相同内容的通知信息。
如果动态界面对你来说不可行,那么静态方式可以作为替代。
Long Look通知当中最多可以显示4个自定义按钮。
Apple Watch可以利用iOS应用当中的交互式通知功能在Long Look中显示相关的操作按钮。
这些按钮会根据通知信息的类型而自动显示出来。
关闭按钮会始终呈现在Long Look通知的底部。
该按钮位于4个自定义按钮下方。
模态表单有利也有弊。
模态表单可以临时性的阻断用户与应用其他部分的互动,使他们不受干扰的完成任务、获取信息,或是在由按压手势唤出的情境菜单中完成选项流程。
要使应用中的模态体验保持在最少的程度。
通常,只在这些情况下考虑使用模态表单:•获取用户的注意力在当前环节是至关重要的。
•某个独立的任务必须被完成,或是被显性的放弃,否则用户数据将处于模棱两可的状态。
模态界面通常由单一界面构成,或者也可以由一系列基于页面式导航的界面构成。
呈现方式上唯一的区别就在于底部是否有页码指示符。
模态界面的左上角用来放置关闭按钮。