画像は、最後に空いた場所へ入れる素材ではなく、サイトを構成する重要なコンテンツです。
AI ERA / CORPORATE WEBSITE DESIGN
AI時代のサイト制作は、
画像を添物にしてはいけない
サイトの印象と成果を左右する主役は画像である
AIによって構成やデザインは短時間で作れるようになりました。だからこそ、企業固有の写真や画像を、何に使い、どう選び、どのように見せるかが、これまで以上に重要になります。
BEFOREページを見る
写真差し替え・デザイン調整後の「After」ページです。
CUDIORAの世界観に合う写真・画像が設定されています。
IMAGE IS NOT DECORATION. IT IS THE MESSAGE.
01
サイト制作の前提が変わり始めている
これまでのサイト制作では、制作会社へ一括発注し、制作開始前にページ数、デザイン、機能、画像、金額をできるだけ確定する方法が一般的でした。最初に完成形を想定し、その完成形に向かって制作を進める方法です。
しかし、生成AIの進化によって、ページ構成、文章案、デザイン案、HTML、CSS、JavaScript、仮画像を含む初期サイトフレームは、以前よりはるかに短時間で作れるようになりました。
これは、単に制作時間が短くなったという話ではありません。サイト制作の進め方、外注する範囲、見積りを確定する時期、制作会社と発注企業の役割、そして人間が価値を発揮する工程そのものを見直す必要が生じています。
02
「画像一式」で済まされてきた
特に、小規模で予算の限られた企業サイトでは、画像に関する作業が「画像一式」などの曖昧な項目にまとめられ、制作会社へほぼ一任されることも少なくありませんでした。
制作会社側も、限られた予算と制作期間の中で、有料ストックフォトからページの内容に合いそうな画像を選び、テンプレートへ当てはめて完成させる。そうした制作方法は、これまで普通に行われてきたはずです。
IMAGE EXHIBITION
サイトのために生まれた画像を、
作品として展示する。
このサイトで使用した画像を、ページの部品から切り離し、 一つひとつの作品として展示しています。 ページを開くたびに展示順が変わり、 画像同士の新しい関係が生まれます。
見るたびに、展示が変わる。
画像作品の展示を見るWHEN DESIGNS BECOME SIMILAR
デザインが似るほど、
画像の違いがサイトの違いになる。
同じテンプレート、似た構成、似た文章でも、使う写真が変われば、そこから受け取るサイトの印象は大きく変わります。
03
テンプレートは額縁である
WordPressのテンプレートを使ったサイト制作では、テンプレートがいわば額縁となり、その中に配置する写真や画像によって、それぞれの世界観やオリジナリティを表現してきました。
同じテンプレートを使っていても、掲載する写真が違えば、サイトから受ける印象は大きく変わります。
企業サイトや商品、サービスの営業サイトであれば、建物、社員、商品、サービス、現場、顧客との接点、仕事の過程。こうした企業固有の一次情報を、どのように画像として確保し、何を選び、どう見せるかが重要です。
04
AIが速く作れるものと、AIだけでは作れないもの ― 企業サイトのケース
AI CAN CREATE
AIが短時間で作れるもの
- ページ構成
- 文章案
- HTML・CSS・JavaScript
- 初期デザイン
- 仮画像
- レイアウト案
AI CANNOT REPLACE
AIだけでは作れないもの
- 実際に働く社員
- 実際の商品や建物
- 現場で積み重ねた経験
- 顧客との接点
- 企業固有の一次情報
- その企業が持つ信頼
05
画像制作ではなく、画像のキュレーション
AI時代に重要になるのは、画像を生成できることだけではありません。サイトの世界観にふさわしい画像を確保し、選び、組み合わせ、見せ方を設計することです。
確保する
実写、既存写真、生成画像、ストックフォト、図解など、ページに必要な素材を集めます。
選ぶ
企業らしさ、事実性、信頼性、世界観、ページの目的に合う画像を選びます。
加工する
色、明るさ、構図、視線、余白を整え、複数の写真を一つの印象へまとめます。
見せ方を設計する
画像に合わせて文章量とレイアウトを調整し、ページ全体の視線と印象を設計します。
06
最初に作るのは完成品ではなく、ビジュアルコンテ
最初はAI画像や仮写真を使い、ページ全体の初期フレームをつくります。その状態を見ながら、本当に必要な画像や撮影を判断します。
STEP 1
仮サイトを可視化
文章、構成、仮画像を配置して、ページ全体を確認します。
STEP 2
画像方針を決める
実写、既存写真、生成画像、図解の使い分けを判断します。
STEP 3
最終デザイン
決定した画像に合わせて、文章量とレイアウトを再設計します。
先に完成品を作るのではなく、
先に判断できる状態を作る。
07
同じレイアウトでも、画像が変わればページの見え方は変わる
どこにでもありそうな画像ばかりでは、見栄えは整っていても、既視感があり、オリジナリティが見えにくい状態になってしまいます。生成画像も安易なプロンプトからは効果的な画像が作れません。
企業であれば、人、現場、商品、過程を見せることで、企業への理解と信頼を生みます。独自の理念や世界観を醸し出したいなら、その意味を加える加工などを施します。
08
「画像一式」ではなく、画像設計を独立させる
第1段階では、要件整理、ページ構成、仮デザイン、ビジュアルコンテまでを作ります。この段階で、不確定な撮影費や画像制作費まで無理に固定しません。
第2段階で、必要な撮影、既存写真の加工、生成画像※、ストックフォト、図解、最終レイアウト調整の費用を確定します。
※生成画像の利用には、著作権や肖像権等に抵触していないかのチェックも必要です。
PHASE 1
初期フレーム
構成・仮デザイン・ビジュアルコンテ
PHASE 2
画像設計
撮影・加工・生成・選定・最終調整
09
AIが使えるほど、意味を与え、選ぶ力が問われる
AIは候補を大量に作れます。しかし、その画像が企業らしいか、実態とかけ離れていないか、他社と似すぎていないか、著作権や肖像権に問題がないかを判断するのは人間です。
AI時代に価値が高まるのは、単に見栄えのいい画像を作り、加工修正するスキルではありません。画像に文脈の意味を与え、組み合わせ、その中からどれを使うのが目的に合うかを判断し、サイト全体の世界観をキュレーションできる人です。
CONCLUSION
画像は、添え物ではない。
表現したい世界観や企業の事実を伝え、信頼を生み、人の心を動かし、行動につなげる。AI時代のサイト制作では、画像をサイトの印象と成果を左右する主役として扱う必要があります。
Noteで全文を読む