Monese是一家無(wú)網(wǎng)點(diǎn)銀行業(yè)務(wù)，允許歐洲經(jīng)濟(jì)區(qū)的居民在2分鐘內(nèi)創(chuàng)建本地銀行賬戶，即使客戶不能立即提供地址信息或信用記錄不良。我們創(chuàng)建了Monese，幫助9000萬(wàn)被排除在金融體系之外的人，因?yàn)闅W洲銀行很難識(shí)別并給予他們信用授權(quán)。

作為金融產(chǎn)品，獲得用戶的信任非常重要。因此，擁有統(tǒng)一且易于識(shí)別的標(biāo)記是Monese成功的關(guān)鍵。

　　為什么決定要重塑品牌

Android平臺(tái)發(fā)布后，用戶群迅速增長(zhǎng)。顯然，下一步是發(fā)布iOS版本，這是審查和改進(jìn)我們形象的好時(shí)機(jī)。

在這一點(diǎn)上，我們已經(jīng)擁有一套現(xiàn)成的品牌認(rèn)知度。來(lái)自真實(shí)用戶的第一手產(chǎn)品的反饋激發(fā)了我們的靈感。最后，我們覺(jué)得品牌需要更好地反映它們 - ——我們有用戶需求。更深刻的理解。

我們發(fā)現(xiàn)了以下問(wèn)題：

現(xiàn)有的標(biāo)識(shí)不是典型的，獨(dú)特的 - ——它看起來(lái)有點(diǎn)幼稚，弧線太平滑了。

我們使用的“Brandon”字體不夠清晰，它被許多創(chuàng)業(yè)公司濫用，這意味著它對(duì)我們來(lái)說(shuō)不是唯一的。

品牌元素混合了尖銳和圓潤(rùn)的形式，不均勻，缺乏協(xié)調(diào)。

紅色的廣泛使用提出了一個(gè)挑戰(zhàn)，使得Monese應(yīng)用程序中的錯(cuò)誤狀態(tài)難以顯示。

△老Monese品牌元素

我們最初努力修補(bǔ)現(xiàn)有品牌。我們?cè)缴钊?，就越意識(shí)到它的許多缺點(diǎn)阻礙了我們。我們需要一套清晰的價(jià)值觀和全新的品牌標(biāo)識(shí)，以更好地傳達(dá)我們的重要性。

作為精益團(tuán)隊(duì)，我們知道徹底的品牌重塑比想象的更難，但如果我們計(jì)劃這樣做，那就是時(shí)候了。我們的使命是將整個(gè)公司與一個(gè)共同的品牌故事統(tǒng)一起來(lái)，與客戶建立更緊密的聯(lián)系，為未來(lái)的發(fā)展奠定堅(jiān)實(shí)的基礎(chǔ)。

　品牌故事板

這項(xiàng)大規(guī)模的工作始于對(duì)Monese現(xiàn)有成就和未來(lái)發(fā)展方向的研究。我們的工作跨越倫敦，愛(ài)沙尼亞塔林的工作室，我們與每個(gè)公司成員聯(lián)系，以收集他們自己對(duì)公司自身價(jià)值的描述。

我們與用戶體驗(yàn)分析師和管理團(tuán)隊(duì)密切合作，將品牌故事板定義為起點(diǎn)。我們討論了我們的銀行服務(wù)如何幫助人們“升級(jí)”并陪伴他們的生活。然后進(jìn)一步定義我們的價(jià)值我們非常重視這個(gè)環(huán)節(jié)，因?yàn)檫@些將形成我們的核心個(gè)性，并將成為所有后續(xù)行動(dòng)的根源，我們所做的每一個(gè)品牌決策都可以追溯到源頭。

我們創(chuàng)建的列表在開(kāi)始時(shí)幫助了我們很多，但內(nèi)容太難記住了。從公司成員的描述中，我們分解了三個(gè)更精致的核心價(jià)值觀。

　進(jìn)步

Monese一直關(guān)注未來(lái)——始終使用新技術(shù)幫助客戶加快速度。

　　人性

我們已經(jīng)看到了人類和整體的價(jià)值。我們對(duì)客戶沒(méi)有任何偏見(jiàn)，這使我們與其他傳統(tǒng)銀行區(qū)別開(kāi)來(lái)。

　信賴

我們?yōu)槟馁Y金提供安全的住所，對(duì)我們的客戶完全透明。我們很友好，隨時(shí)準(zhǔn)備回答問(wèn)題。

　重塑過(guò)程

時(shí)間緊迫，我們迅速行動(dòng)并開(kāi)始概念的設(shè)計(jì)沖刺。因?yàn)槲覀兪浅鮿?chuàng)公司，所以我們經(jīng)常需要從sprint中擠出時(shí)間來(lái)處理應(yīng)用程序和業(yè)務(wù)的其他方面。因此，為了確保一切盡在掌握，我們必須確保核心關(guān)注的只是品牌工作一段時(shí)間，然后花幾天時(shí)間來(lái)處理其他事情。

