Help
Academy
  • INTRODUCTION
  • About Reasy
  • Why Choose Reasy?
  • User Registration
  • Invite & Manage Users
  • GETTING STARTED
    • Create Your First App
    • App Dashboard
    • Workspace
      • Engine Explorer
      • Navigation Explorer
      • Canvas
      • Tools
        • Screen Components
          • Input Elements
          • Containers
          • Texts
          • Buttons
          • Charts
          • Grids
          • Cards
          • Files & Images
          • Custom Components
          • Pre-built Screens
        • Custom Screen Components
        • BPMN Components
        • Data-Driven Plugins
          • Data Sources
            • SQL Plugin
            • Session Plugin
            • MakeServerURL
            • PrivatePDM
            • Logout
            • MethodInvoker
            • UMPlugin
            • APIConsumer
            • EmailReaderPlugin
            • FileReaderPlugin
            • FileWriterPlugin
            • FileDownloadPlugin
            • FileUtils
            • PropertyReader
            • DateUtils
            • JsonUtils
            • JoinPlugin
            • EncryptDecrypt
            • StringUtils
          • Data Display
          • Business Tools
      • Property Editor
        • General Properties
        • Design Properties
    • Engines
      • Screens
        • Responsive Grid System
        • Building App Layout
        • Building Screens
        • Creating Pop-up Screens
        • Events and Actions
        • Importing Screens
          • Importing an HTML
          • Importing a Figma Screen
          • Importing a PDF
          • Importing a Screenshot
          • Importing a Hand-drawn Sketch
          • Text to Screen
        • Manage Screens
      • Data Modeler
        • Setting up a Data Source
        • Creating a Model
          • Adding Computational Formula
          • Adding Validations
        • Importing a Data Model
        • Entity Relationships
        • Exporting a Data Model
      • APIs
        • A Step-by-Step Guide to Build an API
        • Creating an API Service
        • API Configuration
        • Publishing API
        • API Authentication
        • Consuming REST APIs
        • Manage API Services
      • Navigation
        • Layout Setup
        • Creating Microapps
        • Manage Microapps
      • Page
      • Workflow
        • Creating Workflows
        • Workflow Templates
        • Optimizing Complex Workflows
        • Manage Workflows
      • User Management
        • Users
        • Roles
        • Policies
        • Password Policies
        • Data Rules
      • Resources
      • Languages
        • Translating App Language
        • Manage Languages
    • App Management
Powered by GitBook
On this page

Was this helpful?

  1. GETTING STARTED
  2. Engines
  3. Screens
  4. Importing Screens

Importing a Hand-drawn Sketch

PreviousImporting a ScreenshotNextText to Screen

Last updated 1 year ago

Was this helpful?

This feature lets you convert your hand-drawn sketches into screens. Upload your hand-drawn sketch, and with just a click of a button, your screen will be ready.

To get started, take a picture of your hand-drawn sketch and save it as a PNG, JPG, or JPEG image. Import the image, and the platform will convert it into a fully interactive and responsive web page with pixel-perfect accuracy. This efficient process eliminates the need to manually code and design each element from scratch, speeding up your development process significantly.

Here's how to import a hand-drawn sketch:

  • Expand the layout where you want to import the sketch, go to Screen, right-click '', and select Import Hand-drawn Sketch.

  • Choose or drag the sketch in PNG/JPEG/JPG format from your local storage, and then click Import.

  • The platform uploads it and provides a sketching guide. Scroll down to go through the sketching guide. Make sure you follow the guide, as the platform can understand the elements only if they are drawn in a specific way, as demonstrated in the guide.

  • Then, using a few Machine Learning (ML) algorithms, Reasy intellectually identifies the elements in the sketch and tags them with the appropriate tools.

In case you find any element is tagged inappropriately or left untagged, you can manually tag it.

  • Once you confirm that the elements are tagged correctly, proceed with creating the screen.

Then, open the screen, and make the necessary changes if needed.