Designing Uis

Typically, you as a designer would create artwork in imaging and design tools, such as Adobe Photoshop, and then send it to a developer for adding it to the application. With the Qt Bridge export tool, you can convert your artwork into Qt Quick files. You can import the files 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 Adobe Photoshop and Qt Design Studio:

  1. Export your artwork from Adobe Photoshop to Qt Design Studio.
  2. Create a project in Qt Design Studio and import your artwork to it.
  3. Create reusable components in the Design mode.
  4. Animate your design with the 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.

If you would rather use Adobe Illustrator for creating artwork, you can copy-paste your assets to Adobe Photoshop as smart objects.

The following topics describe working in Adobe Photoshop:

  • Organizing Assets in Adobe Photoshop

    To get the best results when you use Qt Bridge to export designs from Photoshop to Qt Quick files, you should follow the guidelines for working with Photoshop and organizing your assets.

  • Exporting Designs from Adobe Photoshop

    You must install and set up the Qt Bridge export tool before you can use it to convert artwork into Qt Quick files that you can import to projects in Qt Design Studio.

© 2019 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.