2018-10-04 13:47:55 +00:00
|
|
|
---
|
|
|
|
|
title: Designer Tools
|
|
|
|
|
---
|
|
|
|
|
## Designer Tools
|
|
|
|
|
|
|
|
|
|
In this section, we'll have guides to a wide variety of tools used by designers.
|
|
|
|
|
|
2019-04-01 19:00:37 +00:00
|
|
|
### UI - Great for static content.
|
2018-10-04 13:47:55 +00:00
|
|
|
|
|
|
|
|
[Sketch](https://www.sketchapp.com) - [Guide](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/sketch/index.md)
|
|
|
|
|
|
|
|
|
|
[Adobe Photoshop](http://adobe.com/Photoshop) - [Guide](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/photoshop/index.md)
|
|
|
|
|
|
|
|
|
|
[Adobe Illustrator](http://adobe.com/Illustrator) - [Guide](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/illustrator/index.md)
|
|
|
|
|
|
|
|
|
|
[Figma](https://www.figma.com) - [Guide](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/Figma/index.md)
|
|
|
|
|
|
2019-04-01 19:00:37 +00:00
|
|
|
### Interaction - Better for complicated interactions.
|
2018-10-14 02:28:11 +00:00
|
|
|
|
|
|
|
|
[Adobe Experience Design](www.adobe.com/products/experience-design.html) - [Guide](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/Experience-design/index.md)
|
|
|
|
|
|
2018-10-04 13:47:55 +00:00
|
|
|
[Framer](https://framer.com) - [Guide](https://github.com/freeCodeCamp/guides/blob/master/src/pages/designer-tools/framer/index.md)
|
|
|
|
|
|
2019-04-01 19:00:37 +00:00
|
|
|
### Wireframes and prototyping - Ideal for click-through prototypes.
|
2018-10-14 02:28:11 +00:00
|
|
|
|
|
|
|
|
[InVision](https://www.invisionapp.com/)
|
|
|
|
|
|
|
|
|
|
[Marvel](https://marvelapp.com/)
|
2018-10-11 23:00:38 +00:00
|
|
|
|
|
|
|
|
[Moqups](https://moqups.com/)
|
|
|
|
|
|
2019-04-01 19:00:37 +00:00
|
|
|
### Painting - Great for artists.
|
2019-04-01 18:29:22 +00:00
|
|
|
|
2019-04-01 19:00:37 +00:00
|
|
|
[Adobe XD] (https://www.adobe.com/products/xd.html)
|
2018-10-11 23:00:38 +00:00
|
|
|
|
2018-10-14 02:28:11 +00:00
|
|
|
[Clip Studio Paint](https://www.clipstudio.net/en)
|
2018-10-11 23:00:38 +00:00
|
|
|
|
2018-10-14 02:28:11 +00:00
|
|
|
[Krita](https://krita.org/en/homepage/)
|
2018-10-11 23:00:38 +00:00
|
|
|
|
2018-10-14 02:28:11 +00:00
|
|
|
[MediBang Paint](https://medibangpaint.com/en/)
|
|
|
|
|
|
|
|
|
|
[Autodesk Sketchbook](https://www.sketchbook.com/)
|
2018-10-04 13:47:55 +00:00
|
|
|
|
2018-10-14 02:28:11 +00:00
|
|
|
## Plug-ins
|
2019-04-01 19:00:37 +00:00
|
|
|
### Chrome
|
|
|
|
|
- [Sizzy](https://sizzy.co/)
|
|
|
|
|
- Responsive web design testing site.
|
|
|
|
|
- [Checkbot](https://www.checkbot.io/)
|
|
|
|
|
- Tool to find dead or broken links, duplicate titles, and more.
|
2018-10-14 02:28:11 +00:00
|
|
|
|
2019-04-01 19:00:37 +00:00
|
|
|
### Firefox
|
2018-10-04 13:47:55 +00:00
|
|
|
- [Color Picker](https://addons.mozilla.org/en-us/firefox/addon/colorzilla/?src=collection&collection_id=90e68e6a-f13f-5921-3412-5228262ca9db)
|
|
|
|
|
- [React Developer Tools](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/)
|
2019-03-21 10:51:26 +00:00
|
|
|
|
|
|
|
|
### For Chrome
|
|
|
|
|
|
|
|
|
|
In this section, you can see popular Chrome plug-ins used by designers.
|
|
|
|
|
|
|
|
|
|
- [ColorZilla](https://chrome.google.com/webstore/detail/colorzilla/bhlhnicpbhignbdhedgjhgdocnmhomnp)
|
