靈感是設(shè)計(jì)師的食糧。如何發(fā)現(xiàn)和抓住設(shè)計(jì)靈感呢？學(xué)習(xí)優(yōu)秀設(shè)計(jì)案例是一個(gè)非常不錯(cuò)的辦法。今天，小摹將為大家分享一款關(guān)于時(shí)尚穿搭的APP，叫做Inspora，出自國外非常有名的設(shè)計(jì)團(tuán)隊(duì)Tubik之手。一起來看看這款A(yù)PP有哪些設(shè)計(jì)亮點(diǎn)吧~

新一代的應(yīng)用程序越來越具備個(gè)性化，在好看好用的前提下，還需要深層次解決特定用戶群體的特定問題。Inspora就是這樣一款好產(chǎn)品，她采用了最先進(jìn)的AI（人工智能）技術(shù)，就像是一名虛擬的個(gè)人專屬造型師，幫助年輕女性用戶解決穿搭和時(shí)尚等相關(guān)問題。

Inspora的全部設(shè)計(jì)，包括logo、界面設(shè)計(jì)甚至宣傳視頻的制作，都是由Tubik團(tuán)隊(duì)完成的。本文將分享Tubik團(tuán)隊(duì)是如何設(shè)計(jì)Inspora的，希望能給你啟發(fā)。  

每天，世界各地會(huì)有數(shù)百萬年輕女性站在衣柜前，問自己，今天穿什么？盡管每個(gè)女生都有一顆愛美的心，但很多女生不懂穿搭，更不懂時(shí)尚。變美，是每個(gè)女孩該有的權(quán)力，它不該成為一種困擾。

Tubik團(tuán)隊(duì)想要做這樣一款產(chǎn)品，為了幫助世界各地的女性人群，學(xué)習(xí)時(shí)尚，找準(zhǔn)自己的穿衣風(fēng)格，變美，變自信，Inspora便因此應(yīng)運(yùn)而生。

Inspora的本質(zhì)是一款基于AI的聊天機(jī)器人，她扮演著虛擬私人造型師的角色，幫助年輕女性用戶人群學(xué)會(huì)穿搭。Inspora的最初定位就帶有顯著的性別標(biāo)記，她（she）不是一款冰冷的產(chǎn)品，而是一名優(yōu)雅的"女性"，所以本文我們也要尊重設(shè)計(jì)師的這一想法，用“她”來指代Inspora，而不是用“它”。

Inspora的使用非常簡單，只需在Facebook Messenger上問Inspora“我應(yīng)該穿什么？”，Inspora就會(huì)根據(jù)不同場景給出合適的穿搭建議。

Inspora具有三點(diǎn)優(yōu)勢：

• 智能：Inspora的人工智能結(jié)合了數(shù)百名時(shí)尚設(shè)計(jì)師的專業(yè)知識(shí)，這使得Inspora自身深諳時(shí)尚潮流之道。

• 個(gè)性：通過與用戶直接交談，Inspora能完全了解用戶以及用戶的喜好，這就為向用戶提供個(gè)人化服務(wù)創(chuàng)造了必備條件。

• 可靠：用戶可以隨時(shí)隨地咨詢，無論何時(shí)都能得到最及時(shí)、最專業(yè)的建議，整個(gè)過程都是自動(dòng)化的，人性化服務(wù)非常周到。

那么，問題來了，Inspora怎么能知道什么衣服適合你呢？

其實(shí)很簡單，就像朋友之間，溝通得越多，就會(huì)越發(fā)了解彼此的喜好和品位。Inspora就是通過和用戶交流來了解用戶的，Inspora會(huì)將用戶所說的話進(jìn)行信息處理，通過提取上下文，理解用戶話語的含義，甚至可以了解用戶當(dāng)下的心情。

比朋友更好的一點(diǎn)是，Inspora不需要休息，她可以全天候關(guān)注你，你說的任何話她都會(huì)認(rèn)真分析，Inspora還會(huì)和你交流，確保不會(huì)遺漏或錯(cuò)解任何信息。

此外，為什么選用Facebook Messenger作為交流載體？

