網站首頁 教育 學前教育 精緻生活 飲食養生 命理 科普教育 金融 歷史 影視 數碼 熱門資訊
當前位置:生活百科站 > 數碼 > 

用AI設計雷電擊中的字型效果教程

欄目: 數碼 / 釋出於: / 人氣:2.96W

首先,你將學習如何設定一個簡單的【網格】,以及如何建立一些非常簡單的【圖案畫筆】和【藝術畫筆】。

接下來,選擇一個字型,並充分利用【外觀】面板,你將學習如何建立主文字形狀。然後你將學習如何儲存自己的【圖形樣式】,以及如何巧妙地利用它們。

使用在本教程一開始製作的筆刷,你會學習如何新增一些電線和一些簡單的電火花。最後,使用基本的圖層混合方法,以及一些徑向漸變,你將學習如何為整體視覺效果新增一個較暗的感覺。

第一部分:電線畫筆

1.建立一個新文件,並設定一個網格

CTRL+N建立新文件。

在“單位”下拉選單中選擇“畫素”,在“寬度”框中輸入600,在“高度”框中輸入400,然後點選“高階”按鈕。選擇RGB螢幕(72ppi)和確保新物件對齊畫素網格框選中,然後單擊“確定”。

點選網格(檢視>顯示網格)和對齊網格(檢視>對齊網格)。首先你需要每一個網格都是一個畫素,所以直接去編輯>首選項>參考線和網格,在網格線間隔輸入1,在次分割線輸入1。你還應該開啟資訊面板(視窗>資訊),以便對你圖形的尺寸和形狀有一個實時的預覽。不要忘記設定測量單位,編輯>首選項>單位>常規。所有這些選項將大大提高你的工作效率。

用AI設計雷電擊中的字型效果教程

2.建立2個圖案筆刷

步驟1

選擇矩形工具(M),刪除描邊顏色,然後選擇填色並設定其顏色為R85 G85 B85。將視線回到你的畫板,簡單地建立一個1px的正方形,對齊網格應該減輕你的工作。

用AI設計雷電擊中的字型效果教程 第2張

步驟2

使用矩形工具(M)建立另外3個1px的正方形。填充顏色,然後將它們按順序放置。【最後一個數值有誤,譯者自己試驗應該是R25 G25 B25】

用AI設計雷電擊中的字型效果教程 第3張

步驟3

將它們CTRL+G編組,並且複製一份,向右拖動2PX。

用AI設計雷電擊中的字型效果教程 第4張

步驟4

使用矩形工具(M),建立四個2*1的矩形,如下圖所示然後填充顏色。

用AI設計雷電擊中的字型效果教程 第5張

步驟5

使用矩形工具(M),建立四個7*1的矩形,如下圖所示然後填充顏色。

用AI設計雷電擊中的字型效果教程 第6張

步驟6

使用矩形工具(M),建立一個6 x 1px的形狀,設定填充顏色為R = 204 G= 149 B = 4,把它置於頂層。將重點放在新的矩形的右邊,切換到直接選擇工具(A),選擇錨點並將他們向上拖動1px。再次選擇這個新形狀,找到效果>變形>弧形。輸入下列影象中顯示的屬性,然後單擊“確定”。

用AI設計雷電擊中的字型效果教程 第7張

步驟7

使用矩形工具(M),建立一個9 x 1px的形狀,設定填充顏色為R = 234 G= 179 B = 34,把它置於頂層。將重點放在新的矩形的右邊,切換到直接選擇工具(A)。選擇錨點並將他們向下拖動1px。再次選擇這個新形狀,找到效果>變形>弧形。輸入下列影象中顯示的屬性,然後單擊“確定”。

用AI設計雷電擊中的字型效果教程 第8張

步驟8

使用矩形工具(M),建立一個7 x 1px的形狀,設定填充顏色為R = 204 G= 149 B = 4,把它置於頂層。將重點放在新的矩形的右邊,切換到直接選擇工具(A)。選擇錨點並將他們向下拖動1px。再次選擇這個新形狀,找到效果>變形>弧形。輸入下列影象中顯示的屬性,然後單擊“確定”。選擇這三個黃色的形狀,並將他們置於底層。

