Qt Design Studio 2.0をリリースしました！
本記事は「Qt Design Studio 2.0 released」の抄訳です。
Qt Design Studioは、デザイナーと開発者に向けたUIデザイン開発ツールとして、単純なプロトタイピングから複雑で美しいユーザエクスペリエンスの作成までサポートします。また、デザイナーと開発者がQt Design Studioを利用することで、よりシンプルで合理的なUIデザイン開発プロセスを実現することができます。
Qt Design Studio 2.0の概要はこちらのビデオからご確認いただけます。詳細につきましては、オンラインドキュメントをご参照ください。
Qt Design Studio 2.0のリリースに向けて、私たちは主にユーザエクスペリエンスの向上に注力してきました。UIに多くの修正を加えており、例えば、アイテムをロックして意図しない変更が行われないようにすることも可能になっています。ナビゲーターの操作性も向上しており、回転ツールの追加や、多くのバグフィックスが適用されています。それらの詳細につきましては過去のブログ(Qt Design Studio 2.0 Beta released)をご参照ください。
TelemetryおよびCrashpad対応
Qt Design Studio 2.0にはGoogle Crashpadに基づいたクラッシュレポーターを搭載しています。Crashpadはクラッシュ時に原因解析に必要な情報を収集、レポート化し、それをアプリケーションからアップストリームサーバーに送信する為のメカニズムです。私たちはSentryをバックエンドサービスとして使用しています。
デフォルトではCrashpadによって生成されたレポートはアップロードされません。CrashpadはQt Design Studioがクラッシュした際、そのプロセスメモリから任意のコンテンツをキャプチャする為、作成されたレポートにはプロジェクト名等の機密情報を含む可能性があるからです。したがって、生成されたクラッシュレポートのアップロードを行うには、ユーザーが同意し、明示的に機能を有効化する必要があります。また、ローカルで生成されたクラッシュレポートをQtサポートチームと手動で共有することもできます。
この機能を搭載した背景として、非常に残念ではありますが、ソフトウェアが大きく、複雑になるにつれて時折クラッシュの原因となるバグを含んでしまうのもまた事実であることがあげられます。もちろんバグではなく開発ホスト側との互換性による問題の可能性もありますが、全てのケースを含めてクラッシュダンプを自動的に収集し、今後の改善に繋げていくことが最善の解決策であると考えています。
また、プロジェクトを進める上でクリティカルな問題として対策が必要な場合、手動によるレポート作成の手間を軽減でき、スムーズにQtサポートチームに状況を通知することができます。
Qt Design Studioの品質と安定性を向上させるため、ぜひCrashpadを有効にしていただければと思います。
Qt Design Studio 2.0には、Qt CreatorインストールのオプションであるTelemetry Pluginも同梱されています。 Telemetry Pluginもデフォルトでは無効になっており、ユーザーが明示的に有効にする必要があります。 Telemetry Pluginは、システムとQt Design Studioの使用に関する情報を収集します。名前、IPアドレス、MACアドレス、プロジェクト名やパス名などの個人データは収集されません。ただし、QUuidオブジェクトは、特定のユーザーに属するデータレコードを識別するために使用されます。
同意した場合、収集、及び送信されたすべてのデータを確認することができます。データの収集と送信の設定はいつでも変更できます。デフォルトではデータは収集されません。データ収集を開始するには、Telemetry モードを選択する必要があります。詳細については、ドキュメントを参照してください。
Telemetry Pluginは、オープンソースライブラリKUserFeedbackを使用しています。
Telemetry Pluginの目標は、ユーザーがQt Design Studioをどのように使用するかについて詳しく知ることです。アプリケーション内の特定の機能の頻度と使用時間を追跡し、このデータを提供することで、ユーザーが製品をどのように使用しているか、特定の機能がどれほど重要であるかも理解できますし、今後のQt Design Studioのより良い改善に繋げることができると考えています。
そのため、Qt Design Studioの品質を向上させ、ユーザーの理解を深めるために、Telemetry Pluginも有効にするようユーザーにお願いしています。
サムネイル表示機能
カスタムコンポーネントのサムネイル表示機能が追加されました。これにより、素早く目的のコンポーネントを見つけることができ、プロジェクトの概要とその構造の把握が容易になります。これは大規模なプロジェクトで特に役立ちます。
Qt Bridge for Figmaテクニカルプレビュー
Qt Design Studio 2.0にはQt Bridge for Figmaのテクニカルプレビュー版が付属しています。 Figmaは、チームコラボレーションに重点を置いたインターフェイスデザインツールです。
Qt Bridge for Figmaは、デスクトップ版のFigmaにインストールできる開発者プラグインとしてQt Design Studioと共に提供されます。プラグインをインストールするには、Figmaのプラグインマネージャーを開き、プラスボタンを押して「新しいプラグインを作成」を行います。次にQt Design Studioに付属しているManifest.jsonファイルを選択します。このプラグインは、FigmaのPlugin/Development/QtBridgeの下にインストールされます。Qt Bridge for Figmaを使用すると、ユーザーは自分のデザインをFigmaからQt Design Studioにシームレスにインポートできます。Qt Bridge for Figmaの機能セットは、Qt Bridge for Sketchと非常によく似ています。Qt Design Studioは、他の2Dおよび3Dグラフィックデザインツールからのインポート/エクスポートもサポートしています。
スクリーンショットからもわかるように、FigmaからQt Design Studioへのインポートはすでに機能しています。Qt Bridge for Figmaの最新のドキュメントはここにあります。
Qt Bridge for Figmaは、すべてを単一のアーカイブとしてエクスポートすることに注意してください。プロジェクトをQt Design Studioにインポートする前に、エクスポートされたアーカイブから手動で抽出しておく必要があります。後はmetainfoファイルをインポートするだけです。Qt Design Studioにインポートする方法の詳細については、こちらのドキュメントを参照してください。
2Dエフェクトの再設計
Qt Design Studio 2.0では、2Dエフェクトの適用方法についても変更を行いました。この新しい方法によって、Qt Quick Frameworkとの整合性が向上し、より直感的になりました。
エフェクトはQt Quickのアイテムではなくなり、アイテム階層の一部ではなくなりました。代わりに、エフェクトを適用するアイテムの子として対象と紐付けを行います。これにより、エフェクトをアイテムライブラリからドラッグして、ターゲットアイテムにドロップするだけで、ブラー、グロー、マスクなどの効果を簡単に追加できるようになりました。
なお、単一アイテムへの複数の効果はサポートされていません。ユーザーが複数の効果を適用したい場合は、各アイテムに1つの効果を適用して複数のアイテムをスタックする必要があります。
Logic Helper
コードを記述せずに特定の操作を簡単に実行できるようにするために、Qt Design StudioにいくつかのLogic Helperを追加しました。QtQuick.Studio.LogicHelperをインポートすることで、アイテムライブラリに要素が表示されます。これらの可視アイテムではないため、ナビゲーターにのみドラッグできます。Logic Helperを使用すると、容易に双方向バインディングが設定でき、定義された精度で数値を文字列にマップできます。
これはQt Design Studioで時折使用していたJavaScriptの条件式を置き換える、または数値を文字列に適切に変換するための便利なBuilding Blocksです。バインディングエディターでJavaScriptを記述する代わりに、ユーザーはこれらのBuilding Blocks使用して、容易にロジックの記述が行えるようになりました。
Logic Helperを使用すると、JavaScriptで記述せずに条件を定義し、たとえばゲージが持つタイムラインの範囲などをマッピングすることが可能です。
MCUサポート
Qt for MCUs 1.6がリリースされ、Qt Design Studioは、Qt for MCUsの機能セットに限定されたプロジェクトの作成をサポートします。ユーザーがウィザードを使用してQt for MCUsのプロジェクトを作成すると、Qt for MCUsで使用できない機能はQt Design Studio上で無効になります。これには多くインポートが対象となり、Qt Quick 3Dに関連するすべてや、プロパティエディターの多くのプロパティも無効になります。
これにより、Qt for MCUsのプロジェクトを開発する際にもQt Design Studioを十分に活用できます。ここにある洗濯機のデモをご覧ください。このデモの目的は、Qt Design Studioを使用してQt for MCUsのアプリケーションを開発する方法を示すことです。この洗濯機のデモは、Qt for MCUsで実行されるアプリケーションの例でもありますが、通常のQtでも期待どおりに動作します。このデモは、全てのプラットフォームでサポートされているQMLとQt Quickのサブセットで開発されています。
実験的なQt 6サポート
Qt Design Studio 2.0にはQt 6の実験的なサポートも付属しています。Qt Design Studioで開発されたQt QuickベースのプロジェクトはQt6でも機能しますが、Qt Quick 3D側にはいくつかの違いがあります。
コンポーネントの実際のレンダリングとインスタンス化は外部プロセス(qml2puppet)で行われます。このプロセスは完全な互換性のためにQt 6でビルドできます。
これを機能させるには、Qt 6をインストールしQt Design Studioでキットを作成する必要があります。次に、オプションの [Use QML emulation layer that is built with the selected Qt] を有効にする必要があります。プロジェクトにQt 6キットを選択すると、Qt Design StudioはQt 6に基づいてqml2puppetをビルドします。結果としてQt 6上でのレンダリングとQMLエミュレーションが可能になります。
これは、Qt 5とQt 6のQt Quick 3Dの違いを理解している上級ユーザーのみを対象としていることに注意してください。2D Qt Quickアプリケーションを開発する場合、Qt 5とQt 6は完全に互換性があります。
ハイエンドIVIデモ
Qt Design Studio 2.0の開発中に、ハイエンドIVIデモにも取り組みました。
このデモはGitLabsサーバーから入手できます。このデモは基本的なIVIシステムを実装し、Qt QuickおよびQt Quick 3Dの多くの機能を紹介します。
このデモをチェックアウトし、オリジナルのアセットに触れることで、デモがどのように設計および開発されたかを明確に把握できます。
このデモの目的は、カスタムシェーダーを使用して高度な効果を実装する方法と、3Dコンテンツと2Dコンテンツと統合する方法を示すことです。
現在もこのデモに積極的に取り組んでおり、引き続き更新される予定です。
はじめる
Qt Design Studio 2.0は商用ライセンスの下で、またはオンラインインストーラーやQt Accountを通じて無料のコミュニティバージョンとして入手できます。 Photoshop BridgeとSketch Bridge、商用のQt for Design Studioライセンスに含まれています。
商用のQt Design Studio 2.0は、オンラインインストーラーの[ツール]> [Qt Design Studio2.0]から入手できます。
Qt Design Studio2.0の最新のオンラインドキュメントはここにあります。ドキュメントは、Qt Design Studio内からも入手することができます。
Qt Design Studioについて、ドキュメントの一部としてチュートリアルを作成しました。
Qt Design Studioのウェルカムページには、開始に役立つ例とビデオチュートリアルへのリンクが含まれています。