Tubik團(tuán)隊(duì)做了大量的分析調(diào)查，得出了一個(gè)結(jié)論，年輕人喜歡社交，喜歡交流，而且喜歡在Facebook Messenger上進(jìn)行交流，F(xiàn)acebook Messenger上產(chǎn)生的會(huì)話數(shù)遠(yuǎn)遠(yuǎn)多于其他任何社交應(yīng)用程序。

很多品牌，尤其是時(shí)裝品牌，一直都沒有認(rèn)識(shí)到給用戶提供一個(gè)可以交流對話的界面有多重要，所以他們只是一味地向用戶推送信息。但I(xiàn)nspora認(rèn)識(shí)到了，并且抓住了這個(gè)機(jī)會(huì)，因此也迎來了廣闊的發(fā)展空間，正在籌備成立一家新型的時(shí)尚技術(shù)公司，為年輕用戶群體提供真正想要的服務(wù)。

Inspora的設(shè)計(jì)是從品牌logo開始的，由設(shè)計(jì)師Yaroslava Yatsuba負(fù)責(zé)。Yaroslava 在進(jìn)行了大量的創(chuàng)造性思考后，提出了logo形象化的概念，最后決定使用女性形象作為品牌形象的承載。

這個(gè)女性形象需要具備以下品質(zhì)：優(yōu)雅、活力，并且可以讓用戶自然而言地將她和時(shí)尚話題聯(lián)系在一起。對于具備深度個(gè)性化的產(chǎn)品，使用人物形象（或動(dòng)物形象）作為品牌標(biāo)識(shí)遠(yuǎn)遠(yuǎn)好于一個(gè)抽象化的符號(hào)，人物形象易于引發(fā)聯(lián)想，也更加具有溫度。

以下是初步設(shè)計(jì)的品牌標(biāo)識(shí)，每個(gè)logo都是一個(gè)易于識(shí)別的女性頭像，但細(xì)節(jié)不同。

經(jīng)過討論，Tubik團(tuán)隊(duì)決定選用最后一個(gè)女性頭像。Tubik選取的理由是什么？

首先，該logo視覺上明亮鮮麗，周圍也沒有其他任何多余的細(xì)節(jié)。白色的背景色搭配紅、綠兩種明亮的主色調(diào)，對比突出卻又能和諧統(tǒng)一，色彩搭配讓整個(gè)設(shè)計(jì)都極具時(shí)尚氣息。

其次，該頭像設(shè)計(jì)線條平滑、柔和，富有女性色彩，墨鏡元素的加入又增添了幾分前衛(wèi)和時(shí)尚感，非常容易引發(fā)女性心理共鳴。

最后，非常值得一提的是負(fù)空間（留白設(shè)計(jì)）的使用。留白讓整體效果看起來更加優(yōu)雅、輕巧。

Tubik團(tuán)隊(duì)在進(jìn)行了最后的優(yōu)化后，加入了品牌名稱。采用了一款簡單、易讀、精煉的字體，使得品牌名在水平和垂直方向上都可以和女性頭像和諧地結(jié)合在一起。

看看最后的成果：

完成了logo設(shè)計(jì)后，Tubik團(tuán)隊(duì)進(jìn)入到下一個(gè)環(huán)節(jié)——圖標(biāo)設(shè)計(jì)。該環(huán)節(jié)主要是團(tuán)隊(duì)中的平面設(shè)計(jì)師負(fù)責(zé)，這是一項(xiàng)極具挑戰(zhàn)的任務(wù)，需要畫大量的獨(dú)特手繪圖標(biāo)，又要統(tǒng)一風(fēng)格，這些圖標(biāo)是用于標(biāo)記各種類型的衣服和鞋類。

此外，圖標(biāo)還需要進(jìn)行不同尺寸和分辨率的測試，以確保它們在各種設(shè)備上都能很好的展示。

Tubik團(tuán)隊(duì)針對Inspora項(xiàng)目制作的圖標(biāo)，涵蓋了不同風(fēng)格的上衣、褲、群、鞋等類別：

用戶界面設(shè)計(jì)是工作量最大的部分，這里主要就Inspora界面設(shè)計(jì)中最典型的問題進(jìn)行分析。在設(shè)計(jì)Inspora界面時(shí)，最大的挑戰(zhàn)是解決數(shù)據(jù)加載過多的問題，同時(shí)還要確保用戶在大量輸入信息時(shí)不會(huì)產(chǎn)生無聊感。

