7年経ったプロダクトにデザインシステムを導入!ゼロからの画面制作を卒業して開発効率アップ by はるみん

PHPerKaigi 2025
レギュラートーク(20分)

7年経ったプロダクトにデザインシステムを導入!ゼロからの画面制作を卒業して開発効率アップ

halmin51g はるみん halmin51g
6

画面開発で、こんな悩みを抱えていませんか?

  • 画面ごとに統一感のないデザイン、曖昧なレビュー基準に振り回される
  • 開発のたびにゼロからデザインとコーディングを繰り返す
  • CSSの保守性が低く、改修のたびに手間がかかる

例えば、新しい画面が追加されるたびに微妙に異なるUIが作られたり、レビュー時に明確な基準がないことでデザインの決定が長引いたりした経験はないでしょうか。こうした課題が積み重なると、チーム全体の開発効率やモチベーションが著しく低下してしまいます。

これらの課題に対する解決策として、「デザインシステム」を導入しました。

今回のトークでは、既存のデザイン案を基に、FigmaやStorybookなどのツールを活用しながらデザインシステムを整備し、プロダクトへの導入を進めた一連の取り組みをご紹介します。

話す内容

  • デザインシステムとは何か
  • 導入に向けた具体的なステップ
  • 導入前の課題と導入後に得られた効果
  • 導入が進まなかった要因と成功に繋がった工夫

こんな方におすすめ

  • 画面開発で課題を感じているエンジニア、UI/UXデザイナー
  • レガシーなフロントエンド構成に悩んでいる方
  • デザインシステム導入に興味がある方

トークを通じて、みなさんの開発現場でも役立つヒントをお届けできればと思います。