Loading...

Optics Corporate Website

Summary

Project Type:

コーポレートサイト

Launch Date:

精密光学機器メーカーのコーポレートサイトです。Next.jsのSSG(Static Site Generation)を採用し、全ページを事前ビルドすることで超高速な表示を実現しています。
デザインは精密光学メーカーの持つ技術力と信頼性を表現するため、ミニマルでありながら高級感のある仕上がりを目指しました。
余白を効果的に使い、モーションアニメーションを控えめに取り入れることで、洗練された印象を与えています。制作体制は1名で、設計からデザイン、実装まで一貫して担当しました。
※実際のクライアント案件のコンテンツを改変したデモサイトとして制作しました。

Tasks Tasks

技術コンサルタント, ブランディング, UIデザイン, UXデザイン, CMS, レスポンシブ, サイトマップ設計, ワイヤーフレーム制作, SEO, コピーライティング

Technologies Technologies

TypeScript, Next.js, Tailwind CSS v4

Colors Colors

#1a1a1a

#d7dcde

#111827

Top Page Top Page

企業の顔として、ファーストビューに印象的なヒーロー画像を配置し、スクロールに応じてフェードインするアニメーションで各セクションを表示します。
企業理念、製品紹介、拠点紹介、企業文化、従業員の声、最新ニュースを1ページに集約し、訪問者が企業全体を俯瞰できる構成になっています。
各セクションは適切な余白とタイポグラフィで区切られ、読みやすさを重視しています。

Company Page Company Page

企業概要、沿革、アクセス情報を掲載しています。タイムライン形式の沿革表示により、70年以上の歴史を視覚的に分かりやすく伝えています。各拠点へのへのアクセス情報をシンプルにわかりやすく提供しています。

Products Page Products Page

医療用レンズ、産業用レンズ、カメラレンズ、顕微鏡レンズの4カテゴリーを紹介しています。
各製品カテゴリーにはビジュアルを大きく配置し、技術的な特徴を簡潔に説明することで、専門性の高い製品を分かりやすく伝えています。画像は最適化されたWebP形式を優先的に読み込み、パフォーマンスを向上させています。

Contact Contact

「まずは、気軽にご相談ください」

ホームページを作りたい。
今のサイトをなんとかしたい。
セキュリティ対策が心配。
こんなシステムが欲しい。

どんなご相談でも大丈夫です。まずはお話を聞かせてください。

作って終わりではなく、その後も長くお付き合いできる関係を。
それが、Peas Projectの願いです。