用AI設計雷電擊中的字型效果教程 第9張

步驟9

選擇下圖中選中的形狀並將他們拖動到色板上(視窗>色板)來儲存自己的圖案。色板面板上有它之後,你就可以刪除原形狀。返回到色板面板,雙擊你的圖案並將它命名為電線末端。

用AI設計雷電擊中的字型效果教程 第10張

步驟10

選中你的畫板上剩下來的那個組,然後開啟畫筆面板(視窗>畫筆),點選新建畫筆(下圖中藍色箭頭處),選擇圖案畫筆,然後單擊“確定”再開啟筆刷視窗。將筆刷命名為“電線”,然後邊線拼貼選擇原始,終點拼貼在列表中選擇電線末端。最後,單擊“確定”,你應該可以在筆刷面板找到你的新圖案筆刷。如果你完成了,那麼可以刪除原形狀。

用AI設計雷電擊中的字型效果教程 第11張

步驟11

聚焦於畫筆面板,選擇“電線”圖案畫筆,並複製它(或開啟畫筆面板的選單,複製畫筆)。雙擊你的畫筆副本,命名它為“電線副本”,雙擊,並勾選縱向翻轉然後點選確定。

用AI設計雷電擊中的字型效果教程 第12張

第二部分:藝術畫筆

1.建立四個藝術畫筆,並新增一個簡單的背景

步驟1

在下面的步驟中你將需要一個0.25畫素分佈的網格,點選編輯>首選項>參考線和網格,在網格線間隔輸入0.25,在次分割線輸入1。

使用橢圓工具(L),建立一個0.25×10px的形狀,設定填充顏色為白色。

取消對齊網格(檢視>對齊網格),切換到錨點工具(shift+c),只需點選底部的錨點。再啟用對齊網格(檢視>對齊網格),使用直接選擇工具(A),選擇在圖2中突出的兩個錨點,將他們向上拖動2PX。

用AI設計雷電擊中的字型效果教程 第13張

步驟2

確保白色的形狀仍然被選中,將目光轉向筆刷面板,並點選新建畫筆。選擇藝術畫筆然後單擊“確定”。將筆刷命名為“0.25白”,然後單擊“確定”。一旦你能在畫筆面板上看到它,就可以刪除畫板上白色的形狀。

用AI設計雷電擊中的字型效果教程 第14張

步驟3【基本和步驟2一樣】

使用橢圓工具(L),建立一個0.25×10px的形狀,設定填充顏色為R = 240 G= 200 B= 227。取消對齊網格(檢視>對齊網格),切換到錨點工具(shift+c),只需點選底部的錨點。再啟用對齊網格(檢視>對齊網格),使用直接選擇工具(A),選擇在圖2中突出的兩個錨點,將他們向上拖動2PX。

確保這個粉色的形狀仍然被選中,將目光轉向筆刷面板,並點選新建畫筆。選擇藝術畫筆然後單擊“確定”。將筆刷命名為“0.25粉”,然後單擊“確定”。一旦你能在畫筆面板上看到它,就可以刪除畫板上粉色的形狀。

用AI設計雷電擊中的字型效果教程 第15張

步驟4【基本和步驟2一樣】

使用橢圓工具(L),建立一個0.5×10px的形狀,設定填充顏色為白色。取消對齊網格(檢視>對齊網格),切換到錨點工具(shift+c),只需點選底部的錨點。再啟用對齊網格(檢視>對齊網格),使用直接選擇工具(A),選擇在圖2中突出的兩個錨點,將他們向上拖動2PX。

確保這個白色的形狀仍然被選中,將目光轉向筆刷面板,並點選新建畫筆。選擇藝術畫筆然後單擊“確定”。將筆刷命名為“0.5白”,然後單擊“確定”。一旦你能在畫筆面板上看到它,就可以刪除畫板上白色的形狀。

用AI設計雷電擊中的字型效果教程 第16張

