從iOS到Metro – 重新設(shè)計(jì)應(yīng)用的交互模式

0 評(píng)論 1967 瀏覽 1 收藏 26 分鐘

上周有幸玩了一會(huì)Metro的平板。單說(shuō)視覺(jué)風(fēng)格,仍是我的大菜,但真正用起來(lái)卻不覺(jué)得舒暢,尤其是橫向?yàn)g覽內(nèi)容列表的時(shí)候,視線不停的在X軸與Y軸之間切換,很快感到頭暈?zāi)垦?,這一切似乎比瀑布流更加兇殘。

當(dāng)然,僅僅是個(gè)人感受;我不想這樣就得出Metro中看不中用的結(jié)論。做這篇譯文大致可以代表我的立場(chǎng),即相比于iOS來(lái)說(shuō),Windows這套東西確實(shí)有很多獨(dú)到的精華在里面;我想通過(guò)這樣的文章加深認(rèn)識(shí),了解一些表象背后的東西。也希望本文可以給那些已經(jīng)熟悉iOS,但對(duì)Metro及Windows平板仍屬于初識(shí)的朋友們一個(gè)小小的起點(diǎn)。接下來(lái)讓我們進(jìn)入正文,一篇與來(lái)自微軟官方的案例文章。

iOS是個(gè)不錯(cuò)的平臺(tái),人們?cè)谄渲袆?chuàng)造了各類(lèi)觸控優(yōu)先、有趣且吸引人的應(yīng)用。不過(guò),隨著Windows 8的登場(chǎng),設(shè)計(jì)師和開(kāi)發(fā)者們又多了一個(gè)釋放創(chuàng)意能量的新舞臺(tái)。

在本篇案例當(dāng)中,我們將幫助各位使用Metro風(fēng)格的設(shè)計(jì)原則對(duì)原有的iOS應(yīng)用設(shè)計(jì)方案進(jìn)行重新構(gòu)思,大家會(huì)了解到怎樣將iPad當(dāng)中一些常見(jiàn)的界面元素及體驗(yàn)?zāi)J睫D(zhuǎn)換成為Metro風(fēng)格,以打造全新的Windows 8應(yīng)用。我們將對(duì)同一款應(yīng)用在兩個(gè)平臺(tái)中的不同設(shè)計(jì)方式進(jìn)行對(duì)比,幫助各位了解怎樣將你的應(yīng)用與Windows 8以及Metro設(shè)計(jì)原則進(jìn)行完美的融合。

 

我們將要研究的是一款相片日志應(yīng)用,用戶(hù)可以在線查看和管理他們的照片或視頻。下圖是這款應(yīng)用的Metro版本:

這款應(yīng)用最初是為iPad設(shè)計(jì)的,如下圖所示。

1016314G7-1

從設(shè)計(jì)及體驗(yàn)?zāi)J降慕嵌瘸霭l(fā),該應(yīng)用可以大致被解構(gòu)為六個(gè)方面:

  1. 布局和導(dǎo)航
  2. 命令與行為
  3. 契約(Contract):搜索、分享及其他
  4. 觸控與手勢(shì)
  5. 屏幕定向與視圖模式
  6. 消息通知

接下來(lái)我們將依次對(duì)這六個(gè)方面的要素進(jìn)行分析與對(duì)比。

布局與導(dǎo)航

聚焦于內(nèi)容

這款相片日志應(yīng)用要有能力對(duì)兩方面的內(nèi)容進(jìn)行良好的呈現(xiàn),即展示用戶(hù)的相片以及與這些相片相關(guān)的最新社交動(dòng)態(tài)。在創(chuàng)建Metro風(fēng)格應(yīng)用時(shí),我們的第一個(gè)目標(biāo)就是將原有iPad應(yīng)用當(dāng)中的那些與核心功能和內(nèi)容沒(méi)有直接關(guān)聯(lián)的界面元素統(tǒng)統(tǒng)移除,例如頂部的導(dǎo)航欄、底部的頁(yè)面指示符、標(biāo)簽欄等。不用擔(dān)心導(dǎo)航的問(wèn)題,我們?cè)诤笪闹袝?huì)談到如何讓用戶(hù)在需要的時(shí)候調(diào)出app bar。

