Getting Started

Typically, you as a designer would design a UI using imaging and design tools, such as Adobe Photoshop, Sketch, Blender, or Maya, and then send your design to a developer for implementation. With the Qt Bridge export tool, you can convert 2D assets into Qt Quick files. You can use the export functionality of 3D graphics tools to save your 3D assets in a format supported by Qt Design Studio. You can import the 2D and 3D assets into Qt Design Studio for editing, before you submit the UI to the developer for adding the functionality to the application.

The following image describes the workflow using Qt Bridge for Adobe Photoshop and Qt Design Studio:

The workflow consists of the following steps:

  1. Export your design from a design tool.
  2. Create a project in Qt Design Studio and import your design to it.
  3. Create reusable components in the Design mode.
  4. Animate your design with the transition editor or timeline and easing curve editor.
  5. Create interactions using states and connections.
  6. Preview your design in real time, on the desktop or on a mobile or an embedded device.

For more information, watch a video that shows how to perform the tasks above:

First Steps

The following topics contain information that you'll need to find your way around Qt Design Studio:

  • Exporting from Design Tools

    Describes how to export designs containing 2D and 3D assets into files that you can import to projects in Qt Design Studio.

  • User Interface

    Describes the parts and basic features of Qt Design Studio.

  • Design Views

    Describes the views and basic features of the Design mode. This is where you'll do most of your work.

  • Tutorials

    Describes how to use Qt Design Studio to create a simple animated UI with some basic UI components, such as pages, buttons, and fields. Some of the buttons can be used for moving between the pages.

  • Qt Quick Best Practices

    Describes how to create UIs that work efficiently on the intended platforms.

Available under certain Qt licenses.
Find out more.