A free and open source wireframing kit made for draw.io (https://www.draw.io/)
There are various ways to use the PWK with draw.io:
- Simply click on this link: https://bit.ly/2LpMMKi
- Clicking on it will open and install the PWK libraries in draw.io
- Make sure to clear your default style in draw.io before using the PWK (Ctrl + Shift +R)
Or just use one of the libraries:
- 00_Views: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F00_Views_v0-1.xml
- 01_Devices: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F01_Devices_v0-1.xml%20
- 02_Elements_Buttons: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F02_Elements_Buttons_v0-1.xml
- 02_Elements_Cards: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F02_Elements_Cards_v0-1.xml
- 02_Elements_Feedback_Notification_Toasts_Dialogs: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F02_Elements_Feedback_Notification_Toasts_Dialog_v0-1.xml
- 02_Elements_Forms: https://www.draw.io/?splash=0&clibs=Uhttps://raw.githubusercontent.com/puzzle/wireframe-kit/master/libraries/02_Elements_Forms_v0-1.xml
- 02_Elements_Placeholders: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F02_Elements_Placeholders_v0-1.xml
- 03_Navigation: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F03_Navigation_v0-1.xml
- 04_Icons: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F04_Icons_v0-1.xml
- 05_Avatars: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F05_Avatars_v0-1.xml
- 06_Colors: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F06_Colors_v0-1.xml
- 07_Typography: https://www.draw.io/?splash=0&clibs=Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2Flibraries%2F07_Typography_v0-1.xml
- Download the PWK libraries from this repo (or click on the link in the «Puzzle-Wireframe-Kit.xml»)
- Open draw.io and import the libraries via: file > Open Library from …
- Now you have our PWK-libraries available in your draw.io (in the panel on the left).
- Open the PWK collection directly in draw.io with this link: https://www.draw.io/?splash=0#Uhttps%3A%2F%2Fraw.githubusercontent.com%2Fpuzzle%2Fwireframe-kit%2Fmaster%2FPuzzle-Wireframe-Kit.xml
- Or you can also download the file «Puzzle-Wireframe-Kit.xml» and open it manually with draw.io
- First unlock the layer «Kit»
- Then, you can copy an element and paste it in your own draw.io file
- You can also download the file «Puzzle-Wireframe-Kit.xml» and open it manually with draw.io
- First unlock the layer «Kit»
- Then, you can copy an element and paste it in your own draw.io file
Make sure to clear your default style before using the PWK (Ctrl + Shift +R)
We also have Puzzle Brand libraries (logos, icons, colors, infographics) for draw.io.
- Simply click on this link: https://bit.ly/2CNomI0
- Clicking on it will open and install the PWK libraries in draw.io
- Make sure to clear your default style in draw.io before using the PWK (Ctrl + Shift +R)
Our infographics-library is based on the one from draw.io: https://t.co/FgbJUR3EIx
We published the PWK with a CC-licence (Attribution-ShareAlike 4.0 International, CC BY-SA 4.0). You are free to use any of the shapes/elements in the PWK for commercial use.
But if you change the PWK itself, you have to publish your version of the kit with the same licence again and make it open source.