Being on the web all day I tend to read a lot of design blogs and tech articles as lame as it may sound through these articles I daily find tools and experiments in code that really keep me fired up about what I do. I began using Delicious about 3 years ago as a way to keep track and catalog some of these finds so “just in case I had that project someday” I would have adequate resources to at least be able to locate answers if needed. Fridays can be slow nights as I usually don’t go out due to a long week and a need for some R&R. Tonight however I had an urge to go ahead and keep on trucking and bust out a post before heading full on into the weekend. So given I have been playing with some nice web based design tools I think now is a perfect time for a brief walkthrough on a few of my favorites.
Muro
This handy little drawing web app utilizes html5 and comes out of deviantart. It still has minor losses in quality but is quite impressive for a free drawing program. If you’re a deviant member you can log in and purchase brushes and upgrades, and also easily upload your creations to your profile. As you can see the UI is fairly simple and the controls even in pro mode are fairly intuitive if you’ve ever used a graphics program. Definitely worth playing with and the galleries from devout users speak quite highly to the possibilities. I was also impressed by the Wacom plugin integration, just one more step in the right direction for web based design.
Aviary
Now I know Aviary has been around and gotten some press on multiple other blogs which is well deserved, but now it is offered through the market place for Google apps. I owe a post explaining Google apps features and installation and customization but for the time being let’s just summarize and state that they have again taken productivity to a new level to offer quality products on a virtually free basis. I use the standard edition of google apps since I am essentially a one man shop and just needed feature rich email at my domain name. Recently I have also adopted contacts due to being an android user, docs, and calendar. Now with the addition of the marketplace I have access to a diverse collection of bolt on applications for all aspects of my business. Aviary has recently just been the icing on the cake as I can now quickly sketch out a drawing or design idea, edit audio for podcasts or even basic soundtracks, and edit photos and create vectors. It’s feature rich but does tend to work best in a modern browser { chrome does well }
COPASO
Brought out by the masterminds at chromaom that produced colourlovers and other great software for patterns and color theming . Copaso is an advanced color templating tool that provides a sleek interface for brainstorming your styles for more in-depth designs where a bit of advanced color planning can come in handy. Throughout my workday I consistently use these tools for quick solutions for clients that don’t have access or resources to hire a graphics person and just need to spruce up a page or profile.
Pixl80
A great simple tool for 80’s arcade styled, pixel drawn images brought out by my buddy over at inkshire. Great for those unique images for sidebars or profile icons, or just to have some fun retro doodling. Currently supports a background fill, 3 brush sizes, and an eraser. Unfortunately since this little app is still under development the only save option is to do a print screen but I have hope to see it progress even further when they aren’t too busy programming and designing a million other great projects.
Font Picker
This handy little air app is great for those of us with literally hundreds of fonts installed on their design box. I personally love air applications for their snappy light response and low footprint. This is a great companion for those content heavy sites where font selection and formatting can really bring the content to life.
CSS3 Sandbox
This is nice handy set of css3 testing and generation tools. Due to a sadly still small collection of css3 supported browsers this is still not something I would recommend for all projects but it can make adding those awesome elements and effects to your style sheet for your more daring projects just in case your viewer is savvy a snap. I especially had fun in chrome with their gradient and font shadows tools.
COLOROTATE
Another nice theming utility that provides a different view that may better fit your work-flow. Also has available photoshop and fireworks plugin for versions cs4 and newer for just $9.
Em based layouts – Vertical rhythm calculator
Another nice Air app that makes layouts with a desire for em values a snap. Wait, whats an em ? An em is a relative measurement based on the square of the font size at that particular point. As font sizes can vary across differing systems and displays, the result is that the em measurement will always be relatively sized and scalable.
Spiffy Box
Great little generator for those tough layouts that need a rounded look but have to be available in more than just firefox and chrome.. sigh. I have used this just briefly for a few quick projects as a quick fix when the budget doesn’t warrant an IE specific style sheet and some light hacks will fit the bill.
SpriteMe
So many little images slowing down your site? Sprites can step in and help step up the performance. By spriting all of your smaller UI elements and icons and even smaller images used for span fills etc you can lower the http requests of your design and use the bandwidth for more pressing features . This simple tool has a nice walk through to show how the process works with a simplistic UI to keep you from spending hours trying to clean up and speed up your site.
Now I know that there are literally hundreds of alternatives for these types of tools I just wanted to bust out a quick list of some of my recent favorites, so hit me up with your favorites or suggestions and go design something! ..
