Skip to main content
QTDS_LandingPage_01 (1) QTDS_LandingPage_04 (1) QTDS_LandingPage_02 (1)

Qt Design Studio

躍動的なデザイン

デザイナーと開発者の間の架け橋となることで、開発プロセスに大きな変革をもたらし、あなたのデザインを制作可能なUIに変えます。

無料トライアルを開始

ベーシックな
プロトタイプを超越

UIをデザインするといっても、単に既存のアセットを使って模型を制作することではありません。Qt Design Studio を使えば、アセットは実際に機能する UI のコンポジションになります。 

コードを
自動生成

Figma、Adobe XD、Adobe Photoshopなどのデザインツールを使ってUIデザインを作成します。Qt Design Studio にインポートすると、コードが自動的に生成され、すぐに開発者が使用することができるようになります。 

あらゆる場所で
テスト&ラン

インタラクションとダイナミックな動作をシミュレートおよび検証します。クラスプラットフォームなので、Qt Design Studioで構築されたものはどのようなハードウェアや OS環境にもコンパイルできます。

リリース
Qt Design Studio 4

Qt Design Studio は、デザインを、単なるモックアップではなく完全に機能を備えたUIに変換します。ターゲット・デバイス上でライブテスト、プレビュー、ピクセル単位での微調整を行うことができます。 

Qt Design Studio は、統一されたフレームワーク、共通言語、フィードバックループの削減、イテレーションの高速化により、デザイナーと開発者の間にあるギャップを埋めます。よりよく理解するために、動画をご覧ください。 

Qt Design Studioを試す

Qt Design Studio を活用するお客様

stellantis
spyrosoft
siili
ekkono

製品デザインの確認期間を数か月から数週間にまで短縮

あらかじめ用意されたコンポーネントを利用

レディメイドのコンポーネントライブラリを使用することで、手間を節約できます。Qt Design Studio のコンポーネントライブラリには、シンプルな形状から複雑な UI コンポーネントまで含まれており、UI 作成をすぐに始めることができます。また、FigmaやAdobe XDのようなお気に入りのデザイン作成ツールからインポートして、UIアセットからカスタムコンポーネントを作成することもできます。 

コンポーネントの使用

QtDS_UI_Example_03_Creating-and-using-components_1920x1080_h264_190822_MacWell_AdobeExpress_1

 

QtDS_UI_Example_05_3D-Visual_effects_1920x1080_h264_190822_MacWell_AdobeExpress_1

 

美しいUIを手軽に実現

Blender や 3ds Max などのツールから 3D アセットをインポートします。Qt Design Studio を使用すると、3D オブジェクトをアニメーション化したり、さまざまなマテリアル、テクスチャ、シェーダを追加したり、数値に変更したりすることができます。ライトマップなどの環境を追加して、UIにふさわしいムードを設定しましょう。その後、パーティクルなどの視覚効果を追加してシーンを完成させます。パーティクルとは、例えば火、雨、霧などを便利な方法で作成できる既成のエフェクト機能です。

3D素材について

アニメーションの作成 

Qt Design Studioは、タイムラインやキーフレームベースのアニメーション、画面間やステート間のアプリケーションフロー、データ駆動型のUIロジックアニメーションなど、2Dや3Dのモーションデザインテクニックをサポートしています。タイムラインを構築し、異なるUIステート間の遷移を作成し、イージングとアニメーションカーブで微調整します。ステートと接続を適用して、動作やアニメーションを起動します。 

アニメーション技術について

QtDS_UI_Example_04_3D-Motion-design_1920x1080_h264_190822_MacWell_AdobeExpress_1

 

QtDS_UI_Example_06_3D-Real-time-rendering_1920x1080_h264_190822_MacWell_AdobeExpress_1

 

シネマティックシーン

カメラアングルや動きを自在にコントロールして、映画のような体験を作り上げます。本物そっくりの反射エフェクトなどでフォトリアリズムを実現します。3Dオブジェクトを環境や素材の変化に対して、正確に反応させることができます。さらに一歩進んで、独自のカスタムエフェクトやマテリアルを作成して、完璧な仕上がりを実現することができます。 

カスタムエフェクトについて

リアルハードウェアを使って
開発をスピードアップ

デザインを素早くインタラクティブなプロトタイプに変換して、UI の外観と機能をハードウェアで開発、検証することができます。UI ロジックを作成して、複雑な体験をシミュレートし、動的な動作を追加します。開発者は、機能的なUIをアプリケーション全体に反映させることができます。 

ターゲット・ハードウェアでの検証

デザインに躍動感を与える

Qt Design Studioは、カスタマイズ可能な視覚効果から、3D要素など豊富な機能を備えており、UIを短時間で作成することができます。

インプットメソッド

物理キーボード、マウス、カスタムハードウェアキー、バーチャルキーボードやマルチタッチジェスチャーを使ったタッチスクリーンを使用できます。

音声入力やジェスチャーなどのカスタムインプットメソッドを統合することも可能です。

ビジュアル・エディター

Qt Design Studio の直感的なセットアップにより、 2D および 3D デザインを視覚的に編集。汎用的なデザイン・ソフトウェアと同じような使用感を実現します。

コードの編集も可能です。QMLは、Qtの使いやすい宣言型言語で、設計プロセスを通じて自動生成され、編集することができます。

タイムライン・アニメーション

キーフレームを使ったタイムラインアニメーションで、デザインに動きを与えます。

カスタマイズ可能な視覚効果

ビルトインおよびカスタマイズ可能な視覚効果で、グラフィックデザインを充実させましょう。

3D要素のインポート

3D要素をデザインに簡単にインポートできます。Maya、Blender、3D Maxなど、主要な3Dオーサリングツールをサポートしています。

ステートエディター

ユーザーが操作するさまざまなUIステート間の遷移を作成、変更、追加できます。

フローエディター

ユーザーがアプリケーション・ビューの間を移動するフローおよび遷移をデザインします。

シーンエディター

シーンエディターで、デザインをピクセル単位で微調整できます。

ダイナミックで拡張性の高いレイアウト

サイズ調整機能でUI要素のサイズや位置を自動的に変更し、あらゆる画面サイズや解像度に対応します。

Qt Design Studioの無料トライアル

無料トライアルを開始

Qt Design Studioを学ぼう

Qt ラーニングセンターで、Qt Design Studio とは何か、使い始めるにはどうすればよいかを学ぶことができます。

ドキュメント

Qt Design Studioの技術的な側面を詳しくご紹介します。

Design Sphere ブログ

Qt Design Studioの最新情報

Qt Design Studioをお試しください

 

Qt Design Studioをご利用ください

デザインツールの最新ニュース

Qt Design StudioプロジェクトをPythonで実行

本稿は「Running your Qt Design Studio projects with Python」の抄訳です。 Qt Desig...

Read more

Qt Design Studio 4.6 リリース

本稿は「Qt Design Studio 4.6 Released」の抄訳です。 Qt Design Studio 4.6がリリースされまし...

Read more

Qt Design Studio 4.5.1 リリース!

本稿は「Qt Design Studio 4.5.1 Released」の抄訳です。 素敵なお知らせ!Qt Design Studioの最新...

Read more