我們來看看幾個(gè)典型頁面：

頁面一：挑選穿搭界面

左側(cè)界面是用戶挑選搭配的界面，用戶只需點(diǎn)擊界面頂部的圖標(biāo)就可以選擇上衣款式，Inspora會(huì)根據(jù)用戶的個(gè)性、喜好，再結(jié)合她自身儲(chǔ)存的時(shí)尚專業(yè)知識(shí)給出穿搭建議。用戶可以根據(jù)Inspora給出的建議收藏搭配（點(diǎn)擊紅色的帶有衣架的button）或者直接刪除（點(diǎn)擊綠色的帶有叉號(hào)的button）。

發(fā)現(xiàn)了沒有？這個(gè)界面上的兩個(gè)button的配色，一紅一綠，和我們前面談到的logo的色彩是一致的，按鈕色彩和品牌色彩相呼應(yīng)，不僅做到了設(shè)計(jì)的一致性，更容易換起用戶的情感感知。

頁面二：我的衣櫥界面

Inspora上展示的服裝都是有根據(jù)風(fēng)格和場合進(jìn)行了分類，并搭配了簡單易懂的圖標(biāo)。在我的衣櫥界面，用戶只需要選擇和他們實(shí)際擁有的衣服和鞋類相似的款式，Inspora就會(huì)自動(dòng)給出可行的穿搭建議。

頁面三：風(fēng)格推薦界面和身材信息界面

為了更好地了解用戶的喜好，Inspare采用了兩種方式：

其一，推薦穿衣風(fēng)格

Inspar會(huì)向用戶提供與其風(fēng)格和預(yù)期相匹配的穿搭照片，以進(jìn)一步了解用戶的喜好。

其二，了解用戶的形體

形體對穿衣效果的影響也很大，充分了解用戶的形體可以更準(zhǔn)確地推薦合適的搭配。這是一個(gè)需要獲取用戶大量信息的步驟，但很顯然，讓用戶手動(dòng)輸入大量數(shù)據(jù)和數(shù)字是不好的做法，很容易讓用戶產(chǎn)生無聊感。

為了解決這個(gè)問題，Tubik團(tuán)隊(duì)開發(fā)了一個(gè)簡單的系統(tǒng)來幫助用戶"編輯"形體，用戶可以快速更改形體的基本參數(shù)，并立即查看其變化以確認(rèn)其外觀和用戶的體型相似。

界面四：用戶喜好測試頁面

Inspare有非?；ㄐ乃嫉叵胱層脩?ldquo;停留在同一頁面上”，這個(gè)測試頁面就可以一次性收集大量的用戶信息，可以讓Inspora更好地了解用戶的品位和喜好。

總體來說，Inspora的界面布局簡潔清晰，品牌logo設(shè)計(jì)和具備高度可讀性的字體可以適配任何設(shè)備，加之簡潔易懂的交互設(shè)計(jì)，創(chuàng)造了不錯(cuò)的用戶體驗(yàn)。當(dāng)然Inspora還有更多的設(shè)計(jì)細(xì)節(jié)，這里限于篇幅無法一一展示，各位設(shè)計(jì)師如果有興趣，不妨自己去看看：https://inspora.com/ 

為了幫助各位設(shè)計(jì)師萃聚設(shè)計(jì)靈感，摹客團(tuán)隊(duì)還會(huì)不定期推出更多優(yōu)秀設(shè)計(jì)案例賞析。如果你有不錯(cuò)的設(shè)計(jì)作品推薦，歡迎聯(lián)系我們哦~

更多閱讀：

【自古套路得人心】最全UI圖表設(shè)計(jì)技巧和套路，分分鐘打造最優(yōu)設(shè)計(jì)

【設(shè)計(jì)師必看】提高網(wǎng)站易訪問性的5個(gè)UI設(shè)計(jì)技巧

教你避雷！網(wǎng)頁設(shè)計(jì)中常見的17個(gè)UI設(shè)計(jì)錯(cuò)誤集錦（附贈(zèng)設(shè)計(jì)技巧）