大家好，我是坤哥

最近幾個月一直忙著網(wǎng)站的開發(fā)還有 AI 相關(guān)知識的學習，所以疏于寫文章了， AIGC 的機遇讓人心動，建議大家務必重視這一波浪潮，我已經(jīng)見過挺多踐行者變現(xiàn)了不少或創(chuàng)業(yè)盈利的了，作為職場人員，應該積極擁抱 AI，利用 AI 來提效，充分利用AI，能給我們帶來意想不到的驚喜。

今天我就來給大家分享一個案例，來看一下我在工作中是利用 ChatGPT 把原本需要半天的工作量壓縮到不到半小時的。

最近我司要做一個 AI 工具地圖，效果如下：

圖片

需求是把每個 AI 產(chǎn)品的圖標分門別類地先合成一個小圖，再把所有小圖整合成一個 AI 大地圖，注意每個圖標下面的文字都是其對應的產(chǎn)品名哦,放大看某一類AI產(chǎn)品的效果如下:

圖片

如果把所有的工作如包括下載圖標，合成每個類別的 AI 產(chǎn)品小圖，再到合成最后的大圖都交給 UI，可想而知這樣的工作量是非常巨大的，所以我們就想能不能盡可能地減輕 UI 的工作量，用技術(shù)的手段至少能做到先下載 AI 圖標將它們分門別類地合成小圖，這樣 UI 所要做的事就比較簡單了，只要把小圖拼成大圖就行了。

首先我們需要找到這樣 AI 圖標，毫無疑問 AI 導航網(wǎng)站再合適不過了，這些導航網(wǎng)站基本上分門別類地給你整理好了這些AI產(chǎn)品的圖標，我們決定使用 https://ai-bot.cn/ 這個導航網(wǎng)站里的圖標，它的首頁截圖如下：

圖片

好了再來明確我們的需求，首先需要獲取每一類 AI 產(chǎn)品下的圖標，并將圖標命名為此 AI 對應的產(chǎn)品名，然后將這屬于同一類AI產(chǎn)品的圖標置于同一個文件夾下，效果如下：

圖片

圖標有幾百個，如果人工一個個下載圖標并命名，工作量巨大不說，還很容易出錯，最容易想到的當然是用腳本如 Js 或 Python 來爬取網(wǎng)頁中的圖標和文案，但是如果人工去寫腳本，也挺費時的，而且很難一次性寫對所有的代碼， 需要花很多時間 來 debug，所以寫腳本這樣的重活最好讓 ChatGPT 來幫我們寫，又快又好，只要我們把需求寫清楚，ChatGPT 基本一次性就能把腳本給我們寫好。

我們首先觀察網(wǎng)站的結(jié)構(gòu)，注意到網(wǎng)站的結(jié)構(gòu)很相似，基本都是 「AI 類別標題 +  AI 類別圖標集合」這樣的組合結(jié)構(gòu)，我們就取一個來觀察。

下圖中綠框為AI 類別標題對應相應的 div，紅框為標題下的圖標集合對應相應的 div。

圖片

繼續(xù)觀察，每一個AI類別的標題對應著 class 為 d-flex 的  div > h4 > i 中的文字。

圖片

而每個 AI 圖標的 url 和名稱對應 html 中的元素如下：

圖片

注意：有一些AI產(chǎn)品分類如熱門工具等不是這樣的結(jié)構(gòu)，不過結(jié)構(gòu)都非常類似，用  Visual Studio 來將它們稍加調(diào)整成以上的結(jié)構(gòu)即可。

了解了我們要提取的 html 結(jié)構(gòu)后，我們就可以給 ChatGPT 下指令來讓其為我們生成腳本來提取每一類 AI 產(chǎn)品下的圖標并在下載后將其命名為相應的 AI 產(chǎn)品名了，指令如下（test.html 即網(wǎng)頁的 html）:

圖片

最終它會給我生成類似以下的 Python 代碼:

圖片

放在本地，下載對應的依賴后一鍵執(zhí)行即可按要求提取每個分類下的AI圖標，如下：

圖片

做到這一步還不夠， 為了進一步減輕 UI 的工作量我希望幫 UI 把每一個 AI 類別的圖標合成一張圖，如下：

圖片

合成圖片這種工作 Python 也能做，指令如下：

圖片

執(zhí)行代碼后即可生成每個AI類別的小圖，效果如下:

圖片

可以看到，每一類的 AI 圖標都合成了一張圖。

這樣的話交付給UI的就是一些合成好的每個 AI 類別的小圖了，UI拿到后再將其拼成一張大圖就相對容易多了。

總結(jié)

本文給大家展示了一個典型地利用 AI 來提效的案例，這只是其中一個例子，實際上在工作中我大量使用了 AI 來編碼，以網(wǎng)站的后端代碼為例上，90%的代碼都是 AI 寫的，當然指令還是我下的，有人說 ChatGPT 的出現(xiàn)可能會替代程序員，但就我的大量實踐經(jīng)驗來看，暫時 GPT 還沒達到這么智能化的程度，比如我一開始讓它寫接口，但它沒給我處理跨域這種情況，這就需要程序員本人有相關(guān)的經(jīng)驗指引它補全，再比如我希望后端的很多接口都需要有用戶身份的驗證后才能進入具體的代碼邏輯，但又不想每個接口都寫重復的校驗代碼，那就需要指示 GPT 幫我封裝校驗邏輯，使用類似export default withMiddleware(handler, cors, authenticate)這樣的責任鏈的方式來重用代碼以提高代碼的可擴展性，所以事在人為，對于程序員來說，你越資深，掌握的知識越多，就越能指示 ChatGPT 最大程序地發(fā)揮其功效， AI 能夠幫我們處理那些重復的，不需要怎么動腦的工作，但更高層次的抽象還是需要程序員來指示它來完成。未來 AI 可能會進化，但至少當下我們能做的還是提升我們的功力以進一步利用釋放 AI 的潛能。