娛樂應用程式

我們在這裡討論的設計概念可協助您建立健全與受歡迎的媒體應用程式。

概觀

Windows 8.1 可以連接各種不同的裝置,從以觸控為主的平板電腦到高解析度的膝上型和桌上型電腦。Windows 8.1 中的許多新功能是專為媒體和 娛樂體驗量身打造的,內容發行者可以透過新方法拉近 與使用者的距離。

Windows 市集也為內容發行者提供發佈、推銷和販售他們內容的絕佳商機。Windows 市集中的商業條款允許您使用 Microsoft 提供的商務引擎。但是,您也可以選擇使用自己的商務引擎自行經營您的業務,以最靈活的方式獲取最大的收益。

本文件說明 Windows 8.1 中對媒體和娛樂發行者格外重要的功能,包含:

  • Windows 市集應用程式—應用程式設計語言,您的內容是最重要的部分。
  • 動態磚與快顯通知—即使您的應用程式並未執行,也能以即時的相關通知宣傳您的內容,讓使用者不斷使用您的應用程式。
  • 搜尋協定與分享協定—尋找和分享媒體內容是現在最高階的作業系統功能,不僅可以建立更一致的使用者經驗,還能讓使用者更輕鬆地尋找和分享您應用程式中的內容。
  • 裝置協定—使用者可以將電腦中的內容傳送到網路裝置,例如電視與音訊/視訊接收器,實現群組檢視和交流。

媒體應用程式中的配置與瀏覽

娛樂應用程式針對不同的媒體類型通常會有許多不同的類別。例如,影片應用程式可能讓您依照內容類型、特定的導演或演員、您之前的影片偏好設定或是精選內容來瀏覽影片。同樣地,若是音樂應用程式,使用者可以依照演出者、專輯、內容類型及精選內容來瀏覽內容。至於媒體應用程式的最佳使用者經驗,最重要的莫過於有意義的內容編排方式,以方便使用者快速有效地找到他們想要的內容。在 Windows 市集應用程式使用階層和其他瀏覽模式,將使您的應用程式在使用上更加快速、流暢和簡單,使用者就能迅速找到他們需要的內容。

為協助您的應用程式選擇最佳的瀏覽模式,請參閱瀏覽模式

如需了解此功能的運作情形,請參閱應用程式功能,從開始到完成系列中的單層瀏覽模式

階層式模型

娛樂及媒體應用程式通常有大量的題材和影像供使用者探索與觀賞。使用 Windows 8.1 中建議的瀏覽與互動模式,可以將內容表面化,讓這些題材和影像成為體驗的焦點。 依照資訊的一般性到特殊性的提供方式,可以讓使用者快速尋找他們想要的內容。

應用程式的中樞頁面

若要在您的應用程式中提供豐富與多樣化的體驗,請使用 Windows 市集應用程式的階層式模型。您應用程式的登陸頁面 (也稱為 hub),可以在同一個表面顯示精選內容、依照使用者之前的興趣建議的內容、目前播放的內容、儲存的佇列、內容類型以及類別,因此可讓您輕鬆地移動瀏覽。您可以反白每個類別群組,點選標頭即可顯示更多內容,如下列影像所示。

顯示範例中樞頁面的影像

在應用程式的中樞頁面顯示您的內容類別,並在每個類別中展示相關的媒體內容,讓使用者注意到這些類別。 為了讓使用者知道類別中還有更多內容,可以在標頭加上>形箭號字符 (>)。

顯示群組中還有其他內容的影像

書籤、我的最愛及播放清單

使用者通常會儲存播放清單,或是將媒體新增到佇列以方便之後存取。如果您的應用程式支援輕鬆的存取方式,希望在存取我的最愛媒體時獲得順暢經驗的使用者就會重複使用您的應用程式。

在您的登陸頁面新增一個稱為「書籤、我的最愛或您的播放清單」的區段,這個區段是所有使用者儲存之媒體內容的集合。讓使用者選取這些已加入書籤的項目,並以下列方式管理:將它們移至佇列頂端、從佇列中移除,或在佇列中排序。 下列範例顯示在「儲存供之後使用」佇列中收集的內容。

示範使用者儲存的一組內容

語意式縮放

在登陸頁面與類別頁面中,使用者可以使用語意式縮放輕鬆查看整個表面,並快速存取他們感興趣的項目。

