質問するログイン新規登録

Q&A

0回答

177閲覧

AIを活用して「実務レベルのデザイン作成→コーディング→LP完成」を1~数日で実現している事例はありますか?

yukki-1227

総合スコア54

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

AI(人工知能)

AI(人工知能)とは、言語の理解や推論、問題解決などの知的行動を人間に代わってコンピューターに行わせる技術のことです。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2026/08/03 00:50

編集2026/08/03 01:55

0

0

実現したいこと

上司から「AIを活用して、Webデザインからコーディングまで行い、短期間(1~数日)でLPを完成できるか検証してほしい」と依頼されています。

現在、複数人で検証していますが、なかなか実現できず困っています。

発生している問題・分からないこと

前提

・コーディング(HTML/CSS/JavaScript)は自分たちで対応できます。
・ただし、デザインスキルはほとんどありません。Photoshop・Illustratorは初心者レベルです。
・最終的な人間による確認・修正は必要という前提です。

使用しているAI

Photoshop AI
Bolt.new
Claude
ChatGPT
Lovable
Stitch

※Photoshop AI以外は無料版を利用しています。

やりたいこと

営業資料や店舗情報(食べログなど)をAIへ入力し、

①LPデザインを生成
②生成したデザインからHTML/CSSを書かせる
③AIの間違いや矛盾を人間が修正して、1~数日程度でLPを完成させる

という流れを目標にしています。

現在困っていること

デザイン生成では、

・先方に提出できるクオリティのものが出力されないことも多い
・日本語がおかしい
・レイアウトや構成が不自然
・修正をAIへ依頼すると別の箇所まで崩れてしまう
・PhotoshopやIllustratorで修正しようとしても、自分たちのスキル不足で時間がかかる

という問題があります。

またコーディングでは、

・シンプルなデザインであれば比較的そのまま実装してくれる
・少し複雑なデザインになると、元デザインを再現できず劣化した見た目になってしまう

ため、結果的に「AIを使った方が速い」とは言えない状況です。

質問

・現在のAIだけで、このようなワークフロー(デザイン生成→コーディング→1~数日でLP完成)は現実的に可能なのでしょうか。
・実際に業務でこのような運用を実現している会社やチームはあるのでしょうか。
・もし可能であれば、どのような手順・ツール・役割分担で実現しているのでしょうか。
・逆に現状では難しいのであれば、その技術的な理由やボトルネックも教えていただきたいです。
・AIのデザインや精度を上げるコツがあれば教えていただきたいです。

上司へ検証結果を説明する必要があるため、実際に業務でAIを活用されている方や、検証されたことがある方のご意見を伺いたいです。

該当のソースコード

特になし

試したこと・調べたこと

  • teratailやGoogle等で検索した
  • ソースコードを自分なりに変更した
  • 知人に聞いた
  • その他
上記の詳細・結果

上記に記載しています。
SNSや口コミではAIでは何でもできると言われていますがAIは統計学であり天気予報みたいに外れることもあり、誇張された表現だと感じています。

補足

特になし

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

gaku_22

2026/08/03 10:21

> 先方に提出できるクオリティ クオリティといってもピンキリだと思うのですが、どれくらいのレベル感を想定していますでしょうか? シンプルなサイトであれば、AIで十分やってくれるという感覚が個人的にありまして、求めるレベルが高いのかなと想像しました... もし参考サイトとかあれば嬉しいです! また自分はClaude Designを多用していますが、 Claude codeで実装するためのプロンプトもClaude Designが出力してくれるので、 それを与えるだけで、ある程度精度高く実装してくれる感覚があります!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.25%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問