使用Illustrator和Fontastic.me創建手繪字體

01之06

使用Illustrator和Fontastic.me創建手繪字體

文字和圖片©Ian Pullen

在這個有趣而有趣的教程中,我將向您展示如何使用Illustrator和在線Web服務fontastic.me創建自己的字體。

為了跟隨,您需要Adobe Illustrator的副本,但如果您沒有副本並且不想購買它,您可能會對我們使用Inkscape的類似教程感興趣。 Inkscape是Illustrator的免費開源替代品。 無論您使用哪種矢量線繪圖應用程序,fontastic.me都可以免費提供完整的服務。

雖然我將向您展示如何使用紙上繪製的字母照片創建手繪字體,但您也可以使用類似技術使用直接繪製到Illustrator中的字母生成字體。 如果您使用繪圖平板電腦 ,這可能比您更可取。

如果使用照片,請確保使用深色筆筒繪製字母並使用普通白紙進行最大對比。 另外,請將您的照片放在光線好的位置,以幫助製作清晰對比的照片,以便Illustrator能夠輕鬆追踪各個字母。

在接下來的幾頁中,我將引導您完成創建第一個字體的過程。

02 06

打開一個空白文檔

文字和圖片©Ian Pullen

第一步是打開一個空白文件來工作。

轉到文件>新建,然後在對話框中根據需要設置大小。 我使用了500px的方形頁面大小,但可以根據需要進行設置。

接下來,我們將照片文件導入到Illustrator中。

03年06月

導入您的手繪文字照片

文字和圖片©Ian Pullen

如果您沒有手繪文字的照片,您可以下載我用於本教程的相同文件。

要導入文件,請轉到文件>放置,然後導航到您的手繪文本照片所在的位置。 點擊地點按鈕,你會看到照片出現在你的文檔中。

我們現在可以跟踪這個文件給我們矢量字母。

04年6月

追踪手繪字母的照片

文字和圖片©Ian Pullen

跟踪信件非常簡單。

只需進入對象>實時跟踪>製作和展開,稍後片刻,您就會看到所有字母都已經疊加了新的矢量線版本。 不太明顯的是,它們將被另一個代表照片背景的物體包圍。 我們需要刪除背景對象,所以轉到對象>取消組合,然後單擊矩形邊界框外的任何位置以取消選擇所有內容。 現在單擊其中一個字母的近旁,但不是,您應該看到矩形背景被選中。 只需按下鍵盤上的刪除鍵即可將其刪除。

但是,如果您的任何字母包含多個元素,則會留下所有單個字母,因此您需要將它們組合在一起。 我的所有信件都包含多個元素,所以我必須將所有這些元素分組。 這是通過點擊並拖動包含字母的所有不同部分的選擇框來完成的,然後轉到對象>組。

現在您將剩下所有的單個字母,接下來我們將使用這些來創建我們需要在fontastic.me上創建字體的單個SVG文件。

相關: 在Illustrator中使用Live Trace

05年06月

將單個字母保存為SVG文件

文字和圖片©Ian Pullen

不幸的是,Illustrator不允許將多個畫板保存到單獨的SVG文件,因此每個字母都必須手動保存為單獨的SVG文件。

首先,選擇並拖動所有字母,以便它們不會覆蓋藝術板。 然後將第一個字母拖到美工板上,並通過拖動其中一個角拖拽手柄來重新調整其大小以填充美工板。 按住Shift鍵的同時保持相同的比例。

完成後,轉到文件>另存為,然後在對話框中,將格式下拉列表更改為SVG(svg),為該文件指定一個有意義的名稱,然後單擊保存。 您現在可以刪除該字母並放置並在美工板上重新調整下一個。 再次執行另存為並繼續,直到您保存了所有的字母。

最後,在繼續之前,請保存一張空白畫板,以便您可以將其用作空格字符。 你也可以考慮保存你的信件的標點符號和小寫版本,但我沒有為這個教程而煩惱。

隨著這些獨立的SVG字母文件準備就緒,您可以通過將它們上傳到fontastic.me來進行下一步創建。 請看看這篇文章,看看如何使用fontastic.me來完成你的字體: 使用Fontastic.me創建一個字體

06年06月

如何在Adobe Illustrator CC 2017中使用新的資產導出面板

使用Adobe Illustrator CC 2017中新的“資產導出”面板將SVG創建縮減為點擊並拖動工作流程。

當前版本的Adobe Illustrator包含一個新面板,可讓您將所有圖形放在一個畫板上,並將它們輸出為單獨的SVG文檔。 就是這樣:

  1. 選擇窗口>資產導出打開資產導出面板。
  2. 選擇一個或全部字母並將其拖入面板。 它們都將顯示為單個項目。
  3. 雙擊面板中對象的名稱並重新命名。 對面板中的所有項目執行此操作。
  4. 選擇要導出的項目,然後從彈出的格式中選擇SVG。
  5. 點擊導出。