10163122T-2

iPad版本:

  • A.導(dǎo)航欄
  • B.內(nèi)容
  • C.頁(yè)面指示符
  • D.標(biāo)簽欄

1016315139-3

Metro版本:

  • B.內(nèi)容與Logo

相片內(nèi)容的呈現(xiàn)方式

兩個(gè)版本都會(huì)按照月份次序來(lái)組織內(nèi)容,不過(guò)對(duì)于月份的表現(xiàn)方式有所差異。在iPad版本中,相片會(huì)根據(jù)上傳月份的不同而被劃分到12個(gè)區(qū)塊當(dāng)中。在Metro版本中,我們傾向于以更加直接的方式呈現(xiàn)出更多的相片及社交方面的信息,使用戶(hù)對(duì)內(nèi)容的上下文環(huán)境具有更強(qiáng)的認(rèn)知。

1016316232-4

iPad版本:每個(gè)月的相片都以堆棧的形式呈現(xiàn),用戶(hù)只能看到其中的一張圖片。

101631H28-5

Metro版本:針對(duì)當(dāng)月內(nèi)容,呈現(xiàn)更多的相片,包括標(biāo)題、評(píng)論數(shù)量等信息;用戶(hù)可以在首屏中瀏覽到更多的“高亮”內(nèi)容。

將樹(shù)形信息結(jié)構(gòu)扁平化

iPad版本中的信息結(jié)構(gòu)及對(duì)應(yīng)的導(dǎo)航機(jī)制是典型的樹(shù)形模式;在Metro版本中,我們要使其扁平化,減少導(dǎo)航操作,讓用戶(hù)最關(guān)注的內(nèi)容盡量多的呈現(xiàn)在首屏當(dāng)中。為了實(shí)現(xiàn)這一目標(biāo),我們將去除iPad中的標(biāo)簽欄,將一部份評(píng)論內(nèi)容直接輸出到首屏。

1016315111-61016312D9-80

iPad版本:

  • A.相片視圖
  • B.評(píng)論視圖

::__IHACKLOG_REMOTE_IMAGE_AUTODOWN_BLOCK__::2

Metro版本:

  • 將評(píng)論與相片內(nèi)容整合在同一個(gè)界面視圖中
  • hub風(fēng)格的設(shè)計(jì)方式,讓最具相關(guān)性的內(nèi)容自成體系
  • 要查看更多評(píng)論內(nèi)容,用戶(hù)可以點(diǎn)擊該內(nèi)容組的標(biāo)題,即“Recent comments”

讓導(dǎo)航操作更加符合“直接操縱”的理念

“直接操縱”的理念可以讓用戶(hù)以更加符合直覺(jué)的方式與內(nèi)容及導(dǎo)航系統(tǒng)進(jìn)行互動(dòng)。在Metro風(fēng)格的應(yīng)用中,我們要盡可能多的在恰當(dāng)?shù)牡胤截瀼剡@樣的交互設(shè)計(jì)思想。例如使用Windows提供的SemanticZoom對(duì)象作為導(dǎo)航控件,可以讓用戶(hù)的操作更符合心智,更有效率。

1016314P9-9

1016311234-10

iPad版本:點(diǎn)擊導(dǎo)航欄中的“Years”按鈕,彈出導(dǎo)航列表,選擇某個(gè)年份進(jìn)入相關(guān)視圖界面。

1016311012-11

101631G60-12

