[画像1: https://prcdn.freetls.fastly.net/release_image/64653/46/64653-46-25c26353f6b180be1adefefaae13150e-742x495.png?width=536&quality=85%2C75&format=jpeg&auto=webp&fit=bounds&bg-color=fff ]
株式会社LYZON（本社：東京都文京区、代表取締役：藤田 健）は、Figma上で自社の公式デザインシステムを一般公開しました。
本デザインシステムは、デザイナー・エンジニア・ディレクター間の共通言語を確立し、UIの品質向上と開発効率の両立を目的としたものです。
社会の背景
デジタルサービスの高度化が進む中、Webサイトやアプリケーションに求められるUIの品質と一貫性は年々高まっています。しかし、現場ではデザインと実装のずれや、プロジェクトごとのガイドラインのばらつきによる非効率が課題となってきました。こうした背景から、企業ごとに独自のデザインシステムを整備する動きが活発化しています。
ストーリー
LYZONではこれまで、数多くのWebアプリケーション開発やWebシステム開発を通じて蓄積してきたUI設計のノウハウがありました。これらを形式知化・標準化し、より再利用性と拡張性に優れた資産へと昇華させたのがデザインシステムです。
本プロジェクトは、社内のデザイン・開発・ディレクション各チームの協働によって約1年かけて構築され、単なる「ガイドライン集」に留まらない「設計思想」としての位置づけを目指しました。
サービス紹介
弊社のデザインシステムは、以下の3つの特徴を備えています。
FigmaベースのUIコンポーネントライブラリ
- ボタン、フォーム、ナビゲーションなどよく使われるUIパーツを体系的に整理- コンポーネントごとに複数の表示状態を定義
- 再利用と拡張が可能な柔軟コンポーネントとして作成
デザイン原則とトーン＆マナーの明文化
- カラー、タイポグラフィ、アイコンなどのガイドラインを一貫して提供- デザイナー間の意思疎通を加速し、認識を揃えることでレビュー回数の削減を実現
開発との接続を意識した仕様設計
- CSSクラスやフレームワーク実装を想定したコンポーネント設計がなされており、開発現場での展開もスムーズ弊社のデザインシステムについては、以下URLからご確認ください。
LYZONデザインシステム v1.0.0 を確認する
[画像2: https://prcdn.freetls.fastly.net/release_image/64653/46/64653-46-a31aec9f1e73ca7786ba40a7a5fc45d3-721x348.png?width=536&quality=85%2C75&format=jpeg&auto=webp&fit=bounds&bg-color=fff ]
なお、デザインシステムについては、弊社公式ブログでも紹介しておりますので、是非ご覧ください。
「デザインシステムとは？LYZONが自社初のデザインシステムを公開」
今後の展開
LYZONでは、お客様のデザインシステム構築を支援できるようになり、ブランドイメージや開発効率の向上を通じて、より良いユーザー体験の実現に貢献しています。今後もデザインシステムをアップデートし、社内プロジェクトへの適用を通じてフィードバックを継続的に反映していきます。また、将来的にはStorybookの構築によってフロントエンドとの連携を強化し、アクセシビリティ対応まで実施する予定です。
株式会社LYZON
所在地：東京都文京区湯島1-6-3 湯島1丁目ビル4階
設立：2007年6月19日
代表者：代表取締役 藤田 健
URL：http://www.lyzon.co.jp/
業務内容：Webサイトの構築、運用及びWebコンサルティング
【本リリースに関するお問い合わせ】
株式会社LYZON 広報担当 郷田、金原
TEL ： 03-5803-0588
E-mail ： press@lyzon.co.jp （goda@lyzon.co.jp、kimbara@lyzon.co.jp）
