これまで制作したWebサイトやLP、Webデザインをご紹介します。
ホテルキャンペーンLP｜LPライティング・Webデザイン・コーディング
クライアントの依頼により、ホテル予約キャンペーンのランディングページを制作しました。
LP内のライティング、情報設計、Webデザイン、コーディングまで一連の制作を担当しています。
キャンペーンの内容やメリットを整理したうえで、ユーザーが必要な情報を順番に理解できるようページを構成。文章とビジュアルの双方から訴求内容が伝わるよう設計し、最終的な予約につながる導線を意識してデザイン・実装しました。
担当：LPライティング／情報設計／Webデザイン／コーディング／レスポンシブ対応
使用技術：HTML／CSS／jQuery
※クライアント情報保護のため、企業名・サービス名等を変更して掲載しています。
チラシ｜マーケティングクリエイティブ
建築会社でWebマーケティングを担当していた際、キャンペーンの認知拡大や集客を目的としたチラシやSNS投稿用クリエイティブを制作しました。
ターゲットや訴求ポイントに応じて、情報設計やコピー、写真、配色、レイアウトなどを組み合わせ、各媒体の特性に合わせてデザインしました。
キャンペーン内容やメリット、開催期間、問い合わせ先やWebサイトへの導線など、ユーザーが必要な情報を把握しやすいよう、情報の優先順位を整理してデザインしました。
また、デジタル版のチラシでは、検索窓部分から企業Webサイトへアクセスできるようリンクを設定しました。
担当：企画／情報設計／デザイン
制作物：チラシ
※企業情報保護のため、実際に制作したクリエイティブの企業名・URL・キャンペーン内容などを差し替えて掲載しています。
SNS投稿用画像｜SNSクリエイティブ
建築会社のSNS運用において、キャンペーンやサービスの認知拡大を目的としたSNS投稿用クリエイティブを制作しました。
SNSのフィード上でも訴求内容を直感的に把握できるよう、写真とキャッチコピーの組み合わせ、文字の大きさ、情報量、レイアウトを調整。
投稿内容や訴求ポイントに応じて、テイストやレイアウトを変えた複数のデザインパターンを展開しました。
中でも、黒を基調としたキャンペーン告知用クリエイティブは、社内でも好評だったデザインです。
担当：企画／情報設計／デザイン
制作物：SNS投稿画像
※企業情報保護のため、実際に制作したクリエイティブの企業名・URL・キャンペーン内容などを差し替えて掲載しています。
Webメディア記事内画像｜Webコンテンツデザイン
制作した記事内画像
Webライティングを学べるキャリアスクールからのご依頼により、Webメディアの記事内で使用する画像を制作しました。
ページごとに異なるテーマカラーが使用されていたため、「どのページに配置しても違和感なく馴染むデザインにしたい」というご要望をもとに、配色やレイアウトに統一感を持たせ、各ページのデザインに自然に馴染むよう仕上げました。
掲載されたWebメディア
デザインのご依頼は、お問い合わせよりお願い致します。
ECサイト｜コーディング・UI実装
Web制作スクールの課題として、Photoshopのデザインカンプをもとに、TOPページ・商品一覧・商品詳細の3ページで構成されるECサイトをすべて一人でコーディングしました。
HTML・CSS・jQueryを使用して、デザインカンプをWebページとして再現するだけでなく、ECサイトで必要となる複数のUIを実装しています。
TOPページには複数の画像が自動で切り替わるカルーセル（スライダー）を設置。サイドメニューには、クリックによって詳細項目を開閉できるアコーディオンUIを取り入れました。
また、商品一覧ページでは、商品を一覧で見せるグリッドレイアウトを採用。商品詳細ページでは、サムネイル画像をクリックするとメインの商品画像が切り替わる機能も実装しています。
担当：コーディング／UI実装
使用技術：HTML／CSS／jQuery
制作ページ：TOPページ／商品一覧ページ／商品詳細ページ
コーポレートサイト｜コーディング
Web制作スクールの課題として、Photoshopのデザインカンプをもとに、TOPページ・ニュースリリース・会社概要の3ページで構成されるコーポレートサイトをすべて一人でコーディングしました。
HTML・CSS・jQueryを使用し、各ページのレイアウトから共通のヘッダー・ナビゲーション・フッター、下層ページまでコーディングしています。
また、Facebookページのタイムラインをサイト内に表示する外部コンテンツの埋め込みにも対応。複数ページで構成されるWebサイトとして、ページ間でデザインやナビゲーションに一貫性を持たせながら制作しました。
担当：コーディング／外部コンテンツの埋め込み
使用技術：HTML / CSS / jQuery
制作ページ：TOPページ／ニュースリリース／会社概要
バナー制作｜Web広告クリエイティブ
化粧品SALEバナー
化粧品の華やかなイメージとSALEの高揚感が伝わるよう、ピンクを基調に商品写真やモチーフを組み合わせてデザインしました。
商品写真を印象的に見せながら、「NOW ON SALE!!」のコピーにも視線が集まるよう、文字の大きさや配置、写真とのバランスを調整しています。
アパレルSALEバナー
「SALE」のタイポグラフィを中心に、割引率・開催期間・参加ブランドなどの情報を整理してデザインしました。
キャンペーン内容がひと目で伝わるよう、文字サイズや太さ、配置にメリハリをつけ、シンプルながら視線を引く構成を意識しました。
SNSヘッダー画像｜自社メディア・ブランディング
自身のWebメディア「I design my door」のSNS運用に合わせ、旅をテーマとしたブランドの世界観が伝わるSNSヘッダー画像を制作しました。
AIブランドクリエイティブ｜企画・クリエイティブディレクション
生成AIをクリエイティブ制作に取り入れ、SNSアイコンやブランドビジュアルをはじめ、Kindle書籍の表紙・表紙イメージ、書籍内イラストなど、ブランドや作品の世界観を伝えるビジュアルを制作しています。
制作目的やターゲットに合わせて、コンセプト・構図・モチーフ・ビジュアルの方向性を設計。
生成結果を確認しながら、細かな修正指示や調整を重ね、完成度を高めています。
単にAIで画像を生成するのではなく、企画意図や伝えたい世界観を言語化し、生成AIへの具体的な指示に落とし込むことで、イメージを形にできることが強みです。
担当：企画／コンセプト設計／クリエイティブディレクション／AI活用
SNSアイコン
海外・旅・国際恋愛・ライティングという自身のブランドテーマをもとに、モチーフや構図、色合いなどを設計。
生成AIへの指示と修正を重ね、SNSでブランドの「顔」となるアイコンへ仕上げました。
自己紹介ブランドビジュアル
自身の活動内容や強み、ブランドの世界観を一枚で伝える自己紹介ビジュアルを制作。
掲載情報やレイアウト、ビジュアルの方向性を設計し、生成AIを活用しながら複数回の修正・調整を行いました。
AIで制作したビジュアルをベースに、Canvaで写真や書籍表紙の配置、文字や細部のデザインを調整し、最終的なクリエイティブへ仕上げています。
Kindle書籍表紙｜企画・ビジュアルディレクション
国際恋愛エッセイでは、作品の世界観や登場人物、構図、モチーフなどを設計し、生成AIへの指示と修正を重ねながら表紙ビジュアルを制作しました。
海外ひとり旅書籍では、表紙のコンセプトや方向性を生成AIでビジュアル化。そのイメージをもとに、イラストレーター・デザイナーと連携して表紙制作を進めました。
その他の経験・実績
ライティング・Kindle出版・SEO・Web制作など、これまでの経験・実績は、ポートフォリオにまとめています。
お仕事のご相談・ご依頼
Web制作・デザイン・クリエイティブ制作に関するご相談・ご依頼は、下記フォームよりお気軽にお問い合わせください。