觸控互動設計頁面含有您的應用程式如何支援移動瀏覽的詳細資訊。下一個影像顯示語意式縮放的群組檢視。

顯示內容類別的範例

使用語意式縮放時,可以讓使用者選取和移動群組,以重新排列首頁上的類別放置方式。使用者現在可以個人化應用程式登陸頁面,這會是他們使用您的應用程式的另一個理由。

使用者也可以使用頂端應用程式列進行瀏覽,如下圖所示。

顯示正在移動之類別的範例

您也可以在特定的類別頁面中使用語意式縮放,以瀏覽該類別中的不同影片或歌曲。使用者將使用語意式縮放在不同的歌曲和視訊之間快速切換。

點選中樞檢視中的項目

案例 1:立即播放

當使用者點選登陸頁面或區段頁面上的媒體項目時,就會開始播放媒體項目。因為這是使用者預期的動作,因此最好將此設為點選的預設回應。下列影像顯示立即播放的互動。

顯示立即播放的互動

同樣地,使用者將需要與正在播放的媒體相關的更多資訊,因此,請在應用程式列中提供一個按鈕,供使用者退出全螢幕檢視並切換到詳細項目檢視。下一個影像顯示這個動作的模擬。

切換到內容的詳細檢視的互動

即使不再是全螢幕檢視,媒體仍會繼續播放。 即使媒體不是處於全螢幕模式,仍繼續顯示媒體控制項。因此,無論應用程式是否縮小,使用者在開啟媒體控制項時都會獲得相同的體驗。

點選全螢幕的切換按鈕,或點選 UI 中的視訊或音訊,都應該繼續全螢幕播放模式。

或者,如果應用程式未提供媒體的詳細資訊體驗,則應用程式列按鈕可以在開啟或關閉其他資訊之間切換,取代從應用程式列切換到詳細檢視。您可以在下列影像中看到這項操作。

在播放期間顯示其他資訊的互動

案例 2:詳細項目檢視

在某些情況下,點選後將使用者引導至詳細項目頁面,可能比立即播放媒體更有意義。例如,如果某個電視節目分成許多集,請在媒體開始前提供使用者選項清單。此外,如果媒體是付費節目,使用者必須先付費媒體才會開始播放,因此您會希望先顯示付款資訊。

下一個影像顯示在某個電視節目的宣傳頁面上,從彙總的內容中選擇特定媒體的程序。使用者點選某一集的影像,就可以讀取該集的相關資訊和評論,再點選一次則會顯示播放該劇集的選項。

瀏覽精選內容的互動

若要返回該劇集的詳細資訊頁面,請點選頂端應用程式列中的 [上一步] 按鈕,或點選 [完整檢視]**** 按鈕以切換至其他檢視。

購買體驗範例

現正播放體驗

當媒體實際上正在播放時,您的應用程式可以提供展示使用者內容的體驗,以和其他媒體做區分。將您的媒體播放體驗設計成完全沈浸式,不包含任何控制項。當使用者需要媒體控制項時,透過點選就會顯示在媒體上。 下列影像顯示完全沈浸式的視訊播放體驗。

不含應用程式控制項的沈浸式視訊體驗

若是具有播放清單概念的音樂及影片應用程式,現正播放體驗可以讓使用者輕鬆地管理和瀏覽播放清單。考慮在畫布或頂端應用程式列上放置一個播放清單按鈕,顯示內含播放清單的可捲動飛出視窗控制項。使用者可以選取項目,然後以下列方式管理:選擇向上或向下移動項目,或是從清單中移除所有項目。下一個影像顯示 [現正播放] 清單。

從播放清單飛出視窗選取音樂

或是,如果您想在 [現正播放] 畫面中一律顯示播放清單,可以使用清單檢視樣式與垂直捲動,讓使用者輕鬆地瀏覽播放清單。 確認頁面其他部分的寬度是固定的,避免頁面往兩個方向平移,造成使用者混淆。在播放清單旁的固定寬度區域中顯示其他資訊。

您也可以讓使用者交叉滑動以選取項目和管理播放清單,如下所示。

管理播放清單項目的範例

在上一集與下一集或上一個與下一個視訊短片之間瀏覽