Metro版本:在相片內(nèi)容上使用雙指捏合的手勢(shì),即可查看全部?jī)?nèi)容所對(duì)應(yīng)的年份及月份。這種方式允許用戶(hù)在任何年份和月份的內(nèi)容中進(jìn)行快速跳轉(zhuǎn)。而且在這個(gè)視圖中,月份條目使用了不同的背景色,其中較淺的代表該月份當(dāng)中沒(méi)有內(nèi)容,使用戶(hù)無(wú)需進(jìn)入下層視圖即可了解這一信息。這套機(jī)制當(dāng)中不包含任何“實(shí)體”的導(dǎo)航元素,用戶(hù)可以通過(guò)與內(nèi)容的直接交互操作來(lái)進(jìn)行導(dǎo)航。

命令與行為

將與當(dāng)前界面相關(guān)的控制元素放到app bar當(dāng)中

當(dāng)我們重新設(shè)計(jì)那些與上下文相關(guān)的行為與控制元素時(shí),也應(yīng)該遵循“內(nèi)容優(yōu)先”的原則,只將那些與當(dāng)前界面內(nèi)容相關(guān)的控制元素放在app bar當(dāng)中。這種方式可以避免用戶(hù)界面被過(guò)多的功能圖標(biāo)復(fù)雜化,無(wú)論用戶(hù)當(dāng)前處于哪個(gè)視圖,他們都可以從界面底部或頂部調(diào)出app bar,執(zhí)行與當(dāng)前內(nèi)容相關(guān)的控制行為。所有Metro風(fēng)格的應(yīng)用都應(yīng)該支持這種交互機(jī)制,以便幫助用戶(hù)建立起一套普遍適用的行為預(yù)期,提升應(yīng)用及平臺(tái)整體的易用性及體驗(yàn)一致性。

另外,可以將那些最常用的命令放在靠近左右邊緣的地方,這樣最容易被手指觸摸到。

以“刪除相片”為例,我們來(lái)看看這個(gè)操作在兩個(gè)平臺(tái)當(dāng)中的區(qū)別:

1016315Q2-13

iPad版本:點(diǎn)擊導(dǎo)航欄右側(cè)的相關(guān)功能按鈕,進(jìn)入編輯模式,然后點(diǎn)選相片,作為刪除等操作的對(duì)象。

10163123E-14

Metro版本:

  • A.默認(rèn)情況下,app bar處于隱藏狀態(tài),使整個(gè)界面環(huán)境更加具有真實(shí)感,并使用戶(hù)的注意力保持在內(nèi)容上面。用戶(hù)可以通過(guò)輕掃(swipe)將app bar從界面底部或頂部調(diào)出。
  • B.調(diào)出app bar之后,用戶(hù)可以點(diǎn)選界面當(dāng)中的內(nèi)容對(duì)象,例如相片;此時(shí),與相片相關(guān)的命令就會(huì)出現(xiàn)在app bar當(dāng)中。也就是說(shuō),這里具體會(huì)出現(xiàn)哪些控制元素,取決于用戶(hù)是否選取了內(nèi)容對(duì)象,以及選取了哪種類(lèi)型的內(nèi)容對(duì)象。這類(lèi)具有上下文相關(guān)性的控制元素通常被放置在app bar的左側(cè),而具有全局性質(zhì)的命令則是在右側(cè)。

契約:搜索、分享及其他

通過(guò)搜索契約使搜索體驗(yàn)更加集約化

在Metro應(yīng)用中,我們使用搜索契約,而不是傳統(tǒng)意義上的那種永遠(yuǎn)會(huì)停留在界面某個(gè)位置上的搜索控件。用戶(hù)可以在任何支持搜索契約的應(yīng)用里持續(xù)的使用側(cè)邊charms bar當(dāng)中的搜索功能,而搜索結(jié)果也會(huì)以更加符合內(nèi)容自身特質(zhì)的方式自然的呈現(xiàn)出來(lái)。

首先,我們來(lái)看看在相片日志應(yīng)用內(nèi)部搜索相片的情況:

