不知道大家是否工作中經常聽到有人點評某個作品說：這個設計缺乏細節？過去在擬物化時期，設計師細節能很好的在質感，圖標，光影處理等方面去體現，但是現在越來越扁平的設計風格，色彩、規范都千篇一律，仿佛設計都能被AI智能取代，今天就來聊聊UI設計師該如何在設計中體現細節！
UI的組成元素？
界面大多都是由字體，圖形，色彩構成的，這也是設計三大要素。那么在設計中，我們如何去處理好里面的關系呢，今天和大家分享一些常用的設計技巧，幫助大家在做設計時候更好去排版，英文示例只說明技巧中文同樣適用。
▲我們嘗試把上圖這個UI界面拆分一下，可以看到界面基本都是由字體、色彩、圖形三大板塊組成的。
▲同理：上圖我們按照同樣的方式去拆分，依然可以獲得三部分的內容
字重創建層級
▲我們都知道字體是有重量的，不同的字重可以體現界面層級，特別是現在的iOS風格中，更強調通過字重對比來提升視覺層次，但是很多設計師只知道運用字體大小去做對比，卻忽略了：運用字重和顏色去做層級區分同樣適用。
▲這段文字比較重要，就加大，這個文字次要就縮小,這是大多數設計師做設計的習慣，但是不要過多依賴大小對比去區分層級
▲我們可以嘗試通過加大字重，同樣可以達到效果
▲可以感受一下當視覺字重變化時，整體版面的層級區分
▲字重的對比在平面設計，版式設計運用比較多
▲品牌設計中，不同字重帶來視覺感受和舒適度是截然不同的
▲商品卡片設計中，通過字重區分層級的視覺效果，信息捕捉效率顯然要比整個版面都用統一字重要更快。
顏色創建層級
在UI排版中，除了字體層級，顏色也是很重要排版手法之一，做界面時候不要只用一種顏色，主要內容黑色，次要內容灰色（文章日期等）輔助內容淺灰色，然后結合前面所說字重運用，能很好的和信息組成視覺節奏。
▲界面中的線條和色塊都是區分層級的輔助手段，按照界面調性去實際調整
▲錯誤做法：讓文字變成淺色比較適合在白色背景下，如果不彩色背景上面使用灰色，因為帶色彩背景和灰色如果一起使用，會顯得界面特別臟，識別度還低
▲通過對圖片，彩色背景通過降低透明度的效果會更加好
▲通過降低文字透明度也能拉開視覺層級
▲選擇與背景相同的色相，直到飽和度合適為止
投影運用創建層級
市面流行風格里面，投影運用大都比較多，但是在用投影的時候，我們需要盡量保持它的干凈和利索，不要使用過大的投影值和擴散范圍，盡量使用柔和投影或者垂直投影。
間距創建層級
▲我們在做很多設計的時候，容易用到很多分割，什么時候用線什么時候用投影，如何讓界面更加干凈，有時候通過留白來區分層級，效果會比線更加干凈清爽。
中心軸創建層級
▲這個頁面中，很明顯左邊比右邊好，右邊信息缺少對齊和呼吸感，左邊有一條明顯中心軸讓頁面更加的清晰。
總結
今天和大家分享的只是UI界面中一部分經典區分層級的要素特點，希望大家都能舉一反三，運用到自己的作品中去，做出更多具備細節感受的作品！
原文地址：我們的設計日記
作者：sky
通常，硬件的外觀僅僅是作為一種體驗的容器存在，而軟件用戶界面（User Interface）的體驗，則決定了我們是否喜歡這個設備。下面，就和大家看看 Apple 在界面方面做的努力。
01. 高度統一的設計語言
蘋果的設計語言有四個標志性特征：平滑圓角矩形 (Squircle)、陰影 (Shadows)、半透明 (Translucency) 和高斯模糊 (Blurring)，它們幾乎貫穿整個系統。從原生應用：相冊、App Store 應用商店、音樂都有這些元素，并且高度統一。
App Store 十年變化
– 圓角矩形
從 iOS 7 轉型扁平化的今天，蘋果完成了對「圓角矩形」的終極運用。蘋果引入了工業設計中連續曲率概念，應用在圓角圖標的輪廓之上。
圓角矩形
但真正意義上的運用，體現在 iPhone X 發布之后。得益于 OLED 柔性屏和 COP 封裝，iPhone X 四邊等寬的機身達到了最高的設計美學，屏幕的外輪廓也追隨機身形態，于是就有了圓角的 Dock。
蝸牛讀書 App
在《致匠心，以設計》這本書中有提到蝸牛讀書App，在大的彈窗和卡片引入了曲率圓角。雖然這是一個很細節的設計，甚至感知不到。但它就是設計師不斷追求的東西。
– 陰影、半透明和高斯模糊
投影可以凸顯內容的重要性，半透明和高斯模糊暗示背后有更多的內容，同時可以保持界面輕盈、通透。
Apple Music iOS 13 版本
相對于 iOS 12，iOS 13 將半透明的特性更進一步。除了迷你播放器之外，Apple Music 的底部導航菜單也變成半透明+高斯模糊了。
細心觀察，微信同樣認同這種語言，在頂欄和底欄做了微弱的半透明和模糊。
相冊 iOS 13 版本
而系統相冊的更新，則延續了 App Store 應用商店的卡片樣式。至此，圓角、投影、半透明和高斯模糊，這四個特征在相冊界面皆得到了印證。
02. 極致的圖標細節
– 語音備忘錄
就拿語音備忘錄來說，它的音軌圖形并不是隨意畫出來的。而是用錄音功能，說出“Apple”這個單詞，所呈現的音軌波形。
語音備忘錄 & Apple單詞的音軌
而且，還有一個小細節是，語音備忘錄是唯一支持180°豎屏旋轉的自帶應用。因為它常見的使用場景是采訪，需要將手機底部的麥克風對著受訪者，而這時圖形界面是反的。所以支持旋轉，這是一個基于用戶使用場景的細節設計。
– 地圖
在蘋果地圖 App 圖標上有一個角標「280」，它代表的是蘋果所在的總部位置，一條位于美國加州 280 州際公路附近。
蘋果地圖 App
另外，新的圖標里，右上角露出了 Apple Park ，也就是我們熟知的飛船圖形，這和實際的平面地圖完全吻合。
蘋果新總部位置
– Safari 瀏覽器
新的 Safari 圖標，磁針的角度由原來的45°變成了50°。有一個頗有意思的解釋是，地磁的北極在一直在持續向北移動，在過去的150年里偏移超過1000公里。這個說法顯然更具有故事性，但事實并非如此。因為磁極向北，那么磁針角度應該越來越小才對，而不是增大。
Safari 瀏覽器
實際上，45° 改為 50° 是出于視覺上的修正。左邊舊的圖標，45°磁針剛覆蓋的是短的刻度條，被倆長刻度條相夾，略顯擁擠。而新的圖標剛好相反，50°磁針相鄰是短刻度，視覺上更具空間感和韻律感。
– 時鐘
大家都知道時鐘 App 的圖標時間是和系統時間同步的，秒針也會勻速轉動。重點來了，長按時鐘 App ，秒針的運動方式由勻速變成滴答滴答機械式轉動了。
時鐘 App 滴答動畫
03. 利用視覺線索
為什么蘋果系統上手容易？在現實世界中，有些東西你一看就知道它如何使用，比如門把手、無印良品的CD機。
這里有個心理學的概念：示能 （Affordance），在 iOS 中也建立了類似的機制。用戶借助以往的經驗，通過圖形，預期下一步的行為或感知它的是做什么的。
滾動內容 & 多頁內容
比如，左邊有一列滾動內容，你可以在底部裁剪掉半個文字，讓人嘗試著去發現下面還有更多的內容。如果有好幾頁內容，那就可以用頁面指示物，來引導還有其他幾頁內容。
滑動窗口
對于滑動窗口內容，你可以用像這樣的一個把手來暗示它是可以被抓取并滑動的。
04. 隱喻
好的設計是有溝通力的，隱喻 (Metaphors) 就是一種很好的方式，它同時也是 iOS 六大設計原則之一。
– 時間隱喻
很多人覺得 UI，不就是顏色、間距那些東西嗎，好像沒什么可設計的。那我們且看，iOS 短信界面是怎么處理的：
- 短信氣泡的背景顏色是有深淺變化的，信息越早，顏色越淡。
- 連發兩條信息，它們上下的間矩是很小的，并且只有下面的信息氣泡有角標。
- 如果發送的間隔時間長一點，短信的上下間距會變大。
短信界面
蘋果就這樣通過顏色漸變、間距，完成了對時間的隱喻。
– 速度隱喻
蘋果系統有一項“朗讀屏幕”的功能，雙指從屏幕頂部向下輕掃，即可呼出。將 iPhone 或 iPad 上的文檔、網頁或微信里的文字讀出來，幫助你將閱讀變為朗讀。
當然，你也可以控制系統朗讀的語速，Apple 很形象的將龜兔賽跑的圖標，隱喻在速度之上。當一個應用程序的虛擬界面是植根于熟悉的真實世界時，那么用戶會學習的更快。
龜兔賽跑
05. 設備同步
蘋果的音頻產品線有很多，諸如 Airpods、Airpods Pro、Beats Solo、HomePod、Powerbeats3，每一個都有各自的圖標。不管你連接哪個，都會同步顯示具體設備。
比如，當你手機連接了 AirPods Pro ，電話界面的音頻喇叭 icon 會變成 AirPods Pro 的 icon。另外，AirPlay 功能可以連接多個揚聲器，甚至新舊款的 iPhone 圖標都有區分。
AirPods Pro 圖標 & 全面屏 iPhone 圖標
同樣，如果你有 Powerbeats3 耳機，并且系統是最新的iOS 13。當你調節音量的時候，喇叭 icon 同樣會變成 Powerbeats3 耳機圖標。
Powerbeats3 圖標
06. San Francisco 字體的秘密
舊金山字體現在是 Apple 平臺統一的標準字體：被應用在 Apple Watch，iPhone，iPad和Mac上，取代了以前的 Helvetica Neue。
冒號的居中對齊優化
新字體有些微妙的變化，最讓我印象深刻的是冒號「 : 」的顯示方式。正常情況下，冒號是在基線上，視覺感知會偏下。但如果冒號是放在數字中間，系統會將它垂直居中對齊。
符號的優化
除此之外，「 #」符號中間的開口是個非平行切口，這是特意被增大處理的。因為 # 的字號在縮小到一定程度的時候，切口會難以識別。所以視覺上需要更多的空白，提高可讀性。
07. 非線性動畫
用戶體驗有一個重要性能指標是：響應速度（Speed Index）。隨著硬件設備的不斷提升，不可否認的是，現在的 Android 啟動速度比 iOS 更快，但是，蘋果加入了很多非線性動畫，以及穩定的幀率表現，在流暢度方面 iOS 更勝一籌。
iOS 13 黑暗模式切換動畫
解釋下非線性動畫，就是一開始很快，最后慢慢慢下來。比如，打開任意一個 App 的過程動畫、鍵盤拉起時的瞬間，以及 iOS 13 控制中心黑暗模式快捷切換，這個icon 動畫同樣用了非線性。
iOS 13 靜音開關動畫
還有一直被詬病的音量和靜音調節，終于得到解決。原先的大 Toast 提示會擋住當前內容，現在改到居頂顯示，并加入物理衰減鈴鐺動畫，極為真實。
總結
在 Apple 的界面視覺中，我們看到了各種隱喻和暗示，我們看到了非線性動畫帶來的流暢體驗，我們看到了雕刻細節的過程。它是設計師不斷追求的東西，最終給用戶呈現的是額外禮遇般的的產品體驗。
原文地址：洋爺（公眾號）
作者：洋爺
1. 3D圖形
許多設計師開始從靜態圖形轉而使用3D動畫，動態的圖形可以承載更多信息，更加令人印象深刻。另外，3D圖形最大的優勢就在于能夠不斷突破想象，渲染出一個夢幻的世界。
2. 版式
你的電腦里是不是安裝了上百款字體，然后再盯著屏幕選擇一個最適合界面展示的字體。
其實只要一個不錯的排版就能解決字體選擇困難癥了，而且可以清晰地展現文字信息。目前Dribbble網頁設計中的熱門趨勢之一就是將多種字體、大小字號和不同的圖案混合在一起，這樣的頁面更加有視覺沖擊力。
此外，文字的排列方向也不局限于傳統的水平排列，可以按照垂直、對角線方向排列，甚至是圍繞特定的形狀。這些獨特的編排方式無疑可以增加布局的新穎程度，但是在使用時也要注意保證文字的可讀性。
3. 紋理材質
雖然扁平化設計依然是占據主流，但Dribbble中另一個引人注目的趨勢就是在網頁或者UI界面中使用可以反映真實生活的紋理背景，比如細致的紙張紋理、柔軟的織物紋理或者粗糙的木材紋理等。
這樣的背景通常也會用在海報或者PPT的設計中，可以為設計作品增加質感，紋理能夠簡化現實生活中的視覺效果帶入到平面設計中，快速建立和觀眾的視覺聯系。類似的背景可以前往這邊下載。
4. 全屏視頻和圖像
許多設計師都開始嘗試使用全屏的圖像或者視頻作為網頁的背景，可以在用戶剛開始進行交互動作的短時間內傳達出網頁的主題和氛圍。
當然了，全屏背景圖像和視頻的加載需要一定時間，想要使用這種方式還需要多方面考慮和測試，以便頁面看起來更加自然。
5. 無圖像網頁
這就和上面所說的趨勢相反了，Dribbble上也有一群設計師更加青睞不包含任何圖像或者視頻的頁面。
這類網頁或者交互頁面通常是基于文字和字體的，借助字體的大小、襯線等特點來增加吸引力。流暢的交互動畫也可以增強純文字頁面的表現力，從大量以圖片為主的頁面中脫穎而出。
6. 數字插畫
插畫在網頁和手機UI中的使用非常廣泛，比文字更有表現力，更清晰和時尚。一方面是因為插畫可以出觸發用戶情緒，從線條、色彩再到面部表情和曲線，無一例外地都在詮釋一個故事，營造某種氛圍。
另一方面，數字插畫對于交互動效來說十分方便。通過軟件處理后，動起來的插畫就具備了更多的可能性，在網頁、手機UI、廣告和視頻中都可以使用，不同的玩法還可以帶來全新的體驗。
雖然我們介紹了6種在Dribbble上最流行的設計趨勢，但這并不代表在實際工作中的應用就非常廣泛，大多數時候設計師還是要根據產品屬性和甲方需求來決定設計風格。
我們討論這些流行趨勢的意義在于突破設計原力，吸引設計師不斷創作出新的表現形式。畢竟設計也是一個圈，誰又能知道下一個流行的設計趨勢究竟會是什么呢？
來源：25xt
]]>
1 使用光柵來更好的設計圖標
UI界面的圖標通?？梢越频目醋鲆韵碌幕靖袷街唬簷M向矩形，縱向矩形，對角矩形，圓形，三角形，正方形。 如果把它們做成高斯模糊效果，你就會發現它們具有相同的視覺重量，因為它們變成或多或少相同的斑點效果。
根據圖標形狀，將它們放在相應的框架中。你就會發現，方形圖標比三角形或細長圖標更緊湊。
圖標越緊湊，所需空間就越小。圖標的邊緣越銳利，細節越多，它們占據的畫板空間就越多。
請注意，不要過分的依賴于網格來設計圖標。它們是用來幫你而不是限制你的。如果一個圖標的某些元素伸展出來更好看，那就順其自然讓它們伸出來。
2注意像素網格的重要性
在非視網膜屏幕上設計圖形的時候，要特別遵循使用像素網格，并優先選用2像素的邊框作為圖標的線條。因為它可以讓圖標在這些顯示屏上更加清晰。
如果為圖標設置1像素的邊框，這個時候，這些邊框應該使用外部或內部的描邊樣式，但不建議是居中的。如下圖，你可以看到他們的區別。
居中描邊的一像素邊框，雖然在放大它們的時候，它們看起來很清晰。但在100%比例大小顯示的時候，它們會模糊掉。所以，慎用~下面兩張圖是圖標在居中描邊的時候所產生的效果：
根據像素的網格線來設置一條線的起點和終點，會讓你的圖標看起來更清晰。通常情況下，線的傾斜角度在45°，30°，60°的時候，清晰度會比一些不常見的角度效果會更好，比如13.7°，81°等等。所以，盡量避免用這樣的數值。
3保持一定的圖標細節
從一套圖標中最復雜的那個開始來設計通常是最有效的，因為它會幫助我們定義相同的視覺重量，讓所有的圖標視覺重量保持一致。
當圖標具有不同的細節層次時，更復雜的圖標會吸引用戶更多的注意力，而且視覺上看上去更重。
4控制最小的間隙尺寸
圖標的相鄰元素之間空間在整個圖標集中不應太小或不一致。在任何情況下，都要定義最小間隙，以避免輪廓“粘滯”。比如下方的圖標，太小的間隙，所產生的粘滯感要特別注意：
下面這個則是調整后的效果，是不是好多了？
對于線性圖標來說，圖標線段的最小間隙應該等于線的粗度。另外，線條應該明確的分開或者準確的閉合連接。下圖是從錯誤的例子：
下面這個則是修改后的效果，是不是好多了？
5去除重復部分
在一套圖標集中，你很可能會重復一些細節，比如下圖這樣。但是盡量不要這么做，讓觀眾的注意力集中在不同的東西上。這就像數學中的分數簡化一樣。您看到的圖形噪聲越少，用戶的理解就越清晰。
比如下方這個郵件收發主題的圖標，當用戶已經非常熟知自己的具體操作，比如收郵件，發郵件，回復等等。那就不要在設計圖標的時候反復強調“信封”這個圖形了。將它們簡化，效果反而更好。
此規則還涉及圖標周圍的各種裝飾，框架，背景。如果它們沒有幫助幫助更好的閱讀圖標，就讓它們更加簡化一點比較好。
6保持圖標風格統一
下面的兩幅圖可以很好的展示正確的和錯誤的例子，比如一套家具的圖標，如果一個圖標的繪制角度是斜45°，那么其他的圖標也盡量保持這樣的角度。而不能一個是正視，一個是斜視?？纯聪旅鎯煞鶊D，哪幅圖是正確的呢？
相同的原理適用于線性圖標和填充圖標。 如果你把它們混為一談，人們可能會認為它們具有不同的重要性或地位。 當然，除非你刻意想要那個。 例如，填充圖標用于鍵命令，線圖標用于其他命令。
當然，我們可以用填充圖標表示當前態，線性圖標代表非選中狀態，這樣也是不錯的選擇。
7基于二倍數的度量系統來設計
與基于十進制的大小調整相比，8像素網格和12列布局用于許多接口更靈活。 12可以分為2,3,4和6。因此，24或48像素圖標區域已成為標準。 如果需要更大的尺寸，可以縮放這些圖標。是時候補習下數學啦！
8保持輪廓的干凈和準確
對于完美主義，設計師不能鉆牛角尖，因為沒有完美的事物。但是在你的最終設計稿里邊，正確的，不扭曲的圖標設計還是非常重要的。特別要注意，確保相鄰的節點和相鄰的元素是完全對齊或者沒有間隙的。
一定要避免 “8.999 px”或“100.001 px”這樣的尺寸。如果節點定位準確，圖標邊緣看起來很清晰。這個非常必要，保持整數吧！
9清理SVG圖標中的垃圾代碼
我們都知道SVG圖標最終是一串代碼。在Sketch中生成的SVG圖標通常會包含很多不必要的冗余代碼，比如組，顏色圖層還有遮罩。下面的這個圖標在Sketch中看起來很棒，但是…….
我們把Sketch生成的SVG圖標在AI中打開的時候，你會發現它的圖層非?；靵y。這些混亂的圖層都可以會讓前端開發工程師在轉換代碼的時候出現問題。
我們可以把這些不必要的圖層刪除掉，這樣看起來簡潔多了：
10不要把本文當公式
當然，以上我們討論的建議只是建議，他們不是刻板的公式。如果你知道自己在做什么，則可以僅僅把它們當作參考，而不一定要完全遵從它們。設計是靈活多變的，只要符合用戶體驗的規律，都可以被我們所用。
作者：Slava Shestopalov
原文：https://medium.muz.li/icon-set-3b4fc87dc6b5
翻譯：靜電
]]>
許多人對現代藝術的評價是這樣的：“這不就是一團亂麻嗎！”“一灘爛泥！”“復制粘貼而已，我也會。”（請自行腦補該類文字所描述的作品）。每當一個藝術家的作品在國際藝術品拍賣會上拍得天價時，總有幾個圍觀的吃瓜群眾會潑下幾滴自信的冷水：“這是什么玩意兒！我也能做好不好！”
然而，有一幅圖是這么機智地反駁的：
圖1，QUOTE BY CRAIG DAMRAUER
作者默默地表示贊同…誰叫你想到的時候沒有做呢？
然而，無論你是否能真的創作出與大師相同的作品，你都需要先對大師創作的動機有些了解。即使說有許多作品的確很容易復制（想想那些專業復制名畫的油畫村吧），如果不去思考作畫背后的過程和背景的話，所作出來的畫也只能是形似，達不到神似，更不用提自己創作了。這篇文章就是想討論幾點現代藝術家在創作過程中的思考，并扯一扯這些思考與用戶界面設計的一些微妙的聯系。
雖然從事著UI這個行業，作者的大學專業卻是藝術史。經過了四年的專業洗（cui）禮（can），對從古至今的藝術的變革歷程有了一個客觀的、系統的了解。當看到吃瓜群眾們從媒體引用有關藝術品的觀點時，作者時不時要為他們擦一把冷汗。許多看上去好似極易上手、平庸無奇的作品實際上是藝術家做了無數次加減法的結果。
圖2
當時作者的期末考試便是背畫名，畫家，及作畫時間。想象一下，每日盯著幾百幅畫作背誦它們創作的時間、地點、創作媒介是件多么美（nao）好（can）的事情！所以在經歷了這樣的洗禮后，作者每接觸一個與曾經背過的畫有類似元素的圖像時，腦中就如數據庫般調出那幅畫的圖像記錄。自然到好似自己已變成一個移動的藝術品數據庫（真是感動不已）。
這種感覺作者稱之為“回光返照”之感，即在有意識的情況下，你所接收到的信息令你回想到了過去所接觸到的信息，下意識地與之形成對比。那么在UI的世界里，我們能否尋覓到現代藝術的影子呢？
一、格子，格子，格子
先看它：
圖3，大眾點評APP 主界面
在許多令作者印象深刻的UI風格中，最典型的就數已遍地開花的“方格子風格”，或“網格化風格”。比如上面大眾點評的APP主界面，也如Windows Surface Pro的主屏界面：
圖4 ，WINDOWS 移動端操作系統主界面
大家一定在想，作者的數據庫此時調出的是哪位藝術家的作品？
？
？
？
？
？
？
？
？
？
？
答案是：
圖5，COMPOSITION A, PIET MONDRIAN, 1923 (OIL ON CANVAS)
方格子的設計讓作者分分鐘聯想到了蒙德里安啊！
網格化風格在近年來已被廣泛地應用于許多主界面的設計當中，如上面截圖的Windows Surface Pro和許多文件管理APP和游戲APP。對于Windows Surface Pro來說，這樣的設計旨在將多樣化的軟件和文件快捷方式均勻且富有變化地排布在桌面上，它相比于傳統的Windows桌面快捷方式更為生動，并可以緩解用戶使用時的乏味感。有人這么總結過，“網格的最重要的用處是為一個構圖中如何定位元素而建立一套規則。一個有效的網格不僅定義著它的度量，也為設計增添了韻律，。”（引用1）之所以作者想到了蒙德里安，不僅因為表面上可以看到的“網格”風，更在于它與網格化設計共同想體現的一種富有變化的韻律。下面這幅畫的靈感取自于紐約曼哈頓的百老匯街道。
圖6，PIET MONDRIAN. BROADWAY BOOGIE WOOGIE. 1942-43 (OIL ON CANVAS)
繁榮熱鬧的百老匯街道被蒙德里安用抽象化的方式濃縮進橫豎交錯的網格，而散布在網格上的較小的方格則代表了川流不息的車流和人群。在表現“歡騰、熱鬧”這一主題時，除了錯落的網格，網格中填充的顏色同時起到了至關重要的作用。當作者看到Windows Surface Pro的主界面時，第一個感受到的也是界面的非靜止性。當代表著不同意義的方格被同時呈現在一個界面、由直線相互連接著時，觀者的目光不再是靜定的，而是沿著各色格子的邊框而不斷跳躍。
二、極簡的標志
在藝術不斷被“現代化”的過程中，有一個非常關鍵的詞匯，那就是“簡化（simplify）”。幾乎所有經典的，傳統的畫作中常見的特點，如精致的人像或物件輪廓、一絲不茍的質地描繪、對眼見之物準確完整的再現，都在藝術的現代化進程中，被一點一點地抹去了。簡化有一個關鍵的目的：讓觀看者更加專注于剩下的部分。通過做減法，藝術家們逐漸學會了有目的性的只留下他們想呈現的部分。古典藝術很像是復刻了照片，每一個細節都完美展現，而現代藝術作品則是往截然相反的方向發展，盡可能地簡化現實中的景象，濃縮成簡化的形態。
請看Picasso不同時期的作品對比：
圖7左，AUTOPORTRAIT, PABLO PICASSO, UNKNOWN DATE (OIL ON CANVAS)
圖7右，AUTOPORTRAIT, PABLO PICASSO, 1907 (OIL ON CANVAS)
人們熟知的畢加索是右邊這張圖代表的風格，而孰不知風格大膽的畢加索也曾經做過循規蹈矩的好學生。同樣是自畫像，畢加索把自己化成了完全不同的樣子。事實上，從寫實到抽象的描繪方式的不同，是現代藝術相對于古典藝術的一大革新之處。
如果上面畢加索作品的對比不夠深刻，請參考這組：
圖8左，米老鼠, WALT DISNEY
圖8右，DAMIEN HIRST – MICKEY (2014)
米老鼠竟還可以這樣畫？而如此幾何化之后，我們竟然還能認得出它是什么。這與UI設計中的扁平化好像如出一轍？是的，無需完整的邊描，僅僅使用基本的幾何形狀依然可以呈現物件最基本的結構，UI設計也是如此。
若要談UI設計，就不得不談icon這個不可或缺的基本元素，以及近年來被極度推崇的扁平化設計。而從擬物化到扁平化的設計發展，就如古典藝術至現代藝術的進程。過度的設計容易使人產生視覺審美疲勞。在電腦普及的短短幾十年內，icon的風格已從最早的精致刻畫逐漸發展到今日扁平化、極簡化、幾何化的風格。
iOS 6 和 iOS 7 的對比：
圖9
陰影被弱化，紋路被舍去，字體纖細了，也不再有攝影精度的圖片出現在icon內，取代而之的是平鋪的色塊和精簡的幾何形狀。生活中的物件被不斷抽象化，提取至幾條簡單的線條。icon的設計進化似乎借鑒了藝術的現代化，不再具象、立體。因而不得不說，不管是在藝術作品還是UI設計中，精簡化都是一個必要的走勢。
三、模糊的意義
最后要比較的一個UI效果是它：
圖10，WINDOWS VISTA
沒錯，就是毛玻璃效果。對此類設計最早的接觸來自于Windows vista的窗口欄。那時作者對印象派的了解并不深。而后正式學習了印象派的定義時，才意識到，如今在OS 8.0中隨處可見的毛玻璃效果原來與印象派有著異曲同工之妙。請看莫奈的霧蓮系列作品：
圖11，CLAUDE MONET, WATER LILIES, CA. 1915-1926
被譽為最喜愛霧霾的藝術家，莫奈的創作特點是舍去對具象物體的描繪，而反過來通過描繪光影對物體的效果來呈現物體本身。他的目的是營造一種光影的氛圍，而不是具體體現任何一個具體的物件。
莫奈這樣描述他的“Water-Lilies”，’創造一種沒有盡頭的整體感，一種沒有水平線或邊岸的水平面’（引用2）。距離和角度已被摒棄，水好似無限地延伸到了我們整個的視覺中。
而作者轉念一想，在UI中對毛玻璃的運用不亦如此嗎？通過模糊背景、卻保留背景的光影，使得原背景中較為銳化的顆粒得以模糊化，為浮于上層的功能性控件提供了極好的背景效果。它使窗口內的文字清晰呈現，卻又維持了大環境的色澤、光影的流向，得以讓我們的視覺沉浸在無限廣闊的背景當中。試著把莫奈的作品置于常用的天氣APP的背景，即是如下的效果：
圖12，IOS UI
毛玻璃的作用效果與莫奈的光影處理如此相似，著實耐人尋味，讓人不禁感嘆到藝術的博大精深。
最后，寫給吃瓜群眾這些話：
籠統得說，設計和藝術的區別在于，設計更有目的性，它為特定的用戶、需求而存在，而藝術更加自由、主觀。盡管如此，在現代藝術的極簡化道路中也不乏與UI設計思路相謀的地方。上面列舉的只是作者發現的UI設計中與現代藝術的幾處微妙的聯系。拋開商業化、功能化、用戶需求這些詞語，設計和藝術的區別也許并沒有那么明顯。我們只是需要用一雙開闊的眼睛去感受這些視覺的變化，這些不同時空里的匠心獨運。
怎么樣，是不是對藝術和設計的關系有了全新的認識？想不想嘗試一下回光返照的美好感受？快去豐富下自己的數據庫，開始背畫吧。可以先從《教你看100幅世界名作》開始。來，作者悄悄告訴你一個快速背畫的秘訣……：
…
…
…
…
…
…
…
…
那就是，
沒有秘訣。
原文鏈接: dianrong
]]>
#p#副標題#e#
#p#副標題#e#
UI的本意是用戶界面，是英文User和interface的縮寫。從字面上看是用戶與界面2個組成部分，但實際上還包括用戶與界面之間的交互關系，所以這樣可分為3個方向，他們分別是：用戶研究、交互設計、界面設計。
1、用戶研究
用戶研究包含兩個方面：一是可用性工程學（usability Engineering），研究如何提高產品的可用性，使得系統的設計更容易被人使用、學習和記憶；二是通過可用性工程學的研究，發掘用戶的潛在需求，為技術創新提供另外一條思路和方法（consumer insight）。所以有：Usability is all about making things easier to use so people can focus more on the work and less on the tools that help them do the work.
用戶研究是一個跨學科的專業，涉及可用性工程學、人類功效學、心理學、市場研究學、教育學、設計學等學科。用戶研究技術是站在人文學科的角度來研究產品，站在用戶的角度介入到產品的開發和設計中。
用戶研究通過對于用戶的工作環境、產品的使用習慣等研究，使得在產品開發的前期能夠把用戶對于產品功能的期望、對設計和外觀方面的要求融入到產品的開發過程中去，從而幫助企業完善產品設計或者探索一個新產品概念。
他是得到用戶需求和反饋的途徑，也是檢驗界面與交互設計是否合理的重要標準。
2、交互設計
這部分指人與機之間的交互工程，在過去交互設計也由程序員來做，其實程序員擅長編碼，而不善于與最終用戶交互。所以，很多的軟件雖然功能比較齊全，但是交互方面設計很粗糙，繁瑣難用，學習困難。使用這樣的軟件后，不是使人聰明與進步而是讓人感到愚弄與羞辱。許多人因為不能操作電腦軟件而下崗失業，這樣的交互使電腦成為讓人恐懼的科技怪獸。于是我們把交互設計從程序員的工作中分離出來單獨成為一個學科，也就是人機交互設計。他的目的在于加強軟件的易用、易學、易理解，使計算機真正成為方便地為人類服務的工具。
3、界面設計
在漫長的軟件發展中，界面設計工作一直沒有被重視起來。做界面設計的人也被貶義的稱為“美工”。其實軟件界面設計就像工業產品中的工業造型設計一樣，是產品的重要買點。一個友好美觀的界面會給人帶來舒適的視覺享受，拉近人與電腦的距離，為商家創造賣點。界面設計不是單純的美術繪畫，他需要定位使用者、使用環境、使用方式并且為最終用戶而設計，是純粹的科學性的藝術設計。檢驗一個界面的標準即不是某個項目開發組領導的意見也不是項目成員投票的結果，而是最終用戶的感受。所以界面設計要和用戶研究緊密結合，是一個不斷為最終用戶設計滿意視覺效果的過程。
]]>– 什么是 GUI Graphics User Interface 圖形用戶界面――lightant 有時也稱為WIMP=Window/Icon/Menu/Pointing Device 窗口、圖標、菜單、指點設備――子木1977
– 什么是 HUI Handset User Interface 手持設備用戶界面――子木1977
– 什么是WUI Web User Interface 網頁風格用戶界面 ――子木1977
– 什么是用戶界面設計： 在人和機器的互動過程（Human Machine Interaction）中，有一個層面，即我們所說的界面（interface）。從心理學意義來分，界面可分為感覺（視覺、觸覺、聽覺等）和情感兩個層次。用戶界面設計是屏幕產品的重要組成部分。界面設計是一個復雜的有不同學科參與的工程，認知心理學、設計學、語言學等在此都扮演著重要的角色。用戶界面設計的三大原則是：置界面于用戶的控制之下；減少用戶的記憶負擔；保持界面的一致性。 （詳細請看http://www.chinaui.com/bbs/dispbbs.asp?BoardID=17&ID=12889）
– 什么是IA: information Architect 信息架構――Ryana
– 什么是UX: user experience用戶體驗――Ryana
– 什么是HCI: human computer interaction人機交互――Ryana
– 什么是CHI: computer-human interaction人機交互――Ryana
– 什么是UCD: user -centered design用戶中心設計――Ryana
– 什么是UPA: usability professionals’ association 可用性專家協會 ――Ryana
– 什么是AI： Adobe Illustrator ；目前最權威的矢量圖繪制軟件，*.ai是它的格式文件。――cuckoo IA在指一項工作的時候是 Information Architecture， 指從事這項工作的人的時候是 Information Architect――空氣
– 什么是CD： CorelDraw ――etomcat 強大矢量圖繪制軟件。別以為是音樂光碟呀！ ――cuckoo
– 什么是PS： 在這里不是指游戲機，是目前最強大的圖形編輯軟件Adobe photoshop。 ――cuckoo
– 什么是ID Industry Design 工業設計哦,不是Identity(身份證明)――lightant ID 就是identification Proof or evidence of identity, 確認身份的證據或證明――kkkksunday
– 什么是MMI Man Machine Interface人機接口,MMI是進行移動通信的人與提供移動通信服務的手機之間交往的界面。包括硬件和軟件。――lightant
– 什么是Design House 業內稱手機設計公司為Design House。――lightant
– 什么是Blog： Blog，是Weblog的簡稱。 Weblog，是Web 和Log的組合詞。Web，指World Wide Web；Log，原義是“航海日志”，后指任何類型的流水記錄。Weblog 是在網絡上的一種流水記錄形式。 Blogger或Weblogger，是指習慣于日常記錄并使用Weblog工具的人。
– 什么是RSS? 它是什么：站點用來和其他站點之間共享內容的簡易方式（也叫聚合內容）。 RSS使用XML作為彼此共享內容的標準方式。 它代表什么：Really Simple Syndication （或RDF Site Summary，RDF站點摘要）例如：一些免費的軟件能夠讓你閱讀那些RSS使能的站點，比如 NewsIsFree 和 Amphetadesk。 它有什么用處：讓別人容易的發現你已經更新了你的站點，讓人們很容易的追蹤他們閱讀的所有weblogs。――eworker
– 用戶優先級定義： 這是需求文檔里的常用詞，按先后順序把要做的事情擺好，根據項目進度或突發情況可以刪剪一些排在后面的小功能，也就是優先級低的功能。如果優先級為一，那就是有多大困難都要做得事情了。（比較直白）――cuckoo
– iso的后綴是什么 虛擬光驅，winiso可以，winrar3.0以上的版本也可以打開――藍色檸檬 ISO 是指 International Organization for Standardization 國際標準化組織――大傻不傻
– 什么是pop 廣告里是標題廣告的意思，類似商場里面打出的一些促銷標語。軟件里就是彈出的意思。――怒放 簡單的說有流行字體的意思――SHE2008 指的是銷售點廣告！――anson007 ＰＯＰ－point of purchase advertising的縮寫。譯為＂購買時點廣告＂／店頭廣告，是一種促銷廣告。――piao5275
– 什么是模版 模版在這里指的是網頁模版，是當網站中有許多頁面版式色彩相同的情況下，將其定義為模版，并定義其中部分可編輯，部分不可編輯，那么在利用模版制作其他頁面時就會很方便，不易出錯。――大阿波
– 什么是圖標 圖標是具有明確指代含義的計算機圖形――kkkkSunday 桌面圖標是軟件標識，界面中的圖標是功能標識。――cuckoo 廣義――具有指代意義的圖形符號，具有高度濃縮并快捷傳達信息、便于記憶的特性。應用范圍很廣，軟硬件網頁社交場所公共場合無所不在，例如…..男女廁所標志…..各種交通標志……狹義――計算機軟件方面的應用，包括：程序標識、數據標識、命令選擇、模式信號或切換開關、狀態指示……狹狹義――.ico/.icl文件….――danae
– 什么是demo 演示――kkkkSunday demo是樣本,用于演示目的.――Ryana
– 什么是RIA Rich Internet Applications 富因特網應用程序――大傻不傻
– 什么是SPI Software Process Improvement 軟件過程的改進――大傻不傻
– 什么是SPA Software Process Assessment 軟件過程評估――大傻不傻
– 什么是SCE Software Capabili Evaluation 軟件能力評鑒――大傻不傻
– 什么是UML Unified Modeling Language 統一建模語言――大傻不傻
– 什么是RUP Rational Unified Process 軟件建模過程――大傻不傻
– 什么是CMM Capability Maturity Model for Software 軟件能力成熟度模型――大傻不傻
– 什么是IEC International Electrotechnical Commission 國際電工委員會――大傻不傻
– 什么是ITU International Telecommunication Union 國際電信聯盟――大傻不傻
– 什么是W3C World Wide Web 萬維網聯盟――大傻不傻
– 什么是IETF The Internet Engineering Task Force 互聯網工程任務組――大傻不傻
– 什么是OASIS Organization for the Advancement of Structured Information Standards 結構信息標準化促進組織――大傻不傻
– 什么是DCMI Dobin Core Metadata Initiative 都柏林核心元數據先導計劃――大傻不傻
– 什么是IRG Ideographic Rapportuer Group 漢字特別授權工作組――大傻不傻
以下為 子木1977 提供：
DB = Date Base 數據庫
DNS = Domain name Server 域名服務器
PDA = Personal Digital Assistant 個人數字助理
BCS = Ballistic Computer System 彈道計算機系統 [軍]
ERP =Enterprise Resource Planning 企業資源計劃
SAP = Satellite Automation System 衛星自動控制系統
OS = Operating System 操作系統
OSF = Open Software Foundation 開放軟件基金會
OO = Object Oriented 面向對象
OOA = Object Oriented Analysis面向對象分析
OOD = Object Oriented Design面向對象設計
OOP = Object Oriented Programming面向對象程序設計
JAR = Joint Application Requirement 合作應用程序需求
JAD = Joint Application Design 合作應用程序設計
BUG = Business User Group 業務用戶團隊
CASE = Computer-Aided Software Engneering 計算機輔助軟件工程
UIMS = User Interface Management System 用戶界面管理系統
DSC = Decision Support Center 決策支持中心
SMOP = Small Natter Of Progamming Units 小型程序單元注：1SMOP = 半個程序設計日（4小時）；1周 = 32個程序設計小時。
FUPRID因子：用戶界面問題可按FUPRID分類。 F = Feature 功能特性 U = User interface 用戶界面 P = Performance 性能 R = Reliability 可靠性 I = Installability 可安裝性 D = Documentation 文檔化以下不是嚴格的定義，只是提供可進一步理解的闡述。特性指的是滿足任務需求的充分的領域和用戶界面功能。用戶界面指充分的形象（外觀）、行為和為了完成用戶任務而進行的用戶交互（感覺）。性能包括批處理或者整個后臺任務的評估?？煽啃员唤忉尦僧a品的基本質量，術語稱之為零缺陷行為?？砂惭b性指的是設置和安裝的容易程序，這與軟件的初次使用有關。文檔化包括所有形式的用戶協助和性能支持的文檔化。無論是硬拷貝形式還是在線幫助的形式，都要求有文檔提供有關產品使用的支持信息。
]]>
現在我們的軟件產品存在的一些問題有技術方面的問題，但是更多的問題來源于各個部門、各個項目小組的之間的配合。我們現有的開發流程一般都是由市場部門提出客戶需求，產品設計人員提出產品設計報告，開發部門設計開發計劃，由各個小組分別開發一個模塊，最后整合成為一個完整的軟件產品。在這些流程之間UI設計應該參與那一個部分，每一個部分應該做到什么地步才可以使產品得到最好的UI設計效果呢？下面我們會在每一個部分具體分析。
首先分析一下現在的問題所在，在一些軟件業比較發達的國家軟件產品的UI設計過程貫穿了軟件開發的自始至終，而且是必不可少的。而在中國產品UI設計并沒有被廣泛接受，就算是已經有了UI設計師的一些企業也沒有對產品的UI有著足夠的重視，一般來講他們大都會把重點放在如何使用代碼實現所需要的功能，在我看來這只是一個成功軟件產品的一個部分。一個優秀軟件產品的開發過程應該是由四個部分組成：
1.軟件產品的設計（業務建模）
2.系統的設計（技術建模）
3.分單元的開發（把軟件各個部分拆分分單元編寫代碼）
4.測試（分為單元測試、系統集成測試和產品功能測試），這些是由軟件研發部門做的工作。
除去以上軟件開發過程的四個部分還有用戶需求和用戶驗收測試，這兩個過程是由市場部門和產品用戶一起完成。所以說用代碼實現產品功能（coding過程）只是軟件開發的一個步驟?，F在我們回到UI設計的角度來看，作為UI設計人員我們需要全程參與到軟件開發過程中，而不只是在某一個步驟參與，現在在大多數軟件企業里UI設計師只是在產品的coding過程的時候才實質性的參與到軟件開發過程里，而在其它幾個步驟里只是參加甚至根本沒有參加（在這里我要強調“參與”和“參加”是兩個詞的不同概念，“參與”指的是完全加入到開發行列開始進入設計階段，而“參加”指的只是旁聽會議或者提出一些簡單的意見并沒有開始進入設計階段），這樣就會大大降低軟件產品的開發效率使開發成本成倍上升甚至導致整個產品的不成功！這并不是危言聳聽，下面我們分析一下在一個軟件產品的開發過程中UI設計應該怎么做、做到什么地步才能避免上邊提到的那些問題？
下面我會根據軟件開發的過程解釋上邊的問題，剛才我提過軟件開發過程的幾個步驟，
1.產品建模
2.技術建模
3.分模塊開發
4.測試，那么我們也分為這四個部分進行討論：
一.產品建模時期：
我們首先來了解一下“輸入”和“輸出”，在UI設計里是很重要的兩個概念，經常會有人過來對我說“我們有一個軟件產品需要美化一下”然后再也沒有什么深入的解釋了，僅僅這句話我的工作就要開始了，然而這個軟件是給誰用的？是干什么的？我們卻一無所知！成功的UI設計首先要有完整的“輸入”，怎么才能叫做完整的“輸入”呢？也就需要UI設計師從整個軟件產品的策劃階段就開始介入，在產品用戶（也就是客戶）向市場部門或者產品部門提出產品需求的時候就要開始參與到產品策劃開發過程中來，這一部分對于UI設計師而言就是第一個輸入階段，并且在這個階段里UI設計師也需要提出一些對產品交互設計的意見，以便產品部門在做產品設計的時候更多的考慮到產品的交互性和功能的簡單表現原則，有很多軟件在設計階段就被加入了許多并不是用的附加功能，其實一個好的軟件設計就是要用最簡單的結構實現用戶的想法，一些可有可無的功能看上去很花哨往往會影響用戶的判斷能力，這些就是產品優化的一些概念了在此我需要簡單的提一下如果想要深入研究可以看一些有關于產品優化的書籍甚至是心理學的書籍，有很多人認為軟件的優化就是代碼的優化（用最少的代碼實現產品功能），在我看來這只是程序的優化是針對程序員而言的而不是整個軟件產品的優化，產品優化包含了交互設計在現在的多數軟件企業沒有專門做這一部分的交互設計師所以往往這一部分被忽略，我認為這一部分應該又UI設計師承擔起來，從文章的開頭我就說過UI設計不只是圖形界面的設計，就算是有企業里邊有這樣的優化人員或者交互設計師他們也要和UI設計師一起配合完成產品交互設計，作為UI設計師產品的交互性和易用性是在做設計的時候必須考慮的！
言歸正傳，產品設計人員經常不會過多考慮簡單易用原理也就是產品出來用什么樣的組合形式體現給用戶，這也是UI設計師考慮最多的事情，所以UI設計師一定要在產品建模期間參與設計，給產品設計師一些意見。作為一名優秀的UI設計師我們還要在了解了產品的需求之后更深入了解這個產品的使用環境和用戶群體的使用習慣。我們還需要了解市場上的同類軟件產品的設計方案，研究他們的優缺點，以便在我們設計的時候吸取它們的長處避免它們的錯誤。在產品建模之后一般的都會由產品設計人員給客戶做一次功能設計講解，往往這樣的講解只是文字性質的需要讓客戶想象著理解，這就會造成很大的隱患有的客戶根本無法理解你的講解甚至對這樣的講解根本不認真聽，因為他們根本不懂，在討論過程中他們經常會同意產品設計人員的一切設計想法但是產品測試的時候他們又會提出種種不滿意，我想這是一般的軟件公司都會遇到的也是最最頭疼的事情，但這并不能怪客戶我說過客戶只會關心視覺效果和軟件的操作而并不會去關心我們是怎么實現這一切的。這種情況帶來的直接后果就是產品的反復修改開發成本成倍上升，怎么避免呢？這就要靠UI設計師了，俗話說“眼見為實，耳聽為虛”，所以需要UI設計師做出一個產品整體效果的demo。這個demo用圖片的形式表現就可以，我們只需要將要體現的產品界面做一個拼湊就可以了，因為這并不是產品的最后樣子，只是協助產品設計人員給客戶講解產品設計。產品建模時期UI設計師要了解客戶的要求想法和產品設計人員對產品功能的要求深入了解產品，采集用戶的使用需求、使用環境和使用習慣，了解市場同類產品的設計分析它們的優缺點。協助產品設計人員完成產品建模過程并制作產品展示demo模擬用戶對主要功能的操作過程和界面呈現，生成交互原型（基本上產品的交互性和易用性問題都需要在產品建模的時期解決）。如果時間允許我們甚至可以提出一份“UI設計分析報告”，這份報告可以附在產品設計說明后，更有效的幫助客戶了解我們的產品設計并且幫助開發人員更好的遵循UI的整體要求來完成開發工作。這個時期的關鍵是“交互設計”。
二.技術建模時期：
在這個時期作為UI設計師我們已經了解了軟件產品的功能需求并且拿到了一份產品設計人員的產品設計說明，可以進入界面樣式的設計過程了。這個時候我們應該考慮更多的應該是產品的整體風格和界面的設計，通常我們也會做出幾份方案給客戶選擇。有些客戶會要求產品遵循一個整體的VI設計標準，那么我們就需要按照一個整體的已定的風格去設計軟件的界面，要與客戶公司的企業形象吻合。在這個時期軟件的UI設計進入到了美術設計階段，我們需要制定整個軟件的風格，塑造軟件的整體形象，并且具體的描述每一個界面中的元素和布局、文字字體等信息。在這個階段我也不應過多的說什么，主要是每個UI設計師各自發揮你們的藝術專長用最簡潔、最漂亮的界面表現軟件產品。需要注意的就是在我們設計整體風格的時候一定要深入了解這個產品的理念，看看它是干什么用的。不同的產品要有不同的風格，這里邊有很多的細節注意，不同的產品、同類的產品不同的內容、不同的傳播介質，這些都會決定UI設計的風格。1.不同的產品：比如一個游戲產品就需要將界面做的花哨一些或者用大的圖片充斥；如果要是一個應用軟件就需要突出使用方便和強大的功能設計要簡潔。2.同類不同的內容：比如一個可愛的游戲產品（像是卡通類游戲）就需要將界面做的活潑生動可愛一點；如果是一個角色扮演的戰斗類游戲（像是槍戰闖關類游戲）就要做的酷一點深沉一些。3.不同的傳播介質：我們要做的軟件產品有的需要在網絡上傳播那么就需要我們考慮到網絡速度的問題；有的就是利用光盤當作介質那么這樣的軟件就可以做一些比較花哨的效果。所以說不同的產品還需要單獨考慮，這也需要UI設計師多多了解產品，保持與客戶交流。還需要重點注意的就是我們在做圖形化設計的過程中千萬要貫徹在前一個階段做好的交互設計，始終注意產品的交互性和易用性。在設計過程中我們一定要做出每種結構每一個步驟的效果圖，不能只提供圖標、按鈕、背景圖等圖片，這樣的話程序員根本不知道往那放這些東西，在這個時期我們就要最終確定軟件界面的呈現形式。技術建模一般是由高級程序員完成的，他們會將整個軟件開發分為一個一個功能模塊，分配給一個一個的開發小組。但是這些負責技術建模的高級程序員考慮更多的往往是如何將整個設計用代碼實現、怎么才能更有效的復用以前已有的模塊等等，而不是軟件是什么模樣會有什么樣的風格，所以作為UI設計師我們必須主動出擊，多多和他們交流以保證我們的想法能夠完整的實現，如果有技術實現的問題我們還要及時做出修改。有時候我們還需要根據客戶或者產品的特定需求做一些延伸性的設計（也叫UI產品設計的外延），包括：軟件的安裝導航界面、產品的演示宣傳動畫、一些附帶的桌面壁紙或者屏幕保護、代表軟件的卡通小精靈、有時還會被要求設計軟件的logo和廣告banner等等。技術建模時期的關鍵是“風格和界面設計”。
三.分模塊開發時期：
這個時期軟件開發過程進入實現階段，也是需要人力最多的時期，這樣就會分散UI設計師的精力。軟件會被切分為若干個小的模塊進行代碼編寫，最后整合成一個完整的軟件產品。對于一個程序員來講他們大多根本不會考慮到產品應該是什么樣子應該有什么整體風格，他們所考慮的只是如何用代碼實現設計的要求，而且在現在的軟件企業多都實現了模塊的復用，這樣會大大節約人力成本，那么程序員只是對原有模板進行修改使之適應新的軟件產品，這樣就會對UI設計的最終貫徹和實現帶來很大的麻煩。做出的每一個模塊雖然已經能夠使用但是都是“各自為政”沒有統一，因此我們也需要主動的協助和監督程序員完整的實現UI設計的要求，如果有技術無法實現的問題需要及時溝通改正設計方案。有的時候有些模塊需要有單獨的風格，比如一些已有的軟件產品需要集合到某一個新的產品中去，這樣就會加大了設計師的設計難度，我們必須要在保證產品整體風格不變的情況下將原有產品的設計風格集合進去，使之更加適合新的產品表現形式。如果我們仍舊保持原有產品的風格那么當各個模塊集合起來之后往往會使新的產品感覺很松散，進入每一個功能都會覺得是另外一個軟件，使人對軟件的印象不深刻。在這個階段我們還是要主動一些，跟進各個模塊界面的實現?，F在很多軟件企業都存在很多UI設計師和程序員的協作問題，不是程序員做不到UI設計的要求，就是UI設計師堅持一些自己的想法不能改動，還有的時候經常會有人過來沒頭沒尾的說幫我做點東西吧！當軟件集成到一起再一看，就是很多不同風格的東西堆砌到一起，從頭到尾都不舒服，領導或者客戶看了以后極度不滿狂批一陣，最后得出結果UI設計做的不到位。有人說UI設計師就要背著軟件不成功的黑鍋，因為人們根本看不見代碼怎么寫的，功能是怎么實現的，他們只知道對軟件的樣子和使用進行評論。讓一個用戶評論一個軟件他們只會說這個軟件好用看上去也不錯挺漂亮的，但是做為一個普通用戶決不會有人說這個軟件程序寫的不錯。這么一看我們會聯想到現在軟件開發之中主要的沖突在UI設計師和程序員之間，其實這只是表面的表現形式。實質上這個現象體現了現在軟件企業的一個通病就是這個開發組之間的協作關系混亂，程序員和UI設計師之間是平級協作關系，程序員是不會對產品負責的，這樣看來UI設計師只應該聽項目經理的，無論對設計做什么樣的改動或者增添什么樣的東西，都應該由開發項目經理和產品經理協商之后決定，只有他們可以對最終的產品負責。這樣也可以避免很多程序員和UI設計師之間的爭執和矛盾。但是現在大多說軟件企業的產品經理和開發項目經理沒有做到這一點，他們也根本不了解UI設計師和程序員的工作，也無法把握他們的工作量，這樣無序的管理會造成很麻煩的后果。其實可以建立一些合理的流程管理制度，就算企業沒有作為UI設計師也可以自己起草一份適合自己和企業的“UI設計需求申請單”，里邊應該列出我們需要的“輸入”內容、工作時間、最終的“輸出”結果等等欄目（可以自己根據要求靈活決定）。這樣形成一個有參與人、有依據、有存底的工作流程，出現問題或者爭執的時候我們有據可依，這只是一個習慣性的東西因不同的企業而議不一定都要建立需求單。在分模塊開發時期UI設計師應該做的是，在模塊開發的前期做出產品每個模塊的效果demo（可以用圖片的形式表現）要求程序員按照demo的樣式進行模塊開發，協助和監督程序員嚴格按照UI設計要求生成最終產品，把握各個模塊的統一，經常了解程序員的工作進展及時對不合理或者難以實現的設計進行討論設計出新的方案。分模塊開發時期的關鍵是“協助和監督程序員生成最終產品”。
四.測試時期的輸入和輸出：
軟件產品的測試會分為三個測試階段，第一個是分模塊開發完成之后每一個模塊進行的單元測試；第二個是將各個單元集成為一個整體的產品進行集成測試；第三個就是整個產品在交付使用前進行的整體測試。在測試過程中UI設計師的任務相對會輕松一些，我們只需要跟著測試人員走幾遍流程，如果在其中發現沒有按照UI設計要求的部分及時要求改正就好了。我們還會經常遇到客戶在測試過程中突然覺得那里不合適需要修改，這也是最最頭疼的事情了，有的時候他們說的并不一定對，只要我們設計的每一個步驟都有一定的道理能夠說服他們就一切ok了。如果他們執意要修改設計方案，那么我們沒辦法只能按照客戶需求修改。但是如果前邊按照本文的流程走下來我想這樣的可能性不大就算是修改也不會是大動干戈。在修改過程中我們還是需要先做出效果圖，讓客戶確定再具體實施，這樣也會避免很多麻煩的。測試時期的關鍵是“檢查整個產品發現問題及時改正”。
如今軟件的越來越多的考慮到人的因素，“以人為本”的設計理念貫穿了整個軟件產品開發的始終，因此軟件產品的UI設計過程最重要的兩個部分就是行為和構造，也就是交互設計和界面設計。上面我們按照軟件開發的四個階段，逐個的分析了每個時期UI設計的任務。由此我們可以看出UI設計并不完全是一個美術設計的過程，還有很重要的一個部分就是交互性和易用性的設計。我們要時刻把自己放在軟件的用戶角度來考慮，設計出最簡單易用，界面友好的軟件產品。
]]>