Examples and Tutorials

In the Welcome mode, you can open examples and tutorials that illustrate how to use Qt Design Studio. Some examples are delivered together with Qt Design Studio and have been documented, while you can download and install others for previewing them on the desktop.

Video Tutorials

The Tutorials tab contains links to video tutorials that provide more information about Qt Design Studio. To watch a tutorial on YouTube, select it in the tab.

Qt Bridge for Adobe Photoshop Videos

For more information, watch a video tutorial and webinar about using Qt Bridge for Adobe Photoshop that are also accessible from the Tutorials tab of the Welcome mode:

  • Building an Instrument Cluster for Your Car HMI, Part 1

    You can access the Cluster tutorial source files in the Examples tab.

  • From Photoshop to Prototype with Qt Design Studio
Qt Bridge for Sketch Tutorials

For more information, read the tutorials about using Qt Bridge for Sketch that are also accessible from the Tutorials tab of the Welcome mode:

Examples for Downloading

The Examples tab lists complex example applications for downloading that demonstrate what you can accomplish with Qt Design Studio.

"Examples for download in Welcome mode"

To download the examples and open them in Qt Design Studio:

  1. Select an example.
  2. Select Start Download to download the example source files.
  3. Select the folder where the source files will be installed.
  4. Select Continue to install the files.
  5. Select Open to open the example in Qt Design Studio.
  6. Select the (Show Live Preview) button to preview the example.

Documented Examples

The Examples tab lists documented examples of using Qt Design Studio. To open an example in Qt Design Studio, select it in the tab.

Cluster Tutorial

Contains sources for the Cluster Tutorial videos.

Coffee Machine

Illustrates how to use the timeline and states to animate transitions in a UI.

E-Bike Design

Illustrates how to use the timeline and states to animate transitions in an application.

Log In UI - Part 1

Illustrates how to use wizard templates to create a simple UI that contains a text label, push buttons, and a logo.

Log In UI - Part 2

Illustrates how to position UI components on pages using anchors and positioners.

Log In UI - Part 3

Illustrates how to use states to create a second UI page.

Log In UI - Part 4

Illustrates how to use the timeline and states to animate UI components.

Optimal 3D Scene

Contains project files for the Optimal 3D Scene.

Progress Bar

Illustrates how to use timelines to create an animated progress bar.

Side Menu

Illustrates how to create reusable components and an animated menu for applying effects.

Washing Machine UI

Illustrates how to create a UI that can be run both on the desktop and on MCUs.

Webinar Demo

Contains sources for the From Photoshop to Prototype video tutorial.

Available under certain Qt licenses.
Find out more.