本瓦造船株式会社様 Webサイトリニューアル
業務の内容や特徴、人(スタッフ)など、会社の魅力がたっぷりと詰まったサイトへとリニューアルしました。
公開 | 2018年04月 |
---|---|
URL | https://hongawara.co.jp/ |
フェーズ | 企画・提案、ディレクション、情報設計、デザイン、コーディング、CMS構築、写真撮影・加工、動画編集 |
タグ | WordPressコーポレートサイト求人 |
スマートフォン・タブレット対応
以前のサイトでは、スマートフォンやタブレット表示に最適化されていなかったため、今回のリニューアルではレスポンシブWebデザインを採用し、マルチデバイスへと対応しました。
本瓦造船様は、BtoBの企業であるため、アクセス解析を見るとまだPCからのアクセスの方が多いですが、公開後もスマートフォンから3〜4割程度閲覧されています。
スマートフォン表示の際は、通信に負担がかからないよう、トップページの動画を画像に切り替える工夫を取り入れています。
デザインコンセプト
トップページのメインビジュアルでは、造船業の大きな見所の一つである進水式の様子や工場の全体像、鞆の浦を広く見渡せるよう、ドローンによる空撮映像も取り入れました。ほぼすべての写真を独自に撮影しており、スタッフの写っている写真も多く起用しているため、業務や会社の雰囲気が伝わりやすいのではないでしょうか。
イメージカラーは、ロゴカラーに統一するために赤色を使用しましたが、見やすさ確保のためコントラストに配慮し、Webでは少し深みのある色に変更しています。
設計・CMS
サイトを作る上で一番肝となる情報設計にしっかりと時間をかけて、担当者様と何度も打ち合わせの場を設けて進めていきました。
本瓦造船様にとってのお客様や、就職活動中の学生さんにとってわかりやすい表現を心がけ、その方々の見たいものにフォーカスして内容を精査し、全体の構成を決めています。
また、サイトの中でも迷わず目的のページに辿り着けるよう、ナビゲーション / 導線を極力シンプルに設計するよう心がけています。下層ページへもダイレクトに遷移できるよう、ドロップダウンメニューを採用しました。
運用面においては、本瓦造船様側でサイトの更新ができるよう、Wordpressを導入しました。「お知らせ」や「建造実績」の追加は、htmlの知識がなくても誰もが簡単に更新できることを目標に、プラグインを導入して改良しています。
特に、建造実績での船の追加は、簡単な画像の選択と文字の入力だけで追加出来るよう工夫しました。
余裕をもってご連絡いただいたことで、調査・検討する時間も十分に取れ、制作に入ってからも順調に進めることができました。
実質の制作期間は3ヶ月ほどでしたので、結果的にも想定したスケジュール通りに進めることができています。これも偏にご担当者様が率先して原稿の準備や各所の段取りを行っていただいたおかげと深く感謝しております。
これまで様々な業種のサイトをお手伝いさせていただきましたが、造船業は初めてでしたのでとても新鮮でしたし、スタッフの皆様にもとても親切にしていただき、楽しくお仕事させていただきました。今後も必要に応じてしっかりとサポートさせていただきます。
製作では「当社の特徴をいかに分かりやすく伝えるか」を考えながら、LABさんと打ち合わせを重ねて、その考えをとても上手に表現して頂きました。
このWebサイトが当社の強力な宣伝ツールになることを期待しています。