每個(gè)沖刺大約4天。我們?cè)O(shè)定每日目標(biāo)，以確保每個(gè)人都專注于跟上節(jié)奏，測(cè)試我們的價(jià)值觀和未來(lái)發(fā)展的靈感。在每次設(shè)計(jì)沖刺之后，我們將討論審查;一開(kāi)始，不要做出重大決定，更多地分享靈感，感受他人思考的過(guò)程。

　　設(shè)計(jì)標(biāo)志

Monese為客戶提供易于申請(qǐng)和使用的安全銀行服務(wù)，幫助他們?cè)谏钪凶杂尚袆?dòng)。我們想要設(shè)計(jì)的標(biāo)識(shí)應(yīng)該反映這一點(diǎn)并表達(dá)我們的價(jià)值觀 - —“進(jìn)步，人性和信任”。所以我們開(kāi)始草繪……

在探索了幾條不同的道路之后，我們決定開(kāi)始利用我們選擇的項(xiàng)目。我們做了很多次迭代，以確保最終的標(biāo)識(shí)傳達(dá)每一個(gè)品牌價(jià)值。

我們的最終解決方案，結(jié)合相互連接的流暢線條，構(gòu)成了一個(gè)反映我們性格的獨(dú)特符號(hào) - ——安全，活力和人性。為了增添柔軟感，我們添加了倒角，使其感覺(jué)更光滑，更人性化。

　字體

在設(shè)計(jì)徽標(biāo)的同時(shí)，我們也開(kāi)始探索字體。主要問(wèn)題是我們現(xiàn)有的字體感覺(jué)太怪異了——不能讓你安心存儲(chǔ)你的工資。雖然它經(jīng)過(guò)精心設(shè)計(jì)，但在我們公司的早期階段，帶有輕微圓角的無(wú)襯線字體表現(xiàn)良好，但它還不夠成熟——這就是我們的新圖像需要執(zhí)行的操作。

我們決定基于字體“ FF Mark”這種新字體誕生于2013年，采用了一些歷史上最成功的無(wú)襯線字體，但在現(xiàn)代設(shè)計(jì)中感覺(jué)更現(xiàn)代，更自由。

每個(gè)雕文都經(jīng)過(guò)精心繪制，賦予其堅(jiān)韌，簡(jiǎn)潔，醒目的邊框，但其曲線也帶來(lái)一絲舒緩和親和力，有助于與新的Monese標(biāo)志融為一體。

我們的大多數(shù)客戶都是非英語(yǔ)母語(yǔ)人士，這意味著輕松識(shí)別是最高先決條件。 Mark字體的x高度足以幫助在小型用戶界面元素中清晰地表達(dá)它。多個(gè)單詞使其足夠靈活，可用于多個(gè)品牌媒體。

總的來(lái)說(shuō)，我們認(rèn)為Mark字體是正確的選擇，因?yàn)樗梢栽鰪?qiáng)我們品牌的形象并增強(qiáng)信任度。

　　配色方案

我們希望色彩匹配能讓人感覺(jué)清新，充滿活力，同時(shí)使用色彩清晰地表達(dá)非英語(yǔ)母語(yǔ)人士的銀行服務(wù)元素，因此我們的選擇必須兼具功能性和審美性。我們考慮應(yīng)用程序中使用的各種狀態(tài)，并選擇靈活的配色方案來(lái)幫助我們提高可用性。

在主色調(diào)方案中，純藍(lán)色，綠色和黃色傳達(dá)出清新的感覺(jué)，遠(yuǎn)遠(yuǎn)優(yōu)于沉悶柔和的舊色。我們認(rèn)為這更適合Monese的形象。我們?cè)缙诘臏y(cè)試人員說(shuō)：“它沒(méi)有其他銀行應(yīng)用程序那么重。 ”的

定義標(biāo)志性交互

因?yàn)樗且环N數(shù)字產(chǎn)品，我們認(rèn)為強(qiáng)大的品牌系統(tǒng)不僅應(yīng)該是一種象征，還應(yīng)該決定產(chǎn)品的性能。作為銀行服務(wù)，用戶使用產(chǎn)品中最重要的操作之一是付款。我們決定專注于此操作，并將其轉(zhuǎn)變?yōu)槠放频暮诵墓δ堋?

我們嘗試了各種治療，以及實(shí)驗(yàn)如何體現(xiàn)在動(dòng)畫中。

在重新思考動(dòng)畫之后，我們開(kāi)始使用JavaScript制作原型并進(jìn)行一些用戶測(cè)試。為確保它很重要，動(dòng)畫不會(huì)干擾操作本身。

△生產(chǎn)和測(cè)試支付業(yè)務(wù)

