26 Useful Tools, Apps and Resources for Developers – A Little Bit of Everything

Jun
1

One Comment - LEAVE A COMMENT

There are moments when you are working on a project, when you realize that you just aren’t the best at everything. Or you hit a roadblock. Or you just need a little assistance. It might be choosing a color palette, creating an certain icon or creating the perfect background pattern. Everyone could use a little help now and then.

This is by no means a comprehensive list on each topic, but places that I have found the resources I’ve needed on several occasions that are alternatives from my normal methods.

I’ve gathered some of my favorites below:

Mockups & Prototypes

Cacoo - Free Online Wireframing

Cacoo

Cacoo – What is that old saying? If you fail to plan, you plan to fail? Well, Cacoo helps you take steps towards planning allowing you to create wireframes/mockups, diagrams, layouts, and more – and to start it is free! It’s a browser-based app, fully upgradeable to a paid version and you can share your diagrams easily.

MockFlow - Online Wireframing Free

MockFlow

Mockflow – “MockFlow is an online tool to design and collaborate User Interface mockups for websites and software.” Like Cacoo this is an (free) online collaborative tool that allows you to create awesome wireframes. One alternative benefit? “MockFlow is hybrid, so you can design seamlessly from anywhere & even with no net-connection.”

Text/HTML/Image Generators

lorempixum - placeholder image generator

lorempixum

lorempixum – Every developer needs placeholder images at some point. lorempixum generates images at any size and allows you to download and use those images, or you can direct link to the category and have images dynamically placed based on size. Choose the size, type and whether you would like a color or grayscale image.

Blind Text Generator - Dummy Text Generator

Blind Text Generator

Blind Text Generator – I get tired of seeing the same old lorem ipsum every time I’m working on a new design, or coding a new site. This generator allows you select a type of dummy text and preview it and will provide the text for you, pre-wrapped in the <p> tags.

malevole - Text Generator

malevole - Text Generator

malevole – Another option to the same old boring lorem ipsum, malevole will allow you to generate 1 to 5 paragraphs of completely random (and I mean completely random) text. Downside? No way to control the size of the paragraphs or the total character limit in general.

More dummy content generators

  • HTML-Ipsum – Every developer needs this. A wonderful assortment of HTML elements that you will need to test each time you develop a new website.
  • Dynamic Dummy Image Generator – Easy to use completely configurable image generator. Although, unlike lorempixum it doesn’t allow you to use images of things. It will dynamically generate you a static image with the size info. It does allow you to choose which file format you want.

Color

I am not going to go overboard with this topic, since I have a whole slew of color tools, inspiration and resources in a previous article on this very subject: 17 great color resources, but I definitely want to shout out my two favorites below:

COLOURlovers - Color Palettes

COLOURlovers

COLOURlovers – I think I’ve said this a million times over, but I love COLOURlovers. Not only is it a wealth of information on color with resources, articles and inspiration – it is also a social community where you can generate and name your own colors, generate and name palettes and patterns, or just find the perfect color/palette for your project that someone else has created.

kuler - color palette generator

kuler

kuler – is Adobe’s brainchild – and while it doesn’t have as many resources/articles as COLOURlovers it does have tons of sweet palettes to browse through, or you can generate your own.

Patterns and Textures

pixelknete - dotted background generator

pixelknete

Dotted Background Generator – A pretty neat little generator that allows you to create a “dotted” background. Choose the height of the dot fade and pick up to two background colors (should you want a gradient effect) and up two dot colors and this site will generate the background for you. It doesn’t give you a link to the image though, you will have to right-click and choose view background image to grab the image you have generated.

Background Labs - Free Backgrounds and Patterns

Background Labs

Background Labs – Hundreds of free backgrounds and patterns. Nice resource alternative if you have exhausted other avenues. “Background Labs feature a wide variety of Photoshop backgrounds, patterns, textures and graphics for use in customizing your Twitter profile, blogs and websites.

Free PSD Files

365psd - Free PSD files

365psd

365psd – Forms, buttons, illustrations, icons, layouts… 365psd provides you with absolutely free psd files each day of a random item. Great for those who need inspiration or a starting point, who aren’t good at design or who learn by example.

dribbble - free design items

dribbble

dribbble and forrst are fantastic inspirational & informational resources to begin with, and occasionally the wonderful designers provide the psds of their creations for free. Not only will you find PSDs, but also keep an eye out for fonts and other goodies. *note: this is using the search functions of each site for the term “free” so some items may not actually be free – but will probably be awesome anyway!

Analytics

  • Six Revisions has put together a nice list of some super awesome tools to use to track all sorts of user information from your site.
  • Woopra – I love Woopra. I have loved Woopra for about three years now. You have the ability to track your visitors, search queries, referals, and more for free (limited # of pageviews monthly – upgrade options available). I wrote a love-letter/review of Woopra a few years back :D

CSS3 Generators

css3playground - css generator

css3playground

CSS3 Playground – Great place to get the CSS3 effects your are looking for. Interactive site that allows you to see your effects as you go, and generates the CSS code for you.

css3 generator

css3 generator

css3 generator – Nifty generator that has options for generating awesome CSS3 effects.

CSS3 Maker

CSS3 Maker

CSS3 Maker – Another generator a lot like CSS3 Generator, but has the compatibility options of each item for each browser and mobile options. The generator is a little less robust than CSS3 Generator.

A little bit of everything else

  • PDFmyURL – This website allows you to put in any URL and it will generate PDF of the content for you. I tried it out on a few sites (including my own) and it worked very well.
  • Lettering.js – A sweet little jQuery plugin that allows you “complete down-to-the-letter control“.
  • tooltipsy – Another awesome jQuery plugin for tooltips that takes the trouble and frustration out of most tooltip plugins and allows you complete control over the CSS, animation and position.
  • +1 from google – I just seen that this launched when google mentioned it today on twitter. Kind of like the “like” function of facebook, but this is connected to your google account.
  • xmarks – When I was a full-time firefox user I used this extension all the time as I had to work on three different computers. This almost seamlessly synchronized all my booksmarks between computers.
  • Instapaper – I run into so many great resources, articles and links daily either through my RSS feed, newsletters or twitter and a lot of times I don’t have a chance to read them. I used to leave tabs open praying my browser wouldn’t eat them, but this is such an easy way to save those items to read later on.
  • Favicon.cc – Import an image or draw your own – this generator does the work for you in creating a favicon for your site.

Jump to Comments

One Response to 26 Useful Tools, Apps and Resources for Developers – A Little Bit of Everything

  1. Willem says:

    Thank you for all these tools.

    Love the website

Leave a Reply

Your email address will not be published. Required fields are marked *