這個APP的界面丑嗎？

01-06

我們小團隊參加一個比賽，是做一個社交APP，要求有搖一搖、即時通訊等等的功能。
如下是我們APP的部分的截圖，有些人看過之後覺得很醜，有些人覺得挺不錯的。我個人當然覺得雖然不算漂亮，但也不至於丑吧？大家覺得呢？難道真是我的審美問題？
主界面（新鮮事）：

側邊欄：
發布新鮮事：
聊天界面：

搖一搖界面：
搖到周圍的人：
個人信息設置頁：

大賽要求通過小遊戲加好友的奇葩需求，我們模仿某個小遊戲用unity做的，嵌到APP里：
-----------------
下面這兩個界面確實丑，時間緊迫沒有細調過，各位可以選擇性無視，主要評價上面幾個：
截圖改過了，第一次截圖的時候忘記把系統字型大小調整成普通了……（剛刷過系統，試了一下大字型大小模式，結果忘記調回來了）
----------------------------

謝謝各位的建議，我會認真去改的。
其實也自己也覺得界面不好看，就是不知從哪下手去改，可能整天看著它調各種功能，看習慣了吧……問了知乎各位現在有些眉目了，再次謝謝大家！

7月3日Update：更換了App的主題色。

重新設計的頁面在答案末尾部分。

題主的APP不僅僅是UI的問題，UX也存在一些問題。非專業，勿噴。題主很明顯想把App做成Material Design，但是裡面出現了太多不符合MD規範的地方，要知道，陰影+FAB+抽屜≠Material Design。

①首先關於App Bar的顏色，Google推薦基礎色的飽和度是500，我找到了一款RGB是(0,,157,189) 的深綠色。

②關於FAB，Google這麼說：

Is it important and ubiquitous enough to be a floating action button?

Important and Ubiquitous 重要且應用廣泛題主的FAB是展開式的，類似於Android微信右上角的加號，裡面的功能需要兩次點擊才能進入，包含了「發動態」，「搖一搖」，「遊戲中心」三個功能，。題主的APP很明顯是類微博的，主要功能是信息流，而搖一搖、遊戲中心、聊天這些功能都是次要的，所以沒必要全部塞到FAB裡面，這裡建議FAB換成Write(new post)按鈕。

③首頁信息流

建議頭像換成圓形。

Google建議卡片要帶圓角，不然就成了磁貼Tile。

④關於功能入口的放置。

搖一搖與遊戲中心放到抽屜里

通知放到主頁面的右上角第一個

聊天放在主頁面右上角第二個

反正在家閑來無事，重新設計一下吧，也有很多不規範的地方，敬請指正，請點擊大圖觀看，效果更好：

更新三張...做得有點糙