關(guān)鍵是保持動(dòng)畫簡(jiǎn)單，確保其可用性，并避免過(guò)度的功能。我們引入了一條流動(dòng)的彩色線條，當(dāng)用戶向下滑動(dòng)以擴(kuò)展時(shí)，該線條完成付款。這種彈性的液體動(dòng)畫為界面增添了更多個(gè)性和樂(lè)趣。

發(fā)展出整套體系

此外，我們探討了支付線如何擴(kuò)展到一個(gè)密切相關(guān)的視覺(jué)系統(tǒng)。我們使用大量連接的彩條通過(guò)動(dòng)態(tài)效果表達(dá)各種支付方式。線條的修剪形成了一系列情感表達(dá)，從標(biāo)準(zhǔn)到精確到精力充沛，富有表現(xiàn)力。

我們從舊信用卡收集的用戶反饋表明，有些客戶認(rèn)為早期的卡不像合法的銀行產(chǎn)品。根據(jù)這些反饋，我們決定設(shè)計(jì)一個(gè)更迷人的暗卡，上面有彩條連接。隔行掃描線紋理表達(dá)了Monese平臺(tái)的順利支付過(guò)程。

△新信用卡包裝

由于Monese是主要針對(duì)流動(dòng)人口的產(chǎn)品，我們認(rèn)為為品牌添加一些運(yùn)動(dòng)元素是有益的。我們希望這個(gè)系統(tǒng)能夠展現(xiàn)出動(dòng)感的感覺(jué)，就像這個(gè)動(dòng)畫的效果一樣。通過(guò)這種方式，我們可以真正表達(dá)持續(xù)改進(jìn)的價(jià)值觀。

這種富有表現(xiàn)力的形狀感覺(jué)流暢且用戶友好，在徽標(biāo)和應(yīng)用界面元素中保持一致的形式。

應(yīng)用修訂

我們還完全重新設(shè)計(jì)了Android和iOS應(yīng)用程序的設(shè)計(jì)，并在同一時(shí)間重新命名。我們希望界面明亮，清新，易于操作。通過(guò)與用戶體驗(yàn)團(tuán)隊(duì)合作，我們會(huì)仔細(xì)考慮每個(gè)元素，以確保每個(gè)決策都有明確的目標(biāo)來(lái)為用戶服務(wù)。

通過(guò)插圖，我們介紹的元素可以讓用戶驚喜不已，并且還可以以靠近徽標(biāo)的線條形式添加交互式圖形。所有圖標(biāo)都經(jīng)過(guò)重新繪制，更圓潤(rùn)，更貼心。我們還使用時(shí)間軸表單來(lái)顯示主界面的執(zhí)行狀態(tài)。

△重新設(shè)計(jì)的界面

原文也插入了一個(gè)視頻，請(qǐng)到這個(gè)鏈接觀看：https://vimeo.com/175713529

　　插畫與角色

我們添加了一個(gè)新的插畫家風(fēng)格，以及一系列有助于表達(dá)應(yīng)用程序各個(gè)部分的角色，增加了一些游戲。這些角色可以幫助用戶消除他們的疑慮，并展示我們與一家隨時(shí)準(zhǔn)備伸出友好之手的公司的距離。

例如，在注冊(cè)Monese帳戶時(shí)，用戶需要等待身份驗(yàn)證完成。我們添加了一個(gè)小動(dòng)畫，顯示正在掃描文檔的場(chǎng)景。在一段時(shí)間內(nèi)，其中一個(gè)角色會(huì)站在掃描儀下方，并噴上一種顏色。我們希望這會(huì)給等待用戶一點(diǎn)獎(jiǎng)勵(lì)，甚至讓他們想等待動(dòng)畫循環(huán)，然后再讀一遍。

　　最終成果

回到修改視覺(jué)識(shí)別系統(tǒng)的初衷——之前我們覺(jué)得這個(gè)老Monese品牌太簡(jiǎn)陋，缺乏信任。不僅因?yàn)檫^(guò)于圓潤(rùn)的徽標(biāo)與多邊形紋理和插圖不相稱，它還會(huì)產(chǎn)生混合色調(diào)，并且它不夠獨(dú)特，不足以使我們與眾不同。

我們已經(jīng)確定了這些問(wèn)題——從更強(qiáng)大，更值得信賴的標(biāo)識(shí)到更貼心的色彩——我們對(duì)新的品牌形象充滿信心，并相信它將為Monese的長(zhǎng)期發(fā)展奠定基礎(chǔ)。它得到了公司所有團(tuán)隊(duì)的熱烈歡迎，我們現(xiàn)在希望客戶歡迎這一系列的變化。

« 談?wù)揢I設(shè)計(jì)中無(wú)盡的黑暗背景 | 江湖微商城商城系統(tǒng)成員功能緊密集成在線和離線 »