步驟5【基本和步驟2一樣】

使用橢圓工具(L),建立一個0.5×10px的形狀,設定填充顏色R = 255 G= 136 B= 248。

取消對齊網格(檢視>對齊網格),切換到錨點工具(shift+c),只需點選底部的錨點。再啟用對齊網格(檢視>對齊網格),使用直接選擇工具(A),選擇在圖2中突出的兩個錨點,將他們向上拖動2PX。

確保這個粉色的形狀仍然被選中,將目光轉向筆刷面板,並點選新建畫筆。確認一下然後單擊“確定”。將筆刷命名為“0.5粉”,然後單擊“確定”。一旦你能在畫筆面板上看到它,就可以刪除畫板上粉色的形狀。

用AI設計雷電擊中的字型效果教程 第17張

步驟6

停用網格(檢視>隱藏網格)和對齊網格(檢視>對齊網格)。選擇矩形工具(M),建立一個寬610px,高410px的矩形。

確保這個新的形狀保持選定,並設定其填充顏色為R=17 G= 66 B=103。開啟“外觀”面板(視窗>外觀),然後點選新增新填色按鈕【圖中小箭頭處】。選擇這個新填充,設定顏色為黑色,降低其不透明度為10%,改變混合模式為正片疊底,點選效果>藝術效果>膠片顆粒。輸入下列影象中顯示的屬性,然後單擊“確定”。

下一步,你需要把矩形對齊在畫板中心,所以開啟對齊面板(對齊到畫板),然後單擊水平居中對齊,垂直居中對齊按鈕。最終你的矩形應覆蓋整個畫板。

點選圖層面板(視窗>圖層),開啟現有的層,只需雙擊重新命名為叫“背景”。你還應該鎖定它,以確保你不會意外地選擇/移動它。

用AI設計雷電擊中的字型效果教程 第18張

第三部分:字形效果

4.建立主要文字形狀

步驟1

選擇文字工具(T),新增文字“DANGER”,使用GoodDog字型,設定大小在150pt,字距為100。

確保你的文字保持選定,shift-control-o(或去文字>建立輪廓)。選擇組,shift-control-g解開它然後control-8(或去物件>複合路徑>建立)讓這六個字母的形狀成為一個簡單的複合路徑。

移動到圖層面板,雙擊在這一步中所做的白色複合路徑,並將其命名為“DANGER”。

用AI設計雷電擊中的字型效果教程 第19張

步驟2

確保你“DANGER”的複合路徑保持選定,將目光轉向外觀面板。首先,shift-x將顏色從填充改為描邊。選擇描邊,設定在0.25pt,降低其不透明度為50%,去效果>扭曲和變換>波紋效果。進入下圖所示的屬性,單擊“確定”,去效果>扭曲和變換>粗糙化。進入下圖所示的屬性,單擊“確定”,去效果>風格化>圓角。輸入一個1px半徑,單擊“確定”。

用AI設計雷電擊中的字型效果教程 第20張

步驟3

確保你的“DANGER”的複合路徑仍然被選中,並專注於外觀面板。選擇現有的專案,並使用複製選定專案按鈕簡單的複製它(下圖中的小藍箭頭處)。選擇新的專案,用R = 240 G = 200 B= 227填充顏色,增加它的不透明度到70%,去效果>路徑>偏移路徑。輸入-2px偏移,點選OK。

返回到外觀面板,專注於粉紅色的專案,簡單地拖動偏移路徑效果,使它高於其他三個效果。

用AI設計雷電擊中的字型效果教程 第21張

步驟4

確保你“DANGER”的複合路徑仍然被選中,並專注於外觀面板。選擇粉紅色的專案,並使用複製選定專案按鈕簡單的複製它。選擇新的行程,設定描邊在0.5pt,用R = 255 G = 136 B = 248取代現有的顏色,增加透明度為80%,取消路徑偏移,去效果>模糊>高斯模糊。進入8半徑,單擊“確定”。

用AI設計雷電擊中的字型效果教程 第22張

步驟5

