偉大的設計如何為買家的旅程提供動力
已發表: 2021-07-19
為什麼設計很重要？ 這似乎是不言而喻的。 我們花了很多時間在這上面，試圖讓我們正在做的任何事情都“看起來不錯”。
但是你知道它有多重要嗎？ 設計不僅僅是“看起來不錯”嗎？
營銷設計的功能
在沒有陷入雜草的情況下，我們最終會談論為什麼烤麵包機看起來像烤麵包機，讓我們簡單地用營銷術語回答這個問題。 為什麼設計在營銷中很重要？
我會說設計在營銷領域執行三個主要功能：
- 設計是指南。 設計引導對您的公司感興趣或可能只是潛在感興趣的人與您建立聯繫。 出色的設計清楚地說明了重要信息是什麼，並引導用戶了解您希望他們做什麼。 網頁的設計有助於向用戶展示點擊位置和導航方式。 按鈕的設計應該說“我是按鈕，點擊我”。
- 設計是大使。 您的設計代表您的公司。 您的徽標、您的網站、一封電子郵件……這些東西通常是潛在客戶第一次了解您的公司時首先看到的東西。 作為大使，出色的設計讓您在競爭中脫穎而出。 它定義了你的視覺風格。 它傳達了使您的公司與眾不同的事物。 它還建立信任。 人們本能地相信一個設計精良的現代網站，而不是一個上次更新於 2006 年的劣質網站。
- 設計是銷售人員。 設計實際上可以執行一些工作，讓人們通過購買者的旅程。 設計有助於推動潛在客戶向前發展，從意識到考慮再到決策。 它形成了推動銷售的聯繫。 出色的入站營銷設計直接吸引您的買家角色。 它通過保持興趣並突出您的關鍵差異化來激發興趣並在買家的旅程中推動潛在客戶。
偉大設計的三個 C
那麼是什麼讓設計變得偉大？ 我們之前說過，它不僅僅是看起來不錯。 我能想到的最簡單的答案是“什麼讓設計變得偉大？” 由三個單詞組成，巧合的是，這三個單詞都以字母 C 開頭。
- 偉大的設計是明確的。 我們知道，設計的功能之一是引導你的觀眾去你想讓他們去的地方，不僅僅是在網站上從一個頁面到另一個頁面，還可以通過引導人們關注重要信息。 好的設計通過盡可能清晰來有效地做到這一點。 您不希望您的客戶或潛在客戶猜測點擊的位置，或錯過重要的內容。 所以我們希望設計清晰。
- 偉大的設計是乾淨的。 將您的信息減少到其基本組成部分。 這意味著將您的書面內容中的字數保持在最低限度，但這也意味著將您的設計內容保持在最低限度。 修剪脂肪並保持設計精益。
- 偉大的設計是一致的。 通過始終如一地使用您的徽標、調色板、字體以及插圖、圖標或攝影的風格來定義您的品牌。 一致性可以成為推動買家完成旅程的強大力量。
讓我們更深入地研究其中的每一個，並看看我們正在談論的關於偉大設計的三個關鍵的例子。
{{cta('020a0931-6bf3-4f13-ab71-d8ec980446a9')}}
設計不明確的例子
也許最好通過查看一些不明確的設計示例來定義什麼是清晰的設計。 我們可以在日常生活中看到它……
按下哪個按鈕？ 你可以猜測，你有一個 50/50 的投籃，但你不應該去猜測。 這些按鈕的設計者沒有考慮 UI。 確保設計使這樣的事情更容易理解，而不是更難。
這是一個……嗯，一家做……某事的公司的網站。 看這個我說不出來。 這個網站的訣竅是，要閱讀消息，您必須將鼠標懸停在左上角的藍色過濾器上。 然後，您可以看到它說：
哦。 哼。
我的意思是，它很可愛，對吧？ 但他們已經比自己聰明了一點，不是嗎？ 他們已經做到了，因此用戶必須花幾秒鐘的時間看它，試圖弄清楚他們是否應該能夠閱讀它，或者他們是否患有眼部偏頭痛。 然後，他們必須想辦法將鼠標懸停在某個區域上以顯示消息。
這樣他們就可以說：“哦。 哼。”
這就是所有用戶要說的，對吧？ “哦。 哼。” 但我向你們保證，當 Bolden 的設計師們提出這個想法時，他們都互相擊掌。
不要讓你的網頁設計師，或者你內心的設計師，為了你自己的利益而變得太聰明。 聰明很好，但他們應該想出一種聰明的方法，同時即時、清晰地傳達他們的信息。
我看著這張照片，讀了所有這些，但仍然不明白。 白天停車一小時，但 6 點後會發生什麼？ 我不知道。
然後我們有周一和周日的具體方向，然後我們跳回到週五和周六。 其他日子呢？ 我想這就是頂部標誌的用途，但我不確定。
我應該確定。 有人確定。 我向你保證這條街上的售票員知道他們什麼時候可以給汽車開票，精確到分鐘。 知道這條街上的規則的人肯定可以使用更清晰的設計來傳達它。
什麼可能更好？ 想像一張桌子，頂部是一周中的幾天，一側是一天中的小時。 顏色編碼的塊會告訴您何時可以停車。 如果你在綠色，你的好！ 像這樣的標誌會很清晰，易於理解，並且佔用不到這個標誌一半的空間，只使用一小部分單詞。
清晰的設計幾乎總是以最簡單的方式進行溝通。
這導致了我們的下一個 C：清潔。 因此，讓我們再次嘗試通過查看相反的示例來定義它。
我們每天都會收到這樣的郵件。 真的有人看他們嗎？ 我猜有人會做，或者他們不會做。 就像我猜有人從垃圾郵件和自動電話中購買東西一樣。 這樣做的人正在毀掉其他人的生活。 但我離題了……
所以在這裡，我們真的不知道該看什麼，不是嗎？ 我的眼睛無法注視任何一件事，所以它們只是呆滯了。 這是一個極端的例子，但它是我們設計的一切的潛在陷阱。 將其歸結為一條信息。 有效地傳達該信息。 那是乾淨的設計。
這個網站主頁是一個不太極端的例子，但它仍然是一個更清潔的例子。 繁忙的背景圖片及其所有顏色和紋理使主要標題幾乎無法閱讀。 也許更糟糕的是，應該是主要的號召性用語的內容更加隱蔽！ （看到那裡箭頭旁邊的那個小“立即購買”嗎？）更簡潔的設計將確保這些重要信息不會丟失。
在這裡，我們有一個完全錯誤的大理石背景，奇怪的標誌——其中一個出現了 3 次！ – 以及設計師可以使用的每種字體和明亮的原色。 讓我們把它放在嚇人的引號中。 “設計師。”
所以我不必告訴你這裡出了什麼問題。 它看起來很糟糕。 要弄清楚這是為了什麼，需要付出一些認真的努力。 乾淨設計的一部分是創建消息的層次結構。
想想你的聽眾想知道什麼。 首先他們會想知道我們在說什麼？ 信息一應該是“第一屆 Pennington Hamfest”。 這應該比其他一切都更加突出。
然後觀眾問“好的，那是什麼？” 所以這應該是第二位，但我認為答案隱藏在角落裡：“Ham Radio Swapmeet 。” 在外面的任何人興奮之前，對不起，你錯過了。 那是幾年前的事了。
諸如時間和地點之類的信息應該是突出的第三個層次。 等等。
您可以使用設計來引導您的聽眾了解他們想知道的內容：“Pennington Hamfest 是一個業餘無線電交換會議，於 2012 年 6 月 2 日舉行。” 簡潔的設計不會阻礙這一點，它使它更快更容易。
這不是乾淨的設計，但它也為我們的下一個“C”提供了一個很好的轉義，因為它也根本不是……
持續的。 這是我們要討論的最後一個“C”，然後我們將討論如何將這三個出色設計的“C”應用到買家的旅程中。
那麼讓我們從一致性的角度來看上圖。
就像我說的那樣，那裡有很多字體。 所有不同的重量，所有不同的顏色，有些是斜體，有些不是，有些是輪廓，有些帶有陰影。 這裡絕對沒有一致性。 就好像每一段文字都是完全獨立於其他一切“設計”的，然後它們都被放在頁面上。
應該建立一致的外觀，然後所有設計都應該從外觀的細微變化中產生。
良好設計的規則
在任何項目中，都應該有幾個級別的一致性。 最高的、最重要的水平是適用於公司所做的一切的品牌一致性。 創建一致性本質上是關於創建規則。 您的基本品牌一致性至少包括以下幾組規則：
- 標識。 每個擁有標誌的公司都應該有關於如何使用該標誌的規則。 不要拉伸它，不要留下它的一部分，不要在它後面放一個醜陋的大爆炸，諸如此類。
- 字體。 在印刷設計中，我通常說你應該只選擇兩種字體。 對於很多在線應用程序，最好只選擇一個。 然後，您可以使用該一種字體的不同大小和粗細。 選擇一個字體系列對於建立一致的外觀並在其他地方允許更多的創造力大有幫助。
- 調色板。 如果你還沒有，你應該為你的品牌建立色彩指南——讓它們成為你品牌的一部分。 有很多資源可以幫助您選擇可以很好地協同工作的調色板，具體取決於您想要傳達的感覺或您想要創造的情緒。
然後對於特定的項目，比如入站營銷報價，您也將在其中創建一致性。 牢記您的品牌一致性，對於每個項目，您應該……
- 確定一個主題。
- 根據該主題創建外觀。
- 並為圖像設置樣式以及如何使用它們。 這可能意味著選擇一組具有一致外觀或堅持某種攝影風格的圖標。
偉大的營銷設計的例子
現在讓我們看一個我們已經討論過的所有事情的例子，在行動中。 我們將查看我們為在 madison/miles media（網頁設計機構）創建的入站營銷漫畫書創建的活動。 我們花了數年時間寫這本書，所以我們真的很想圍繞它創建一個有效的活動。
我們如何創建一個使用設計來推動買家前進的入站優惠活動？
讓我們從我們的號召性用語按鈕開始：
現在讓我們檢查一下，確保它符合我們優秀設計的標準。 首先，清楚嗎？ 信息簡單明了：“以有趣的方式了解入站營銷。 獲取你的免費漫畫書。” 並且設計不會妨礙這一點。 事實上，它試圖讓信息更加清晰，通過用我們的金色著色來強調我們的主要主題——入站營銷。 此外，我們在一個盒子裡有“獲取你的免費漫畫書”，所以它看起來像一個按鈕。 請記住，在清晰的設計中，我們希望引導潛在客戶朝著我們的方向前進。 使整個 CTA 圖像看起來像一個按鈕，或在圖像中創建一個類似按鈕的元素，有助於通過說“單擊此處”來引導潛在客戶。
乾淨嗎？ 我們限制了我們的元素：我們有我們的主角，一些簡單直接的文本，以及漫畫書的圖像。 所有這一切都建立在漫畫的背景之上。 它給了它一些視覺上的興趣，但完全不干擾其他元素。
是否一致？ 嗯，這是大多數人會看到的第一件作品，所以我們在這裡建立外觀，以便以後的作品與之保持一致。 但是，我們已經通過從“WILD！”中提取金色來建立與漫畫書本身的一致性！ 在標題中，我們用於標題的“驅動您的客戶”部分的字體以及我們用於副標題的封面中更傳統的字體。 那是 Benton Sans，這是我們主要的 madison/miles 媒體品牌字體。 我們將其用於“獲取免費漫畫書”按鈕。
我們也是一家印刷雜誌設計機構，因此您會看到我們的品牌字體體現在我們不同形式的營銷中。 這對我們的品牌塑造非常重要。 一家公司應該始終是可識別的，所以在你的設計過程中記住這一點。
所以，是的，我們與我們公司的既定外觀和報價本身保持一致，我們正在製定一些其他指導方針，說明我們將如何在我們的活動中使用其他元素。
這是另一個 CTA 按鈕。
這個設計用於電子郵件。 同樣，我們確保設計是……
- 清除。 簡單的信息，以明確引導潛在客戶的方式傳遞。
- 乾淨的。 元素數量有限，以增強且不干擾消息的方式使用。
- 持續的。 與我們之前的作品相同的字體、顏色和圖像。 我們設定了外觀並堅持下去。
這是登陸頁面。
當然，登陸頁面是一個非常重要的部分，因為這是建立信任的地方。 潛在客戶會給你一些信息，尤其是現在，他們需要信任你。 遵循我們“清晰、乾淨、一致”的設計原則是建立這種信任的好方法。 精心設計的登陸頁面顯示“您在這裡與專業人士打交道。”
很明顯。 我們漫畫書的標題很大，並且位於英雄藝術的下方。 很清楚訪客的期望。 填寫三個表單字段，然後單擊易於查看的大按鈕。 十分簡單。
它很乾淨。 我們最初有一個淺藍色背景。 只是一個乾淨的白色最終效果更好。 這裡沒有什麼花哨的，但它不是必需的。 僅在漫畫藝術中，我們就有很多視覺上有趣的元素。
它與 CTA 一致。 來自相同來源的圖像，唯一的事情是我們現在讓他們在漫畫書中窺視。 您可能會注意到我們還引入了另一種字體，但這是來自我們網站 Playfair Display 的 madison/miles 的輔助字體。 所以我們現在引入了一些，但保持一切與既定外觀一致。 我們還有底部的綠色條，這是我們的麥迪遜/英里媒體綠色。 再說一次，只是以一種非常微妙的方式介紹我們的一些品牌。
現在我們到達感謝頁面。
再次，很清楚。 下載內容提供的大按鈕。 非常明確的次要行動號召，引導訪問者現在更多地了解我們是誰。 它很乾淨。 我們確實在此頁面上保留了藍色背景，以稍微區分它。 但它非常微妙和不引人注目。 最後，它是一致的。 相同的顏色、字體和圖像。
感謝頁面的希望之一是訪問者隨後將遵循這些鏈接之一。 我們也希望這是一個平穩的過渡。 因此，如果他們點擊進入我們網站上的資源頁面，感覺就像是他們旅程的延續。
因為我們在此過程中使用了品牌字體和顏色之類的東西，所以我們與我們的品牌建立了一致性，並實現了從我們的報價平穩過渡到我們的主站點。 在設計方面沒有什麼不和諧或令人困惑的，因為我們以微妙的方式引入了品牌一致性。
因此，通過在我們的入境營銷中使用清晰、乾淨和一致的設計，我們正在為買家的旅程提供動力。 在您的設計中使用這些相同的原則，讓您的潛在客戶沿著他們與您建立聯繫的道路前進。
madison/miles media 在 DesignRush 上被公認為頂級內容營銷公司。{{cta('1395b35c-b222-49d6-8bdd-fb2e45b05459')}}