Adobe Illustrator CC For LuckyTemplates 備忘單

Adobe Illustrator CC For LuckyTemplates 備忘單

Illustrator 使用方式的許多最顯著變化發生在將矢量圖像轉換為網絡的領域,而被低估的 SVG 格式是該過程中的關鍵環節。SVG 文件保留了矢量圖的寶貴可擴展性功能,並且在網站和 Web 開發環境中幾乎得到普遍支持。為 Web 準備矢量圖稿時,重要的是要避免使用 Illustrator 的標準效果,而是使用 SVG 濾鏡。

Illustrator 附帶了一套體面但極簡的 SVG 過濾器,但這裡有一些關於如何查找和添加 SVG 過濾器的提示以及用於創建自己的 SVG 過濾器的資源。對於那些與 Web 和應用程序開發人員一起工作的人,通過查看用於交付 SVG 代碼的備忘單,讓他們的生活更輕鬆、更高效。

如何在 Illustrator 中應用 SVG 濾鏡

當您在 Illustrator 中為屏幕創建 SVG 文件並且想要應用效果(如陰影)時,您應該將這些應用為 SVG 濾鏡。這樣,您的 SVG 文件就可以保持無限的可擴展性而不會失真。

以下步驟將引導您在 Illustrator 中將 SVG 過濾器應用於圖形:

選擇要應用過濾器的對象。

選擇效果→SVG 濾鏡。

從出現的列表中選擇一個過濾器。
大多數過濾器都有描述性名稱。例如,與個位陰影的名稱是下拉陰影,與那些高斯的名字是高斯模糊。工作流程有點奇怪和迂迴,但您需要先選擇一個過濾器來訪問所有可用於應用的選項。

要更改選定的過濾器:

  • 保持選擇應用過濾器的對象,然後通過選擇窗口→外觀打開外觀面板。
  • 在“外觀”面板中,單擊出現在面板“填充”部分中的 SVG 過濾器。“應用 SVG 過濾器”面板打開。
  • 在“應用 SVG 過濾器”面板中,更改應用的過濾器。
  • 要查看過濾器的外觀,請選中預覽複選框,如圖所示。
    Adobe Illustrator CC For LuckyTemplates 備忘單

確定過濾器後,單擊“應用 SVG 過濾器”面板中的“確定”。

如何將 SVG 濾鏡添加到 Illustrator

Illustrator 的 SVG 過濾器集是極簡主義的,但您可以通過設計自己的過濾器或從在線資源下載預先打包的 SVG 過濾器集來增強它。設計過濾器涉及編碼,但如果您熟悉 HTML,它是可行的。我推薦w3Schools 上的教程來創建 SVG 過濾器。或者,您可以在線購買過濾器集,甚至可以在Creatingo找到一些不錯的免費 SVG 過濾器集。

購買或創建自己的 SVG 過濾器後,您可以按照以下步驟在 Illustrator 中安裝它們:

選擇效果→SVG 濾鏡→導入 SVG 濾鏡。

在打開的對話框中,導航到並雙擊您創建或免費下載的 SVG 過濾器文件。
您要查找的文件應該是一個 SVG 文件(多個過濾器捆綁在一個 SVG 文件中)。
您的新過濾器現在可在 SVG 過濾器子菜單中使用。

選擇效果→SVG 過濾器將新過濾器應用於所選對象。

如何將 SVG 代碼從 Illustrator 移交給開發人員

通常,您在 Illustrator 中創建的 SVG 圖形會移交給遊戲設計師、動畫師、信息圖表或其他輸出,開發人員將在其中處理 SVG 圖形背後的代碼。作為插畫家,您不需要知道如何創建該代碼,但您可能需要知道如何獲取它並將其交給開發人員。就是這樣。

將 SVG 圖形作為代碼導出的途徑通過 Illustrator 的保存功能運行。“保存”菜單具有將文件導出為 SVG 代碼的選項(不容易找到)。在生成該代碼時,您可能希望與屏幕開發人員進行實時通信,因為有幾個選項取決於該代碼的使用方式:

選擇文件→保存(如果您要重新保存文件,則選擇另存為)。

在打開的對話框中,從格式菜單中選擇 SVG。
忽略 SVGZ 文件選項,該選項用於不在瀏覽器中顯示的壓縮文件。

單擊保存以打開 SVG 選項對話框。

始終在 SVG Profiles 下拉列表中選擇 SVG 1.1。其他版本已過時。

如果您在 SVG 文件中嵌入或鏈接了圖像,請從圖像位置下拉列表中選擇嵌入。但是,請先諮詢您的 Web 開發人員有關此選擇的信息。

選擇保留 Illustrator 編輯功能以使文件可在 Illustrator 中編輯。
此選擇會增加文件大小,但允許您處理單個 SVG 文件,您可以編輯、更新該文件並與 Web 開發人員共享。