確保你的“DANGER”的複合路徑仍然被選中,並專注於外觀面板。選擇頂部,粉紅色的專案,並使用複製選定專案按鈕簡單的複製它。選擇新的專案,白色取代現有的顏色,增加透明度為90%,取消高斯模糊效果,去效果>風格化>外發光。輸入以下影象中所顯示的屬性,然後單擊“確定”。

用AI設計雷電擊中的字型效果教程 第23張

步驟6

重新選擇你的“DANGER”複合路徑,注重外觀面板,使用新增新描邊按鈕新增第五個描邊(下圖中的藍色箭頭)。選擇這個新的專案,把它拖在外觀面板的底部,設定重量在1,顏色 R = 109 G= 15 B = 61,然後降低其不透明度為70%。確保你的“DANGER”的複合路徑仍然被選定,開啟圖形樣式面板(視窗>圖形樣式),並簡單地單擊新的圖形樣式按鈕(下圖小藍箭頭處),以儲存自己的圖形樣式。

繼續專注於圖形樣式面板,只需雙擊你的新的圖形樣式,並將其命名為“電”。

用AI設計雷電擊中的字型效果教程 第24張

步驟7

重新選擇你的“DANGER”複合路徑,去物件>路徑>偏移路徑。進入10px偏移,點選OK。

確保所得到的複合路徑依然選定,專注於外觀面板,並使用相同的新增新描邊按鈕新增一個新的描邊。選擇這個新的專案,把它拖在外觀面板的底部,設定 描邊為6pt,R = 255 G= 136,B = 234。然後去效果>模糊>高斯模糊,輸入一個20px半徑,點選OK。移動到圖層面板,雙擊在這一步中所做的複合路徑,重新命名它“外邊界”。

用AI設計雷電擊中的字型效果教程 第25張

第四部分:細節渲染

5.加入電線

步驟1

選擇畫筆工具(B),選擇畫筆面板“電線”模式,畫兩路徑。大致如第一圖所示。確保你是從左邊開始繪製路徑。使用相同的工具,選擇你的“電線副本”圖案畫筆,畫另一個路徑。大致為第二影象所示。這一次確保你從右邊開始。

用AI設計雷電擊中的字型效果教程 第26張

步驟2

選擇四條路徑的線圖案畫筆,效果>風格化>陰影。輸入下圖左邊顯示視窗的屬性,單擊確定,再去效果>風格化>投影。輸入中間的視窗中顯示的屬性,請單擊“確定”,再去一次效果>風格化>投影。輸入右側視窗中顯示的屬性,請單擊“確定”。再一次效果>風格化>投影,進入第二排左側視窗中顯示的屬性,最後一次效果>風格化>投影,輸入第二排右側視窗顯示的屬性,然後單擊“確定”。確保四路線圖案畫筆仍然選定,並且編組(CTRL-G)。

用AI設計雷電擊中的字型效果教程 第27張

6.建立連線你電線和文字的電火花

步驟1

使用畫筆工具(B)或鋼筆工具(P),建立一個簡單的路徑,連線線與文字,如下圖所示。首先為這個新路徑新增一個簡單的,1pt白色描邊。

用AI設計雷電擊中的字型效果教程 第28張

步驟2

選擇連線你線與文字的路徑,重點放在圖形樣式面板,只需點選“電”圖形樣式。

確保您的路徑被選定,將視線集中在外觀面板上。選擇0.25pt,白色的描邊,降低其不透明度為30%,選擇0.25pt,粉紅色的描邊,降低其不透明度為50%,然後選擇0.5pt,粉紅色的描邊和降低其不透明度為70%。確保這個路徑仍然被選定,返回到圖形樣式面板,並儲存一個新的圖形樣式。命名它“火花”。

用AI設計雷電擊中的字型效果教程 第29張

步驟3

使用畫筆工具(B)或鋼筆工具(P)建立多個路徑去連線線與文字,如下圖所示。確保所有這些新的路徑被選中,並簡單地新增“火花”的圖形樣式。因為波紋效果,你可以自由使用新增錨點(+)或刪除錨點工具(-)輕鬆地從一個特定路徑新增/刪除錨點,如果你覺得它看起來太暗淡/擁擠。

