SharedTutor | Tutorials For Everyone

Find your interesting tutorials in Get your tutorial about Computer, Blogging, Makemoneyonline, Games, Design, and more!

Fresh Resources for Web Designers and Developers – September 2013

Four months to look before we revisit another round of the latest year resolutions. In the meantime, let’s see precisely what is in store for September’s gather of fresh helpful information on designers and developers as if you.

In this list, we've got a Photoshop plugin that allows you to create a new open image format called WebP, an origin for free illustrations, and another free of charge hi-res photos, something that presents your app inside a device mockup without the use of Photoshop, and many other great resources.

Let’s check them out.


CSSComb is an instrument for sorting CSS properties in order that they are more organized, readable, and simple to maintain. You can set your personal rules on how it should sort the properties. CSSComb supports CSS3 and CSS Pre-processor - LESS and Sass. It is available as web tool, plus plugins for many code editors like Sublime Text, TextMate, Coda, and Notepad++.

Emmet LiveStyle

Tools including LiveReload lets us understand the changes we’ve built to our CSS, around the browser instantly. Emmet LiveStyle takes this procedure a step further via bi-directional live editing. That means we can do Live Editing both from within the browser as well as the code editor without the page refresh and file saving. Watch it for doing things in this video: Emmet LiveStyle sneak peak.

Read Also: How To Refresh Changes On Browser With Sublime Text

WebP Photoshop Plugin

Site developers are actually paying attention to high-definition image quality and it is impact on website loading performance. To address this situation, Google introduced a new open image format format called WebP. Compared to PNG and JPEG, WebP may be smaller by 26-39% while still maintaining the quality with the image.

A full listing of application and os that supports WebP image format are available here and here.


SVGeneration is often a patterns generator for SVG. As we have discussed within our previous post series, SVG is one from the way to visit to serve graphics for HD screens. And now with SVGeneration tool, developing a background pattern with SVG is made a lot easier. (And this is the most popular: Circle Everywhere).


There are many free PSD files to give your mobile app design or prototype inside a phone or tablet mockup. But, this means it requires Photoshop to work with the file as it is really a PSD. In the case where Photoshop isn't available, it is possible to use MockupPhone since your alternative. At the time from the writing, you are able to choose iPhone, iPad, Galaxy, Nexus, and Lumia mockup.


KoalaApp is often a GUI application for compiling LESS, Sass, Compass and CoffeeScript. Unlike Codekit (a similar application), which only runs on OS X, KoalaApp may be run on Windows, OS X and Linux.


Unsplash is really a collection of free HD images. The collections are very fantastic, also it can really provide a good influence on your design prototype look. So, if you are looking for great image Unsplash is one of the sites to look. Worth-bookmarking and checking it regularly since there will be 10 new hi-resolution photos every 10 days.


We see the trend in drinkng venues where photos are displayed in a box side-by-side or top-bottom in a single frame. TychPanel is surely an extension that permits you to do the ditto automatically in Photoshop. Even better, you are able to create your individual layout and boxes, adjust background colors, the width along with the height.

iOS7 Wireframe Kit for Illustrator

For some designers, they may choose Illustrator over Photoshop (or Fireworks) for creating an app design prototype. If you are normally the one, you almost certainly need this bookmarked and saved, iOS Wireframe for Illustrator.

Story Board Illustration

Julian Burford, a designer and illustrator from Netherland shared for longer than 430 illustrations in AI format that may be useful for creating sketches and storyboard. I can claim that this is one with the great free programs every designer should bookmark. Head over to his Dribbble page to download the file.

Related posts:

  1. Fresh Resources for Web Designers and Developers - August 2013

  2. Fresh Resources For Designers And Developers - January 2013

  3. Fresh Resources for Designers and Developers - March 2013

  4. Fresh Resources For Designers And Developers - May 2013

No comments

Post a Comment