網頁設計後PSD時代(Post-PSD Era)

我們已經進入了網頁設計的後PSD時代了嗎？

在我的整個職業生涯，我常常看到非常有才華的設計師浪費了大量的時間來創造一個擁有網站全部細節的PS設計稿，像素被註明，細節效果被費力的展示，頁面列印出來，掛在牆上，呈現給客戶，

客戶據此指手畫腳給出反饋，然後設計師進行修改。如此反覆直到所有人滿意為止（或者沒人再在乎No one gives a shit，出現這種情況比你想象的要頻繁）。只有這個時候這些設計稿才會被提交給（更像是推給More like a push）開發人員來進行構建。

可惜在多裝置（multi-device）時代，這個笨拙的流程正顯得越來越沒有意義。我並不是說要整個的扔掉Photoshop然後完全在瀏覽器上進行設計（Chrome開發工具又哪裡有混合模式呢？），而是說在新型網頁設計趨勢下如何更好的理解Photoshop的使用方式和情境。

 

Photoshop適用於（Photoshop is great for）：

建立和編輯映像，正確的廢話，編輯圖形元素這個是PS的駕駛室。

建立設計基調（design atmosphere，如同Andy Clarke所言）: 顏色，結構（textures） 以及整體設計感覺。這個在我看來是Photoshop和瀏覽器開發工具以及紙質設計相比較的最大優勢。

草圖（Sketching） – 毫無疑問Photoshop, 紙張原型會比用代碼構造原型更快。不過，我得說一些工具比如像Codepen，正在變得讓使用代碼構造原型越來越他媽容易。

開發Style Tiles, mood boards, 等等。這些或多或少都和設計風格有關。

 

Photoshop不適用於（Photoshop is not great for）：

創造完整的填滿的設計對象 – 實際上基本不可能在PS裡描述清楚網站所有的環境、分比率、使用者偏好和細節，停止嘗試。停止描述“iPhone view” “iPad view”以及“Cinema display” view。有多得多的情況要處理。

描述狀態、動效(Articulating states) – 對於懸浮（Hovers）, 點擊（clicks）, 以及其他互動元素，直接構造原型比在Photoshop裡的設計低品質圖層對象要好。整個網站工作還有更多方面需要處理（效能、響應性、人類工程學、總體感覺），而不僅僅是視覺差異。使用PS勾勒出一個想法是一件事情，不過依照我的經驗，設計師通常會越過這類事情的邊界。

使用讓你感到舒服的工具，清楚的辨別出什麼時間點什麼程度下會失去意義。充分而合理的使用你工具箱裡面的各類工具，各擅其事，想出辦法和客戶溝通你的設計想法，而不是促使客戶認為會有一個完整的擁有所有細節描述，畢其功於一役的PSD設計圖。

或許類似於軟體開發，這算是產品設計的去瀑布流，把敏捷模式引入到全流程。

iefreer註：原文發表在技術創業微門戶：踏得網（Techbrood.com）