用AI設計雷電擊中的字型效果教程 第30張

7.建立衰落的電火花

步驟1

使用畫筆工具(B)或鋼筆工具(P),從文字建立,如下圖所示的一個簡單的路徑。確保你從文字的內部開始繪圖。首先為這個新的路徑新增一個簡單的,1pt的白色描邊。

用AI設計雷電擊中的字型效果教程 第31張

步驟2

確保你的小路徑保持選定,將目光集中在外觀面板上。選擇專案,從你的畫筆面板中新增“0.25白”的藝術畫筆,降低不透明度到30%,去效果>扭曲和變換> 波紋效果。輸入下圖所示的屬性,單擊“確定”,去效果>扭曲和變換>粗糙化。輸入下圖所示的屬性,單擊“確定”,去效果>風格化>圓角。輸入一個1px半徑,單擊“確定”。

用AI設計雷電擊中的字型效果教程 第32張

步驟3

確保你的小路徑仍然被選擇,專注於外觀面板。選擇現有的專案,並使用複製選定專案按鈕簡單的複製它。選擇新的描邊,將“0.25白色”藝術刷更換為“0.25粉紅色”藝術刷,並增加其不透明度為50%。

用AI設計雷電擊中的字型效果教程 第33張

步驟4

確保你的小路徑仍然被選擇,專注於外觀面板。選擇頂層專案,並使用複製選定專案按鈕簡單的複製它。選擇新的專案,將“0.25粉紅色”的藝術刷換為“0.5粉紅色”藝術刷,增加其不透明度為70%,去效果>模糊>高斯模糊。輸入8半徑,單擊“確定”。

用AI設計雷電擊中的字型效果教程 第34張

步驟5

確保你的小路徑仍然被選擇,專注於外觀面板。選擇頂層專案,並使用複製選定專案按鈕簡單的複製它。選擇新的專案,刪除現有的高斯模糊效果,將“0.5粉”的藝術畫筆換為“0.5白”的藝術畫筆,然後增加其透明度為90%,去效果>風格化>外發光。輸入以下影象中所顯示的屬性,然後單擊“確定”。確保你的小路徑仍處於選中狀態,專注於圖形樣式面板,儲存一個新的圖形樣式,並將其命名為“電火花”。

用AI設計雷電擊中的字型效果教程 第35張

步驟6

使用畫筆工具(B)或鋼筆工具(P)創造一些新的路徑,如下圖所示。確保所有的這些新的路徑被選中,只需新增“電火花”圖形樣式。別忘了你可以很容易地新增/刪除錨點,並改變你的路徑。

用AI設計雷電擊中的字型效果教程 第36張

步驟7

使用鋼筆工具(P)建立一個微小的路徑,如下圖所示。選擇它,專注於圖形樣式面板,只需新增“電火花”圖形樣式。確保您的路徑選擇,目光集中在外觀面板上。選擇頂層專案,只需將“0.5白色”換為“0.25白色”的藝術畫筆。保持這個小路徑仍然選擇,返回到圖形樣式面板,並儲存一個新的圖形樣式。它的名字“小電火花”。

用AI設計雷電擊中的字型效果教程 第37張

步驟8

使用鋼筆工具(P),建立一些新的路徑,如下圖所示。確保所有這些路徑的被選擇,新增“小電火花”圖形樣式。

用AI設計雷電擊中的字型效果教程 第38張

8.建立發光點

步驟1

啟用對網格的顯示(檢視>顯示網格)。這一步你需要一個每格一畫素的網格,所以去編輯>首選項>參考線和網格,輸入1px每格。使用橢圓工具(L),建立一個15×3px形狀,設定填充顏色在R = 220 G = 118 B = 215。

用AI設計雷電擊中的字型效果教程 第39張

步驟2

確保你粉紅色的形狀保持選定,並專注於外觀面板。選擇現有的填充,效果>模糊>高斯模糊。輸入一個2px半徑,單擊“確定”。

