ChatGPT で半日の作業を 20 分に短縮

みなさんこんにちは、私はクン兄さんです

ここ数ヶ月、私はウェブサイトの開発とAI関連の知識の学習に忙しく、記事を書くのを怠っていました。AIGCのチャンスは刺激的で、誰もがこの波に注目する必要があると私は提案します。私は多くの実践者が多くのことを実現したり、ビジネスを始めて利益を上げたりしているのを見てきました。社会人として、私たちはAIを積極的に受け入れ、AIを使用して効率を高め、AIを最大限に活用する必要があります。それは私たちに予期せぬ驚きをもたらす可能性があります。

今日は、ChatGPT を使用して半日分の作業を 30 分未満に圧縮したケース スタディを紹介します。

最近、弊社ではAIツールマップを作成しようとしており、その効果は以下のとおりです。

写真

要件は、各 AI 製品のアイコンをカテゴリ別に小さな画像に組み合わせ、すべての小さな画像を大きな AI マップに統合することです。各アイコンの下のテキストは、対応する製品名であることに注意してください。特定のカテゴリの AI 製品を拡大表示すると、次のようになります。

写真

アイコンをダウンロードして、各カテゴリのAI製品の小さな画像を合成し、最終的な大きな画像を合成する作業をすべてUIに任せると、作業量が非常に膨大になることが考えられるため、UIの作業量をできるだけ減らすことができないか考えたい。少なくとも、技術的な手段を使って、最初にAIアイコンをダウンロードし、カテゴリに応じて小さな画像に合成することはできる。このようにすれば、UIが行うべきことは比較的シンプルで、小さな画像をつなぎ合わせて大きな画像にするだけで済む。

まず、そのような AI アイコンを見つける必要があります。AI ナビゲーション Web サイトが最も適していることは間違いありません。これらのナビゲーション Web サイトは基本的に、これらの AI 製品のアイコンをさまざまなカテゴリに整理しています。ナビゲーション Web サイト https://ai-bot.cn/ のアイコンを使用することにしました。そのホームページのスクリーンショットは次のとおりです。

写真

さて、ニーズを明確にしましょう。まず、AI 製品の各カテゴリのアイコンを取得し、アイコンにこの AI に対応する製品名を付ける必要があります。次に、同じカテゴリの AI 製品に属するアイコンを同じフォルダーに配置します。効果は次のとおりです。

写真

アイコンは何百もあります。一つ一つ手動でダウンロードして名前を付けると、膨大な作業量になり、エラーが発生しやすくなります。最も簡単な方法は、もちろんJsやPythonなどのスクリプトを使用してWebページ上のアイコンとテキストをクロールすることですが、スクリプトを手動で記述すると時間がかかり、一度にすべてのコードを正しく記述することが困難になります。デバッグに多くの時間がかかりますので、スクリプトの作成という重労働はChatGPTに任せるのが最善です。速くて良いです。要件を明確に記述すれば、ChatGPTは基本的に1回でスクリプトを作成してくれます。

まず、ウェブサイトの構造を観察してみると、ウェブサイトの構造が非常に似ていることに気が付きます。基本的には、「AI カテゴリのタイトル + AI カテゴリのアイコン セット」の組み合わせ構造です。1 つを取り上げてみましょう。

下の図では、緑色のボックスがAIカテゴリのタイトルに対応するdiv、赤色のボックスがタイトルの下に設定されたアイコンに対応するdivです。

写真

観察を続けると、各 AI カテゴリのタイトルは、クラス d-flex の div > h4 > i 内のテキストに対応しています。

写真

各 AI アイコンの URL と名前は、HTML 内の次の要素に対応しています。

写真

注: 人気のツールなど、一部の AI 製品カテゴリはこのように構造化されていませんが、構造は非常に似ています。Visual Studio を使用して、上記の構造に少し調整することができます。

抽出したい HTML 構造を理解したら、ChatGPT に指示を与えて、AI 製品の各カテゴリのアイコンを抽出し、ダウンロード後に対応する AI 製品名を付けるスクリプトを生成させることができます。指示は次のとおりです (test.html は Web ページの HTML です)。

写真

最終的には、次のような Python コードが生成されます。

写真

それをローカルに配置し、対応する依存関係をダウンロードしてワンクリックで実行すると、次のように必要に応じて各カテゴリの下に AI アイコンが抽出されます。

写真

これだけじゃ十分ではありません。UI の作業負荷をさらに軽減するために、次のように各 AI カテゴリのアイコンを 1 つの画像にまとめる UI を支援したいと考えています。

写真

Python は画像の合成も行えます。手順は次のとおりです。

写真

コードを実行すると、各 AI カテゴリの小さな画像が生成され、その効果は次のようになります。

写真

ご覧のとおり、AI アイコンの各カテゴリが 1 つの画像に結合されています。

このように、UI に配信されるのは、各 AI カテゴリの合成された小さな画像です。UI がそれらをつなぎ合わせて大きな画像にするのは比較的簡単です。

要約する

この記事は、実際には、職場のバックエンドコードを使用するために、AIを使用しています最初はインターフェイスを書くために、私にとっては、ドメインのクロスの状況を処理しませんでした。コードのスケーラビリティを改善するために、コードを再利用するためのdleware（認証）これは、頭脳をあまり必要としない反復的なタスクの処理に役立ちますが、より高レベルの抽象化を完了するには、依然としてプログラマーが指示する必要があります。 AIは将来的に進化するかもしれませんが、少なくとも今私たちにできることは、AIの可能性をさらに活用し、解き放つためのスキルを向上させることです。