{"id":26488,"date":"2016-05-19T23:01:14","date_gmt":"2016-05-19T15:01:14","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=26488"},"modified":"2022-08-24T18:56:11","modified_gmt":"2022-08-24T10:56:11","slug":"free-wireframing-kits","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/","title":{"rendered":"10 Free Wireframe Kits For UI Designers"},"content":{"rendered":"

As a designer, you will pass through several steps while you work on your project, from designing your ideas on paper, through creating wireframes, to finally refining your prototype<\/strong>. If you have many projects, it will take some time to make everything from scratch for each.<\/p>\n

In this post we collected 10 wireframe kits that can assist you in the wireframing process<\/strong>. By using these kits, you can work faster and more effectively, and from now on, you can also kickstart your project and speed up your UX design workflow<\/strong>.<\/p>\n

Read more: <\/strong>5 apps that do prototyping better than Photoshop<\/a><\/p>\n

Material Design Wireframe Kit<\/a> <\/h2>\n

This Material Design Wireframe Kit<\/strong> has become so massive a compilation, the creator has to host it on a Dropbox to make it available for all.<\/p>\n

So far, there are 41 screens<\/strong> provided, including the contact screen, e-Commerce, text content, page settings, and more. Download the Sketch file here<\/a>.<\/p>\n

\"Material<\/a><\/figure>\n

Moon wireframe kit<\/a> <\/h2>\n

Here are 50 screens<\/strong> that are ready for use in your next app design project.<\/p>\n

The kit contains splash screens, login and signup elements, menu, setting, feed gallery, item details and more.<\/p>\n

This awesome kit made by George Frigo<\/a>. The files available on Sketch<\/strong> and the zipped file can be downloaded here<\/a>.<\/p>\n

\"Moon<\/a><\/figure>\n

Mobile Wireframe Kit<\/a> <\/h2>\n

The Mobile Wireframe Kit<\/strong> contains the most commonly used UI element in mobile app design, consisting of 20 screens <\/strong>and 50 mobile UI elements<\/strong>.<\/p>\n

The screens such as \u201cSign Up\u201d,\u201dCreate Account\u201d, \u201cWalkthrough\u201d, \u201cProfile Page\u201d, \u201cDashboard\u201d, among others will help you quickly start your app design. Download the Sketch 3 <\/strong>file here<\/a>.<\/p>\n

\"Mobile<\/a><\/figure>\n

Carbon Material Wireframe Kit<\/a> <\/h2>\n

Carbon<\/strong> is great wireframe kit using Material Design, designed for use on your next mobile e-Commerce app.<\/p>\n

It contains 15 e-Commerce screens <\/strong>and over 30 elements<\/strong> in a separate file, as well as layers and the Roboto font included. You can download this kit in Photoshop<\/a> and Sketch<\/a> or get it in a bundle<\/a>.<\/p>\n

\"Carbon<\/a><\/figure>\n

Flowchart Kit<\/a> <\/h2>\n

This wireframe kit helps designers to quickly show clients the interaction between pages and works well for quick zoning and sitemaps.<\/p>\n

The kit includes assets like arrows and symbols <\/strong>too but doesn\u2019t come with the Google free font Open Sans<\/a>, which you should get first before opening the kit.<\/p>\n

Download the Sketch file here<\/a>.<\/p>\n

\"Flowchart<\/a><\/figure>\n

Snap Kit<\/a> <\/h2>\n

If you want to build an app for iOS 8, then Snap Kit<\/strong> is the right wireframing tool for you.<\/p>\n

It contains 22 mockups and even more elements that you can customize and use for your app design mockup. Snap is available on Sketch<\/strong> format. Download this kit here<\/a>.<\/p>\n

\"Snap<\/a><\/figure>\n

Apple Watch Wireframe Kit<\/a> <\/h2>\n

This wireframe is specifically designed for app that are built for the Apple Watch<\/strong>. It is in AI<\/strong> format.<\/p>\n

Included in the kit are the following: 20 minimal watch screens, components, size guidelines, and a Apple Watch mockup. You can download the kit here<\/a>.<\/p>\n

\"Apple<\/a><\/figure>\n

FlowiOS Wireframe Kit<\/a> <\/h2>\n

Here is clean wireframe kit for an iOS app made by Vineet Kumar<\/a>. It features sidebar menus, gallery, feature page for products, cart, settings page and more.<\/p>\n

You can download the Sketch<\/strong> file contains of 12 screens<\/strong> to kickstart your app design. Download the Sketch file here<\/a>.<\/p>\n

\"Flow<\/a><\/figure>\n

Platforma Ultimate Wireframe Kit<\/a> <\/h2>\n

The Platforma Ultimate Wireframe Kit<\/strong> gives you 20 wireframe layouts<\/strong> in 4 categories, headers, contents, features <\/strong>and footers<\/strong> for free.<\/p>\n

The files come in three formats: Photoshop, Adobe Illustrator, and Sketch. The full version<\/a> of the kit contains more than 200 layouts, and is available for $68. Download the free version here<\/a>.<\/p>\n

\"Platforma<\/a><\/figure>\n

Wireflows <\/h2>\n

Lingo<\/strong> is set of mini web wireframes to help designers with mappped out user workflows<\/strong> on an app.<\/p>\n

With this kit you can can design prototypes faster. However, you need to use the Lingo<\/a> app<\/strong> to open the files, which in turn requires Mac OS X 10.10+<\/strong> to work.<\/p>\n

\"Lingo<\/a><\/figure>","protected":false},"excerpt":{"rendered":"

As a designer, you will pass through several steps while you work on your project, from designing your ideas on paper, through creating wireframes, to finally refining your prototype. If you have many projects, it will take some time to make everything from scratch for each. In this post we collected 10 wireframe kits that…<\/p>\n","protected":false},"author":141,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3395],"tags":[1732,1731],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"\n10 Free Wireframe Kits For UI Designers - Hongkiat<\/title>\n<meta name=\"description\" content=\"As a designer, you will pass through several steps while you work on your project, from designing your ideas on paper, through creating wireframes, to\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"10 Free Wireframe Kits For UI Designers\" \/>\n<meta property=\"og:description\" content=\"As a designer, you will pass through several steps while you work on your project, from designing your ideas on paper, through creating wireframes, to\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2016-05-19T15:01:14+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-08-24T10:56:11+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/free-wireframing-kits\/material-wireframe-v2.jpg\" \/>\n<meta name=\"author\" content=\"Agus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@bagusdesain\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Agus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/\"},\"author\":{\"name\":\"Agus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/b23dad06815dff0bcc222088bed549dd\"},\"headline\":\"10 Free Wireframe Kits For UI Designers\",\"datePublished\":\"2016-05-19T15:01:14+00:00\",\"dateModified\":\"2022-08-24T10:56:11+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/\"},\"wordCount\":620,\"commentCount\":3,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/free-wireframing-kits\\\/material-wireframe-v2.jpg\",\"keywords\":[\"prototyping\",\"wireframing\"],\"articleSection\":[\"UI\\\/UX\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/\",\"name\":\"10 Free Wireframe Kits For UI Designers - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/free-wireframing-kits\\\/material-wireframe-v2.jpg\",\"datePublished\":\"2016-05-19T15:01:14+00:00\",\"dateModified\":\"2022-08-24T10:56:11+00:00\",\"description\":\"As a designer, you will pass through several steps while you work on your project, from designing your ideas on paper, through creating wireframes, to\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/free-wireframing-kits\\\/material-wireframe-v2.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/free-wireframing-kits\\\/material-wireframe-v2.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/free-wireframing-kits\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"10 Free Wireframe Kits For UI Designers\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/b23dad06815dff0bcc222088bed549dd\",\"name\":\"Agus\",\"description\":\"Agus is a music enthusiast, backpacker and code writer. He has an ambition to build a Skynet on top of HTML and CSS.\",\"sameAs\":[\"https:\\\/\\\/x.com\\\/bagusdesain\"],\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/agus\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"10 Free Wireframe Kits For UI Designers - Hongkiat","description":"As a designer, you will pass through several steps while you work on your project, from designing your ideas on paper, through creating wireframes, to","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/","og_locale":"en_US","og_type":"article","og_title":"10 Free Wireframe Kits For UI Designers","og_description":"As a designer, you will pass through several steps while you work on your project, from designing your ideas on paper, through creating wireframes, to","og_url":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2016-05-19T15:01:14+00:00","article_modified_time":"2022-08-24T10:56:11+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/free-wireframing-kits\/material-wireframe-v2.jpg","type":"","width":"","height":""}],"author":"Agus","twitter_card":"summary_large_image","twitter_creator":"@bagusdesain","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Agus","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/"},"author":{"name":"Agus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/b23dad06815dff0bcc222088bed549dd"},"headline":"10 Free Wireframe Kits For UI Designers","datePublished":"2016-05-19T15:01:14+00:00","dateModified":"2022-08-24T10:56:11+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/"},"wordCount":620,"commentCount":3,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/free-wireframing-kits\/material-wireframe-v2.jpg","keywords":["prototyping","wireframing"],"articleSection":["UI\/UX"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/","url":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/","name":"10 Free Wireframe Kits For UI Designers - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/free-wireframing-kits\/material-wireframe-v2.jpg","datePublished":"2016-05-19T15:01:14+00:00","dateModified":"2022-08-24T10:56:11+00:00","description":"As a designer, you will pass through several steps while you work on your project, from designing your ideas on paper, through creating wireframes, to","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/free-wireframing-kits\/material-wireframe-v2.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/free-wireframing-kits\/material-wireframe-v2.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/free-wireframing-kits\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"10 Free Wireframe Kits For UI Designers"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/b23dad06815dff0bcc222088bed549dd","name":"Agus","description":"Agus is a music enthusiast, backpacker and code writer. He has an ambition to build a Skynet on top of HTML and CSS.","sameAs":["https:\/\/x.com\/bagusdesain"],"url":"https:\/\/www.hongkiat.com\/blog\/author\/agus\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-6Te","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/26488","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/141"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=26488"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/26488\/revisions"}],"predecessor-version":[{"id":61979,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/26488\/revisions\/61979"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=26488"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=26488"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=26488"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=26488"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}