從零開始的異化視覺設計， 是一種設計的思維方式。 這是類比一個叫做「Re：從零開始的異世界生活」的日本動漫， 從中得到一些靈感發現也是可以運用到設計當中。 有時候， 我們會苦惱設計能力如何得到更多提升， 此文或許能提供一些參考性的思路和設計方法。
什麼是從零到一？
從一個還只是資訊框架層面到一個可以啟動開發的視覺設計稿， 我會將這個過程稱為從零到一。
舉個例子， 說說我以前遇到這樣一個需求， 是個遊戲分類的清單頁， 是需要左右滑動切換標籤的， 交互圖如下：
一般面對這種交互的時候， 是不是立刻想起了什麼?
沒錯， 就是我們的規範。 成熟產品的大系統下都有自己的基礎控制項的規範， 這些規範的作用是為了保證整個大系統的頁面之間的交互邏輯一致性和視覺的統一性， 就像這樣：
然後我們會習以為常的， 把對應的規範套入對應的交互中， 然後要注意的是間距， 品牌色， 清單樣式。 然後我們就完成了視覺稿， 這個過程就是從零到一， 如下圖：
那麼問題來了， 這樣就夠了嗎？
二.從一歸零再到一有些時候設計師會苦惱為何自己只是符合預期， 很難再往前突破， 或者會產生疑問， 是不是還可以做些什麼？
如果說從把一個交互圖， 套用規範， 或者按照常態去執行視覺， 是一個0到1 的過程， 那是否可以考慮一下， 把這個1歸0後， 再去異化的思考會是什麼樣的結果。
順著這個思路， 我們思考一下， 尋找「1」的問題所在， 我們不難發現它有幾個問題：
文字標題的弊端， 只能通過閱讀文字識別， 是否可以增加圖形化標識。 沒有遊戲氛圍感， 除了圖示， 都感受不到這也是遊戲平臺的頁面。 有點枯燥無趣。那麼進一步思考就是在原來的基礎上， 為了新「1」， 需要怎麼做？
保留重要的不可變動的資訊：列表、標題、左右切換。然後進行各種嘗試， 尋找合適的介面佈局方式， 就可以優化成這樣：
這就是我認為的「從一歸零再到一」。
將已有的視覺設計，通過打散佈局和資訊結果，並將他們通過更優的方式重組，再給一些輕微異化的樣式，就能得到新的視覺稿。
三. 零一的迴圈剛才的案例中我們可以看到一個從「零」到「一」，然後歸「零」再到「一」的過程。
其中最難理解和最難做到的就是歸「零」的過程，歸「零」是指把之前介面中的資訊結構打散並重組，並且還需要優化結構和滿足基本需求。
總結的基本操作方法是：
與產品溝通述求點，瞭解視覺層面需要滿足的內容。瞭解產品未來的趨勢，思考前瞻性的視覺概念。將頁面的所有元素和資訊解組，分析所有資訊屬於哪些類型，整理出不可變動資訊、可變動資訊、可增加的資訊、可變的佈局樣式資訊重組，在思考板式的過程中，就可以將之前分解出來的資訊來重組，可變換資訊就要思考可變換樣式的可能性。通過產品的需求和對設計的預期，不斷嘗試重組資訊結構，找到合適的版式和視覺樣式（注：為了確保自己生命安全和不做無用功，該步驟一定要與交互同學，產品同學和技術同學多多溝通）。這就是「從零」開始的設計方法，往往我們專案的週期會根據專案的緊急程度決定，所以總會有視覺設計週期不同的情況。然而用「從零」方法，是可以在有限的時間裡，不斷的從「零」到「一」，再又從「一」歸「零」的資訊歸納，不斷迴圈，找到最合適的設計。將這個過程叫做「零一迴圈」。
就像把上面的交互圖不斷「從零到一」，我們就可以得到各種不同的視覺稿，從而找到合適的方案。
四. 思考的維度這種從零開始的迴圈思考的方式，會讓我們在設計的時候思考盡可能多的可能性，並根據產品的特性找到合適的方式，也是保證我們的設計是有理可循的。
這個時候，很多小夥伴肯定要問，是怎麼去做這個從零的思考的，這不就是不同的版式方案而已嗎？當然，版式的思考是「從零方法」的一個重要維度，下面也提供幾個不同維度的思路。
1. 互動方式留言板一直是用戶之前使用的功能，但是是否能夠用一些更有趣的方式？之前的留言板是一個一個卡片滑動切換，可以看到別人單條留言，但是效率比較低，而且互動性很弱，所以就思考是不是可以用彈幕的方式去優化，結果會好很多。
把原來的卡片留言板的方式，替換成流行且有趣的彈幕的方式，參與感更強。讓彈幕可以變得更加的有話題性，提升使用者在該主頁的參與量。
2. 情感化融入這是一個情侶之間互動的一個功能，但是單純的在介面裡看到問題和分數，是否有點枯燥？那麼，就可以從情感化的維度思考，能否有一個人性化介質，讓兩個人之間的互動變得更有趣，更有情感。
也可以通過各種其他的維度來從零思考，只要有足夠的時間去做嘗試，我們便可以從中受益。所謂的匠心，也是這種不斷嘗試找到答案的決心。
寫在最後，全文都是以「從零」的思路去探索設計方法論，其實所謂的「從零」就是在得到一個結果的時候，是否可以再往前走一步。
將已有的視覺設計，通過打散佈局和資訊結果，並將他們通過更優的方式重組，再給一些輕微異化的樣式，就能得到新的視覺稿。
三. 零一的迴圈剛才的案例中我們可以看到一個從「零」到「一」，然後歸「零」再到「一」的過程。
其中最難理解和最難做到的就是歸「零」的過程，歸「零」是指把之前介面中的資訊結構打散並重組，並且還需要優化結構和滿足基本需求。
總結的基本操作方法是：
與產品溝通述求點，瞭解視覺層面需要滿足的內容。瞭解產品未來的趨勢，思考前瞻性的視覺概念。將頁面的所有元素和資訊解組，分析所有資訊屬於哪些類型，整理出不可變動資訊、可變動資訊、可增加的資訊、可變的佈局樣式資訊重組，在思考板式的過程中，就可以將之前分解出來的資訊來重組，可變換資訊就要思考可變換樣式的可能性。通過產品的需求和對設計的預期，不斷嘗試重組資訊結構，找到合適的版式和視覺樣式（注：為了確保自己生命安全和不做無用功，該步驟一定要與交互同學，產品同學和技術同學多多溝通）。這就是「從零」開始的設計方法，往往我們專案的週期會根據專案的緊急程度決定，所以總會有視覺設計週期不同的情況。然而用「從零」方法，是可以在有限的時間裡，不斷的從「零」到「一」，再又從「一」歸「零」的資訊歸納，不斷迴圈，找到最合適的設計。將這個過程叫做「零一迴圈」。
就像把上面的交互圖不斷「從零到一」，我們就可以得到各種不同的視覺稿，從而找到合適的方案。
四. 思考的維度這種從零開始的迴圈思考的方式，會讓我們在設計的時候思考盡可能多的可能性，並根據產品的特性找到合適的方式，也是保證我們的設計是有理可循的。
這個時候，很多小夥伴肯定要問，是怎麼去做這個從零的思考的，這不就是不同的版式方案而已嗎？當然，版式的思考是「從零方法」的一個重要維度，下面也提供幾個不同維度的思路。
1. 互動方式留言板一直是用戶之前使用的功能，但是是否能夠用一些更有趣的方式？之前的留言板是一個一個卡片滑動切換，可以看到別人單條留言，但是效率比較低，而且互動性很弱，所以就思考是不是可以用彈幕的方式去優化，結果會好很多。
把原來的卡片留言板的方式，替換成流行且有趣的彈幕的方式，參與感更強。讓彈幕可以變得更加的有話題性，提升使用者在該主頁的參與量。
2. 情感化融入這是一個情侶之間互動的一個功能，但是單純的在介面裡看到問題和分數，是否有點枯燥？那麼，就可以從情感化的維度思考，能否有一個人性化介質，讓兩個人之間的互動變得更有趣，更有情感。
也可以通過各種其他的維度來從零思考，只要有足夠的時間去做嘗試，我們便可以從中受益。所謂的匠心，也是這種不斷嘗試找到答案的決心。
寫在最後，全文都是以「從零」的思路去探索設計方法論，其實所謂的「從零」就是在得到一個結果的時候，是否可以再往前走一步。