如何運用柵格系統設計一個Logo?

2020-12-11 人人都是產品經理

柵格線真的只能拿來裝逼展示嗎？有什麼目的呢？平時應該怎麼看待它，怎麼用它，這篇文章或許能給你答案，一起來學習吧。

經常看到很多LOGO初看一般，但只要加上了柵格線，感覺瞬間就上了一個檔次。記得有個比較出名的例子就是錘子手機的Logo，是不是覺得右邊的柵格線加上之後，瞬間高大上了很多。

那這些柵格線真的只能拿來裝逼展示嗎？有什麼目的呢？平時應該怎麼看待它，怎麼用它，這篇文章或許能給你答案，一起來學習吧。

logo是品牌形象非常重要的一部分。當設計師運用柵格系統設計logo時，可以讓logo的形狀看起來更加完美，使品牌經久不衰且讓人印象深刻。

在這篇文章中，我會介紹我設計logo的經驗以及我為什麼在logo設計中運用柵格系統。剛開始設計logo的時候，我會做調研，頭腦風暴，畫草圖，但是很難讓logo的幾何形狀設計到比較完美，而且我相信大多人也無法只用筆就可以畫出一個完美的logo。

Logo設計中的黃金比例

隨著工作經驗的累積，我改變了我的工作方式，在logo設計過程中融入柵格系統，結果有了很大的改善。但這並不是一夜之間的轉變，我是在設計過程中不斷的提升我的設計方式，才有這樣的變化，所以我是怎麼做的？

下面我們會討論：

柵格系統的目的是什麼？logo設計中使用柵格系統的目的是什麼？使用柵格系統設計logo的基本方法每個設計師都有必要掌握柵格系統嗎？

SriSahasra 花卉活動裝飾 Logo

柵格系統的目的是什麼？

柵格系統並不是非常新鮮的東西，幾十年來，攝影師，藝術家，印刷師和設計師一直在用柵格來解決視覺問題。

柵格系統是排列所有元素的不可見結構

平面設計師利用柵格，可以使書籍，雜誌，宣傳冊，logo，和其他的設計更簡單。

UX/UI設計師使用柵格來對齊複雜的頁面元素，網頁設計中可以使用多種類型的柵格，主要包括：Bootstraps 12列網格系統，960網格系統，黃金比例網格，基礎網格等。

關於網頁的柵格系統，我會在另外一篇文章中結合具體案例講解。

12列柵格系統案例

在我的12個UX/UI 個網頁設計探索中運用的是黃金分割柵格來進行設計布局

建築設計裡面的黃金比例：

使用柵格系統意味著遵循客觀通用規律

彩雲註：如果想深入研究柵格系統，你可以從圖形設計和柵格系統的歷史開始進行自己的調研，關於設計探索，新技術，色彩理論以及設計的各個方面的文章和視頻有很多。在這篇文章中，我們只討論logo設計中的柵格系統。一個比較好的學習方法是不斷的看優秀logo設計作品並問自己為什麼它們看起來如此新潮，現代，耐看和有影響力。他們使用了什麼方法來設計？採用什麼設計原則讓logo看起來這麼完美？

順序原則：柵格系統是為了讓設計具有優先級。

簡約性原則：柵格系統是為了讓設計更加簡約。

柵格系統在logo設計中非常有必要，但也不要為了使用柵格而使用柵格，logo設計也應在視覺上保持平衡。一旦掌握了基礎使用方法，就可以輕鬆地根據需要打破規則。

logo設計中柵格系統的目的是什麼？

品牌設計的各個方面都會用到logo，柵格系統通過順序性原則和簡約性原則使logo在品牌推廣過程中的應用更簡單，也有利於以後與其他設計師的合作中保持視覺的一致性。

Logo中使用柵格系統的基本方法

你可以使用多種類型的柵格。但是基本上這些都是圓形，正方形和矩形的組合，或者一個形狀增加一定的角度。我最喜歡使用45度或90度的角度，因為這些角度看起來更自然。數學比率在logo設計中可以有利於保持logo的視覺平衡，例如斐波那契數列或黃金分割。

柵格系統只是一個幾何工具

有一點需要說清楚的是，柵格其實並不是那麼的重要。柵格系統只是一個幾何工具，你用一些其他視覺平衡的形狀也可以設計出讓人喜歡的logo。沒有一個固定原則或速成的方法要求每個設計師必須在設計中使用，有時候使用柵格反而會讓logo適得其反，這個需要我們隨著工作經驗和專業的不斷增加來靈活的運用這些方法。

從別的設計師作品中學習

有很多設計師的作品非常值得學習，找到他們並持續關注。

不要一開始使用柵格設計

先從設計調研，概念探索開始，然後嘗試不同方案。大多數的設計師都跳過了前面的步驟，想直接通過柵格系統來設計讓人滿意的logo。柵格系統很重要，但這個方法應該在最後一步完成。