1016316347-15

iPad版本:

  • 只能通過(guò)首頁(yè)導(dǎo)航欄中的搜索控件執(zhí)行搜索
  • 用戶(hù)輸入關(guān)鍵詞時(shí),搜索建議會(huì)動(dòng)態(tài)輸出,用戶(hù)可以直接從中進(jìn)行選擇

Metro版本:

  • 用戶(hù)調(diào)出charms bar使用搜索,應(yīng)用列表中默認(rèn)選中的就是當(dāng)前的相片日志應(yīng)用。
  • 當(dāng)用戶(hù)開(kāi)始輸入搜索關(guān)鍵詞時(shí),托盤(pán)中會(huì)即時(shí)出現(xiàn)搜索建議。用戶(hù)提交了查詢(xún)關(guān)鍵詞后,可以看到完整的搜索結(jié)果視圖。

接下來(lái),我們看一看在相片日志應(yīng)用外部搜索該應(yīng)用內(nèi)相片的情況;這項(xiàng)功能不適用于iPad版本。這個(gè)例子演示了怎樣在其他應(yīng)用當(dāng)中通過(guò)搜索托盤(pán)里的應(yīng)用選擇來(lái)實(shí)現(xiàn)跨應(yīng)用搜索。該功能允許用戶(hù)在任何時(shí)間、任何應(yīng)用內(nèi)搜索任何想要的信息。

1016314106-16

如上圖所示,用戶(hù)當(dāng)前處于Tweet@Rama應(yīng)用的環(huán)境當(dāng)中,出于某種需求,該用戶(hù)希望搜索相片應(yīng)用當(dāng)中所有包含“Barcelona”關(guān)鍵詞的相片。輸入了關(guān)鍵詞之后,用戶(hù)在搜索托盤(pán)中選擇相片應(yīng)用,使其成為搜索結(jié)果提供者,這時(shí)相片應(yīng)用就會(huì)自動(dòng)加載,并顯示相關(guān)的搜索結(jié)果。這種方式使得用戶(hù)無(wú)需手動(dòng)在當(dāng)前運(yùn)行的應(yīng)用與搜索目標(biāo)應(yīng)用之間進(jìn)行切換。

通過(guò)分享契約與更多的人互通信息

對(duì)社會(huì)化媒體的整合是很多應(yīng)用當(dāng)中的關(guān)鍵要素。對(duì)于iPad應(yīng)用,設(shè)計(jì)師通常要對(duì)應(yīng)用所需支持的社交媒體頻道進(jìn)行選擇,例如Twitter或Facebook等,然后開(kāi)發(fā)人員會(huì)將這些服務(wù)一個(gè)個(gè)的整合到應(yīng)用當(dāng)中。當(dāng)其中某些服務(wù)的API接口發(fā)生變化的時(shí)候,開(kāi)發(fā)人員還必須調(diào)整應(yīng)用當(dāng)中的相關(guān)代碼,以確保其正常運(yùn)作。

而在Metro風(fēng)格的應(yīng)用當(dāng)中,我們會(huì)使用分享契約。這種技術(shù)方案簡(jiǎn)化了設(shè)計(jì)與開(kāi)發(fā)方面的工作,因?yàn)槲覀儾恍枰獮橛脩?hù)有可能用到的社會(huì)化服務(wù)而將它們與每個(gè)單獨(dú)的應(yīng)用都逐一整合起來(lái)。不僅是社會(huì)化服務(wù),用戶(hù)還可以將信息保存共享至平臺(tái)上所有那些使用了分享契約的應(yīng)用,而開(kāi)發(fā)者們則無(wú)需擔(dān)心外部服務(wù)的接口問(wèn)題。站在用戶(hù)的角度,他們可以在charms bar這個(gè)固定的地方完成有關(guān)分享的操作。

下面是一個(gè)將相片日志應(yīng)用中的圖片共享給其他應(yīng)用服務(wù)的例子:

