UI知識，論新手如何單獨完成一款A(yù)PP的設(shè)計(4)

這是公司現(xiàn)在準(zhǔn)備推的優(yōu)品商城APP版。

市面上的商城APP，例如天貓、京東、亞馬遜、唯品會等等都已經(jīng)養(yǎng)成了一定的用戶習(xí)慣，所以在一開始設(shè)計APP的時候，被要求既不能大幅度打破這些人們熟知的用戶習(xí)慣，又要做出自己的特色，這是這次設(shè)計的難點所在。

而公司特色就是分銷返利系統(tǒng)，那就緊抓這個核心猛艸就對了。

第一次做APP，完全是兩眼一抹黑啊，也沒人教T.T

那既然人傻，就多看別人的唄，把前戲做足了！

從《iOS 8人機界面指南：UI元素與設(shè)計尺寸》、《IOS ui設(shè)計常用尺寸及基本知識》、《ios8 設(shè)計快速參考指南》等等設(shè)計規(guī)范，到天貓、京東、蘇寧、唯品會、亞馬遜、掌上管家等等APP，再到Flyme4的設(shè)計、ios9的設(shè)計，網(wǎng)上的優(yōu)秀設(shè)計，甚至是一個WIN10界面窗口旁的一圈描邊也能給予我極大的聯(lián)想創(chuàng)意。

前戲時間越多，后面發(fā)力起來越帶勁（個人感受~）

可能有一些同學(xué)對“抄”這個詞比較忌諱，感覺就是要做自己的東西。

這個我覺得還是要按照具體需求來，如果是極具個人特色的APP，的確應(yīng)該如此。但是這種比較大眾化的APP，還是隨著大眾來會比較好。況且精細(xì)地去解讀學(xué)習(xí)人家的優(yōu)秀設(shè)計，才能知道自己的不足所在。

ICON很重要！

（真的很重要，再說一遍！）

如果說布局是一個人內(nèi)在，那ICON就是那巨大的歐派！

70年代的名人祖爾金的名言“我最厲害”，套用在ICON身上最合適不過了。

不過畫ICON的確是一件很折磨人的事。

贊美扁平化，讓這一工作變得沒有那么繁瑣。

前期就是多試試，保存下每一次不滿，說不定會突然發(fā)現(xiàn)“我了個艸，這個不錯”，然后抓住這個特點，猛艸就好了。

這里推薦使用最新的PS CC2015版本，畫板功能在做多頁面的時候很贊，不容易偏離主體風(fēng)格。不過對電腦要求比較高，我的小筆記本跑的要死要活的。

其實做不同頁面最簡單的做法還是死抓一個要素，可以是一種顏色或多種搭配的顏色，或是框體風(fēng)格，甚至可以是你之前畫的ICON風(fēng)格等等。只要讓人一看有統(tǒng)一感即可~

這次制作周期較長，準(zhǔn)備工作做得比較足，最終效果還是可以接受的。

不滿之處當(dāng)然有很多，比如部分ICON畫的整體性不足，沒有制作動效等等，但畢竟是自家的孩子，而且還是大寶貝，我個人還是很喜歡的~

也歡迎大家多說說壞話。老家有一種習(xí)俗，對著別人家的孩子說鄙俗之語，孩子長大了反而會反著來。做設(shè)計不也是這樣嘛？

最后跟大家一起探討一個標(biāo)線的問題

因為安全框，所以我們畫的圖標(biāo)肯定要小于真正的尺寸，如圖中的紅色ICON。而外圍灰色部分則是他的真正大小。

但是在標(biāo)尺寸的時候，我見過一些人的做法是就是上圖的藍線，直接拉到ICON身上。這樣做就是方便。

而我認(rèn)為應(yīng)該像最正確的做法應(yīng)該是綠線，但這無疑加大很多工作量，因為ICON外圍是透明的，在PS中不顯示，需要額外再畫出真實框體。

跟公司的程序員討論，他一開始是讓我標(biāo)藍線那種，我跟他討論有以后，又覺得綠線更合理。。。有點不大靠譜

大家是怎么看這個問題的呢？