You can be a great designer with amazing creativity, if you don’t find the right tools you might be limiting yourself. Check out these 10 tools that will help you to become a more efficient designer.
1. Color Scheme Designer
A very practical tool if you lack inspiration for your next design’s color scheme. Pick a starting color from the color wheel, then chose among different kind of combinations: mono, complement, triad,… You can then refine your colors by using the adjust scheme tab under the color wheel.
There are many color scheme tools available online, but I still chose to feature Color Scheme Designer for several reasons. First, you don’t need to create an account, so you gain a bit of time by going straight to scheme creation. The app is also helping you to create colorblind friendly schemes by letting you test your scheme with various vision types. Web designers will also enjoy the “light page / dark page example” feature, which gives you a preview of a template using your chosen color scheme. At last but not least, exporting in various formats is just one click away.
The main interface
A light page preview of the color scheme
2. Adobe Browser labs
Firefox, Chrome and Safari are great web browsers that try to implement HTML and CSS specifications quite quickly. Unfortunately, not all browser vendors comply with those specifications (I’m looking at you Internet Explorer), thus you have to hack your way to a good display of your website.
Adobe Browser lab is the perfect tool to thoroughly test your website for display bugs. You will need to have an Adobe account to use the service, but it’s still free. Usage is very straightforward, simply chose which browsers you want to test and enter your URL. Voilà!
3. Five Second Test
Fine tune your web pages by letting other analyzing the most prominent elements of your design. Your website’s visitors are not willing to wait to find stuff, that’s why testing your website with a very short time span is the way to go. Five Second Test is a paid app, but you can use the community edition for free by contributing with reviews.
4. Prefixr
Create cross-browser CSS3 in seconds with Prefixr. This little tool adds the browser vendor specific prefixes to make your CSS work in different browsers.
5. Onotate
The perfect tool to collaborate with your clients. For $15 a month, you can upload your concepts, annotate them with your client, and get it approved (or not).
6. Page Speed Online
There are some excellent Firefox extensions that do a great job at this, but if for some reason you don’t want to bother installing it, Page Speed Online is the tool for you. Just enter one URL and it will analyze your page speed, telling you where there is room for improvement.
7. Sneakpeekit
Actually Sneakpeekit is not an application, but a very useful set of templates to sketch your mockups. A must-have for web designers who enjoy sketching by hand.
8. Typecast
A tool to design better web typography easily. With Typecast you’ll get access to thousands of web fonts, try out font combinations, build baseline grid quickly, and refine typographic details. It’s still free while in beta, so try it out.
9. CSS Button Maker
Brought to you by CSS Tricks, this little tool will let you create CSS buttons quicker than ever. Sliders are used to change the size or the rounding of the corners, color pickers are there to let you change the color scheme.
10. Connect a Sketch
Do you like to sketch your website mockups by hand but want to add some interactivity? That’s exactly what Connect a Sketch does.
About the Author
Mirko Humbert
Mirko Humbert is the editor-in-chief and main author of Designer Daily and Typography Daily. He is also a graphic designer and the founder of WP Expert.
