上門無憂
上門無憂app是聯想為上門服務的工程師們提供記錄工單狀態、查詢備件信息、知識庫學習等的一款應用。主要分為“工單、備件、學習、我的”四個模塊,工單主要為工程師提供每一單服務的詳細記錄,工程師需要確認服務的每一個過程,從而確保服務質量;備件主要是服務中的更換備件信息;學習即知識庫,工程師可在其中搜索到各類相關問題;我的——工程的個人信息頁面。
于工程師:可以幫助工程師記憶,為工程師提效減負。
于公司:可以更好的管理每一個工程師,直接為工程師推送通知、對服務交付的細節進行考核。收集用戶信息。
于用戶:可以反饋回來的數據,提前知曉哪個工程師將于何時到達,為他進行服務。
引導頁設計
現在出發/確認到達現場/確認離開現場/確認服務完成
客戶類型、問卷信息、SLA
搜索關鍵詞、文檔分類、相關技術通報
從上圖可以看出,整個引導頁的設計以突出app的主要功能為目的,以粉灰色為基調,而風格則偏向扁平簡約。這主要是考慮到app的設計風格也是簡約為主,以紅灰為主色調,多表單信息等。
引導頁中所使用的顏色,大部分都有app中直接提取,再加上一些同色調的輔助色。
細心的人可能會發現,最后一張主體部分的紅不如其他兩張的顏色重。這是出于面與線的區別考慮,本身面看起來就比線要重,所有選擇適當將面的顏色調亮,來保持平衡。
在引導頁選擇方案的時候,大家都更偏向于簡約清新的風格,起初想做的溫馨一點,著重體現工程師們的貼心服務,后來考慮到app的使用者是工程師們,所以更換為以突出功能為主。
最開始,大家都很喜歡自如這種小清新的手繪風格,色彩溫暖,繪畫精細,風格突出(個人覺得相比較圖來說,字排的不太好看)。就個人而言,我也是想嘗試一下這樣的風格的。
看過整套,就會發現,其實這套引導頁它所有的圖畫與文字的關聯性并沒有那么大,換句話說,也就是把圖形放到其他的話術下,也是沒有問題的。
而這次引導頁的設計中,應該可以看到,每個頁面的話術與圖形的關聯性極強。當然,我的這套引導頁的設計也是借鑒了其他設計的,如下圖:
上圖是我在作圖前的參考頁面,都說天下設計一大抄,在開始一個新項目時,大部分的設計師都會選擇到花瓣、千圖、UI中國、站酷等各類設計網站上找素材,或者尋找所謂的“靈感”,這樣的學習形式其實也挺好的,多去看,發現美的東西并去研究和學習,這也是提升自己的一種方法,但關鍵是怎么樣把別人的東西變成自己的東西。
顯然,我還做的不夠。需要更多的思考,這也算是一次嘗試吧,嘗試分析作品,去看自己的不足。
可以看到,我幾乎是整個借鑒了這個引導頁的風格、形式等,但是具體的內容有很多區別,也做了一些改進。
例如,上圖整套的設計都是以山和云為背景,但實際上這跟它所表現的內容,是沒有任何關系的,所以只是單純的背景。
而我在做的過程中,力求能夠將背景和主題結合起來,起初的兩張關聯性都還不夠,做到最后一張的時候,基本上是有密切的相關性了。
例如,力求風格、元素、顏色上的更加統一,希望能關注更多的細節等等。
結束語
曾經有一個設計師問我(其實是一次面試),你臨摹這個icon,你知道它哪里做的好么?你知道它所在意的細節是什么嗎?問的我一臉懵圈,說實話,在臨摹的時候我確實沒有去考慮它到底為什么好看,于是我只能老實的回答說不知道,并向他請教。
面試官很好,是一個很厲害的設計,于是開始跟我分析那套icon好在什么地方,注意的細節是哪里。于是我知道了,一個高UI跟一個入門級UI的區別在哪里,希望終有一日,我也可以成長到想要的樣子。
其實我一般不喜歡分享自己的設計,因為覺得做得還不夠好,獻丑咯!