Webデザインの仕事にも、AIが活用されるようになってきました。画像を生成したり、デザインのアイデアを出したりと、これまで時間をかけて行っていた作業を効率化できる場面が増えています。
実際には、AIを使えばすべての制作が完結するわけではありません。AIをどの工程で活用するのか、どのような指示を出すのか、生成された結果をどう改善するのかによって、制作の進め方は変わります。
今回は、現役のWEBデザイナーの皆さんに、仕事でどのようにAIを取り入れているのか、また、どんなことに気を付けているのかを聞いてみました。
AI導入で、何が変わった?現役WEBデザイナーに聞いてみた
AIは、Webデザインの現場でどのように活用されているのでしょうか。
現在、Webデザイナーとして活動している方数人に、仕事でAIをどのように使っているのかを聞いてみました。今回は、提案書の作成、デザイン制作、プログラミングという3つの活用例を紹介します。
1. 提案書の作成に活用
クライアントと打ち合わせをする前に、クライアントの業種やご要望を予想して、提案資料を用意します。この準備に数日かかることもあります。
こうした提案書の作成にも、AIを活用するようになりました。例えば、クライアントから聞いた要望や打ち合わせのメモをもとに、提案内容の整理や構成案の作成をAIに依頼しています。文章のたたき台を作成してもらえば、ゼロから情報を洗い出す作業を効率化でき、資料作成の初期段階にかかる時間を短縮できます。
今までは、1案つくるだけで精一杯でしたが、今は2案目、3案目と複数の提案書を準備できるので、クライアントとの打ち合わせの流れに合わせて提案書を変えることができるようになりました。とても助かっています。
(WEBディレクター Iさん)
2. デザインの制作過程に活用
デザイン制作では、アイデア出しや画像素材の作成、デザインの改善案の検討などにAIを活用しています。
Webサイトのデザインを考える際に、AIに複数のレイアウト案を提案してもらったり、画像生成AIでメインビジュアルに使う素材を作成したりしています。
例えば、「ノートパソコンでデザインを学ぶ社会人」「自然光の入る落ち着いた部屋」「画像の右側に文字を配置できる余白を確保」といった条件を指定します。被写体だけでなく、背景や構図、余白の位置まで具体的に伝えることで、デザインに組み込みやすい画像を生成しやすくなります。
画像はそのまま使うのではなく、雰囲気や構図をクライアントに確認してもらうために使っています。OKが出たら、フォトグラファーに依頼して撮影してもらいます。
デザインでAIの案をそのまま使うこともしていません。そうすると、どこかで見たことがあるような雰囲気のデザインになってしまうので、デザイナーの手で制作しています。
(WEBデザイナー Kさん)
3. プログラミングに活用
ネットショップで、お客様のご要望に合わせた機能を追加したいときに、AIにその部分のプログラミングを依頼しています。
例えば、ネットショップに在庫管理機能をつけたいとか、クーポン発行機能をつけたいとか。これまでは、そういう拡張機能を作るときに有料のプラグインを購入していました。今ではAIを使って自分でプログラミングできるし、カスタマイズもできるので助かっています。
AIが作ったコードを中身を確認せずそのまま使うと、何が起こっているのかどんどん分からなくなってしまうので、人間側でも確認してから使うようにしています。結局プログラミングを勉強することになりそうです(笑)。
しかし、私はWEBデザイナーであってエンジニアではないので、分からないことも多いです。そのため、複数の生成AIを使用してセカンドオピニオンを確認するようにしています。ChatGPTでコードを書かせて、それをClaude Codeに確認してもらっています。そうすると、「この書き方でもいいけど、もっと効率よくするならこちらがお勧めです」という返事が来ることもあります。
(WEBデザイナー Nさん)
AIを導入するとき、どんなことに気を付けていますか
1. やりたいことを言語化するのが難しい!言葉にする練習が必要
やりたいことを文章にするのがとても難しいなと思います。例えば「丸い椅子」といっても、どの部分が丸いのか、どれくらいの大きさなのか、それを上から見ているのか真横から見ているのか、などなど文章にするのがなかなか難しいです。
これは画像の情報を文章にするのはもともと難しいかもしれませんが、単純な資料作りにしても、言葉足らずだったり、人間ならわざわざそこまで説明しなくても分かるということまで文章にしないと伝わらないこともあります。そうなると、「だったら私が作ったほうが早いのでは」と思うこともありました。言語化の練習が必要だと思っています。
(WEBディレクター Iさん)
2. やっぱり間違いも多い!間違いに気づかず使わないように
生成AIの画面に「間違うことがあります」という注意文が出ていますが、間違いがあることを前提にしてチェックする必要があると思います。
別の生成AIにセカンドオピニオンを求めることもありますし、単純にGoogleで調べて根拠を確認することもあります。また、AIに根拠を示すよう求めることもあります。「その根拠は何ですか」「ソースはどこですか」と質問したときに、「根拠はありません」と返事が返ってくることもあります。その場合は、その案は採用しないようにしています。
(WEBディレクター Iさん)
3. 生成AIによって得意・不得意があるようです
ChatGPTは、HTMLのコーディングやPHPについての質問の回答が簡潔で分かりやすいです。
Claudeは、日本語の文章が自然で、資料作成を依頼するときれいなレイアウトで出してくれます。
Geminiは、メールの文章作成を依頼することが多いです。お願いやお詫びの文章を頼むと、丁寧な文章を作ってくれるのでとても助かります。
(WEBデザイナー Nさん)
まとめ
今回、現役Webデザイナーの皆さんに話を伺ったところ、AIは提案書の作成やデザイン制作、プログラミングなど、さまざまな業務で活用されていました。
AIの導入によって、Webデザイナーが取り組める作業の幅が広がり、仕事の進め方にも変化が生まれています。
AIの台頭によって、Webデザインの知識は不要なのではないかと思われがちです。しかし、人間側に知識がなければ、AIに意図を正確に伝えることも、生成された情報やコードの正しさを確認することも難しくなります。AIを効果的に活用するためには、やはり基礎知識が必要なのです。
これからWebデザイナーを目指す人は、配色やレイアウトなどのデザインの基礎、デザインソフトの操作、HTMLやCSSといったWeb制作の知識を身につけることが大切です。そのうえで、AIに何を依頼するのか、どのような指示を出せばよい結果が得られるのか、生成された結果をどう確認・修正するのかを、実際の制作を通して学んでいきましょう。
AIを使うこと自体が目的ではありません。デザインやWeb制作の知識を土台に、AIを適切な場面で活用し、仕事の質や効率を高めていくこと。それが、AIが普及するこれからのWebデザイナーに求められるスキルの一つです。
WEBデザイナーの仕事、やってみたいと思ったら!
あなた自身で “創れる人生”に。デジタルハリウッドSTUDIO青森は「なりたい!」の想いを全力でサポートします。
\Web業界についてもっと詳しく知りたい方はこちら!/
※デジタルハリウッドSTUDIOの本サイトに遷移します
デジハリ青森では、無料のスクール説明会を開催中です。 遠方の方は、Zoomによるオンライン説明会もご活用ください!
説明会の流れ
- カウンセリングで疑問を解消
- 学校・コース/カリキュラムの詳細を解説
- 卒業生作品・実績をポートフォリオでご紹介
- あなたの目的に合った就転職プランのご提案
- 学習環境・設備のご案内
- ご希望の方には体験もご案内
デジハリ青森に興味を持った方がいらっしゃいましたら、
ぜひお気軽にお問い合わせください。
\ 参加無料 /
※デジタルハリウッドSTUDIOの本サイトに遷移します
※説明会をお申し込みの際は、「ご希望のスクール」をSTUDIO青森と記載して下さい。
※現在オンラインでのスクール説明会も実施しております。