通常使用者會連續觀賞多部相關的短片或劇集。 透過提供 [上一個] 與 [下一個]**** 按鈕,可以讓使用者快速瀏覽到下一個短片或下一集。下列影像顯示播放體驗中的 [上一個] 和 [下一個]**** 按鈕。

播放體驗中的下一個和上一個控制項

若是上一個與下一個互動更常見的音樂應用程式,這些命令最好放在畫布上,如下一節的<命令>中所述。

命令

媒體控制項

若是擁有音樂及視訊播放功能的媒體應用程式,將播放控制項放在一致的位置,可以協助使用者自信且流暢地與媒體互動。若要深入了解命令,請閱讀 Windows 市集應用程式的命令設計

因為 [播放/暫停] 按鈕與傳輸滑桿通常是媒體播放的重要控制項,因此可以放在畫布上,並在使用者點選或撥動螢幕時顯示。[播放/暫停]**** 應該是反映點選時發生之動作的切換按鈕。 例如,當音樂正在播放時,按鈕應該顯示 [暫停],當音樂暫停時則顯示 [播放]。下列影像顯示媒體應用程式中的控制項。

媒體控制項的範例

如果您的應用程式使用傳輸滑桿,[倒轉] 與 [快轉]**** 按鈕就是重複的功能,因為使用者可以使用滑桿來倒轉或快轉影片或歌曲。為了避免重複,請勿同時使用傳輸控制項與倒轉/快轉控制項。

其他媒體控制項 (如 [上一個] 與 [下一個]**** (歌曲或影集)) 實際上則取決於您的應用程式案例。例如,如果正在播放電影,[上一個] 與 [下一個]**** 並無太大意義,但對於音樂播放清單或連續的電視節目系列來說就很實用。如果在您的應用程式中使用 [上一個] 與 [下一個]**** 控制項,請將它們與 [播放/暫停] 和傳輸滑桿放在一起,當使用者點選或撥動時,就可以同時看到所有可用的控制項。

請不要在指定的內容中顯示無意義的控制項。例如,啟動新的音樂播放清單時,[上一個]**** 按鈕要在音樂開始播放後才會生效 (因為使用者在播放清單的最前面,因此沒有「上一個」曲目)。

媒體控制項會在使用者點選或撥動時顯示。應用程式列則是在邊緣撥動時顯示。 每當使用者撥動螢幕以顯示應用程式列時,請一併顯示畫布上的媒體傳輸控制項,使用者才能在需要時使用應用程式列命令與媒體互動。

除了 UI 媒體控制項以外,您還可以為使用者提供更多的媒體播放體驗控制項,也就是讓他們以媒體鍵盤按鈕或媒體遠端按鈕來控制您的應用程式,例如:

  • 播放
  • 暫停
  • 向前快轉

音量控制滑桿與靜音按鈕可透過硬體按鈕提供,因此不應在您的應用程式中重複。

其他次要的媒體播放命令則可留在應用程式列中,例如切換全螢幕模式、關閉標題以及中繼資料。 如需使用應用程式列的詳細資訊,請閱讀應用程式列的指導方針和檢查清單

為了管理播放清單,也請考慮在應用程式列中放置下列按鈕:「從播放清單移除」、「儲存佇列」、「在佇列中上移」以及「在佇列中下移」。

窄格式視窗大小

使用者將應用程式大小調整為窄格式寬度時,媒體控制項的互動應維持相同:

  • 點選媒體畫布,顯示媒體播放控制項。 [播放/暫停] 在窄格式寬度中必須要保留。
  • 其他像是傳輸滑桿以及 [上一個]**** 和 [下一個] 之類的控制項,在窄格式寬度中則可以捨棄。

下列影像顯示窄格式媒體應用程式中的 [播放/暫停]**** 按鈕。

調整為窄格式寬度大小的媒體應用程式範例

背景與前景播放

如果您的媒體應用程式正在播放音樂,而使用者切換到另一個應用程式,您的應用程式可以在背景繼續播放音樂。 支援在背景播放的媒體案例範例有音樂、串流廣播電台、播客及音樂影片。 在播放視覺化媒體 (如電視節目和影片) 時,若使用者切換到另一個應用程式,您的應用程式應該自動暫停。這樣當使用者切換回您的應用程式時,就可以接續上次播放的位置,不會錯過任何內容。

若要深入了解背景媒體播放,請閱讀 MediaControl.Soundlevel | soundLevel propertyWindows 市集應用程式中的音訊播放白皮書。