返回到外觀面板,並使用相同的新增新的填充按鈕,來新增第二個。選擇新的填充,設定白色,降低其不透明度為80%,改變混合模式為疊加,去效果>路徑>偏移路徑。進入一個2px偏移,點選OK,去效果>扭曲和變換>收縮和膨脹。拖動滑塊到-70%,點選OK,去效果>風格化>羽化。輸入一個2px羽化半徑,單擊“確定”。

用AI設計雷電擊中的字型效果教程 第40張

步驟3

確保您的壓縮形狀仍然被選擇,視線焦點在外觀面板上,並新增第三個填充。選擇它,設定顏色為白色,改變混合模式為疊加,去效果>路徑>偏移路徑。進入向左一個畫素的偏移,點選OK,去效果>扭曲和變換>收縮和膨脹。拖動滑塊到70%,點選OK,去效果>風格化>羽化。1.5px羽化半徑,單擊“確定”。移動到圖層面板,雙擊在這個步驟中編輯的形狀,簡單地稱它為“輝光”。

用AI設計雷電擊中的字型效果教程 第41張

步驟4

複製(control-f)你的“輝光”,讓它沿著你的文字。如下圖所示。

用AI設計雷電擊中的字型效果教程 第42張

9.為整張圖增加黑暗的風格

步驟1

禁用網格(檢視>隱藏網格)和對齊網格(檢視>對齊網格)。使用矩形工具(M),建立一個新的610×410px的矩形,在對齊面板中選擇水平居中對齊,垂直居中對齊。

確保這個新的形狀保持選定,並專注於外觀面板。選擇現有的填充,開啟漸變面板(視窗>漸變),然後新增預設的黑到白的線性漸變。

保持專注於你的漸變面板,從下拉選單中選擇徑向漸變,然後移動到漸變色。選擇右滑塊,設定黑色的顏色(R = 0 G = 0 B = 0),然後移動左滑塊。選擇它,設定顏色在R = 17 G = 66 B = 103,然後不透明度設定為0%。

回到外觀面板,選擇填充,降低其不透明度為90%,改變混合模式為柔光。最後,確保填充保持選中狀態,漸變工具(G),拉伸漸變,如下圖所示。

用AI設計雷電擊中的字型效果教程 第43張

步驟2

確保之前的矩形仍然被選中,目光聚焦在“外觀”面板上,選擇現有的填充,並使用複製所選專案按鈕來複制它。選擇新的填充,降低其不透明度為30%,改變混合模式為顏色加深,然後在漸變面板中選擇左滑塊,更換現有的顏色為R = 234G= 179 B = 34,增加其不透明度為100%,並拖動滑塊在25%處。

用AI設計雷電擊中的字型效果教程 第44張

步驟3

確保你之前的矩形仍然選中,聚焦在“外觀”面板上,選擇頂層專案並使用複製所選專案按鈕來複制它。選擇新的填充,增加其不透明度為75%,改變混合模式為柔光,並將現有的徑向漸變更改為下面的影象顯示的一個。請記住,漸變影象中的黃色零表示不透明度的百分比。

用AI設計雷電擊中的字型效果教程 第45張

步驟4

確保你之前的矩形仍然被選中,專注於外觀面板,並用複製所選專案按鈕來新增第四個填充。選擇新的填充,設定黑色,降低其不透明度為10%,改變混合模式為正片疊底, 效果>藝術>膠片顆粒。輸入以下影象中所顯示的屬性,然後單擊“確定”。

用AI設計雷電擊中的字型效果教程 第46張

步驟5

確保你之前的矩形仍然被選中,專注於外觀面板,選擇第二個填充(從底部開始計數),並重復使用複製所選專案按鈕。選擇填充,將其拖動到外觀面板的頂部,並用下面的影象顯示的資料替換現有的徑向漸變。別忘了,漸變面板中的黃色零表示不透明度百分比,而白色數代表位置百分比。

用AI設計雷電擊中的字型效果教程 第47張

這裡是它最終的效果:

用AI設計雷電擊中的字型效果教程 第48張