登陸頁面題主的叫做筍友，我就把G+的圖標P成了S+當logo吧(*′艸`*)

暫且說一點，你看看你的字型大小

瀉藥

怎麼說呢，不好看。

至於為什麼不好看，主要是細節沒有做好。

這種事在程序員搭界面的時候沒有和設計師多次交流的時候很容易出現。

程序員在搭界面的時候一般是不會在一些非常細的地方花太多時間的，他們不會在意段落的間距，項目的間距這些看似沒什麼大不了的東西，結果做出來的效果差強人意，也把設計師氣的半死。

題主這個APP的問題，首先是陰影用的不好，很生硬，並且陰影是偏的，可能在手機上效果差別不大，不過截圖感覺就很奇怪了。

還有就是字體大小，間距還有顏色這些東西的不注意。

這點在側邊欄上尤其突出，感覺就是幾個控制項直接堆在一起的結果。

整體上對於間距的不重視，比如「發布新鮮事」的界面，輸入框是直接頂著邊的，這樣就很難看了。

你要麼沒有邊框，要麼你就要有個間距。

另外題主對於陰影有些濫用的嫌疑。尤其是整體扁平的情況下，陰影的使用應該慎之又慎。

再然後就是各種不對齊，我就不多說了。

總之題主應該能感受到，我做的好像也差不多，怎麼感覺就這麼差，甚至還有人說丑。

因為細節的處理不夠，會讓整個界面都顯得粗製濫造，最後讓人感覺很不好。

所以題主，你需要自己打磨一些細節，和設計師多溝通溝通。

可以去看看大公司的APP，你會發現以上的錯誤一般是不會犯的。

丑

題主，首先你的整個UI感覺沒有太明顯的系統傾向，就像 @李小泡的說法，是一個「四不像」的產品。當然你也可以在Android系統上採用iOS 8的風格，或者反過來，畢竟對於開發者來說出來貼合說明文檔並不是強制的。但是有句話說的好

when you are in rome do as the romans do。

所以我們既然在在Android系統上，就根據人家Google的路數來，不然可是一點禮貌也沒有。

根據你本身提供的幾個圖我為你做了幾個頁面，你看一下，時間倉促，可能也有不對的地方，見笑：）點大圖

題主，我姑且認為你是要貼合Material Design，畢竟你的Status Bar是Android。「筍友」這個App，依據Material Design（Introduction）的規範，視覺上存在的問題主要是在：

配色 Color - Style
布局 Structure - Layout
icon Icons - Style
字體 Typography - Style

拋開這四個問題先不說，首先作為一個參與比賽的作品，題主我建議你在視覺和營銷上面做一些改動，讓自己的App不那麼難看，甚至高大上一些：

用戶頭像選用歪果仁的。
文本內容選用Lorem ipsum。
圖片內容選用fancy一些的圖片，這個你可以去Google一下，有很多設計師常用的圖站。

當然，這些東西都是錦上添花，題主沒有很好地了解Material Design的內涵。

Material Design我們簡單粗暴來說一下主要三個元素：

紙片，也就是。
紙片是Material Design的內容載體，我們所有的圖片，文本都是由紙片承載的。
X Y Z軸。
X Y軸很好理解，初中函數套用在我們的屏幕上面分別是橫向延伸與縱向延伸。Z軸呢，Z軸是垂直與我們屏幕的一個正向延伸。

陰影。
陰影是Material Design用來區分紙片層級的一種手段。

不好理解嗎？看下圖：

俯視圖

具體表現

所以題主你能粗略的理解 Material Design了嗎？其實題主完全不用因為這麼多人說丑說難看甚至出現一些被摺疊的評論而焦心，我完全是可以看出題主是想做成Material Design得風格的，只是沒有很詳細的閱讀MD的文檔（對了，甩一個中文翻譯的鏈接Material Design）。

我先不說好不好看吧......

但是為什麼你的界面元素風格不統一的呢？

你是想做平面化呢？卡片呢？還是擬物？還是Android Holo Design或者Material Design？至少先把界面風格統一一下吧？

你覺得不醜？

請問

一個界面有多少種顏色？

多少種字形？字體字型大小字重有不同均單獨算一個？

按鈕陰影是什麼鬼？

這登錄邊框又是什麼鬼？

我看不下去了，這是線框稿吧？

我還沒從信息架構人機界面的角度展開就有這麼多違反基本平面設計原則的東西，哪來勇氣說不醜呢？

不要瞎創新，把內置的主題用上就比這個好看。

最後問一句考慮過色盲的感受么？紅綠盲在我國男性比例很高的。

不想太傷你這樣的視覺稿在我們團隊看來是線框圖而已用來確定交互邏輯

這時候就說明了設計指南的作用了：雖然它不能指導你做出 100 分的頂尖設計，但是當你完全沒有設計水平的時候，可以防止出現20分的設計並幫助你做出 67 分的 app （本來我覺得有80分，專業玩家 NovaDNG 覺得只能有 67 分，所以你們看，我們程序員的審美還得要不斷提高）。

傳送門：Material Design Introduction

細節！

因為一個、二個、三個，多個細節疊加起來，就丑了！

其實哪些地方你們偷工減料了你們最清楚，把偷工減料的地方完善，應該就不算「丑」了。

無法直視。

就算團隊木有視覺設計師，你也可以用原生控制項啊！你看你的登錄和註冊頁的edittext和button是什麼鬼啊……

我一直認為設計師最重要的成長契機就是一定要眼高手低，只有你的眼光高也就是審美一直高於你的技術，你才可以不斷進步，而這完全取決於你平時對素材的積累和賞析。

說的有點遠，拿一個界面來看，你最先應該保證的不是好看和酷炫，而是應該保證整體風格的一致性，包括控制項的一致性，圖標的一致性，字體的一致性，間距的一致性，用色的一致性等。ui稍微有出彩的地方確實可以提高用戶體驗，但是最關鍵的簡單清爽的整潔感，操作時的視覺流暢度，在關鍵點的恰當的視覺牽引才是一個ui設計師應最先具備能力，你不是藝術家而是設計師。

至於你說的丑不醜，我只能說從一致性上有很大不足，給人的視覺呈現上看，有人說丑可以理解，把字體、圖標、配色的問題解決好了，適當的留白，你的界面會上一個層次，到那個時候才是你應該考慮美的問題。

告訴你一句大實話，在移動端界面設計中，前面提到的一致和規範性，本來就是美的一部分，加油吧！

我就一張一張的說（tu）吧（cao），大家可以打開兩個頁面對比來看，我就不貼圖了。

1. 這個App想採用卡片式設計，但是卡片左右的margin顯然太小。陰影的opacity也過大，不知道開發者是不是沒用SupportLibary的CardView。其次用下角的FAB（FloatActionButton）也太。。太丑了，自己看吧，陰影的方向與卡片還不一致，導致界面的光源邏輯有問題。

2. 側邊欄，你這是要給老人用還是咋的？字型大小是怎麼回事？？不說什麼了

3. 發布新鮮事：同樣是margin的問題，icon也過於大

4.氣泡有點大，氣泡的padding小一些更好，而「下午XX」那個圓角矩形框padding大一些好。發送按鈕丑爆了，不會做就把陰影去掉吧。底部icon再小一點。

5. 搖一搖中心圖片建議顏色設置為灰色

6. 周圍的人，同樣有margin的問題，還有氣泡padding。。。

7. 個人信息，還好。字體要稍微小一些。

8. 遊戲界面我不會點評。

9. 我擦。。。讓我冷靜一下。按鈕的陰影趕快去了吧，文本框placeholder字體要小一些，padding要大一點，頭像再小一些。根據Design Guide，建議把「去註冊→」改為「註冊」，動作按鈕應該是動詞，而且千萬不要加特殊符號（如果你有審美的話）

10. 同上

寫完了。希望題主以後在界面上多多努力吧，我只是就這個App的界面邏輯做視覺方面的點評，交互和邏輯其實也可以再考究一些。

------------------------------------------

以上。

丑

你開心就好

謝邀！

第一次做這樣可以了。

字體大小參照其他app的截圖，調整一下

上下左右的留白要有，而且要均勻，

注意風格保持一致，扁平就一致扁平下去，

陰影薄一點，距離調整一下，目前的設計顯得臟

注意距離對兩個元素之間關係的影響，該靠近點兒的要靠近些，

加油！

建議程序猿不要干設計獅的工作。

丑…那個drawer一股濃烈的山寨氣息

這字型大小！這按鈕！這配色！這排版！這這這這……