生成式AI(AIGC)在網站開發上的應用

使用生成式AI(AIGC)好一陣子了，就用這篇來講一下AIGC如何輔助我的工作，主要是網站開發的部分，以我的個人網站紅色死神來當範例。

設計部分

設計部分用滿多的，AIGC 讓我這個以前有點設計經驗的人能夠透過工具快速地生出我要的內容，主要是使用 MidJourney，包含：

1. Logo

Logo 本來我是讓 AI 自由生，後來覺得給他參考圖後，可以更快生出我要的圖，所以我就找了一張原圖：

透過 AI 重新發想後變成這樣：

最後我再轉成向量圖後在繪圖軟體裡修改，成果就是這樣：

2. 背景圖

背景圖比較單純，就用我喜歡的科幻風加上我喜歡的紅配黑的顏色，就生出了許多圖來用。

3. 以圖生圖的素材

除了上面的背景圖都是完全靠 prompt 生成的外，也有些素材我是參考一些圖片生成的，比如我一直很喜歡零式系統的那個 3D 圓球形雷達，我就請 AI 參考並生出我想要的圖來：

原圖：

生成後：

4. 重複背景圖

用 AI 生出重複的背景圖也很方便，有些地方我就用 AI 生出一些背景素材來用，只不過這次我用的也都有用繪圖軟體改過顏色。

5. 頭像

用 AI 生個人頭像也很方便，在這個時代可以很快速的弄出一個屬於自己的 Avatar。

文案部分

文案部分大概就是 ChatGPT 了，我大致就是用來生成、翻譯跟改寫內容，在我的網站上比較特別的應該是有個角色介紹區塊，會做這個區塊是生了一些角色圖後，想說來弄個地方放，所以就又請 ChatGPT 幫我想角色名還有介紹那些的，就完成了這個頁面。

程式撰寫

程式撰寫大概就是裝了 GitHub Copilot 跟有遇到問題就問問 ChatGPT，讓開發效率好很多。

最後工商一下我有在 ETToday 上開了一門《用AI強化職場競爭力 ChatGPT、Midjourney從入門到精通》的課，有興趣的朋友可以參考看看。