1016314332-17

iPad版本:用戶(hù)需要點(diǎn)擊導(dǎo)航欄右側(cè)的相關(guān)動(dòng)作按鈕,并從展開(kāi)的列表中選擇“分享到Facebook”。如果要使應(yīng)用支持更多的分享服務(wù),開(kāi)發(fā)人員必須在該應(yīng)用當(dāng)中逐一增添。

1016315295-18

101631Hc-19

Metro版本:

  • 用戶(hù)始終可以在固定的地方找到分享方面的功能,無(wú)論他們正在使用哪款應(yīng)用
  • 當(dāng)前設(shè)備中所安裝的所有支持分享契約的應(yīng)用,都會(huì)出現(xiàn)在搜索托盤(pán)中的應(yīng)用列表里,如上面大圖當(dāng)中的Socialite、Tweet@Rama、Notespace、PaintPlay等。
  • 用戶(hù)可以分享多種類(lèi)型的內(nèi)容,例如鏈接、相片,或是將信息存放在某些記事本類(lèi)的應(yīng)用中。
  • 用戶(hù)最常用到的服務(wù)會(huì)出現(xiàn)在應(yīng)用列表的頂端,提升操作效率。

我們同樣可以將當(dāng)前的相片日志應(yīng)用通過(guò)分享協(xié)議注冊(cè)到分享托盤(pán)的應(yīng)用列表當(dāng)中,這樣就可以讓用戶(hù)將其他應(yīng)用當(dāng)中瀏覽到的圖片內(nèi)容共享到相片日志應(yīng)用當(dāng)中了。

101631IR-20

有關(guān)應(yīng)用間內(nèi)容共享的詳細(xì)信息,可以到Guidelines and checklist for sharing content當(dāng)中查詢(xún)。

使用文件選擇器從不同的地方獲取文件

在傳統(tǒng)桌面設(shè)備中,用戶(hù)可以通過(guò)文件選擇器(File picker)查看本地存儲(chǔ)設(shè)備當(dāng)中的文件或路徑。在移動(dòng)環(huán)境中,所有支持文件選擇器契約的Metro應(yīng)用同樣可以實(shí)現(xiàn)這樣的操作。

下面的例子演示了用戶(hù)怎樣在相片日志應(yīng)用中上傳一張本地存儲(chǔ)的相片:

10163145Q-21

iPad版本:用戶(hù)可以在本地的相冊(cè)或一些外部服務(wù)當(dāng)中選擇圖片。

101631NM-22

Metro版本:

  • A.用戶(hù)在app bar當(dāng)中點(diǎn)擊上傳按鈕,系統(tǒng)打開(kāi)文件選擇器界面。該界面及其打開(kāi)方式在任何上下文環(huán)境中都會(huì)保持一致。
  • B.點(diǎn)擊“Files”標(biāo)題,用戶(hù)就可以查看到所有支持文件存取的路徑。
  • C.用戶(hù)可以在一個(gè)路徑中選擇多張相片進(jìn)行上傳,界面底部的縮略圖列表會(huì)反映出當(dāng)前的選取狀態(tài)。

我們還可以進(jìn)一步利用Metro應(yīng)用獨(dú)特的功能特性,讓不同的應(yīng)用訪問(wèn)和使用彼此所包含的文件,例如在其他應(yīng)用中使用相片日志應(yīng)用里的圖片。通過(guò)這樣的功能,用戶(hù)無(wú)需首先在相片應(yīng)用中將圖片下載到本地,然后再上傳到另外的應(yīng)用中;系統(tǒng)會(huì)將所有支持文件選擇器契約的應(yīng)用都看作是一個(gè)可以在任何地方讀取的文件存儲(chǔ)位置。

101631D60-23

