產(chǎn)品經(jīng)理通常需要提供產(chǎn)品原型、流程圖和功能說明文檔等給設(shè)計、開發(fā)和測試人員。設(shè)計人員需要根據(jù)產(chǎn)品經(jīng)理提供的文檔，制作效果圖和圖片資源等給開發(fā)和測試人員。而設(shè)計效果圖時的注意事項有哪些呢，深圳APP開發(fā)公司總結(jié)了以下幾點：
（1）設(shè)計師在設(shè)計效果圖的時候，最好按APP適配的最小尺寸設(shè)計布局，且在文字顯示區(qū)域放的字符個數(shù)就是實際要顯示的最大字符個數(shù)，這樣很容易發(fā)現(xiàn)控件顯示區(qū)域不足的問題。如在電商APP中，最長的商品名稱可能有20個字符，那么在效果圖上就要放20個字符。
（2）各種元素區(qū)域的尺寸要符合Apple和Google的設(shè)計規(guī)范要求。如果最小點擊區(qū)域太小，會導(dǎo)致用戶無法正常操作。
對于iOSAPP，就是在iPhone3手機上，也就是@1x分辨率下，最小點擊區(qū)域不能小于44px×44px；對于AndroidAPP，就是在屏幕像素密度為MDPI時，最小點擊區(qū)域不能小于44px×44px。在@2x分辨率和像素密度為XHDPI時，最小點擊區(qū)域不能小于的邏輯像素為88px×88px。
（3）在用戶第一次使用APP時，許多界面沒有數(shù)據(jù)顯示，其內(nèi)容為空。如用戶第一次使用電商APP時，購物車和訂單界面內(nèi)容為空，就需要設(shè)計這些界面內(nèi)容為空時的效果圖。
（4）除了正常顯示數(shù)據(jù)的界面外，還需設(shè)計從服務(wù)器或本地獲取數(shù)據(jù)時的提示界面和無法正常獲取數(shù)據(jù)時的界面。
（5）iPhone手機基本都使用系統(tǒng)自帶的輸入法，在用戶點擊搜索區(qū)域，彈出輸入法軟鍵盤時，軟鍵盤上會顯示按鈕；Android手機上使用的輸入法各式各樣，輸入法軟鍵盤上不一定會有按鈕。在設(shè)計搜索界面時，iOSAPP的右上角通常不需要有按鈕，但AndroidAPP的右上角最好要設(shè)計有按鈕。同時要設(shè)計搜索不到數(shù)據(jù)時的界面。
（6）在設(shè)計搜索界面時，需要設(shè)計有搜索歷史和無搜索歷史的兩種界面，同時明確顯示搜索歷史的個數(shù)。
（7）如果在一塊區(qū)域中，只有一個元素需要用戶點擊，那可適當(dāng)放大這個元素的長度和高度，或設(shè)計整個區(qū)域都響應(yīng)用戶點擊，以方便用戶操作。
（8）在許多APP，尤其是電商APP中，會在購物車、訂單或消息圖標的右上角設(shè)計一個數(shù)字角標，顯示購物車中的商品數(shù)量、訂單個數(shù)或消息個數(shù)。通常會把角標區(qū)域設(shè)計成圓形，如果數(shù)量不到100時，可以正常顯示；超過99，變成3位或4位數(shù)時，往往就顯示不下了，此時有以下兩種解決方案。
“數(shù)字超過99時，顯示99+。”
“改變角標區(qū)域的形狀?！?/span>
如圖1-1所示，左邊的購物車里只有10個商品；中間購物車里的商品個數(shù)超過了99，就用99+表示；右邊購物車里的商品個數(shù)超過了100，達到了1000，把圓形角標改成了橢圓形角標，以便完整顯示1000這個數(shù)字。
圖1-1
（9）在設(shè)計圖片顯示區(qū)域的時候，不同界面圖片顯示區(qū)域的長寬比最好一致。如電商APP在商品列表和商品詳情界面都需要顯示圖片，商品詳情界面的圖片顯示區(qū)域設(shè)計為300px×300px，商品列表中的圖片顯示區(qū)域可設(shè)計為100px×100px，這樣在服務(wù)器端可以只放一張300px×300px的圖片，在APP端的商品列表界面顯示圖片時，服務(wù)器端可把300px×300px圖片的寬度和高度直接都除以3，再發(fā)給APP，而不用擔(dān)心在商品列表界面圖片會變形。
（10）按最新的Google文檔要求，AndroidAPP中各控件的尺寸數(shù)值及控件間的間距數(shù)值最好是8的倍數(shù)。
（11）用戶使用APP的時候使用得最多的操作是點擊操作，要想設(shè)計使用滑動操作，如在消息列表中通過滑動刪除某條消息，最好給用戶某種提示，否則用戶通常不會使用滑動操作。APP開發(fā)公司關(guān)于“APP設(shè)計效果圖時需要的注意事項”相關(guān)知識就介紹分享到這里，謝謝關(guān)注，博納網(wǎng)絡(luò)編輯整理。