所以剛開始設計的時候我建議先畫最少20-30個概念稿，選出最好的3個將其矢量化到軟體中，然後選出最好的一個用柵格系統來進行完善。隨著經驗的積累，你畫的草圖會越來越少，並在選擇可行方案上更加有經驗。當你開始使用上面所介紹的方法來設計logo的時候，就會離設計一個完美的logo更近一步。

原文：https://uxplanet.org/logo-design-with-grid-system-ec23b593fc2c

作者：Kanhaiya Sharma

譯者：周慧敏，關注產品，交互，用戶體驗的UI設計師，希望把遇到的國外優秀文章分享給對這篇文章感興趣的你。

本文由 @周慧敏 翻譯發布於人人都是產品經理。未經許可，禁止轉載

題圖來自Unsplash，基於CC0協議

相關焦點

  • 乾貨:網頁設計之柵格系統
    維基百科對其定義為：柵格設計系統（又稱網格設計系統、標準尺寸系統、程序版面設計、瑞士平面設計風格、國際主義平面設計風格），是一種平面設計的方法與風格。網頁柵格系統是有平面柵格系統中發展而來，以規則的網格陣列來指導和規範網頁中的版面布局以及信息分布。
  • 利用柵格系統,構建優秀的響應式設計
    合理運用柵格系統可以幫助我們控制布局結構並實現一致和有組織的設計，這篇文章介紹了利用柵格系統構建響應式設計。一、寫在前面今天，90％的媒體互動都是基於屏幕的，通過手機，平板電腦，筆記本電腦，電視和智能手錶來與外界產生聯繫。多屏設計已成為商業設計中不可或缺的一部分，響應式設計正迅速成為常態。
  • 從柵格系統實例,了解柵格基礎知識
    本文將為大家介紹設計網頁裡非常重要的一個網格系統，也叫柵格系統。那麼柵格系統的作用以及設計要點是什麼呢？本文將為大家揭曉。「UI設計的不就是這些細節，難道要比誰畫的圓更圓誰畫的方更方嘛？」——引用自我設計路上的引路人美mo語錄這篇我就給大家介啥一下設計網頁裡非常重要的一個網格系統，也叫柵格系統英文為「grid systems」。這東西的作用其實有點兒像小時候寫字的田字格本子，它起到的作用就是讓你就算字寫的很難看，但是最起碼能在這個橫平豎直的田字範圍裡顯得規規整整。
  • 3dmax軟體如何設置柵格並對柵格大小進行修改步驟教程詳解
    3dmax如何進行柵格設置？ 在3dsMax中，柵格有著可視化空間、比例和間距的輔助工具對象。本文小編將為大家詳解3dmax設置柵格對柵格大小、柵格線顏色進行修改的步驟與教程。3dmax如何進行柵格設置3dmax設置柵格的步驟與教程如下：步驟一、打開3d max軟體，可看到四個視圖窗口，在窗口的頂邊的菜單工具欄下，
  • 深入淺出,帶你認識網格系統與版式設計
    在報名過程中，很多同學問的最多的問題是什麼是網格系統？它與版式設計有什麼聯繫？基於這些問題，很有必要編寫一篇文章讓大家提前認識一下網格系統與版式設計。當然，開課後，劉痕老師也會詳細和大家講解這塊知識，例如在第四節時會講解到。掌握版式構圖，是每一位平面設計師的看家本領。學習排版，除了要有系統的理論知識做指導，還要學會在實踐中如何去運用。
  • 小程序Logo如何設計?
    小程序Logo，一般是在手機屏幕上展示，對於logo設計的識別性要求很高，並要確保logo在小程序上達到美觀、清晰的呈現效果。這篇文章整理了主流小程序平臺的設計規範，以及需要掌握的針對於小程序logo設計的3點實用技巧，希望對需要設計小程序logo的朋友們有些幫助。
  • 如何設計出一個好logo?深圳逗號設計為你解答
    logo設計作為一種藝術，看似只是一個符號，卻充當著設計中的「小品』，logo設計也是廣告設計中最難操作的。一名專業的LOGO設計師，基本功需要深厚，再到實踐中去不斷打磨，比如設計各種企業公司LOGO，能更快的領悟其中的技巧與理念。那麼如何設計出一個好logo呢？
  • 設計不出來logo怎麼辦?這裡6種logo設計方法,分分鐘搞定logo!
    如今的logo設計越來越趨向於簡潔、乾淨、清晰、獨特，簡約的設計更容易讓別人感知，更易被描述、被記住。如何能讓自己設計的logo簡約，又讓人容易識別。今天和大家分享一下LOGO設計技巧，希望給你帶來不一樣的創意和靈感，設計LOGO的時候不要設計得太複雜了，LOGO它是個標記需要保持簡單。設計的時候要讓LOGO具有靈活性，不能太依賴配色方案，即使顯示成黑白色都是好看的，列如蘋果公司的LOGO不論那種配色方案都非常好看，這是logo設計靈活性最好的例子！
  • 5個層次分析:產品設計中的「借鑑」思想如何運用?
    5個層次在產品的不同流程中，但排列組合又組成了一個有機的網際網路產品。基於5個層面的「借鑑」競品應該如何去做：那麼，如何通過競品的數據分析從而得出結論應用到自己產品設計中去？首先，明確數據分析目的，為什麼要收集並分析這樣一份數據？只有你的目的明確了之後，才能對接下來你要收集哪些數據、如何收集有一 個整體的把握。只要這些點是一個個切實待解決的問題點，將其 羅列下來，一個一個的去收集數據。你分析的結果可能會改變整個項目，但有了數據的支撐，會讓項目或需求有一個全新的開始或細節的調整。
  • 平面設計——logo設計
    Logo，是品牌的靈魂，一個logo的好與壞，影響品牌的市場佔有率。Logo設計的風格很多樣化，有強烈風格的logo更能讓人記住，一些知名品牌的logo看起來簡潔易記，在消費者心中留下不可磨滅的印象。今天竹上貓小編就來分享一些不同風格的logo，視覺上簡潔大氣，彰顯品牌的蘊意。
  • 如何評價一個logo
    對於一個企業來說logo是必須要有的，因為它是一個企業的象徵。 但是logo也是有優劣之分，有時同樣的價格設計出來的logo也是不同的，那麼如何評估一個logo的優劣呢？① 應用性公司的logo是要具備強大的應用性的，做廣告時可以用，多媒體上可以用，不僅僅是在網站上打開，也是需要列印出來，不能在網站上看起來是正常的，但是印刷出來就模糊了，在廣告或者傳真紙上以黑白顏色呈現時，會造成與原來彩色原圖的較大視覺偏差。
  • 如何設計抖音LOGO頭像 抖音logo怎麼設計好看
    首頁 > 問答 > 關鍵詞 > 抖音最新資訊 > 正文 如何設計抖音LOGO頭像 抖音logo怎麼設計好看
  • 對啊網設計學院:如何製作自己的logo設計
    為什麼logo很重要？ 但是，在我們研究如何製作logo之前，值得一看的是設計良好的logo的特點。畢竟，如果您不知道使logo成功或失敗的原因，如何設計自己的logo？ logo很重要的原因之一是因為它可以簡潔有效地告訴潛在客戶和客戶企業的全部內容。
  • 如何打造有溫度的烘焙logo設計?
    一個非常好看而且有寓意的logo，不但能夠達到吸引更多消費者進來消費的效果，而且還可以在他們心裡留下深刻的印象，從而達到持續性消費的效果。那麼，如何才能打造一個具有溫度的烘焙logo設計呢？下面小編就來帶大家了解一下。
  • 全球信息柵格通信能力建模
    O 引 言全球信息柵格(GIG)是在全球範圍內工作的一個超大規模信息系統，是新時期、新戰略、新思想下的產物。它能提供一套增值功能來支援信息處理、存儲和傳送，並實現人網互動、網絡管理、信息分發管理、信息保障等功能的最優化，它是未來分布計算機技術發展的趨勢。
  • 怎樣設計好一個LOGO?有哪些流程步驟!
    本文由：「學設計上兔課網」原創，圖片素材來自網絡，僅供學習分享 怎樣設計好一個LOGO？有哪些流程步驟！當您看到他人設計出的優秀logo時，是不是心生羨慕？是不是也希望自己在某一日可以擁有如何杰出的logo標誌？
  • 如何用AI設計logo?扁平化圖標logo設計案例詳解
    手機應用等扁平化的logo圖標非常漂亮，如何設計呢？非常簡單，今天萬逢春給大家做一遍演示，教大家如何輕鬆搞定扁平化圖標logo設計。第一步，新建文檔，選擇鉛筆工具，繪製圖形，使用平滑 工具拖動滑鼠，使得路徑變得平滑。
  • 平面設計師們最常用的logo設計指南……
    每次談起平面作品集 logo 項目的製作流程，主題、調研、草圖、成稿、排版這些詞就高頻率的出現。雖然聽過百遍，但對於初次申請的國內學生來說，還是面臨抽象難懂的問題。於是，今天總結了5大板塊，為同學們系統講解平面 logo 設計，希望能對你的平面作品集創作起到事半功倍的效果。
  • 創意logo設計的幾種表現形式
    因此logo設計的形式也是多樣化，而logo設計常用的3種表達形式：具象圖形logo、抽象圖形logo、字體logo，我們一起來看看吧。1、具象圖形logo具象圖形logo這是在品牌設計中比較常見的。2、抽象圖形logo抽象圖形logo在品牌設計中更加適用於多元化企業。在logo設計的過程中，如果字體或具象表現能力受限或者象徵的範圍狹隘，不能很好的表現其精神和文化理念時，這時候可以選擇具有象徵意義的抽象圖形來表達。抽象圖形的logo能夠帶來廣闊感和自由感，留給人們豐富的想像餘地，這有利於豐富logo的藝術表現力。
  • 新手如何設計App的圖標Logo?
    想要設計一款App圖標logo，卻不知道從何下手，也不清楚尺寸規範。針對新手，如何快速搞定app logo圖標設計？藉助在線設計LOGO神器，今天和大家分享移動App 的logo圖標設計，現學現用容易上手的4個小套路！1.品牌名稱的首字母/漢字