系統傳輸控制項

對於在背景播放媒體的應用程式,系統傳輸控制項能讓使用者不需切換回到您的應用程式,就能查看正在播放的內容和控制播放。在不透過您的應用程式的情況下,使用者只要按下他們裝置上的硬體音量按鈕,即可快速而流暢地存取媒體控制項與中繼資料。提供曲目與演出者名稱的資訊,可以讓使用者知道正在播放的內容。如果您的應用程式正在載入內容或正在下載,您可以提供狀態,讓使用者知道他們的媒體播放狀態。 下一個影像顯示系統傳輸控制項。

系統傳輸控制項範例

回到媒體撥放體驗

如果使用者正在使用您的應用程式、正在瀏覽以加入更多歌曲到播放清單,或正在購買新音樂,必須要有一致的瀏覽位置提供給「現正播放」的音樂/視訊。這樣可讓使用者快速回到「現正播放」體驗。

下一個影像顯示當使用者正在執行其他媒體相關工作時,要存取瀏覽列有多麼簡單。使用者隨時可以快速瀏覽到應用程式的「現正播放」區段。

目前播放的內容會顯示在 UI 中,只要選取即可回到現正播放內容

評分與評論

評分與評論媒體內容是多數媒體應用程式的重要案例。考慮在您的應用程式顯示評論的區段上方設置星號,讓使用者可以快速評論媒體內容。為了讓使用者寫下評論,您可以在上方顯示一個文字方塊,以留下顯示觸控式鍵盤的空間。按 Enter 送出評論。如有需要,文字方塊可以大一些,以容納較長的評論。

使用者可以點選標頭以查看更多評論,如下所示。

評分內容的互動

媒體應用程式中的印刷格式

依循字體大小指導方針打造內容結構與律動感。若要使您的媒體應用程式的印刷格式與 Windows 8 一致,請使用 11pt Segoe Semilight 做為內容的主要大小,標題和副標題使用 Segoe UI Light 20pt。如果需要較小的大小,簡短標題與參與名單則使用 Segoe UI Regular 9pt。不要指定小於 9pt 的字體。

頭條及標題慎用 42pt Segoe UI Light。避免將「音樂」或「影片」之類的標題設為 42pt。 影片、專輯或音樂曲目的名稱才使用最大的字體大小。使用最大的字體大小時,必須採用字型間距調整與印刷格式正確的標點符號。 請使用斜雙引號 (True Quote)、縮寫符號及破折號來代替直線引號與連字號。下列範例顯示標點符號的正確及錯誤用法。

文字格式的範例

雖然 Windows 8 需要使用大小寫句子,但您可以決定您的內容較適合全大寫、全小寫或標題大寫。請注意,這些印刷樣式處理方法可能不適用於許多當地語系化語言。也請務必使用一致的大小寫樣式並區分不同的內容片段,而不僅僅是將視覺趣味性加到應用程式的印刷格式。

如果您決定不採用這項指導原則,請試著不要使用 4 種以上的不同字體大小和粗細。使用色彩與字型粗細,有助於區分以相同字體大小顯示的內容。

字型的指導方針含有字型的最佳做法 (如大小、色彩及粗細) 的詳細資訊。

協定

分享

分享協定可讓使用者以熟悉且自然的方式分享兩個應用程式之間的內容。將內容分享至媒體應用程式或從媒體應用程式分享內容的案例有很多種,而這可以區分您的應用程式與其他應用程式的不同。如果您要讓使用者從應用程式分享內容,應用程式應為分享來源。如果您要讓使用者從其他應用程式取用資料,應用程式應為分享目標。依據應用程式的特定需求,您也可以同時支援兩者。

從娛樂應用程式分享

分享媒體內容是娛樂應用程式的重要案例。使用分享協定,可以讓使用者將他們覺得有趣的影片或正在聽的歌曲,分享到支援該格式的任何應用程式。這實現了許多實用的案例,像是在社交網路上分享有趣的影片,或以電子郵件傳送推薦影片或歌曲給朋友。也能以有趣的方式透過 Windows 的其他應用程式 (例如相機篩選應用程式、自動調整應用程式等) 從媒體應用程式轉換音樂、相片或影片。

分享視訊內容

分享至娛樂應用程式

