宮川商会様 はじめまして。 webデザイナーの_ririri_と申します。 貴社の募集を拝見させていただきまして、是非お力になれないかなと思い応募させていただきました。 ↓こちらのURLからデザインのプレビュー画面をご覧いただけます。 【TOP】 https://xd.adobe.com/view/994b7e16-58d0-4cf7-aed9-8ff578f72ffa-cc18/?fullscreen 【プルダウンメニューイメージ】 https://xd.adobe.com/view/9fa0de1b-3f8e-4c72-8aaa-e88eaf442104-caf3/?fullscreen 【スライド別画像イメージ】 https://xd.adobe.com/view/358c8c40-8333-4bf0-8461-1953b6f09463-60df/?fullscreen 以下、リニューアルデザインの説明でございます。 (写真が素敵で、デザインしていてとてもワクワクしました...!) 【全体デザイン概要】 ・写真を活かす落ち着いた配色 ・細めですっきりとしたフォント、装飾最低限でスマートな印象 ・見出しを大きな英字フォントにし、デザインのポイントに ・色見本の写真から着想を得て、縦長・角丸の写真トリミング 【構成概要】 こだわりたい部分に「スクロールによるストレスの撤廃」という項目がありましたので、念の為記載いたします。 TOPページは「初めて訪れた方向け」という考えで作成しており、 「ある程度サイト内の情報を集約、簡易な説明→詳細ページへ遷移させる」といった構成にしております。 内容が多い分ページは少し長くなるのですが、遷移しないと情報が見れないよりも、1ページ内である程度の情報を得られるようにする構成が昨今主流となってきており、このデザインも特に問題ない長さと思います。(スマホの縦スクロールにユーザーが慣れてきて、ページの長さを気にしなくなってきたというのも背景にあるかと思います) 【変更・追加ポイント】 ■ヘッダー・フッター 項目が多いと迷ってしまうのと、カタログのように使用するということもあり、 見たいページへの選択がしやすくなるよう似た項目をグルーピングして配置いたしました。マウスを当てるとプルダウンメニューが開きます。 ヘッダーは最初はロゴのみ大きく表示されており、スクロールすると小さくなりヘッダー帯に収まる想定です。 最初にロゴを大きく見せることで印象に残りやすくなります。 フッターの内容もヘッダーに合わせております。 ■スライド 写真がとても綺麗なので、組み写真ではなく一枚写真を画面いっぱいに見せる仕様が良いかなと思っております。 どのような写真が入っても可読性を保てるようにしております。 ※プレビュー画面だと左右に余白が入ってしまうのですが、実際は画面いっぱいに表示される仕様です。 ■お知らせ スライドの右下に配置し、数秒ごとにお知らせ内容が切り替わるタイプにいたしました。 コンパクトかつ、目にとまりやすい仕様です。 ■About:宮川商会について カタログのように使用されるとのことでしたが、 コーポレートサイトとして「宮川商会はどのような会社なのか」まずTOPで伝える必要があると考え、 岐阜県土岐市はどのような所で、どのような環境で製品がつくられているのか伝えるエリアを1番最初に追加しております。 ■FAQ:よくある質問 問い合わせの多い内容を見せておくことで問い合わせ件数も減り、その場で疑問を解決できることでユーザーの満足度も上がり、 受注につながると考えページ下部に追加いたしました。 【その他】 ・全体的にテキストが少なめで内容が伝わりにくいかもという印象でしたので、キャッチコピーやダミーテキストを足してボリュームを出しております。 どのような文章を入れたら良いかなどもご提案可能です! 現時点で貴社の意図に沿わない点もあるかと思います。 もし採用されましたら、 色々とお話を伺いつつデザイン・内容共にブラッシュアップし、使いやすく素敵なサイトにしていけたらなと思っております。 もちろんスマホ版デザインも作成いたします。 最後までご覧いただきありがとうございました。 ご検討のほど、よろしくお願いいたします!
メンバーからのコメント
宮川商会様
はじめまして。
webデザイナーの_ririri_と申します。
貴社の募集を拝見させていただきまして、是非お力になれないかなと思い応募させていただきました。
↓こちらのURLからデザインのプレビュー画面をご覧いただけます。
【TOP】
https://xd.adobe.com/view/994b7e16-58d0-4cf7-aed9-8ff578f72ffa-cc18/?fullscreen
【プルダウンメニューイメージ】
https://xd.adobe.com/view/9fa0de1b-3f8e-4c72-8aaa-e88eaf442104-caf3/?fullscreen
【スライド別画像イメージ】
https://xd.adobe.com/view/358c8c40-8333-4bf0-8461-1953b6f09463-60df/?fullscreen
以下、リニューアルデザインの説明でございます。
(写真が素敵で、デザインしていてとてもワクワクしました...!)
【全体デザイン概要】
・写真を活かす落ち着いた配色
・細めですっきりとしたフォント、装飾最低限でスマートな印象
・見出しを大きな英字フォントにし、デザインのポイントに
・色見本の写真から着想を得て、縦長・角丸の写真トリミング
【構成概要】
こだわりたい部分に「スクロールによるストレスの撤廃」という項目がありましたので、念の為記載いたします。
TOPページは「初めて訪れた方向け」という考えで作成しており、
「ある程度サイト内の情報を集約、簡易な説明→詳細ページへ遷移させる」といった構成にしております。
内容が多い分ページは少し長くなるのですが、遷移しないと情報が見れないよりも、1ページ内である程度の情報を得られるようにする構成が昨今主流となってきており、このデザインも特に問題ない長さと思います。(スマホの縦スクロールにユーザーが慣れてきて、ページの長さを気にしなくなってきたというのも背景にあるかと思います)
【変更・追加ポイント】
■ヘッダー・フッター
項目が多いと迷ってしまうのと、カタログのように使用するということもあり、
見たいページへの選択がしやすくなるよう似た項目をグルーピングして配置いたしました。マウスを当てるとプルダウンメニューが開きます。
ヘッダーは最初はロゴのみ大きく表示されており、スクロールすると小さくなりヘッダー帯に収まる想定です。
最初にロゴを大きく見せることで印象に残りやすくなります。
フッターの内容もヘッダーに合わせております。
■スライド
写真がとても綺麗なので、組み写真ではなく一枚写真を画面いっぱいに見せる仕様が良いかなと思っております。
どのような写真が入っても可読性を保てるようにしております。
※プレビュー画面だと左右に余白が入ってしまうのですが、実際は画面いっぱいに表示される仕様です。
■お知らせ
スライドの右下に配置し、数秒ごとにお知らせ内容が切り替わるタイプにいたしました。
コンパクトかつ、目にとまりやすい仕様です。
■About:宮川商会について
カタログのように使用されるとのことでしたが、
コーポレートサイトとして「宮川商会はどのような会社なのか」まずTOPで伝える必要があると考え、
岐阜県土岐市はどのような所で、どのような環境で製品がつくられているのか伝えるエリアを1番最初に追加しております。
■FAQ:よくある質問
問い合わせの多い内容を見せておくことで問い合わせ件数も減り、その場で疑問を解決できることでユーザーの満足度も上がり、
受注につながると考えページ下部に追加いたしました。
【その他】
・全体的にテキストが少なめで内容が伝わりにくいかもという印象でしたので、キャッチコピーやダミーテキストを足してボリュームを出しております。
どのような文章を入れたら良いかなどもご提案可能です!
現時点で貴社の意図に沿わない点もあるかと思います。
もし採用されましたら、
色々とお話を伺いつつデザイン・内容共にブラッシュアップし、使いやすく素敵なサイトにしていけたらなと思っております。
もちろんスマホ版デザインも作成いたします。
最後までご覧いただきありがとうございました。
ご検討のほど、よろしくお願いいたします!