在設計領域，不斷總結與交流是提升自我的重要途徑。在此，我將自己總結的一套新功能引導頁設計思路分享出來，希望能與大家共同探討，也期待大家提出問題和建議。另外，文章中使用到的 2.5D 軸測圖輔助線，我會在文末附件中添加，大家可以下載打印用來畫草圖，也可以在軟件上使用。
首先要明確新功能是什么。我收到運營那邊的文案，主要涉及四個新功能：一是照護計劃全程管理，能讓用戶提前查看規(guī)律復診日期和復查項目；二是全新健康頁面，可使健康檔案、近 7 天自測以及飲食運動數(shù)據一目了然；三是新增發(fā)現(xiàn)頁面，里面有精選的高質量控糖知識供用戶發(fā)現(xiàn)；四是用藥、測量提醒功能，能讓藥物、測量提醒如約而至，讓血糖管理更輕松。
了解到新功能大致內容后，還需要向產品詢問這些具體功能點的使用方式以及解決了用戶哪些問題等。不過由于這些功能的界面設計之前由我完成，前期也和產品有過溝通，所以我就跳過了這一步，但實際上如果不了解功能，這一步是必須要做的。
接下來要思考如何使畫面貫穿文案內容，表達出新功能的特點。這就像做看圖說話的反向題目，要根據文字去構思畫面。首先在腦海里想象各種可能的畫面，然后通過關鍵詞搜索來尋找與腦海中畫面相符的素材，如果想象不到畫面，也可以通過搜索圖片來構建想象。比如想到照護計劃全程管理，我腦海里浮現(xiàn)的是一個控制臺，用戶能全程掌握自己的計劃管理；想到全新健康頁面，會想象用戶運動后查看自己健康數(shù)據的場景；想到新增發(fā)現(xiàn)頁面，會聯(lián)想到用戶探索新功能，打開新世界大門的畫面；想到用藥、測量提醒，會浮現(xiàn)一個人躺著很放松的樣子。
這一步需要收集大量不同視覺風格的圖片來確定視覺方向。為了減少不必要的改稿，我會給產品快速瀏覽搜集到的圖片，一起討論視覺風格的方向。這里并非是要迎合產品的口味，畢竟不是每個產品都對視覺流行趨勢有敏銳的嗅覺，主要是討論時下流行的設計技法以及適合我們產品 App 風格的利弊。如果前期沒有確認好視覺風格，等頁面繪制完評審時才發(fā)現(xiàn)風格問題，就可能導致大量修改甚至推倒重做，影響進程和效率。最后我們討論決定結合手繪和當下比較流行的 2.5D 風格。
繪制草圖是非常重要的一步，一定不要急于直接上機操作。我第一稿快速繪制的草圖比較雜亂，不過到這里思路已經很清晰了。如果時間充足，可以整理一下再繪制一版清爽干凈的草圖。建議像我一樣手繪不太好的設計師，在畫草圖時可以借助輔助線或者網格線。
之后是線稿環(huán)節(jié)。剛開始做設計時，我為了省事，習慣于一邊上色一邊繪圖，其實這樣效率反而更低。就像以前畫畫要先打好型再上色一樣，先畫好線稿更直觀，也便于修改，這其實和先做一個低保真模型類似，后面上色會更順利。
上色時，可以選取與自身產品相關的色調，也可以大膽配色，這取決于想要通過色彩傳達的情緒和品牌感。我這次的配色方案主要基于產品 App 的主色和輔助色進行變化延伸。
接著是增加質感和調整細節(jié)。在畫面上，可以通過增加顆粒等技法讓畫面更有質感，在陰影部分增加雜色，能讓畫面細節(jié)更豐富。添加顆粒質感的方法有很多，既可以在畫面繪制完成后導入 PS 里使用畫筆工具再次繪制，我這次則直接使用 sketch 的顆粒填充并進行調整。最后進行微調，進一步豐富畫面，比如給人物加一個陰影，給手機增加一些光線，添加一些若隱若現(xiàn)的背景等。
調整完成之后，可以使用動效軟件添加一些細微的動效，讓畫面更加生動。不過在這之前，需要和開發(fā)人員談論動效的實現(xiàn)方案。