如果您的應用程式支援將儲存的相片、音樂或影片分享給朋友、家人或大眾,此應用程式應該登錄為共用目標合約。這讓使用者可輕易地利用您的應用程式來組織其他應用程式的媒體,觸及更廣泛的觀眾。

如果您的媒體應用程式能以有趣的方式從其他應用程式轉換內容 (不論此應用程式是否將特殊篩選套用至相片、自動調整音樂錄製、合成全景相片等),應該登錄為共用目標合約。這讓使用者可輕易地利用您的應用程式來解除鎖定具有其他應用程式內容的應用程式的值。

搜尋

針對通常會顯示多個類別搜尋結果的媒體應用程式而言,搜尋是一個重要的案例。搜尋常用鍵為使用者的所有搜尋需求 (包括網頁) 提供一個集中式的體驗,同時應用程式內搜尋方塊協助您為使用者提供一個完全自訂的搜尋體驗。

若要深入了解搜尋,請參閱搜尋的指導方針。 下一個影像顯示一般的搜尋體驗。

搜尋體驗範例

如果您的應用程式含有更進階的搜尋案例 (包含篩選與搜尋範圍),請在適當時在應用程式畫布上提供這些案例。

此外,使用查詢建議可以協助自動完成使用者的搜尋查詢以加快查詢速度,而不需要輸入整個字串。

設定

媒體應用程式所有適用的設定 (如使用者帳戶資訊、訂閱資訊、隱私權設定及通知設定),應存在設定常用鍵中。設定常用鍵提供讓使用者調整設定的單一位置,並防止您的應用程式 UI 因為不同的設定而變得雜亂。 下列影像顯示媒體應用程式中的設定。

設定 UI 範例

裝置

裝置協定為您的媒體應用程式提供連接的最佳選項。您的使用者可能想在電視上觀賞影片或視訊,以及在音訊裝置上播放音樂。與裝置協定整合可以讓您的使用者透過點選就能完成操作。 下列影像顯示正在播放到裝置的內容。

裝置體驗範例

聯繫和即時性

磚和通知

媒體應用程式中的動態磚有許多精彩案例。影片應用程式的磚顯示推薦給使用者的最新影片、新發行的 DVD、爆紅的熱門影片—這些全都有助於和使用者再次互動。 同樣地,音樂應用程式的磚會顯示使用者最喜愛的演出者發行的新專輯、現正播放的音樂,或是依據使用者興趣而推薦的演出者,當使用者偶然發現有新的內容時,就會再次注意到您的應用程式。 下列影像顯示呈現資訊的動態磚。

媒體應用程式的磚範例

讓使用者將不同的影片內容類型、電視頻道、演出者和播放清單釘選到 [開始],可以讓使用者查看最感興趣的內容自訂通知,並可快速存取他們最關心的內容。這是讓使用者再次回到您的應用程式的另一個方法。 下列影像顯示已釘選的媒體應用程式磚。

已釘選的媒體和娛樂應用程式磚範例

如果您讓使用者選擇加入,即使應用程式未執行也可以透過快顯通知查看新聞快報,讓熱衷的使用者隨時獲知最新消息,也會讓他們再次使用您的應用程式。不過,某些使用者可能不想受到快顯通知的干擾,因此,請確保快顯通知必須透過設定常用鍵中的應用程式設定來啟用。

漫遊

「漫遊」**是裝置之間設定與喜好設定的移動。 多數使用者 都擁有一部以上的 Windows 電腦。建立可在使用者所有的 Windows 8 電腦之間提供一致體驗的應用程式,可以滿足使用者的期待。可能的話,最好可以漫遊應用程式設定、 已儲存的媒體內容、我的最愛、「上次觀賞的」歷程記錄以及 使用者檢視特定媒體的停止處。您可以在應用程式設定的指導方針應用程式資料漫遊的指導方針,和管理應用程式資料中找到關於漫遊的其他指導方針。

方向與視窗大小

直向與橫向

設計 Windows 8.1 的媒體應用程式時,請考量裝置大小、螢幕解析度與方向。Windows 8.1 簡化了直向配置與高解析度螢幕的比例調整設計,因為針對較大的裝置在您的應用程式中包含更多內容。在橫向檢視和直向檢視展現您的應用程式。對於您應用程式中的某些檢視 (如觀賞影片),可能需要橫向鎖定檢視。

