Thursday, August 1, 2013

Fresh Resources for Web Designers and Developers – August 2013

August is here so it’s time for another round up!



In this round, we have some great tools from a Photoshop action that creates 3-dimensional maps, an awesome Google Chrome extension for testing out responsive design, and a tool to create Long Shadow designs. Here they are, in no particular order.


Source Tree


SourceTree is a client app for Github and Mercurial version control system. It allows you to manage your repositories in a very simple and intuitive User Interface. It is the perfect app for people who are not comfortable of doing Version Control through Command line.



tmTheme Editor


tmTheme is a theme file for syntax highlighting for code editors like Sublime Text and TextMate. There are several .tmTheme available to download for free, and ready for use if you want to change your code highlighting colors. But, if you want it to be more personalized, you can use tmTheme Editor from Herokuapp, which makes creating and editing much easier.



Colour Code


There are a lot of tools for generating color schemes on the Web. Here’s one more. Colour Code is a very intuitive and easy to use web-application for generating color scheme. Simply move the mouse cursor and it will instantly generate the colors on the specified rule — Monochrome, Analogic, Complement, Triad, etc. We can also download the color scheme in LESS format and PNG.



Long Shadow Generator


In our previous article, we have shown you some examples of Long Shadow design applications. Now if you want to apply the same effect, this PSD file will allow you to apply this shadow effect in your design element much quicker.



Dimension


Dimension is a really nice Google Chrome extension for testing your responsive design without having to resize the browser window. It comes with ruler showing the viewport size, a draggable handle to resize the viewport size, and Preview Mode to simulate the design in various device type.



Mapita


Mapita a Photoshop action that lets you turn your flat layers into 3-dimensional map. It comes with several common map elements like Grass, Snow, Buildings, Trees, and Clouds. This Photoshop Action is created by Wassim at BlueGraphic, and it is free!



Buttons


Creating Web buttons is technically easy, but it would be better if we can build one real quick. Buttons is a collection of class helpers that allows us to do so. It provides a set of CSS to build various button styles. It is built using Sass and Compass, so the styles are completely configurable to meet your requirements.



Fontastic


There are a lot of font icons available for free, but they usually come with a bunch of icons that we do not need. By using Fontastic you can include only the icons you need, eventually helping to speed up your website. At the time of the writing, it has more than 1700 of icons.



Dev Tools Secret


All modern browsers come with its own Dev Tool that helps developers develop and debug the website. But there are so many more buried features that we do not know of. The Dev Tools Secret, as the name implies, lists the hidden features of the browser’s Dev Tool.



Popular UI


I bet that you have visited either one of these popular website design Singapore; Facebook, Rdio, Github, and Apple. The Popular UI is a collection of these website design Singapore’ user interface, which is rebuilt by Luke Chesser in Photoshop for educational purpose. You can learn how the layers are structured and organized, and also see how the effects are built. It’s a very useful resource for beginners especially.









    







Fresh Resources for Web Designers and Developers – August 2013

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.