Metro UI 的設計感悟

2021-09-08 02:41:01 字數 1242 閱讀 3124

metro是火車的意思,這個ui借鑑了火車站指示牌的思路,也就是希望提供乙個簡明的資訊給使用者。

但是metro絕對不是簡單化資訊就可以的,簡單化會讓ui顯得很簡陋。如何在一塊空白中,建立足夠簡潔而又不過於簡陋的ui,這是metro需要尤其注意的。

在乙個小格仔裡面要想顯示完整的資訊那是不可能的,這就需要我們提供使用者能夠識別,而又最有意義的資訊。

美包含很多要素,但是使用者介面的美學乙個關鍵的地方就是效率,包括易於識別,易於查詢,快速做決定等使用者體驗工程學方面的內容。第一點是先劃分內容的層次,標題和內容要區分開來,不同組別的內容要區分開來,從左到右,從上到下,同類內容保持設計上的一致,不同類內容形成足夠的反差。

空白並不是多餘的內容,要將空白也做美學考慮,做設計的元素。比如標題和內容可以借助空白來隔離。

對齊是看不到的聯絡,如果想要同類元素有關聯,就把他們對齊一下。

圖形可以在有限的空間內,起到很好的辨識效果,如果光是一堆文字,可能就很難提取使用者需要的內容。

使用者介面和內容的乙個顯著差別是,內容是描述性的,而使用者介面是辨識和操作性的,使用者介面不能表達具體的詳細的內容,甚至不能告訴你這個按鈕代表什麼意思,但是他對於有一定操作基礎的人來說是最容易辨認和操作的。這就需要用到抽取內容骨幹的手法,第二是要建立統一的操作模式,讓使用者可以舉一反三。 

設計要讓使用者明白,在於它嚴格的一致性,如果你做10件事,卻有兩件是錯的,對使用者的影響就大大超過這兩件事本身的比例。 如果乙個不能代表文字,那就不要用。如果標題和內容應該區分出來,就不要讓他們偶爾粘在一起。不要讓不同內容使用相同的樣式,不要讓不同內容使用相同的對齊,不要無緣無故留出一大堆空白,不要牛皮蘚的設計。不高明的設計,比花俏而錯亂的設計要好得多。

眼睛總比手快。乙個頁面能展現足夠多的東西給使用者,就比用兩個頁面來展示要好得多。不要害怕用小字型,不要害怕使用者看不清楚,不要害怕內容過多。雖然很多人批評門戶**過於臃腫,但是這對使用者來說其實是友好的,單純為了設計上的美觀而忽略使用者需求是不恰當的。

人都喜歡曲線,喜歡圓滑的東西,方塊線條確實不討好使用者。用方塊是為了建立乙個區域,乙個分組,用來對內容進行良好的分離和對齊(因為有邊界,而圓形沒有明顯的邊界),如果用這個建立圖示,而不是用來展示實時和互動的內容,那就是浪費了。在建立足夠辨析度(圖示)的基礎上,必須應該提供實時資訊。方塊內的設計是乙個難題。

光有上面還不能突出「品味」,要想讓你的ui有品味,必須要研究裝飾和背景。有人喜歡木紋,有人喜歡斜紋,有人喜歡花紋,有人喜歡漸變色,有人喜歡金屬字,映象字,水晶字,這些裝飾效果一上場,立刻顯出你獨特的藝術品味。但是,不管你是什麼品味,都應該遵從上面的設計原則。

系統設計感悟

author skate time 2012 07 26 系統設計感悟 總結以往教訓,以後再設計系統時注意點 首先考慮 系統不同的服務物件的定位,比如優先順序等 系統的考核指標定位 效能,穩定,擴充套件伸縮 再次設計系統時必須考慮 1.控制表的資料量,根據硬體配置給定閥值 如500w或1000w 如...

Metro UI 對APP使用體驗的影響

metro ui是微軟的一種設計方案。該設計方案已用於移動作業系統windows phone 7和多款微軟產品。微軟segoe wp字型,屬於segoe字型家族的一員,細膩堅韌給人一種優雅的美感,同時它也是wp7手機系統的預設字型。獨特風格 metro ui 強調資訊本身 metro ui是一種介面...

架構設計感悟

去年跳槽到了一家新公司,到現在已經一年多了。這一年多沒有寫什麼東西。一直都在做一些軟體平台化的工作。後續會不斷跟大家 如何做乙個好的軟體架構設計。一年多的軟體平台化設計開發工作,改變了我對軟體架構設計的看法。原來提到架構設計,最先想到的就是這次設計要採用什麼設計模式,把系統分成幾層。現在說到架構設計...