視窗大小調整

Windows 8.1 讓使用者在螢幕上並列放置多個應用程式以便進行多工處理。 設計應用程式在窄格式寬度中能夠順暢運作,是增加應用程式在螢幕上停留時間以及更長時間吸引使用者的絕佳方式。它可讓使用者在使用您的應用程式時可以進行多項操作,這樣的話,即使他們在執行其他工作,也能延長您的應用程式在螢幕上的時間。

使用者想要與媒體應用程式進行多工處理有幾種實用案例。使用者可能希望在瀏覽網站時,可以觀賞現場直播的體育賽事,或是在閱讀新聞時,可以聆聽 Spotify 播放清單。針對所有大小的視窗量身打造核心播放體驗以支援這些常見案例。

下列影像顯示大小調整為窄格式寬度的娛樂應用程式範例。請注意,每個頁面都有自訂且實用的檢視,當重新調整應用程式的大小時,允許使用者保留內容。

窄格式媒體與娛樂應用程式的範例

因為使用者可以將視窗大小調整為任何寬度 (甚至調到最小寬度),所以外觀比例會有很大的差異。請依據外觀比例顯示視訊及其他媒體內容。如果視窗外觀比例不符合媒體內容,請以上下黑邊顯示媒體內容,這樣內容就不會延展。

啟動顯示畫面

媒體應用程式通常需從網路下載更新內容。為了讓您的應用程式可以快速回應,請不要等到每個類別的所有影像都下載後才顯示登陸頁面。這樣會令使用者失去耐性。請在內容標題下載後就顯示應用程式登陸頁面,然後以非同步方式載入影像與其他資料。 下列影像顯示啟動顯示畫面範例。

啟動顯示畫面範例

音樂和視訊最佳做法

音樂應用程式

建議

將您的應用程式登錄為背景媒體

如果您的應用程式可以播放音樂播放清單,即使在使用者切換到其他項目之後,您還是可以讓應用程式繼續在背景播放。如需詳細資訊,請參閱如何在背景播放音訊

回應所有硬體媒體按鈕

登錄並回應播放、暫停、播放暫停、下一個曲目、上一個曲目及其他媒體按鈕的事件,如此一來,使用者便能從遠端控制器或媒體鍵盤按鈕控制您的應用程式。如需詳細資訊,請參閱如何設定媒體控制項的按鍵

在系統傳輸控制項中提供「現正播放」資訊

能夠在背景播放的應用程式應該要在系統傳輸控制項中,提供曲目名稱、演出者名稱及專輯封面,讓使用者即使不在應用程式中,也能夠獲得目前正在播放之曲目的詳細資訊。如果您的應用程式會在使用者變更曲目時發生延遲,可以在曲目名稱欄位填入「正在載入下一首曲目」,讓應用程式不會感覺沒有回應。如需詳細資訊,請參閱系統傳輸控制項開發人員指南

 

視訊應用程式

建議

選擇正確的應用程式資料流類型

在大部分情況下,將應用程式登錄為僅在前景運作的媒體

如果使用者在開始播放您的視訊之前正在播放背景音樂,則您的資料流會自動暫停任何背景音樂,如此一來,使用者便能聽到您的視訊隨附的音效。當使用者切換離開應用程式時,自動暫停該視訊,讓使用者稍後可以再從他們離開的地方繼續播放,而不會遺漏任何視訊。如需詳細資訊,請參閱 Windows 市集應用程式中的音訊播放

如果使用者播放音樂影片或建立視訊播放清單,將您的應用程式登錄為背景媒體

當使用者將您的應用程式當作音樂播放程式或將視訊排入佇列時,即使他們切換離開這個應用程式,還是預期能夠聽見持續播放的音樂。如需詳細資訊,請參閱如何在背景播放音訊

回應所有硬體媒體按鈕

登錄並回應播放、暫停、播放暫停、下一個曲目、上一個曲目及其他媒體按鈕的事件,如此一來,使用者便能從遠端控制器或媒體鍵盤按鈕控制您的應用程式。如需詳細資訊,請參閱如何設定媒體控制項的按鍵

 

認識 Windows 市集應用程式

Windows 市集應用程式的 UX 指導方針

媒體播放,從開始到完成 (HTML)

媒體播放,從開始到完成 (XAML)