海苔ジャパン様（サービスサイト）｜Web制作実績 レスポンシブ対応｜制作実績

設計面では、「見る」「食べる」「知る」の3つの観点をヘッダーに大きく設けることで、幼少層などの幼いユーザーにも、見やすくて分かりやすいレイアウトを考案しました。

メインビジュアル内の右下及び直下には、各コンテンツへの導線リンクを設置しており、ヘッダーを見ずにとりあえずページをスクロールしたユーザーにも、次のページへの回遊をしっかり促せる設計を行っております。

ユーザーに楽しみながら海苔のことを知っていただけるように、ホームページ内には様々な工夫を凝らして実装を行っております。

例えば、トップページでは「もっと見る」などのリンクボタンにマウスを重ねると、公式キャラクターのピノリがボタンから飛び出してくるアニメーションを実装し、バナーやロゴに対しては横に揺れる印象的なアニメーションを加えるなど、見ていて飽きないポップな表現を加えております。

お客様からは、「著名人とコラボして海苔レシピの開発・発信をしたい」というご要望もいただいていたため、料理研究家として本の出版やテレビ出演でご活躍されている栗原はるみさんの特集ページを制作いたしました。

こちらのページでは、栗原さんのファンや主婦層にターゲット絞り、パンフレットに合わせた大人らしいデザインにテイストを変えて実装を行いました。

栗原さんのお写真や、海苔を使用したレシピの写真を多く取り入れることで、「海苔が食べたい」「海苔を使った料理がしたい」と主婦層に思っていただけるようなコンテンツに仕上げております。

デザイン面では、ターゲットの比較的若い年齢層を意識し、お客様のご希望カラーである緑を中心に赤、黄、緑の色をコンテンツにごとに分類して使用することで、ポップさがありながらも統一感のあるすっきりとした構成を実装しました。

海苔について楽しく知る・学ぶという観点から、ユーザーに堅い印象を与えないよう、フォントや各パーツを通して全体的に丸みをイメージし、柔らかくて親しみやすい印象も演出することで、サイトの回遊率を促進し、海苔の普及をWeb上から発信しております。

設計面では、ユーザーにより「海苔が食べたい」「海苔を用いて料理したい」という興味関心を持っていただくために、海苔を食べている人の人物写真や、海苔を使用したお料理の写真など、画像を多く取り入れてレイアウトを実装しました。

スマートフォン用サイトでは、PC用サイトと比べて画面の幅が狭まりますが、「写真から海苔の魅力をしっかり訴求したい」というお客様のご要望に沿い、スライダーでの実装や写真の切り抜き方を工夫することで写真を最大限表示させながら実装を行いました。

コンテンツ量が豊富なページが多いため、スマートフォン用サイトではユーザーへ訴求したいコンテンツへの導線リンクにメリハリを付けて訴求したいコンテンツの差別化を図りました。

具体的には、ユーザーへ訴求したいTOPページの海苔動画コンテンツに対し、3つの動画を省略せず大きく設置することで、ページ遷移と動画閲覧への誘導を促しております。

レシピなどの数が多いコンテンツは、スライダーを用いて画面に表示しない横幅を有効活用することで、多量なコンテンツを訴求度に合わせて表現しております。

旧サイトでは、レスポンシブデザインに対応しておらず、ユーザー比率の多いスマートフォンでの表示が最適化できておりませんでした。

ネオインデックスのホームページ制作では、レスポンシブデザインに対応し、なおかつユーザーの行動特性をしっかり分析したうえで、各デバイスに合わせた最適な設計を行います。さらに、最新トレンドを乗せたデザインにて実装を行うことで、クオリティの高いフルオーダーメイドのホームページを作り上げております。

デザイン面では、お客様の訴求したいピックアップコンテンツへの導線リンクに合わせて、担当デザイナーがグラフィック要素の高いバナーを数種類制作いたしました。

バナーはホームページ内のアイテムとしてユーザーに強力に訴求できるアイテムのため、ユーザーをしっかり見せたいコンテンツに誘導できるよう、また、ホームページがさらにリッチに見えるようにこだわって制作いたしました。

お客様からは、「今の時代に合ったデザイン力」「簡単にレシピ投稿ができるオリジナルCMS」「スマートフォン用サイトの作りこみ」に対してご好評をいただいており、高い総合満足度と評価をいただきました。