プログラミング知識ほぼゼロでアプリ開発

2024/11/16(土)に開催された『生成AIなんでも展示会 Vol.2』にて、展示物を作成する過程で使用したLLMの使い方等のノウハウを、某記録兼当日の説明用として作成しました。

①前提

・建築設計の仕事を行なっており、プログラミングの知識はほぼゼロ

・Aiに関してはほぼ毎日利用している(GPTsハッカソンにてセミファイナル、２次審査進出の実績あり)

・画像生成Aiはよく使用する（SNS等で情報発信を行なっている)

プログラミングがわからないけど、Aiがある程度わかる場合のAiプログラミング方法？の紹介になります。この方法が最も良いというわけではなく、建築向けWebUIを作成する際にどのように作成したのかを書いています。

使用したLLM

今回建築向けWebUIを作成するにあたり使用した言語モデルは、

Claude 70%
ChatGPT 30%

②コード作成方法

LLMの使い分け

コード書かせる作業は生成速度が早いclaude.aiで行う。

支持内容が複雑で頭を使いそうな内容の指示の場合はo1-previewを使用。

Claudeの使用制限を防ぐため、どうでもいい質問や軽い質問等(エラーについて何を言っているか確認する等)についてはChatGPT 4oで行う。

Cloudでのコードの書かせ方

Cloudでのコード生成能力

• 200行程度まで: 問題なく生成可能

• 300行超: 途中省略や不完全な生成が発生

長いコードへの対処方法

• やり取りの回数を抑え、数回のやり取りで世代交代

• 途切れた場合「続き」と指示して段階的に生成

• コードを200行程度の複数のコードに分割

③良く使用するプロンプト

指示の最初に入力

あなたは世界一のプログラマーです。

指示の最後に入力

全力でお願いします。

コードをブラッシュアップしたい時

※コードの内容は良くなるが、無駄な機能も増える場合があるので、コードを長くしたくない場合は使用しないのがお勧め

このコード60点とした場合、改善点を列挙し100点のコードを作成してください。

コードを圧縮したい時

コードの機能は維持した状態で、できるだけ短い洗練されたコードを作成してください。

その他の注意点

長文のコード＋複数の修正指示
何度もやり取りする手間が省けトークン数も節約できますが、１度に入力する文章が長すぎると、出力精度が低下しやすい。

修正項目を１つずつ修正する場合
確実に修正していけますが、同じチャット欄で会話しているとその会話以前の内容を全て理解して答えるため、使用制限にかかりやすく、出力精度も下がる。こまめな世代交代がお勧めです。

④作成手順

venv作成
↓
メインの処理部分を作成
↓
必要なライブラリーのインストール
↓
メインの処理部分で動作確認
↓
修正、欲しい機能を加える
↓
フロントエンド部分を作成
↓
修正、欲しい機能を加える
↓
壁床のTexture収集スクレイピング兼jsonファイル作成コード作成
↓
実際に使用しながらUIの修正

⑤作成期間

作成期間は、平日の会社から帰宅後及び土日を合わせた約１週間です。

最後に

用語等もわからないまま作成しており、このnoteも間違ったことを言っている可能性がありますがご容赦ください。