EmitgnosコーポレートサイトをNotionをCMSとして用い簡易的にリニューアル

Emitgnosを創業してから長い間、スクロールも不要なほどにシンプルな会社概要のみのWebページをコーポレートサイトとしていましたが、いくらか自社として公開できるコンテンツが増えてきたので簡易的にリニューアルしました。

「簡易的」という言葉が指すように完全なリニューアルではなく、現在のところWIPなステータスで、少しづつ完全体を目指していければと思っています。

クライアントワークですと中々こういった漸進的な制作プロセスは採用しづらいですが、自社のものであれば躊躇いなく採用できます。

やはり弊社のような小さな会社だと、リソースの都合などから自社のために何かを制作するのは後回しにしがちなので、少しづつでも公開してしまった方がメリットがあるだろうという判断です。

💬 この記事さえも執筆中で、少しづつNotionから更新しています。現時点では特に公開/非公開のハンドリングをしていないので、常に執筆の履歴が公開されてしまうのですが、これはこれで良いだろうということで後回しです。

とは言っても、Webサイト/アプリケーションの制作会社として、中途半端なものを公開することでネガティブな印象を与えてしまうのは避けたいところですから、エンジニアリング的にもデザイン的にも、「こだわり」を目安として制作を進めています。

この記事では、現時点における「こだわり」をいくつか紹介します。

---

• 大部分のコンテンツをNotionで管理
  • ケーススタディやメディア以外のコンテンツもNotionから更新可能
    • 現状はサービスや会社概要もNotionで対応
    • デザイン的な意味での取り回しが難しいので、後々ケーススタディとメディアだけ（データベースのみ）の利用になりそうではある
  • Notion APIが返す有効期限のある画像の取り扱い
    • ビルド時のみストレージに存在しない画像をアップロード
    • externalな画像をNotionで設定してあげるのが一番簡単ではある
    • 有効期限なくして欲しい
• ヘッダーのProgressive blur
  • 滑らかにブラーをかけるの調整難しい
  • Progressive blurはアニメーション不要でスクロールに奥行きを加えられるのが好み
    • スクロール連動のアニメーションは操作感を損なうことが多いし、自己帰属感を残しながら対応するのは大変なので出来れば避けたい
• メインビジュアルのGLSLシェーダー
  • “Expand the Time.” を表現するグラフィック
    • 平等に進んでいく時間を拡張するイメージ
  • Three.jsなどを使わずスクラッチで実装
    • 複雑なことはないシンプルなシェーダーを描画するだけだったので依存関係も増やさず対応できそうというモチベーション
    • Next.js 15, React 19を使用しているため、現状だとライブラリを使いづらかったのもある
• ビジュアルの方向性を示すフォント
  • 呪術的な雰囲気を持つ Basteleur Moonlight
    • Moonlightかっこよすぎる
    • 月は社名にも関連あるのでより良い
  • 機械的な雰囲気を持つ Space Grotesk
  • 相反するようなビジュアルのフォントの組み合わせを模索した