Using Wireframe Scanner

Convert your hand-drawn wireframe into a digital design in seconds

Updated over a week ago

About wireframe scanner

Who can use this feature? ๐Ÿง™

Wireframe Scanner offers automatic hand-drawn wireframe conversion into an editable Uizard prototype! This is one of the most magical AI features we offer โœจ
โ€‹
If you're interested in hand-drawn wireframe transformation to a digital design/prototype, this is a perfect guide for you! ๐Ÿš€


About wireframes

Learn all about how to sketch and upload a wireframe to Uizard by watching our walkthrough video below, or continuing on to read this article!

In Uizard, when we say 'hand-drawn wireframe' we refer to low-fidelity user interfaces that are sketched on paper simply by using a pen.
โ€‹
So the 'hand-drawn wireframe' could be successfully uploaded to your Uizard project, it's important to follow sketching guidelines.

Find some examples of hand-drawn wireframes below:

d04a4039-5e88-4e5b-87ad-0303ce339052.jpg
5a33dc81-b808-4f6a-b2f2-66deab01f138.jpg
4868f036-3d4d-4df7-91f3-a1e90c67628e.jpg
64dc7d8a-214a-4f8a-b238-2f3bc1287e7e.jpg

Uploading a wireframe

1) Got to your project and click on the 'How can I help you?' menu at the bottom:


โ€‹2) Select 'Generate a screen':

3) Click on 'Wireframe':

4) Select which device-type you'd like the generated screen to be:

5) Drag and drop the image into the blue field or click on it to upload a file:

6) Click on 'Use in design' to use the new screen or click 'Make changes' to start over:


Using a tablet to draw wireframes

You can utilize your tablet to draw your hand-drawn wireframes if you'd like!

You'd simply need to save your drawing as an image or take a screenshot of it and upload it to Uizard by following the regular procedure ๐Ÿ™Œ

Remember to follow the sketching guidelines ๐Ÿš€


Supported file formats for uploading

We currently support the upload of source image files in PNG, JPEG, or HEIC formats.

Did this answer your question?