|
|
|
本汪曾負責過微軟的某些視頻。
Modern UI 的大部分特性是適合用來做 PPT 的。
好的 PPT 應該是基于演講者定制的。不要輕易相信有了好的模板你的演示就一定會比別人的好——好的模板套成渣的也不在少數，好的 PPT 配上水平不夠的演講也很常見。演講的目的在于讓聽眾明白你的想法，PPT 只是一個輔助工具，是聽眾在“明白你的想法”這一環節的催化劑。演講才是重點。
關注此問題的應該大多是會自己動手做的，每次從空白 PPT 開始構想創作是一件很好的事。
貼上微軟官方的設計理念：微軟 /design design.microsoft.com
不建議把 Modern UI 簡單粗暴地理解為“色塊”堆砌而成的界面——那界面上的“擬物”還是所謂“扁平”又有何本質區別?也不能把 Modern UI 叫做“扁平化”，微軟官方可是從來沒有用過“扁平化”這樣的措辭。(早期叫 Metro UI ，涉及商標原因改為 Modern UI 或 Windows 8 Style UI。Metro UI 的早期，那些個磁貼是長條狀的，比現在看到的長許多。)
不認同 Modern UI 的，每個人有各自喜好。但我們無法否認要獨立于 iOS、Android 樣式之外設計出一套極具辨識性與差異化的 UI 不是一件容易事的事實。許多手機產商用盡各種方式，卻似乎始終無法跳出那個框框。
一、字體
英文：Segoe UI
中文：Microsoft YaHei UI 、Microsoft YaHei 、微軟雅黑
Segoe 是 Modern UI 規定使用字體。微軟還開發或授權一組字體，中文的 Microsoft YaHei UI 就屬于其中一種，用于簡體中文的顯示，現有 Light / Regular / Blod 三種版本。附上官方鏈接 Windows 下的字體 。
在控制面板中提取字體，或從 Microsoft 官方獲取：Font Families
Windows Phone 上的中文使用 Dengxian 字體，英文使用 Segoe WP 字體(Light / Semilight / Semibold)。它們或將在 Windows 10 for Phones 中與 Windows 10 統一(目前 Windows 10 的設計準則還沒有一個完整成型的資料對外公開或樣式呈現)。
對英文原版系統來說，在沒有安裝中文語言包的情況下，不會有“微軟雅黑”這個字體，但是有 Microsoft YaHei UI。也就是說，即使“微軟雅黑”不可用，Microsoft YaHei UI 都是處于可用的狀態。UI 是代表系統界面顯示的字體。
默認字體經幾次系統升級發生了改進：
Windows 8 的默認字體：
SS01 樣式(Windows 7 的默認樣式。這里謝謝 @prox 的關注和提醒，為引起注意，相關信息附在文末)：
SS20 樣式(首選的設計和間距)：
第一眼你們可能覺得除了字母符號 Q I & 有變化之外只是數字 1 有了變化。很遺憾地告訴你，好幾個數字都發生了變化：
Windows 7 中的默認字體：
Windows 8 中的 Segoe UI：
注意事項：
如果頁面標題或副標題太長而無法顯示，請使用省略號 (U+2026)，而不要使用 3 個點。不要在標題文本末尾和省略號之間添加空格。
不要使用傾斜字體。
應遵循布局。(這點在之后會說明，簡而言之：勿亂擺)
二、字面內容(語言風格)
?、?字詞：
若要體現“簡單”和“輕松”，請使用簡單的句子和短語、最短的文本和日常字詞。
精心挑選的精確字詞可清晰地表達意義。
通常，少即是多。
以客戶(對應 PPT 的觀眾)的語氣說話。你要假設你只懂一點或完全不懂你所面對的產品，并以這樣的眼光審視你的作品。下面是一些調整前和調整后的示例：
請說“獲取 Windows 8.1”，而不是“查看產品”。
請說“你需要一個 ID，如下所示：customer@microsoft.com ”，而不是“ID 無效”。
請說“選擇你的主題”，而不是“配置你的顯示效果”。
同樣，盡量避免那些聽起來嚇人或對于大多數客戶僅有模糊意義的“技術”字詞。比如：無效、錯誤、配置、管理、設備(請改用“電腦”或“手機”)等。
② 標點符號：
標點符號能幫助傳達意義，但它不可替代字詞。以下是要記住的幾點：
不要過度使用感嘆號。相反，選擇程度更深的字詞。
和感嘆號一樣，請慎用問號。當鏈接采用客戶問題的措辭時，它們效果很好。
③ 用法：略。
?、?注意格式規范：
“英文” “中文” “數字”相互之間須有空格。比如 [我們將在 4 月 29 日召開 Build 大會，會上會有更多關于 Windows 10 的信息公布。]
英文句子間須有空格。比如 [We released Windows 10 Technical Preview last year, and many people like it. We also showed HoloLens.] 在逗號后面、句點后面均有空格。
大小寫。如：Windows 不能寫作 windows 或者 win。Windows 10 for Phones 不宜寫作 Win10 for phone。
對于有特別作出規定的標志，比如 Microsoft 徽標 Microsoft Corporate Logo Guidelines (請展開其中的 + 號按鈕)。
【附加示例】
調整前的文本：你嘗試打開的文件不屬于允許的文件類型。
調整后的文本：不能在手機上打開此類文件。
調整前的文本：我們正在將該演示設備的設置還原到預配置的值。此過程不可中斷。
調整后的文本：我們正在將該電腦還原到用于演示的原始設置。該過程需要一些時間，并且不能中斷。
調整前的文本：Microsoft 可能會使用你提供的信息，以通過與你的帳戶相關聯的服務相關強制性通信聯系你，并提供我們認為你感興趣的其他通信。
調整后的文本：Microsoft 可能針對關于你的帳戶的服務相關信息聯系你，或者向你提供你可能感興趣的其他有用信息。
【配置正確合適的字面內容，也是 Modern UI 的設計準則之一!如果沒有做到，便不能算是 Modern UI。重申一遍，不建議把 Modern UI 理解為“色塊堆砌”?！?/p>
三、顏色
Modern UI 的顏色是飽滿、鮮明和真實的數字，涵蓋了顯示技術所能夠達到的整個色域。Windows 主要使用單一純色，但利用各種技巧創造深度，如透明度、分層和混合。
先上一張色表吧。此色表僅對 Windows Phone 起作用，Windows 又是另外一套顏色方案(不是不整合，是兩種設備的融合度還不高、使用場景還有很多隔閡的時候，顏色的使用也需要隨使用場景的特點而有不同。這點又反映在磁貼的動畫上，Windows 上的磁貼不會也是禁止進行前后翻轉。)另，此色表是當時的，現在我手里有一臺 Lumia 830，它的主題色還多了一種“亮綠”，是為了配合亮綠色背殼而增加的，且它排在最后一位，而不是插隊到綠色位置。還有的運營商可能會有定制的主題色，這些暫時都不在我們的考慮范圍內。
Modern UI 體現在 Windows Phone 上的配色：
謹慎地融入顏色，對品牌產生影響。使用離散、高對比度的顏色組合來體現清晰度和可見性。應當盡量少用鮮艷的顏色，如果你無法決定使用哪種顏色，則默認使用中性或單色色調。意思就是不要將各種五花八門甚至發亮的顏色(而且還是沒有經過組合配色的隨機選的顏色)毫無規律地拼湊在一起——尤其是手機這樣小尺寸的手持設備，因為它與大屏幕的設備有不同的特點，配色方法是有區別的。簡單說來，如果你要在一個小的地方，比如明信片、名片、書簽等等的小物品上運用Moder UI，記得：少用色，用好色。
比如 Microsoft Account 的各處登錄頁面(如 Outlook)，它經常需要在手機或各種設備上顯示，它非常簡潔，就一種藍色藍色(Xbox 登錄可能會是綠色，是顏色在品牌上的變換)，不會五花八門。且用色之處，皆為重要信息，或，希望你關注的信息。
Modern UI 體現在 Windows 上的配色：
正如你知道的那樣，系統顏色和應用顏色是不同的。系統顏色是用戶選擇并由 Windows 應用到系統中主要 UI 表面的顏色，如“開始”屏幕背景、邊欄菜單、按鈕顏色等等。應用顏色是應用開發人員選擇的獨特顏色，它獨立于系統顏色之外。應用顏色表示應用的品牌和標識。
這點應用到 PPT 上可以變換為，選定用于貫穿整個 PPT 的主色，和你的分頁顏色。比如目錄用色，和目錄上各章節的配色。
能輕易發現，背景色一定不是淺色系的!(至少默認配色方案不會給出淺色系背景，至于可自定顏色不在討論范圍內)默認的紫色，是深紫，明度較低，即用沉穩的色調，去反襯磁貼的多彩。若背景色是淺色系的，那么整個界面會顯得凌亂，難分主次。
應用在 PPT 上，背景要具有承載頁面內容的能力。即使是圖片作為背景，也要將圖片的明度調暗。可試著選擇桌面壁紙當作開始屏幕背景，并和桌面切換對比，你會發現，開始屏幕雖然使用了桌面壁紙作為圖片，卻也是經過了加暗處理。(Windows 上的內置應用配色，是經過調色配置好的一套顏色，可自行取色使用。但不要從開始屏幕上的磁貼取，請從“所有應用”界面的小圖標取。因大磁貼顏色實際是漸變色，而非真純色。)
另，為何 Windows 8.1 更新后默認壁紙是黃色的呢?因為本身黃色不適合作為開始屏幕上的磁貼顏色，會造成文字變黑的結果。黃色同時是中性色，冷暖不定。到了 Windows 8.1，桌面變為黃色，廣告圖中多是中等正方形狀態。顏色上，弱化它;功能上，不強調它。微軟希望大家更多地使用 Modern 應用，而不是桌面，趨勢。)
一個案例：多彩的鬧鐘，下方開關白色為開，否則是關。增強了對比度，這就是在視覺上將開關的狀態感知增強了，且因背景是深灰，而非鮮亮色，這種感覺就更強了。當你放眼看這張圖的時候就有“一目了然”的感覺。如果用左右拉的開關，并放于鬧鐘名稱右側，放眼望去，便不會那么清晰了。
作用在 PPT 上，即運用高對比度的顏色來獲得“看一眼就明白”的效果。(黑、灰、白不屬于色彩。)
總之：主角是前景被關注的內容，而非背景。這里反映出 Modern UI 的一個原則：突出最重要的信息，內容第一，而非無謂的裝飾。讓信息量達到“無法向下刪減”的程度。
再看幾個應用的顏色：
郵件現已經改為藍色，可能是為了和 Outlook 藍色調配合。
界面上色系越少(相近色不算)，Modern UI 的特征越明顯。
統一配色，并將最需要引人注意的部分用該顏色標注出來，除此之外，用不同灰度的黑色。底部菜單欄也為了和背景形成反差，引起注意。比如郵件應用，被藍綠色標記的文字是郵件前面幾個字的提要，而不是發件人或者其他，這是因為郵件內容是最最重要的，比如“周末一起去野餐吧”這樣的郵件消息，而不是“洪國明”這樣的名字。(洪國明是微軟用于 Demo 的一群名字中的一個，還有“曾樹山”等等……如果有關注廣告可能會看到。另，Contoso 是微軟用于 Demo 的公司名字，幾乎每個案例都是說 Contoso 公司，還為其注冊商標、開發演示應用。contoso.com 好像是會跳轉到 Microsoft 官網。)
拓展： Windows 窗口的背景并不是白色，而是鉻色。:-)
再來個優秀案例：
“閱讀列表”應用的頂部菜單欄之一(按時間排序，從左到右是“今天、昨天、這周的早些時候、上周、上個月”)。下面是界面圖片：
想必不用多解釋，此案例中“今天”的配色是明度最高的，因其是“今天”共享進來的。時間越之前，明度越暗：弱化注意力。越是之前的，越可能是已經閱讀過了的、無需關注的。
應用在 PPT 上，想象一個場景：時間軸式的事件圖，若時效性較強，可逐漸改變明度。若特征不是時效性，是某幾個關鍵時刻，那么關鍵時刻就用明度高的，其余的依次弱化。
為什么說不要把 Modern UI 理解為“色塊堆砌”，其中一個原因：用色是有講究的，即使是大純色塊，也不是亂用的。重點不在于“大的純色塊”這樣的視覺表象，而是用色塊表現了什么、突出了什么、弱化了什么、起到了怎樣的交互引導作用、產生了什么樣的品牌形象、怎樣提升了用戶的操作效率等。
四、排布與對齊
本節末尾有提供官方干貨哦。——欸別急，先看再下。
寫在最前：我所見過許多想模仿“磁貼”卻模仿不到位的，很大問題出在“磁貼間距”上，要么太離散，要么靠得太近。間距是直接影響到“像不像”的一個因素。
1、使用網格系統(要做出嚴苛精確的界面)
在設計 PPT 時候，記得用網格。
網格由單元和子單元組成。測量的基本單位就是單元。一個單元等于 20 × 20 像素。每個單元進一步細分為 5 × 5 像素的子單元。每個方形單元有 16 個子單元。下面這張圖描述了屏幕左上角處的網格。放大該圖像即可顯示像素、子單元以及單元。
2、頁眉
頁眉的基線應該為距離頂部 5 個單元或 100 個像素。頁眉的左邊距為 6 個單元或 120 個像素。Windows 8 頁眉為 Segoe UI 樣式集 20 細線。
(還有一些用于程序設計的 UX 事項，比如 Windows 8.1 中鼠標觸頂會出現標題欄，設計時要考慮元素不會被遮擋。這些內容就不贅述了，PPT 制作中基本沒人去寫這種交互。)
這很適合用來填寫 PPT 的頁標題(如果頁面不是只有這一個標題的話)?？梢韵茸瞿赴妫ê梦?，這樣就很方便，不用每次去調整。
3、內容區域
內容區域的上邊距為 7 個單元或 140 個像素。左邊距為 6 個單元或 120 個像素。下邊距非常靈活。對于水平平移的內容，應該不超過 6.5 個單元(130 個像素)，且不少于 2.5 個單元(50 個像素)。 對于垂直平移的內容，上邊距和左邊距保持不變。由于內容滾出屏幕，因此未指定下邊距。
用在 PPT 上是很科學的。我們按 16:9 的屏幕來講(2013 版之后默認的比例)，尤其內容的左側，不能靠太近邊緣，因為橫向本身就比較長，要達到平衡。
4、水平填充值
內容項之間的水平填充因項而異。對于明邊項(如圖像和用戶磁貼)，磁貼和隨附文本之間的填充為 2 個子單元或 10 個像素。對于列表，列之間的填充為 2 個單元或 40 個像素。對于明邊項，列之間的填充為 2 個子單元或 10 個像素。
這里就涉及到開頭說的“間距”的問題啦~ 規定是磁貼間間隔 10 像素。開始屏幕上的每塊磁貼都是有 1 px 的邊框的哦，那個邊框就包含在“10 像素的間距”之中。也就是說，除去邊框，還有 8 px 的空間。
這里就不舉反例了，相信大家都曾經見到過，嗯。如果你實在沒把握，可以把開始屏幕或者其他的截屏一下，放進 PPT，然后用圖形臨摹重疊，再刪除截屏。
5、垂直填充值
內容項之間的垂直填充也因項的類型而異。 對于磁貼和文本列表，行內項之間的垂直填充為 1 個單元或 20 個像素。對于明邊對象，行內項之間的填充為 2 個子單元或 10 個像素。
6、組之間的水平填充
組之間的填充為 4 個單元或 80 個像素。此填充足夠大，在用戶平移時足以輕松辨別組。
嗯，分組。不過 PPT 中應該很少會用到組的樣式吧……
再給大家提供幾張圖，是微軟用作為講解案例的：
可以說，排布和對齊，是很大程度影響到你的 Modern UI 看起來“正不正宗”或者說“像不像”的關鍵因素之一。
寧可多花一點時間在對齊和排布上。另，PowerPoint 中的“對齊”功能挺好用的。
說了這么多，你一定在找干貨……好的，這就給你!
等等!這是側重排布與對齊以及模塊樣式的，不是側重用色的。
用于 PowerPoint 的設計模板： https://go.microsoft.com/fwlink/p/?LinkId=325041
用于 Photoshop 的設計模板： ttps://go.microsoft.com/fwlink/p/?LinkId=325040
用于 Illustrator 的設計模板： https://go.microsoft.com/fwlink/p/?LinkId=325039
這些資產，適合用于 PPT 某些頁面的設計(看起來更接近 Modern UI)、適合用于應用的 UI 設計。但是記得，我們很難用 PPT 達到動態磁貼的效果，也是 Modern UI 的一個精髓所在。要想方設法讓你靜態的頁面內容達到“一目了然”和”突出重點”的狀態。
剛剛給了一些干貨。
那么就來說說，這些干貨你準備怎么用?可不是亂搭的呀寶貝們……
就舉個實例吧，表單的布局?；蛘哒f，把表單換成一行行內容，對應進去就好啦。
先給一張各種元素的建議大小，包括間距：
之所以說表單，就是想拓展一下。不僅僅是用于 PPT。比如你要用 Modern UI 來設計一張或多張打印出來的填表，就能注意到。
下面是使用單列布局的短表單示例：
下面是使用單列布局的較長表單示例：
請不要嘗試將大量內容置于一個非常長的表單中，而是考慮將任務分成多個組或多個表單序列。下面是分為多個組的較長表單示例(比如你設計的問卷，一長串連在一起，對方看到就覺得很多，看著不舒服，帶來一種煩躁感。這不是 Modern UI 所提倡的，而應該簡單化，有焦點。因此要分頁)：
下面是分為多個頁面的較長表單示例：
何時使用兩列布局?
將兩列布局用于僅能進行有限垂直平移的短表單。 兩列布局在橫向充分利用了屏幕空間。 請記得為兩列之間保留足夠的用于裝訂線的空間。
下面是使用兩列布局的表單示例：
此外，我想分享一個大家應該都見過的表單設計：
五、圖標
圖標使用最少的部分和細節，可以提取和簡化概念。它們在本質上是圖形，并且采用平面透視效果和單色，強化了內容重于版式的思想。
透視
的圖標是二維符號形狀。圖標可以巧妙地暗示體積或深度，但我們一般避免增加透視線或角度。大多數圖標代表一個概念或對象。如果一個圖標代表一個以上的對象，前面的對象“擠出”后面的對象。
“擠出”一個對象意味著當圖標中的一個元素顯示為覆蓋另一元素時，覆蓋操作將創建一個與背景顏色匹配的間隙。
顏色
圖標的主要顏色是純白色。白色是可以在大多數具有豐富的彩色背景的顏色上下文(如應用磁貼和應用欄)中很好地顯示的單一顏色。
生產
建議使用矢量繪制所有圖標，尤其是在 Adobe Illustrator 或 Expressions Design 中。將矢量形狀貼靠在字形系統中是至關重要的。Windows 圖標必須有清晰、干凈的邊緣。
圖標不只是提供功能。還有助于將用戶與應用的總體構想聯系起來，甚至可以喚起對應用的良好情感。圖標不但要透出品牌的個性，而且要保持界面的效率。
另外，來說說 Segoe UI Symbol 圖標。用這些圖標會顯得你的 Modern UI 更加接近原本的設計。
大部分此類字形在提供時其間距為零。你可以在每個零寬度字形上放置其他零寬度字形。例如，如果你插入零寬度的紅色的實心 (U+E00B)，光標不會跑到心形的末尾，因為其寬度為零。然后，如果你插入黑色的心形輪廓 (U+E006)，則心形輪廓會放置在實心之上。
大部分圖標還具有鏡像樣式，以供使用雙向文本的語言使用。
這里提供一些 Unicode ID。
紅心大戰
星形評級
復選框組件
單選按鈕
雜項
滾動條
漸進式公開箭頭
后退按鈕
后退按鈕的字形提供了 3 種不同大小，以便外環的權重等于 16pt、20pt 和 42pt。這些字形設計用于支持分層。
HTML 的后退箭頭
記得添加其他代碼，創建環繞這些字形的圓環。
用于控制的圖標的字形
這些字形設計為以 14pt 大小顯示。記得使用其他代碼，創建環繞這些字形的圓環。
六、動畫
如果你有心做動畫，喜歡折騰搗鼓，那就試試吧。PowerPoint 中部分動畫的“平滑結束”比較用得上，但至今配合動畫延遲也沒有嘗試出完全相同的程度。Modern UI 中很多動畫的“位移-時間”圖像是曲線。
1、底部 Action Bar：https://content5.ssl.catalog.video.msn.com/e2/ds/42bad77c-661f-457f-ad89-9fdf0742d807.mp4
這個使用進入動畫“飛入” – 從底部 – 持續時間和平滑結束時間自行設定。
2、隱藏面板 Charm：https://content5.ssl.catalog.video.msn.com/e2/ds/629ed613-3265-42f6-878c-c057313643d3.mp4 設定方式與上一條同理。但視頻中還是早期樣式，Windows 8.1 中面板與其上的文字有動畫延遲，顯得更有活力。視頻中文字內容和面板還是一個整體。要做新樣式，將文字內容與底部面板分離，設置動畫延遲。
3、彈出動畫：https://content3.ssl.catalog.video.msn.com/e2/ds/2a38b01a-a40b-491e-8802-5a9572a123a2.mp4 包括一個平移，它是在彈出元素淡入時從初始位置到最終位置的垂直移動。平移距離和方向由應用指定。在大多數情況下，平移應為 50 像素，以向上方向移動。不過，如果彈出元素顯示在觸發彈出的 UI 元素下方，則平移應是向下移動 50 像素。例如，此下載平移將適用于從導航欄或從應用標題觸發的浮出控件。這是為了向用戶提供彈出元素與其觸發元素之間的可視鏈接。
更多動畫自行操作、觀察。
我是從介紹其設計準則這個角度來回答如何制作這種風格的 PPT 的，試圖把重點的一部分呈現出來，整理下大家紛亂的感知，我認為這樣做更實際。
這是我看到的一個提煉：
Metro UI 設計具備以下五點原則：
1. 干凈、輕量、開放、快速
2. 要內容，而不是質感
3. 整合軟硬件
4. 世界級的動畫
5. 生動，有靈魂
# 注釋 #
在【一、字體】中提及的 SS01 樣式，出現了一些復雜的情況，感謝 @prox 用心的查證，手動點贊!因 @prox 網絡問題無法發表，在這里貼出他的修正內容：
Segoe UI 的兩種造型?
@佳偉發現列出的 Segoe UI 字體，字形竟然是不一致的。
作為 Segoe UI 的粉絲，我不辭勞苦(?)地找到了一臺 Windows 7 電腦，使用 QQ 遠程協助截下了如下珍貴圖像。po主真的很拼……
這是 Windows 7 下的 Segoe 字體集。
在圖中，發現了兩個名為“Segoe UI 常規”的文件。它們分別是這樣的：
顯然這兩種字形是不一致的。第二種，通常我們認為是微軟雅黑的西文樣式。注意兩個字體文件版本號，可見下圖版本號更低。
我想這大概就是佳偉截圖中出現兩種不同樣式的 Segoe 的原因了：微軟中途發布了新版本的 Segoe 字體。
我找到了這樣一個鏈接：Segoe UI Light
其中有這樣一行：
可見表格當中并未列出這個 5.11 版本。推測，這可能只是一個臨時的、中間的、不正式的版本。
Segoe 字體本身是不包括中文的。微軟當前對它的用法是，與微軟雅黑中文搭配成新版 YaHei Light，或與方正中等線搭配成 Windows Phone 自帶 DengXian 字體。所以呢，也許是 5.11 版本打包的時候出錯了，直接將一整套微軟雅黑扔了進去……(注意5.11與其他任何版本的中 文字體都不一樣，其他的選擇了默認宋體作為中文字體缺失時的替換展示字體，而 5.11 版本帶有雅黑)
Bing 的搜索結果也傾向我的推測。
因此，Segoe 就是這樣的：
并非為了兼容 Windows 7 而把自己改成 YaHei UI Regular 的樣子。
再次感謝!
設計師為此付出了艱辛勞動，程度之大是我們無法想象到的。
它傾注了設計師多年的用心探索、大量的資料、不斷推翻改進的設計。不然，何以成為微軟整個公司轉型而確定的設計風格呢。
那些令人尊敬的人們，現在或許正為未來五年或十年的設計風格而探索著。
設計規則是人定的，為了更好地展現。那么規則也是可變的。期待 Modern UI 的不斷精進!
(按當時 Windows 8 的開發情況，最終的配色方案和 UI 是在零售版中露面的。而有人聲稱 Windows 10 每個外放的預覽版本都會暫時封鎖一部分功能，這也是展示的 9841 和下載下來的 9841 有多處不同的原因了。那么沒有理由不相信 Windows 10 最終會擁有一套漂亮的界面!鑒于保密工作越發嚴謹，大家還是等正式發布的那天吧!→ 如果過早曝光，沒了驚喜，那多沒意思嘛^_^)
全篇完結。
|
|
發表留言請先登錄！
|