人工智慧Logo設計師Brandmark

mp.weixin.qq.com

里，就介紹過 Brandmark 了，當時 Brandmark 還是 v1 的版本，現在已經是 v2 版本了，也上線了一些子產品，例如 Brand Rank 、 Logo Crunch 。

Brandmark 在官方博客里介紹了關於人工智慧做 Logo 設計的思考，核心的內容，我梳理了下：

使用類似於字體向量（ https://github.com/Jack000/fontjoy ）來發現字體之間的關係， Brandmark 希望將 Logo 中的圖標與字體分別向量化，進行匹配。 Brandmark 認為粗體字體與 icon 的填充面積是相關的，於是設定了一條規則：越粗的字體配填充面積越大的 icon ，是一個較好的設計 ( 設計師更多地思考及制定設計規則 )。基於此，很多工作將得以開展。關於顏色， Brandmark 是這麼思考的。顏色是通過大量的配色數據，按照明度進行排序，並打上標籤，以生成各種標籤的顏色集。顏色方面， Brandmark 顏色生成採用的是基於 pix2pix ，使用 GAN 來生成新的顏色組合（ http://colormind.io ）。數據集使用 Adobe Color 數據和 Dribbble 的手工挑選的調色板組合。顏色數據集的更新，補充 Brandmark 採用從照片提取主題色的方法，使用 MMCQ （ Modified Median-Cut Color Quantization 改進的中位切分法）的方法。除了 MMCQ 方法，還有 KMeans 對於主題色的提取效果也是不錯的。

在 Brandmark 的博客里，提到了「 設計民主 」，以後任何人都更容易接觸到設計，同時快速具備設計能力。

Brandmark 的核心產品 Logo 設計，有4個流程：

1、輸入logo的名稱，簡介

2、輸入關鍵詞

3、選擇喜歡的顏色風格

4、生成設計

目前普遍認為 step by step 的方式是體驗比較好的做法，但我們需要留意流程的長度，基於技術實現的難度，盡量減少流程的長度。當然，除了很智能的幾步生成設計之外， Brandmark 還提供了手動編輯／調整 Logo 的功能。

我們從參數的角度看 Brandmark Logo 的設定。主要是由2大塊，一個是關於 Logo 組成元素，例如 Title 、Tagline 、Icon 、 Background。另一個是 ColorScheme 。整個產品的模型：

Logo=BrandMark( Title, Tagline, Icon, Background )ColorScheme( Main_color, Background_color )

詳細的參數設置，有興趣可以翻閱下：

Title={ 「Text」:String, 「Size」:Number, 「Letter_space」:Number, 「Line_space」:Number, 「Color」:String, 「Font」:String}Tagline={ 「Text」:String, 「Size」:Number, 「Letter_space」:Number, 「Line_space」:Number, 「Color」:String, 「Font」:String}Icon={ 「Hide_icon」:Boolean, 「Size」:Number, 「Spacing」:Number, 「Line_space」:Number, 「Color」:String, 「Choose_icon」:String}Background={ 「Color」:String }ColorScheme={ 「Title_color」:String, 「Tagline_color」:String, 「Icon_color」:String, 「Background_color」:String}

Brandmark 在智能生成與手動設置之間找到了一個較好的平衡點。

接下來，我們看下 Brandmark 的子產品 Logo Rank ，一款用於評估 Logo 設計質量的web應用，根據用戶上傳 Logo 圖片，系統根據 Uniqueness （獨特性）、Legibility （醒目）、Color/Contrast （顏色／對比度）幾個維度進行評測，輸出簡單的報告。

Uniqueness

獨特性

類似於「以圖搜圖」，基於相似度，比對資料庫里的一百萬個 icons ，計算出視覺上的獨特性。這邊官方也介紹了是基於 CNN 來做的。

Legibility

醒目

從線條的清晰，粗細，易於識別程度來評估 Logo（也許技術上是通過計算像素 rgba 中的 a 通道值，讓計算機區分手繪的線條與軟體畫出來的線條）。

Color/Contrast

顏色／對比度

評估色彩屬於主觀的成分較多，從數據本身，Brandmark 採用基於著名品牌的 Logo 進行參照。如麥當勞、 snapchat 、可口樂樂等。

Overall

總體的評估得分

通過各評估維度的佔比，得出一個總體的評分：

Overall( Uniqueness, Legibility, ColorContrast )

再介紹一款子產品 Logo Crunch 。它是一個用於生成多解析度的 Logo ，它使您的高解析度 Logo 在較低解析度上清晰可見。可以運用於網站圖標，iOS 應用圖標或 Android 應用圖標的生成。用戶只需上傳一個高解析度的 Logo ，其他解析度的內容通過此工具自動生成。策略上有3個方法：圖像形態學上的開與閉運算來進行，給 Logo 整體加粗描邊，識別圖像中過細的線條進行針對性描邊。

Brandmark 還有 Font Generator 字體生成，AI Color Wheel 智能配色。大家有興趣可以自行體驗，或在知識星球進一步交流。

*

知識星球

更多可以在知識星球交流。

*

熱門文章