UXPin Merge というデザインツールがすごいという話を聞いて調べてみた
そもそもUXPinとは何か？
2010年にポーランドでスタートし、現在はアメリカとポーランドの2つの拠点で事業を行っている会社
ただ、日本語も対応していたので求人をみてみたら東京が３つ目として記載があった（日本語に注力しようとしてくれているのかもない）
同名のUXPinは、デザインとエンジニアリングを一つの統一されたプロセスに統合するコードベースのデザインツール
世界150か国以上で使用されているコラボレーションUXデザインプラットフォーム
条件付きインタラクション、変数、ステートベースのアニメーション、パワフルな表現により、本物のように感じられるプロトタイプを構築することができる
言い換えれば、ウェブ上のあらゆるものをUXPinで正確にプロトタイピングすることができる
UXPinには、macOSデバイスとWindowsデバイスの両方で使用できるネイティブデスクトップアプリと、そのWebベースのバージョンがある
14日間の無料トライアルがあり、その後自分に合ったプランを選択するか、無料プランを使用し続ける
https://www.uxpin.com/jp/pricing
UXPin Merge
価格ページを見る限り、UXPin にはMergeとStandardがあって、StorybookやGit統合をするならUXPin Mergeの方を使うことになりそう
Mergeは、Gitリポジトリから UXPin エディターにコード化された React.js コンポーネントをインポートし、同期させることができるのが特徴
インポートされたコンポーネントは、開発者が開発プロセスで使用したコンポーネントと100％同一なので、エンドユーザーが体験する実際の製品と同じような外観、操作性、機能（インタラクション、データ）を持つことになる
各ロールのひとができるようになること
サイトに載っていた各ロールのひとができるようになることについて
https://uxpin-jp.notion.site/UXPin-Merge-7153e34032f548929321dbbd2878ac56
デザイナーできることは以下
- 追加作業やコーディングの専門知識を必要とせずに、コード リポジトリにすでに存在するコンポーネントを使用する。
- すでにコード化された要素の再描画をやめる。
- 製品コードで利用可能なインタラクションやデータを使用して、高度なユースケースをテストすることができる。
エンジニアできることは以下
- デザイナーがすでにコード化されたコンポーネントを使用することを保証することで、ワークフローを高速化する。
- 実際に構成されたJSXを参照するすべてのデザインに対して、自動生成された仕様書を使用する。
- カスタムコンポーネントの作成、コードの反復、コンポーネントのデータソースへの接続により、高度なプロトタイピングプロセスに参加できる。
デザインオプス／デザインシステムチームができることは以下
- コードで設定された単一の情報源から、デザイナーとエンジニアの両方にサービスを提供する統合デザインシステムを構築する。
- React.jsコンポーネントのプロパティ（prop-types、フローまたはタイプスクリプトのタイプ、インターフェース）を制御することで、システム内のコンポーネントへの変更を制御する。
- 設計システムのバージョンを管理し、設計者とエンジニアの両方に対してGitHubを通じてリリースを調整する。
デザインとエンジニアリングのリーダーができることは以下
- デザインとエンジニアリングのプロセスを接続し、同期させることができる。
- ウォーターフォールのハンドオフなしにアジャイルプロセスを実現する。
- アイデアをテストし、新機能や製品を市場に投入するまでの時間を短縮することができます。
実際の使い勝手などは綿貫さんの記事が参考になった
プロトタイピングに関してはFigmaより優れていそう
これまでのデザインツールの課題の一つに、デザインしたものをどうコードにするかがあると思っていてそれを根本的に解決するツールになりそう
まだデザイナーとどう協業したらよいかわからないが注目したい
