-
大学教育領域向け公式Webサイトの企画・デザイン・コンテンツ設計
女子美術大学の「クリエイティブ・プロデュース表現領域」を紹介する公式Webサイトの制作を担当しました。本案件では、単なる大学・学科紹介ではなく、領域独自の教育理念や学びの特徴を分かりやすく伝え、受験を検討している学生や保護者が「どのようなことを学べるのか」「卒業後にどのような進路があるのか」を具体的にイメージできるサイトを構築することを目的としました。現在のサイトでは、領域紹介、学べること、学生作品、プロジェクト、卒業生の声、入学検討者向け情報などが整理されています。
制作では、まず教育領域が掲げる「表現力とプロデュース力を養う」という特徴を整理し、それをサイト全体のコンテンツ構成へ反映しました。特に、美術・音楽・演劇・映像など幅広いジャンルを横断して学ぶ領域であるため、一般的な大学サイトのように授業内容だけを説明するのではなく、実際の学生作品や社会・地域とのプロジェクト、卒業生の活動まで掲載することで、学習内容を具体的にイメージできる情報設計としています。
ファーストビューから領域のコンセプトを印象的に伝え、その後に「領域について」「学べること」「学生作品」「プロジェクト」「卒業生」と段階的に情報を展開することで、ユーザーが興味を持った内容を深掘りできる構成を設計しました。特に学生作品では、映像、インスタレーション、ミクストメディア、アートプロジェクトなど多様な制作物を掲載し、文章だけでは伝わりにくい教育内容を視覚的に理解できるようにしています。
また、学生だけでなく卒業生の現在の活動を紹介するコンテンツを設け、プロデューサー、デザイナー、アーティスト、学芸員、研究者・キュレーターなど、卒業後の多様なキャリアを具体的に伝えられる構成としました。これにより、教育内容だけでなく、その学びが将来どのような仕事や活動につながるのかまで一つのサイト内で確認できるようにしています。
さらに、大学・自治体・企業などとの共同プロジェクトも紹介し、実際の社会と接点を持ちながら学ぶ領域であることを伝えています。地域や自治体、他大学、他領域とのコラボレーション実績をアーカイブとして整理することで、継続的な活動実績を蓄積できるコンテンツ構造としました。Web制作： HTML / CSS / JavaScript
デザイン： Webデザイン、レスポンシブWebデザイン、ブランドサイト設計
UI/UX： 情報設計、カテゴリー設計、ナビゲーション設計、ユーザー導線設計
コンテンツ設計： 教育内容、学生作品、プロジェクト、卒業生インタビュー、ニュース
CMS運用： ニュース・プロジェクト・作品などの継続的なコンテンツ管理
メディア活用： 写真、動画、作品画像を活用したビジュアルコンテンツ設計
制作領域： 大学・教育機関サイト、学科・専攻サイト、ブランドサイト、コンテンツサイト、作品アーカイブサイト -
食品ブランド向け商品サイトの企画・デザイン・販売導線設計
食品ブランドの商品をWeb上で効果的に訴求し、商品の特徴やこだわりを理解したユーザーが、そのまま購入先までスムーズに移動できるブランドサイトの制作を担当しました。本案件では、単純な商品情報の掲載だけではなく、商品の魅力を視覚的に伝えながら、ブランドへの興味喚起から商品理解、購入行動までを一つの流れとして設計することを重視しました。
制作では、まず商品の特徴やターゲットユーザーが求める情報を整理し、ファーストビューから商品のコンセプト、製造・素材へのこだわり、商品ラインナップ、各フレーバーの詳細、購入場所へと段階的に情報を展開する構成を設計しました。実際のサイトでも「美味しい秘密」「多種の味」「随食享用 Store」といった流れで、商品の価値を理解してから販売先を確認できる構成になっています。
特に商品訴求では、台湾産米を使用していること、糙米を70％配合していること、非油炸、味精・防腐剤を使用していないことなど、商品の特徴を単なる文章として並べるのではなく、写真や商品パッケージと組み合わせて視覚的に理解できるように設計しました。また、糙米粥と多穀粥という商品カテゴリーを分けることで、それぞれの特徴やターゲットとなる食シーンをユーザーが把握しやすい構成としています。
商品一覧では、濃郁豚骨、椒香牛肉、海鮮什穀、野菜纖穀など複数の商品を掲載し、それぞれの味や使用素材、特徴を確認できるようにしました。商品ごとの情報量を統一することで、ユーザーが複数の商品を比較しながら、自分の好みに合った商品を選択できるUIを意識しています。
さらに、ブランドサイトから実際の購買行動へつなげるため、7-ELEVEN、全家、萊爾富、OK便利商店、全聯福利中心、家樂福、愛買、大潤發などの販売店舗に加え、momo、PChome、金車オンラインショップといったECサイトへの導線を設置しました。これにより、サイト内で商品を知るだけで終わらず、ユーザーが自分にとって利用しやすい購入先を選択できる構成としています。
フロントエンド： HTML / CSS / JavaScript
デザイン： Webデザイン、商品ブランドサイト設計、レスポンシブWebデザイン
UI/UX： 情報設計、商品カテゴリー設計、商品比較、ナビゲーション設計
コンテンツ設計： 商品紹介、素材・製法紹介、商品ラインナップ、商品詳細
販売導線： 実店舗検索・購入導線、ECサイトへの外部リンク設計
ビジュアル： 商品画像・パッケージ画像を活用したブランド表現
マーケティング： 商品訴求、ブランド認知、購買導線、コンバージョン設計
制作領域： 食品ブランドサイト、商品紹介サイト、プロモーションサイト、販売促進サイト -
店舗サイト向けWebサイトの企画・デザイン・導線設計
新感覚の冷凍熟成バウムクーヘンを販売する食品ブランドのWebサイト制作を担当しました。本案件では、単に商品を販売するECサイトを制作するのではなく、「-23℃で1週間冷凍熟成する」という商品の最大の特徴をブランドの中心に据え、製法、素材、職人の技術、食べ頃、パッケージ、購入方法までを一つのストーリーとして伝えることを重視しました。実際のサイトでも「FROZEN AGING」「ADDITIVE FREE」「CRAFTSMANSHIP」「READY TO EAT」と段階的に商品価値を説明する構成になっています。
制作では、まず商品の最大の特徴である冷凍熟成という独自製法を分かりやすく伝える情報設計を行いました。一般的なバウムクーヘンとの違いを最初に理解してもらったうえで、-23℃で1週間熟成する工程、独特の食感、素材へのこだわりへと情報を展開し、ユーザーが読み進めるほど商品の価値を理解できる構成としています。
また、食品ブランドでは「何が入っているか」だけでなく、「誰が、どのような考えで作っているのか」も購買判断に大きく影響します。そのため、オーストラリア産の小麦、北海道十勝産の発酵バター、無添加クリーム、卵などの素材情報に加え、職人による手作りやドイツの伝統的な「別立て製法」についても掲載し、商品の品質を裏付ける情報として整理しました。
さらに、冷凍熟成という商品の特性上、「どのように食べるのか」を正確に伝えることも重要でした。焼き上げ、冷凍熟成、冷蔵便、冷蔵庫で約3時間冷やすという流れを視覚的・段階的に説明し、購入後に最も美味しい状態で楽しめるようユーザー体験まで考慮したコンテンツ設計を行いました。
デザイン面では、商品の高級感や独自性を表現するため、商品写真やパッケージ写真を大きく活用し、テキストだけでは伝わりにくい食感やブランドの世界観を視覚的に訴求しました。また、ギフト需要も想定し、専用パッケージや配送ボックスについても紹介することで、自宅用だけでなく贈答用の商品としての魅力も伝えられる構成としました。フロントエンド： HTML / CSS / JavaScript
EC・販売： オンラインショップ連携、商品購入導線設計
デザイン： Webデザイン、ブランドサイト設計、レスポンシブWebデザイン
UI/UX： 情報設計、スクロール型コンテンツ設計、CTA・購入導線設計
コンテンツ設計： 商品紹介、素材紹介、製造工程、食べ方、ギフト訴求、FAQ・商品情報
マーケティング： ブランド訴求、商品価値訴求、購買意欲向上、コンバージョン設計
ビジュアル設計： 商品写真・パッケージ写真を活用したブランド表現
制作領域： 食品ブランドサイト、商品プロモーションサイト、EC連携サイト、販売促進LP -
美容サロン向けWebサイトの企画・デザイン・予約導線設計
複数の店舗を展開するサービス事業者向けに、ブランドの世界観を統一しながら、各店舗の情報やサービス内容を分かりやすく発信できる公式Webサイトの制作を担当しました。本案件では、単なる店舗紹介ではなく、ブランドの理念や技術力を伝えながら、ユーザーが自分に合った店舗・スタイル・スタッフを見つけ、そのまま予約まで進めることができるサイト設計を重視しました。実際のサイトでも、ブランド紹介、技術力、ヘアスタイル、トレンド、店舗、料金、スタッフ、ニュース、採用、アカデミーなど、多数の情報を体系的に整理しています。
制作では、まずブランド全体の特徴とユーザーが求める情報を整理し、「ブランドを知る」「スタイルを探す」「店舗を選ぶ」「料金を確認する」「スタッフを選ぶ」「予約する」というユーザー行動を想定した情報設計を行いました。特に複数店舗を展開しているため、店舗ごとの所在地や営業時間、スタッフ、料金などを個別に確認できる一方、ブランド全体としての統一感も維持できる構成としています。現在のサイトでは、渋谷、青山、原宿、銀座、銀座セントラルの各店舗へ直接アクセスできる導線が設けられています。
また、ユーザーが美容サービスを選択する際には、店舗情報だけでなく「どのような仕上がりになるのか」を事前に確認できることが重要です。そのため、ショート、ボブ、ミディアム、ロング、クリエイティブ、メンズなどのカテゴリーからヘアスタイルを探せる構成を設計し、サービスを受ける前に具体的なイメージを持てるようにしました。さらに、トレンドコレクションや特集コンテンツを組み合わせることで、単なる予約サイトではなく、ブランドの技術力やトレンド感を継続的に発信できるメディアとしての役割も持たせています。
予約導線については、ユーザーが店舗や料金を確認した後に予約ページを探し直す必要がないよう、各店舗の予約ページへ直接移動できる導線を設計しました。料金ページではメニューや初回特典を確認できるようにし、予約前に必要となる情報を整理することで、ユーザーの不安を減らしながら予約行動へつなげる構成としています。フロントエンド： HTML / CSS / JavaScript
デザイン： Webデザイン、ブランドサイト設計、レスポンシブWebデザイン
UI/UX： 情報設計、カテゴリー設計、ナビゲーション設計、ユーザー導線設計
予約機能： 店舗別予約導線、予約システム連携、料金・メニュー確認導線
コンテンツ設計： ヘアスタイル、トレンド、スタッフ、店舗、料金、ニュース、採用
外部連携： 各店舗予約システム、関連サービスサイトへの導線設計
運用設計： ニュース・特集・店舗・スタッフ情報などの継続的な更新
制作領域： 店舗サイト、複数店舗サイト、ブランドサイト、予約サイト、集客サイト -
IT・通信・インターネット領域向けSaaSサービスサイトの企画・デザイン・導線設計
IT・通信・インターネット領域の企業向け業務支援SaaSのサービスサイト制作を担当しました。本案件では、単にプロダクトの機能を紹介するのではなく、IT・通信・インターネット業界の担当者が「自社の業務プロセスをどのようにデジタル化・効率化できるのか」「クラウド導入によって何が変わるのか」を直感的に理解でき、最終的に無料体験や導入相談へ進めるサイト構成を重視しました。
制作では、まずIT・通信・インターネット業界における業務課題を整理し、「クラウド活用」「顧客・案件データ管理」「Excel業務の脱却」「ワークフローのオンライン化」「問い合わせ管理の自動化」「プロジェクト・タスクの可視化」「売上・契約管理」「採用・人材管理のデジタル化」など、ユーザー自身の課題からサービスを探せる情報設計を行いました。単純な機能一覧ではなく、業務領域・部門・利用シーンといった複数の切り口から最適な活用方法を探せる構成とし、ITリテラシーの差があるユーザーにも対応できる設計としています。
また、IT・通信・インターネット業界向けのSaaSでは、機能説明だけでは導入判断につながりにくいため、実際の導入事例を活用して「どのような企業が、どのような業務課題を解決したのか」を具体的に確認できるコンテンツを設計しました。さらに、外部サービス連携やAPI連携などの拡張性についても整理し、既存のITインフラやクラウドサービスと組み合わせて利用できることを伝えられる構成としています。
コンバージョン設計では、ユーザーの検討段階に応じて複数の導線を用意しました。まずは気軽に試したいユーザーには無料トライアルやデモ体験を案内し、より具体的に導入を検討している企業には導入相談やパートナー企業への問い合わせへ進める構成としています。また、ホワイトペーパー、導入事例、セミナー、動画コンテンツなどを用意し、すぐに導入を決めないユーザーに対しても段階的に理解を深められる設計を行いました。を行うことで、サービス価値をより直感的に伝えられることを実感したプロジェクトです。フロントエンド： HTML / CSS / JavaScript
デザイン： Webデザイン、SaaSサービスサイト設計、レスポンシブWebデザイン
UI/UX： 情報設計、カテゴリー設計、検索・導線設計、ナビゲーション設計
コンテンツ設計： サービス紹介、機能紹介、用途別・業種別・部署別コンテンツ、導入事例
マーケティング： CTA設計、無料体験導線、導入相談、資料・セミナーへの誘導、CV設計
外部連携： プラグイン・外部サービス連携情報の掲載、問い合わせ・相談導線
運用設計： 導入事例、セミナー、資料、ニュース、学習コンテンツ等の継続的な更新
制作領域： BtoB SaaSサイト、業務改善サービスサイト、プロダクトサイト、企業向けWebサイト、コンバージョンサイト