如果顯示更多選項按鈕,單擊它以訪問高級選項。並做出您的選擇。
本質上,不同的選項使用您的文件生成 CSS,該文件以下列方式定義屬性。請諮詢您的 Web 開發團隊成員,了解如何定義這些 CSS 屬性:

  • Presentation Attributes在 SVG 代碼中嵌入樣式。此選項是最簡單的默認選項。如果您不與網絡或應用程序開發人員合作,請使用此選項。
  • 這兩個樣式屬性選項盡可能依賴 CSS 來管理樣式。
  • 樣式元素為樣式生成類樣式選擇器。
  • 包含未使用的樣式選項生成的代碼可能增加,而無需增加函數值的SVG文件的大小。

取消選中 SVG 選項對話框底部的五個複選框,除非您的開發人員合作夥伴要求您選擇它們。
這些選項適用於高度專業化的應用。

要根據您在 SVG 選項對話框中所做的選擇生成 SVG 代碼,請單擊SVG 代碼按鈕。
生成的 SVG 代碼顯示在操作系統的文本編輯器中。您可以使用操作系統的文本編輯器將該代碼保存為文本文件,然後將該文件交給開發人員。

生成代碼後,單擊“確定”保存文件。
您可以在 Illustrator 中重新打開和編輯此文件。


屏幕抓取 PDF 文件的一部分

屏幕抓取 PDF 文件的一部分

您可以使用 Adob​​e Acrobat CS5 中的快照工具來選擇文本和圖像,並在 PDF 文件中創建特定區域的圖片。結果通常稱為 PDF 文件中某個部分的屏幕抓取。結果是一張圖片,而您的文字不是 [...]

在 Photoshop CC 中測量、計數和分析像素

在 Photoshop CC 中測量、計數和分析像素

Photoshop CC 中的測量功能專為研究人員和科學家設計,非常強大。您可以測量任何事物併計算技術圖像中任何事物的數量,可能來自顯微鏡或望遠鏡。如果您知道圖像中任何元素的確切大小,那麼您幾乎可以發現任何 […]

Adobe CS5 Illustrator 中的液化工具

Adobe CS5 Illustrator 中的液化工具

當您使用 Adob​​e Creative Suite 5 (Adobe CS5) Illustrator 中的液化工具時,您可以通過創建簡單到復雜的扭曲來彎曲對象——使它們呈波浪狀、粘稠狀或尖狀。液化工具可以為您的對象完成各種創造性的或古怪的(取決於您如何看待它)扭曲。你 […]

如何在 Adob​​e XD 中調整文本屬性

如何在 Adob​​e XD 中調整文本屬性

當您的 Adob​​e XD 項目中有文本時,您可以開始更改文本屬性。這些屬性包括字體系列、字體大小、字體粗細、對齊、字符間距(字距調整和跟踪)、行間距(前導)、填充、邊框(筆觸)、陰影(投影)和背景模糊。因此,讓我們回顧一下如何應用這些屬性。關於可讀性和字體 […]

如何在 InDesign CC 中創建二維碼

如何在 InDesign CC 中創建二維碼

您可以使用 InDesign 創建和修改 QR 碼圖形。二維碼是一種條形碼形式,可以存儲文字、數字、URL 或其他形式的數據等信息。用戶使用她的相機和智能手機等設備上的軟件掃描 QR 碼,該軟件使用 [...]

在 Photoshop CC 中使用畫板

在 Photoshop CC 中使用畫板

就像在 Adob​​e Illustrator 中一樣,Photoshop 畫板提供了在一個文檔中構建單獨頁面或屏幕的功能。如果您正在為移動應用程序或小手冊構建屏幕,這會特別有用。您可以將畫板視為使用“圖層”面板創建的一種特殊類型的圖層組。它的 […]

在 Adob​​e Illustrator CC 中換行

在 Adob​​e Illustrator CC 中換行

在 Adob​​e Illustrator CC 中包裝文本與包裝禮物並不完全相同——它更容易!文本換行強製文本環繞圖形,如下圖所示。此功能可以為任何作品增添一點創意。圖形迫使文本環繞它。首先,創建 […]

如何在 Illustrator 中調整形狀大小

如何在 Illustrator 中調整形狀大小

在 Adob​​e Illustrator CC 中進行設計時,您通常需要具有精確尺寸(例如,2 x 3 英寸)的形狀。創建形狀後,將其大小調整為精確測量值的最佳方法是使用“變換”面板,如下圖所示。選擇對象,然後選擇窗口→轉換為 […]

如何將透明度應用於 SVG

如何將透明度應用於 SVG

了解如何在 Illustrator 中對 SVG 圖形應用透明度。探索如何輸出具有透明背景的 SVG 並應用透明效果。

在 Adob​​e XD 中處理圖像

在 Adob​​e XD 中處理圖像

將圖像導入 Adob​​e XD 後,您將無法進行大量編輯控制,但您可以像處理任何其他形狀一樣調整圖像大小和旋轉圖像。您還可以使用角小部件輕鬆地將導入圖像的角變圓。通過定義一個封閉的形狀來掩蓋你的圖像 […]