SmartHR Design System

株式会社SmartHR

SmartHRで運営しているデザインシステムのWebサイトのリニューアルを技術面でお手伝いしました。リニューアル前のJamstack構成(Gatsbyを使いNetlifyにデプロイ)を活かしながら調整し、より高速でメンテナンスしやすいサイトに仕上げています。プロジェクトはリニューアルの相談からはじめ、コンテンツ整理のサポートも行いました。従業員向けシークレットコンテンツの仕組みを使いやすくなるよう再構築しています。
リニューアル後も、ライブラリのアップデート対応、GitHubでのコード公開、パフォーマンスの計測や改善、OGP画像生成など、技術面でより良くなるよう継続的にサポートをしています。

https://smarthr.design/

Gatsbyで高速に表示

体感パフォーマンスに定評のあるGatsbyを利用し、初期表示も高速に表示されるサイトにチューニングしました。パフォーマンスへの影響が大きいWebフォントは利用せず、デバイスフォントの指定を工夫しています。

GitHubでソースを公開

従業員専用のコンテンツを分離することで、GitHubでサイトのソースを公開できるようになりました。情報をオープンにする運営理念に合わせた運用です。

SNSシェアに対応したOGPイメージ生成

SNSでシェアされた際に使われるOGP(Open Graph Protocol)とその画像は、シェアされたURLの情報を伝える大事な情報です。SmartHR Design Systemのサイトでは、ページごとのタイトルや関連情報が含まれた、違うイメージ画像を自動生成するように設定しました。これにより、多くのサービスでシェアされた際にもわかりやすく情報とリンクが表示されます。

Webサイトのスペック

採用サービス、ライブラリ

新しいWeb技術で成功させたいプロジェクトなら、技術選定の前に気軽にお問い合わせよりご相談ください。

お問い合わせ