如上圖所示,用戶(hù)在PC Settings界面中點(diǎn)擊“瀏覽”,以更換頭像圖片。由于我們的相片日志應(yīng)用支持文件選擇器契約,所以在接下來(lái)的文件選擇界面中,就會(huì)看到應(yīng)用名稱(chēng)出現(xiàn)在列表當(dāng)中,用戶(hù)可以選擇該應(yīng)用當(dāng)中存儲(chǔ)的相片作為新的頭像。

觸控與手勢(shì)

在界面邊緣輕掃,調(diào)出應(yīng)用內(nèi)部或系統(tǒng)全局的相關(guān)工具欄

  • 針對(duì)當(dāng)前應(yīng)用上下文的命令與功能,通常被放置在界面底部的app bar當(dāng)中。
  • charms bar隱藏于于界面右端,其中包含了若干系統(tǒng)全局性質(zhì)的命令。
  • 界面左邊緣隱藏著最近使用過(guò)的應(yīng)用列表。
  • 從界面頂部向下輕掃,可以找到固定或關(guān)閉app的命令。

下面兩張圖片分別演示了調(diào)出app bar和charms bar的方法:

101631D96-2410163143S-25

文件多選

1016314943-26

iPad版本:

  • 用戶(hù)首先要進(jìn)入一種特定的編輯模式來(lái)執(zhí)行選擇及相關(guān)的編輯操作,因?yàn)椤包c(diǎn)擊”在通常情況下是用來(lái)加載或進(jìn)入某項(xiàng)條目的。
  • 當(dāng)選擇與編輯的操作結(jié)束后,要退出編輯模式。

Metro版本:

  • 用戶(hù)無(wú)需進(jìn)入特定的編輯模式;只要在內(nèi)容對(duì)象上向下短距離輕掃,就可以選中該對(duì)象,同時(shí)app bar會(huì)自動(dòng)出現(xiàn),顯示與選中對(duì)象相關(guān)的操作功能。
  • 這個(gè)手勢(shì)是可逆的。這套交互模式使Windows 8在對(duì)象選取方面的效率得到了有效的提升。

雙指張開(kāi)與捏合

無(wú)論在iOS還是Windows中,這兩個(gè)手勢(shì)在很多時(shí)候都被用作放大或縮小內(nèi)容對(duì)象的尺寸。不過(guò)對(duì)于Metro應(yīng)用來(lái)說(shuō),它們還可以通過(guò)Semantic Zoom來(lái)實(shí)現(xiàn)內(nèi)容層級(jí)間的導(dǎo)航。用戶(hù)可以捏合某個(gè)內(nèi)容對(duì)象,來(lái)進(jìn)入它所在的相關(guān)內(nèi)容組。不過(guò),當(dāng)用戶(hù)正在以全屏模式瀏覽單張相片的時(shí)候,捏合與張開(kāi)的手勢(shì)還是會(huì)被用來(lái)調(diào)整圖片的尺寸。

101631B12-27

屏幕定向與視圖模式

面向不同的屏幕定向方式及設(shè)備尺寸,提升布局的適應(yīng)性

在iPad應(yīng)用中,設(shè)計(jì)師通常需要考慮兩種屏幕定向方式以及對(duì)應(yīng)的界面設(shè)計(jì)方案。而Windows 8可以運(yùn)行在多種設(shè)備上,包括平板和臺(tái)式機(jī)。因此,我們要考慮到顯示空間更大的情況,讓用戶(hù)在大尺寸設(shè)備中能夠看到更多的內(nèi)容。網(wǎng)格布局可以使設(shè)計(jì)方案更好的適應(yīng)于不同的屏幕定向方式及不同類(lèi)型的顯示設(shè)備,例如針對(duì)縱向空間更大的設(shè)備來(lái)顯示更多的當(dāng)月特色圖片。

1016313541-28

iPad版本:在不同的定向模式下,內(nèi)容完全相同,只是輸出布局進(jìn)行了調(diào)整。

1016316353-29

