App Templates in Visily

App Templates in Visily

This article explains what App Templates are in Visily and how to use them to speed up your design workflow.

What App Templates are

App Templates are sets of screens arranged in a meaningful flow to represent a complete application type. Examples include a meditation app, an e-commerce website, a CRM tool, and more.

How to access App Templates

You can access App Templates from the Template Dialog. To open it:
  1. Select Add new → Wireframe templates, or press W

  2. Or access from the Templates tab in the Wireframe Library

In the Template Dialog, App Templates are available under the Apps tab.   

How to use App Templates

  1. Open the Template Dialog and go to the Apps tab. 
  2. Browse the available App Templates to find one that fits your needs. When browsing app templates, you can:
    1. Use the search bar to find templates by keyword.

    2. Use the Web/Mobile toggle to filter templates by screen type.

    3. Use the navigation arrows on the thumbnail to quickly review the included screens.

    4. Click a template thumbnail to open the full list of screens included in that app template.

      After clicking to view the screens included in an app template, you can preview each screen individually, just like when browsing UI Screen Templates.
  3. Choose how you want to add it:
    1. Click Add on the thumbnail to add the full app template

    2. Click Add all screens from the screen listing to insert every screen at once

    3. Or add only selected screens if you do not need the full set 

  4. Once the screens are added to your board, start editing them to match your product and design needs.

Notes

  1. App Templates are different from UI Screen Templates. Screen Templates are individual screens, while App Templates are grouped sets of screens designed to represent a complete application type. 
  2. Using App Templates deducts Template Credits once they are added to the board. The credit cost is based on the number of screen templates included, at 30 credits per screen.
  3. The search bar in the Template Dialog works across tabs. You can search from Screens, Apps, Flows, or Diagrams, and the results will appear across all tabs, so you can find and insert what you need more quickly.

  4. If you cannot find the template you need, try searching other Visily design libraries first. If you already have a reference design, you can also import it using the Visily browser extension or from Figma. You can also choose Generate with AI and let Visily AI create a design for you instead.

Need more help?
If this does not solve your issue, contact support and include a screenshot if possible.
    • Related Articles

    • Flow Templates in Visily

      This article explains what Flow Templates are in Visily and how to use them to speed up your design workflow. What Flow Templates are Flow Templates are sets of screens grouped into common UX patterns that appear across many products and ...
    • Component Templates in Visily

      This article explains what Component Templates are in Visily and how to use them to build designs faster. What Component Templates are Component Templates are ready-made UI building blocks that help you add detail to your design without creating ...
    • Diagram Templates in Visily

      This article explains what Diagram Templates are in Visily and how to use them to create diagrams faster. What Diagram Templates are Diagram Templates are premade templates for common diagram, planning, and brainstorming use cases. In Visily, they ...
    • UI Screen Templates in Visily

      This article explains what UI Screen Templates are in Visily and how to use them to speed up your design workflow. What UI Screen Templates are UI Screen Templates are prebuilt screen designs you can add to your board as a starting point. In Visily, ...
    • How to import designs from Figma into Visily

      This article explains how to import Figma designs into Visily using the Visily plugin for Figma. You can bring your designs into Visily by copying them directly or by exporting them as a `.vis` file. Once imported, your Figma designs become editable ...