平時(shí)我們收集參考時(shí)，總是喜歡去收集界面的參考，而一些小的設(shè)計(jì)往往容易被忽略。這些問題在平時(shí)練習(xí)時(shí)往往很難察覺，到了做實(shí)際項(xiàng)目時(shí)就會(huì)出現(xiàn)各種各樣的問題。

下面和大家分享三個(gè)我在工作遇到的的坑，希望大家能夠提前注意繞道而行。

1. UGC內(nèi)容未設(shè)置舉報(bào)功能。
2. 登陸注冊(cè)時(shí)，鍵盤擋住按鈕。
3. 文字在淺色圖片上對(duì)比度不夠。

一、UGC內(nèi)容未設(shè)置舉報(bào)功能

在App Store審核被拒的原因中有這樣一條：如果你的APP內(nèi)有發(fā)帖等UGC（用戶產(chǎn)生內(nèi)容）功能，必須提供用戶協(xié)議，并留有內(nèi)容舉報(bào)功能，否則就會(huì)被審核拒絕。

這個(gè)功能在設(shè)計(jì)時(shí)很容易被忽略，我之前做的一個(gè)項(xiàng)目就遇到這種情況，當(dāng)提交到App Store時(shí)才知道要加這個(gè)舉報(bào)功能，只好重新添加，然后在提交。

使用場景：根據(jù)App Store的反饋，一般UGC的內(nèi)容都需要加舉報(bào)功能。

該功能多用在資訊類、圖片社交類、電商類等UGC的Feed流中。

該功能一般有兩種展示入口：置于更多圖標(biāo)中；直接置于列表中。

1. 置于更多圖標(biāo)中

當(dāng)列表中有點(diǎn)贊、評(píng)論等功能較多時(shí)，可以將它置于更多圖標(biāo)中，比如：騰訊視頻發(fā)現(xiàn)、Facebook。

騰訊視頻和Facebook除了點(diǎn)贊和評(píng)論都還有一些其他的功能，因此可以直接將這些功能整合到更多圖標(biāo)中。

在設(shè)計(jì)時(shí)，如果你不想舉報(bào)圖標(biāo)太明顯，可以將其弱化處理，比如騰訊視頻就用線性圖標(biāo)。

2. 置于刪除圖標(biāo)中

當(dāng)列表中沒有其他功能時(shí)，或者是以用戶感受為中心的審核機(jī)制時(shí)，我們可以將舉報(bào)直接置于刪除列表中，讓反饋屬性更明確，同時(shí)反饋的項(xiàng)目更細(xì)，比如:今日頭條、淘寶。

今日頭條的列表沒有其他功能，在列表中加入了關(guān)閉按鈕，點(diǎn)擊就可彈出不感興趣、反饋垃圾信息、拉黑、屏蔽等內(nèi)容。

淘寶的Feed卡片中雖然有評(píng)論、點(diǎn)贊等功能，為了便于用戶篩選感興趣等內(nèi)容和舉報(bào)，它在卡片的上方加入加了關(guān)閉圖標(biāo)，點(diǎn)擊就可彈出不感興趣、不想看、低俗色情、虛假不實(shí)等內(nèi)容。

二、登錄注冊(cè)時(shí)鍵盤擋住按鈕

在設(shè)計(jì)登陸注冊(cè)界面時(shí)，一些設(shè)計(jì)師容易忽略鍵盤對(duì)界面的影響，因此當(dāng)輸入信息時(shí)，鍵盤就將操作按鈕蓋住了。當(dāng)信息輸入完之后還需要退出鍵盤，然后在點(diǎn)擊按鈕，讓操作不太流暢。

面對(duì)這種情況該如何解決呢？

通過對(duì)線上APP的收集和歸類，主要有三種解決方案：第一預(yù)留鍵盤高度；第二內(nèi)容滾動(dòng)；第三軟鍵盤設(shè)置按鈕。

當(dāng)?shù)顷懽?cè)信息較少，我們?cè)谠O(shè)計(jì)的時(shí)候就可將鍵盤的高度預(yù)留出來，避免鍵盤擋住按鈕的情況，比如：36Kr，鍵盤彈出并未遮住按鈕。

當(dāng)界面展示效果較長，鍵盤會(huì)把按鈕遮蓋掉時(shí)，我們可以給開發(fā)說讓其設(shè)置內(nèi)容滾動(dòng)。

比如：京東金融鍵盤彈出后整體內(nèi)容向上滾動(dòng)，僅顯示輸入信息。

當(dāng)然你也可以自己設(shè)計(jì)軟鍵盤，將登錄按鈕置于鍵盤中，這樣更能減短用戶操作路徑，不過這種方式對(duì)于一般公司來說成本較高，比如：農(nóng)業(yè)銀行。

三、文字在淺色圖片上對(duì)比度不夠

列表設(shè)計(jì)中，圖片上的文字在深色背景上展示正常，但是在淺色背景上就不易識(shí)別，這往往在設(shè)計(jì)過程中考慮不周全導(dǎo)致的，該問題多在新手階段出現(xiàn)。

解決該問題最早的方法是直接將文字加投影，但是隨著界面風(fēng)格的變化，該方式顯得不太合適。

目前多采用底部增加不透明度為40-0的黑色蒙層。

關(guān)于圖文的結(jié)合大家可以去看看劉清的《幾招搞定圖文結(jié)合》，文中主要提出了5種圖文處理方式，主要有：灰度平衡、文字覆蓋圖像、蒙版覆蓋圖像、文字突出顯示、圖文提煉結(jié)合，同時(shí)還有詳細(xì)的解說過程，大家可以點(diǎn)擊《幾招搞定圖文結(jié)合》標(biāo)題查看。

四、畫重點(diǎn)

大家在設(shè)計(jì)時(shí)，很容易跟著產(chǎn)品原型走，從而忽略一些小設(shè)計(jì)。尤其是對(duì)于新手設(shè)計(jì)師來說，更容易考慮不全面，因此建議大家在看到一些干貨的文章，就收集起來。以后在工作中遇到也能夠很快的找到文章，從而就可以規(guī)避這些問題，少走彎路。

比如本文提到的三個(gè)容易被忽視的點(diǎn)：UGC內(nèi)容未設(shè)置舉報(bào)功能、登陸注冊(cè)時(shí)鍵盤擋住按鈕、文字在淺色圖片上對(duì)比度不夠，下次大家遇到這些問題就不用再去踩坑了。

最后，大家可以在留言區(qū)說說你遇到的那些坑，大家可以互相交流~

參考引文：《App Store審核被拒的23種原因總結(jié)》

作者：風(fēng)箏KK，公眾號(hào)：海鹽社

本文由 @風(fēng)箏KK 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自Unsplash, 基于CC0協(xié)議