UXPinとStorybookの統合により、あなたやあなたのチームメンバーは、承認されたインタラクティブなコンポーネントのUIライブラリからデジタル製品をこれまで以上に簡単に構築できるようになります。統合後は、ワークフローが改善され、より効果的な製品開発が期待できます。しかし、単に2つのツールを統合しただけでは、すべてのメリットが得られるわけではありません。以下のStorybookのベストプラクティスを参考に、製品開発プロセスをより効果的なものにしてください。
まだStorybookとUXPinのMerge技術を統合していない場合は、今すぐチュートリアルにアクセスして始めましょう。プロセスはわずか1分で完了します。

誰もがコンポーネントを見つけやすい命名規則を見つける

Storybookには検索機能があり、新しいプロジェクトに追加したいストーリーやコンポーネントを見つけるのに役立ちます。しかし、この検索機能は、探したいものの名前を覚えているかどうかにかかっています。完璧に覚えている必要はありませんが、かなり近いものが必要です。そうしないと、必要なアセットにたどり着くまで、延々とファイルを見続けることになってしまいます。

この問題を解消するために、命名規則を選択してください。現実的には、どのような命名規則を選んでも問題ありません。[ComponentName].stories.[js|jsx|tsx]は、多くのチームでうまく機能しています。しかし、あなたにとってはうまくいかないかもしれません。

最も重要なことは、一つの命名規則を選び、全員がそれを使うことを義務付けることです。デザインシステムの隅々にまで不正なコンポーネントが存在しないようにするためです。

StorybookのCSFフォーマットにこだわる

Storybookからコンポーネントをエクスポートする際、ファイルはデフォルトでCSFフォーマットになっています。デザイナーや開発者の中には、自分の編集ソフトに合わせてフォーマットを変更したくなる人がいます。しかし、それは決して良いことではありません。CSFフォーマットは、ファイルを他の環境に移動させても、メタデータが確実に残るようになっています。

一度にひとつのストーリーに取り組む

クライアントはすぐに結果を求めます。それがデジタル製品を作るということの本質です。鳴り止まないメールに対して、マルチタスクで対応する人もいます。するとどうでしょう。問題を解決したり、プロジェクト間で生じた混乱を整理したりするのに多くの時間を費やすことになります。

そのためには、1つのストーリーに集中して取り組むことが大切です。そうすれば、プロジェクトのあらゆる側面を整理することができ、より良い結果が得られ、より早くマイルストーンに到達することができるでしょう。

ストーリーに着手したら、区切りのよいところまで整理してコンポーネントの追加とテストを続けます。そうすることで、すべてのコンポーネントが適切なストーリーに配置され、プロジェクトの進捗状況を正確に把握することができます。

もちろん、1つのプロジェクトを完成させるまで、1つの作業しかできないというわけではありません。ただ、一度に一つのストーリーに集中するように、一日のスケジュールを組む必要があります。

順序立てて進める。StorybookとMergeはコードベースのデザインアプローチを採用しているので、チームの時間を大幅に節約できるツールがすでに用意されています。急ぐ必要はありません。

カスタムドキュメントが必要かどうかは、開発チームと相談する

Storybookにデフォルトで搭載されているDocsPageを使うべきなのか、それとも独自のドキュメントを作成するべきなのか。この質問には、普遍的な正解はありません。しかし、あなたのチームが開発する製品の種類に応じて、一つの選択肢があると思います。

あなたがJavaScriptの経験が豊富でない限り、コンポーネントをドキュメント化する最善の方法については、開発チームと話し合う必要があります。どちらの方法がデザインや開発のニーズに合っているかは、専門家の意見を参考にしてください。

Storybookで遊ぶ時間を作る

Storybookには、クリエイティブなリスクを冒しても、ストーリーの他のコンポーネントに影響を与えないためのサンドボックスがあります。これはStorybookの最も優れた点のひとつですから、ぜひ活用してください。

遊ぶことは時間の無駄ではありません。あるツールがどのように機能するのか（機能しないのか）を学ぶ最も効果的な方法のひとつです。今、探索に費やす時間は、将来的にStorybookのより良いユーザーになるためのものです。練習だと思ってやってみてください。でも、楽しみながらやってくださいね！

Storybookのコミュニティに参加する

Storybookにはたくさんのチュートリアルがあり、UIコンポーネントライブラリやデザインシステムを作るための効果的な方法を見つけることができます。しかし、すべての質問にチュートリアルが答えてくれるわけではありません。

そこで、Storybookのコミュニティの出番です。他のオープンソースツールと同様に、Storybookにもユーザーや開発者の活発なコミュニティがあります。コミュニティに参加すれば、他のユーザーと知見やヒントを交換することができます。

また、コミュニティに参加することで、Storybookのアップデート情報や、それがデザインプロセスにどのような影響を与えるかを常に知ることができます。

UXPin は、世界中の製品チームがアイデアをより早く製品にするためのデザインプロセスツールです。
UXPinの革新的なテクノロジーであるMergeにより、DesignOpsの課題を簡単に解決することができます。UXPin Mergeでは、Reactコンポーネントを使ってデザインし、最終製品と完全な一貫性を持ったプロトタイプを実現することができます。
さあ、今すぐ無料トライアルを！