Skip to content
by HITOBA DESIGN
1. 公式ウェブサイトの概要
「株式会社ヒトバデザイン」が手がけるオフィスデザインのプロジェクト「work kit」の公式ウェブサイトです。オフィスデザインの施工事例を中心に、プロジェクトのコンセプトやデザイナーの紹介、働き方に関するジャーナル記事などを掲載し、企業のオフィス空間を豊かにするデザインとサービスを幅広く紹介しています。
2. 構成
グローバルナビゲーションが常に上部に固定されており、Works（施工事例）、About、Journal、Company、Designers、Contactといった主要ページに簡単にアクセスできる構成です。ファーストビューでプロジェクトの理念を伝え、その後にWorks、Journal、Companyといったコンテンツがセクションごとに配置されています。全体的に縦長のシングルページレイアウトで、スクロールを促すデザインになっています。
3. FV（ファーストビュー）
背景に動画を使用し、オフィスで働く人々の活気ある様子をダイナミックに表現しています。中央には「work kit 働く人と場を、豊かにする壮大なプロジェクト」という明確なプロジェクト理念を配置。動画とテキストで、このプロジェクトが単なる空間デザインではなく、働く人々の体験を豊かにすることを目指しているというメッセージを強く伝えています。
4. テイスト
ミニマルでクリーンなデザインテイストです。過度な装飾を排し、写真や文章といったコンテンツそのものの魅力を引き立てています。余白を多く取り、洗練されたプロフェッショナルな印象を与えつつ、温かみのある写真や動的な要素で、親しみやすさも兼ね備えています。
5. コンセプト
「働く人と場を、豊かにする」という明確なコンセプトが貫かれています。単に美しいオフィスを創るだけでなく、そこで働く人々の生産性やコミュニケーションを向上させ、企業ブランディングにも貢献するデザインを提案していることが伝わります。プロジェクトを通じて「働く」という行為をより良いものにしようという、壮大なミッションを感じさせます。
6. ターゲット
これからオフィスを新設・移転しようとしている企業経営者や、オフィスのリノベーションを検討している総務・人事担当者、そして企業のブランディング担当者などが主なターゲットと考えられます。掲載されている事例が多岐にわたることから、企業の規模や業種を問わず、幅広い層へのアプローチを目指していると推測されます。
7. 見出し
セリフ体やサンセリフ体を使い分け、視覚的な階層を明確にしています。太字や大文字を効果的に使用し、重要なメッセージを強調。写真やコンテンツと見出しが連動しており、シンプルながらもユーザーの視線をスムーズに誘導する役割を果たしています。
8. あしらい
余白を活かしたミニマルなデザインでありながら、写真や動画を効果的に配置し、単調にならないよう工夫されています。マウスホバー時の画像拡大エフェクトや、スクロール時のフェードインアニメーションなど、さりげない動きでユーザーの興味を惹きつけ、サイト体験を豊かにしています。
9. フォント/配色/余白
フォント:
本文には可読性の高いサンセリフ体、一部の見出しやロゴにはセリフ体が使用されており、メリハリをつけています。
配色:
黒を基調とした背景に、白やグレーを組み合わせたモノトーン配色が中心です。これにより、洗練されたモダンな印象を与えています。Worksページのサムネイルに、テーマカラーであるブルー系のアクセントカラーが使用されています。
余白:
コンテンツの周囲に十分な余白が確保されており、情報が整理されて見やすい印象です。余白を活かしたレイアウトは、ブランドの持つ洗練されたイメージを強調しています。
10. まとめ
「work kit HITOBA-DESIGN」のウェブサイトは、「働く人と場を豊かにする」というコンセプトが、デザインとコンテンツの両面から一貫して表現されています。ミニマルなデザインと動画を組み合わせたFV、豊富な施工事例、そして働き方に関するコラム記事は、潜在顧客にブランドの価値と専門性を効果的に伝えています。洗練されたデザインは信頼感を生み出し、企業のオフィスデザインという専門的な領域において、プロフェッショナルなイメージを確立していると思いました。
