Reshapedがオープンソースとして公開

• Reshapedは、デザイナーと開発者のためにReactとFigmaのコンポーネントライブラリを提供するプロジェクト
• 当初は有料ライセンス方式だったが、現在は全面的にオープンソースへ移行
• オープンソース化により、GitHubとFigma Communityでソースコードとデザインライブラリの両方を利用可能に
• このプロジェクトは、デザインとエンジニアリングの連携を強化し、実務でそのまま活用できるベストプラクティスを提示
• 既存購入者は今後も引き続きアップデートとサポートを受けられる

---

Reshapedのオープンソース移行の背景

• 約5年前にReshapedプロジェクトを始めた動機は、ReactとFigmaの両方で使えるコンポーネントライブラリが必要だったため
• 10年以上にわたりデザインシステムを扱ってきた経験をもとに、デザインシステムで共通して発生する問題点と良い基準を明確に理解している
• Webの80%はいまなお似たような中核デザイン原則の上に構築されていることを見いだし、これを広くカバーしつつ、開発者が残りの20%を柔軟に扱える低レベルユーティリティを提供するシステムを設計
• 当初からアクセシビリティやデザインのどちらか一方だけに集中するのではなく、デザインとエンジニアリングの整合性、UIテーマ、ダークモード、マイクロアニメーションなど、さまざまな実務課題をあわせて解決することに重点を置いていた

有料モデルからオープンソース化決定までの過程

• プロジェクトの継続性を保つため、初期には個人およびチーム向けの有料ライセンス販売方式を採用
• そのおかげで小規模コミュニティにより集中し、バグレポートや機能リクエストに深く対応できた
• いつかは有料の壁を取り除きたいという思いがあり、2年前にはReactパッケージを先に無料化したことで新たな可能性が開けた
• いまやすべてのソースコードとFigmaライブラリをオープンソースとして公開し、ReactはGitHub、FigmaはFigma Communityで利用可能になった

オープンソース化の意義と期待される効果

• Reshapedはデザインとエンジニアリングの橋渡しをするツールであり、双方がスケーラブルなデザインシステム構築のベストプラクティスを学べる
• ライブラリのソースが公開されることで、新機能が導入される際に実際の実装プロセスを透明に共有できる
• FigmaやReactの新機能も、Reshapedの例を通じて企業のデザインシステムへ適用する前に事前ベンチマークできる

今後の計画とコミュニティ支援

• Reshapedのコンポーネントライブラリは今後も引き続き拡張される予定
  • 既存の有料購入者は変更なく今後のアップデートとサポートを継続して受けられる
  • 既存のコミュニケーションチャネルも同様に維持される
• 今後はコアライブラリの上に、より高度で使い勝手の良いプレミアムコンポーネントの追加を検討している
  • 50種類のランディングページレイアウトのような断片的機能ではなく、複雑なCSSとReactロジックを必要とする高難度コンポーネントが中心

コミュニティへの還元を決意

• 5年間のクローズドソース運用を終え、いますべてをコミュニティに還元し、新たな楽しみを期待している