Metro版本:豎屏模式及大尺寸設(shè)備可以利用更大的空間顯示更多的內(nèi)容,同時(shí),特色內(nèi)容附近的內(nèi)容輸出數(shù)量也會(huì)根據(jù)顯示設(shè)備尺寸的不同而進(jìn)行優(yōu)化調(diào)整。另外,我們也可以為內(nèi)容當(dāng)中的圖片制作多個(gè)版本,使它們根據(jù)不同的顯示環(huán)境響應(yīng)式的輸出更合適的圖片。

使用快照視圖吸引用戶(hù)

在Win8中,用戶(hù)可以將一款應(yīng)用以快照的方式整合在另一款應(yīng)用中,實(shí)現(xiàn)多任務(wù)操作??煺找晥D可以有效提升應(yīng)用的使用時(shí)間,吸引用戶(hù)維持更長(zhǎng)久的使用周期。通過(guò)調(diào)整兩者之間的分隔欄,用戶(hù)可以很容易的在當(dāng)前主應(yīng)用及快照應(yīng)用之間進(jìn)行切換。所以設(shè)計(jì)師需要考慮主應(yīng)用與快照應(yīng)用在容器尺寸發(fā)生變化時(shí),依然能各自保持上下文內(nèi)容的可讀性。

1016312I5-30

  • 相片日志應(yīng)用在快照視圖中輸出的內(nèi)容與完整模式當(dāng)中的相同,但視圖的布局樣式進(jìn)行了調(diào)整。
  • 在快照視圖中,用戶(hù)可以通過(guò)上下滑動(dòng)來(lái)瀏覽更多的內(nèi)容。相比與在完整模式當(dāng)中的左右滑動(dòng)瀏覽方式,在這樣狹小的空間中,上下滑動(dòng)更加合理、易操作。

消息通知

使用瓦片呈現(xiàn)動(dòng)態(tài)信息更新

iOS 5引入了通知中心,使得所有的通知信息都可以迅速即時(shí)的在界面頂部呈現(xiàn)出來(lái),用戶(hù)可以將提示消息展開(kāi)為完整的通知中心面板,查看所有的消息。另外,在iOS當(dāng)中,應(yīng)用圖片側(cè)上方的數(shù)字標(biāo)識(shí)也可以讓用戶(hù)了解到該應(yīng)用當(dāng)中的內(nèi)容更新數(shù)量。

101631NS-31

而Windows 8中的瓦片則整合了通知中心與數(shù)字標(biāo)識(shí)這兩個(gè)方面的提示功能,用戶(hù)即可以直接在瓦片中閱讀提示信息,也可以點(diǎn)擊進(jìn)入應(yīng)用。另外,與iOS通知中心統(tǒng)一化的輸出格式有所不同,Metro風(fēng)格的應(yīng)用瓦片允許設(shè)計(jì)師從大量模板當(dāng)中選擇不同的樣式。

10163122E-32

你也可以使用toast notifications向用戶(hù)進(jìn)行提示。這類(lèi)即時(shí)信息會(huì)在屏幕右上方出現(xiàn),并且會(huì)對(duì)用戶(hù)在當(dāng)前應(yīng)用中的任務(wù)起到干擾和中斷的作用。通常,在某個(gè)應(yīng)用第一次運(yùn)行的時(shí)候,我們可以讓用戶(hù)選擇是否接受這種提示方式。toast類(lèi)似于iOS當(dāng)中出現(xiàn)在屏幕頂部的通知,不過(guò)在Windows 8中,設(shè)計(jì)師可以從一組toast模板中進(jìn)行選擇,使它的呈現(xiàn)方式與當(dāng)前應(yīng)用具有更強(qiáng)的相關(guān)性。

下圖所示的是相片日志應(yīng)用推送過(guò)來(lái)的最新評(píng)論提示:

10163130Z-33

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 目前還沒(méi)評(píng)論,等你發(fā)揮!