Do you ever have to design or have input into software user interfaces? If not, you might want to skip this post, but if so, Balsamiq Mockups might be of interest to you. The concept of the program is quite simple: create a bare-bones version of the user interface in question. So bare bones, in fact, that it almost looks like it was sketched.

The hand-drawn style might seem a little funny at first, but it serves a couple of very real purposes. Firstly, it makes it extremely clear that what you create with it is nothing but a mockup; nobody you show it to is actually going to expect that it be able to do anything. Second, it strips away all of the more subjective elements of design like color and shading, so you can focus on the usability of the layout of your user interface.

Balsamiq Mockups is compatible with Windows, Mac, and Linux, but unfortunately that flexibility comes with a price, in more ways than one. The first price is that it's a Flash application, so to run it on your machine as a desktop app requires Adobe Air. The second price is, well, the price: $79 US to be exact. Well, that's not entirely true. Yes, it is $79US for the full desktop version, but if you're not worried about being able to save your mockups or export them as PNG files, you can install a feature-limited desktop version for free.

[via John Watson]

Icons are to me like clothes are to my wife - meant to be changed. I love sprucing up my desktop with customized icons and a funky background, only to change it all up a week later.

If you're like me, then you're going to enjoy this list of 50 of the most beautiful icon sets created in 2008 at NOUPE. The icon sets listed are intended for everything from customizing your Mac or Windows desktop, to iPhone replacement icons, to web development. There's a little something for everyone, so have a peek if you're at all curious.

Do you have a favorite resource for free icons? Link it up in the comments.

If you're tackling some graphic design project or maybe even your wall decor, getting color hints from ready made color templates from professional designers can be useful. Below are 10 of the better sites to help you out on your design challenge.


ColorCombos - nice color palettes to choose from. If there's a particular website whose colors you want to snag, check out their "Grab Website Colors" engine. You just input the URL of the site you're reviewing and ColorCombos extracts the palette for you.



COLOURlovers - this is pretty close to color mecca. This post should actually be filed as a Timewaster because you can spend hours checking out the various palettes and patterns and rolling your own. The site is full of features such as create your own palette from a URL you're inspired by, join groups devoted to colors (srsly), shore up on the latest color trends, contribute your own content and vote on others.


ColorExplorer - another site that's feature rich and full of color goodies. Color import from images, palette export to most programs, convert any number of colors into a matching palette, 1 click palette filters and adjustments, plus no requirement for site registration.


Kuler - not surprisingly, Adobe has a fetching web app to help you generate color schemes and if you have Adobe's Creative Suite 4, Kuler is built in. Kuler has great tools such as color extractor from an image, theme creation from 1 to several colors, as well as a community you can join and give and receive comments on yours and other's creations.


ColorJack - very nice color site featuring several apps such as Color Sphere which allows you to choose the right color scheme supporting 18 formulas and 9 color blindness simulations. There's also Color Galaxy, an online color visualizer with colors from 27 libraries including everyone's favorite forever and ever, Crayola.

Keep reading for more...

Outlawdesignblog did a great job compiling an interesting collection of free downloadable grunge fonts to help you get that nice, dirty, raw edge you might be craving on your graphics. Of course, whether or not grunge fonts convey edgy anymore is debatable since they are all over this year's back to school fashions which school kids are wearing with the appropriate bad ass attitude.

I don't know about you but when grunge becomes the fashion statement for school kids, it might not be the edge you're looking for in your design project. In any event, whether or not grunge has become a cliche - you're still in charge of what you create and now you'll have more grunge fonts to help inspire your work or, perhaps not.

Check out some of my favorites from the collection after the jump.

Now that we've harangued you to upgrade your Web site, take advantage of business blogs, read your Web stats/, incorporate search engine tips and use Web 2.0 themes, it's time to choose a Web design firm to make all of the above happen for your small business. Google "web design" and spend the rest of your natural life clicking links or narrow down your search around some specific best-practices criteria.

Virtual Hosting has an excellent article up detailing 23 actionable web design lessons that we can learn from eye-tracking studies. Most of the items are common sense: people scan web pages rather than read them, people look at the top left corner of the page first, people ignore banner ads, people ignore fancy formating that looks like ads, etc. But why do people interact with pages in this manner?

The answer should be obvious: web designers have trained visitors to use their sites in a certain way. Yahoo, Google, AOL, and MSN all format their sites according to the above listed guidelines. Because of this, people expect site names and logos to be a the top left. They expect banner shaped images to be banners and therefore ignorable. They expect sites to look, feel, and function a certain way and they are very frustrated when they don't.

In a way it is like news papers. People expect news papers to look and function a certain way no matter what city or country they are in. Its perpetually reinforcing as each site that follows this standard pattern (which is not a bad pattern by any means) causes more users to expect the next site they visit to look the same. It is good because it promotes usability but bad because it limits creativity and new design patterns. People have to innovative inside a very small box.

Enter the CSS Grid Builder from the good folks at Yahoo!. Yahoo! has spent thousands of hours crafting web pages and testing them across all the possible OS and browser combinations (yes, even Opera). The end result of all this testing was the public release of the Yahoo! User Interface CSS and JavaScript libraries. The CSS Grid Builder is a simple web-based interface for quickly creating any number of layouts that rely solely on YUI's CSS files. This gives you the advantage of easily and visually laying out designs without using tables, and they will work the same way in every popular browser

Whilst there's plenty of tools around for helping with CSS styling, if you want a neat little browser bookmarklet that displays all the properties associated with the selected element and "box model for any element on any web page", then XRAY from WestCiv might be just the thing.

It's your worst digital nightmare, apart from perhaps a full system recovery, the losing of digital photos. We've all been bitten by a memory card or computer itself ruining a set of pictures at some stage, however well-renowned Flickr and Zooomr-based photographer Thomas Hawk points to a handy tool that might just save your bacon: PhotoRescue 3.0 from DataRescue Software.

Hawk also provides a set of tips for using the software to its full potential, and one tip that we'd add to the excellent advice is not to fill your memory card as full as absolutely possible - leave a little bit of space to avoid completely corrupting the memory card. There's nothing worse than shooting a couple of gigabytes (or more) of photos, only to have them written off by your own desire to reap value from a massive memory card.

PhotoRescue is not free, although judging by the review linked below, it might just save not only your photos, but your sanity too when the panic of "Er, I just lost a whole holiday's worth of photos" really begins to set in. Your $29 gets you a Windows and a Mac licence to the app.

Free fonts are everywhere online, but in most cases you get what you pay for. While many people are happy using hacked together fonts, discerning viewers notice the little things that set a well-made font apart from the wannabes.

Freelance web designer Vitaly Friedman has put together a listing of his choice of the best 25 free fonts available online, and it's very hard to argue with his choices. He plainly states that his bias is towards fonts that are useful in a business setting, rather than those that would be more at home "on a colourful teenager's homepage". Don't miss the update at the top of the post including links to new fonts Fontin (seen here) and Delicious. Beautiful stuff.

It's easy to forget that there is more out there in terms of useful business type faces than Times New Roman and Arial. Thanks to Vitaly, we can all experiment with some more interesting but still classy looking fonts in our next report or PowerPoint presentation.

If you're a fan of the Adult Swim network, you've certainly seen Tom Goes to The Mayor and probably wondered, "How do they do that?" The show's oddball humor is punctuated by innovative and simple sparse-frame animation, dominated by characters who look stimpled and photocopied onto the set.

If you've longed to be on Tom Goes to the Mayor but aren't as cool as David Cross, Sarah Silverman, Brian Posehn or any number of other hot alt-comics who've graced the show's two seasons, fear not.. we'll show you how to make your own Tom Goes without flying to Hollywood, or breaking the bank.

Flipping through free font sites is not an ideal way to spend time (hate those pop-up ads) however, you can go to Fonts 500 which provides the top 500 fonts from some of the web's biggest free font archives. Here you can cull through your favorites and know that users like you found these the best to download.

Btw, the two fonts used in the Download Squad graphic are Heartland (for "Download" and Swatch (for "Squad").

[via Lifehacker]

If you missed the color course in college or habitually spend a small fortune on paint tester cans only to throw recycle them, you can (unlike at the paint service desk at Home Depot) get really good color help online. On the web, there are professional color palettes from infinite sources to help you out. Here's a few unearthed from Fuzzy Future to help you find the perfect color match for your design project:

ColorBlender
You can slide the RGB buttons to create a core color which then automatically creates a coordinating palette.




DeGraeve
Input the URL of an image and the site will generate a lovely palette to match.



Kuler
Kuler from Adobe Labs helps you create endless colors and you always come out looking like a pro.



EasyRGB
Match your RGB values to real color paint lines (including Sherwin Williams), inks, fandecks, etc.



[via Digg]

Palette generators are nothing new, in fact they go back to the same color theory designers have used for ages. Colorjack takes the color wheel into the 21st century.

Available both online as a super slick AJAX application -- with the ability to export palette files for Illustrator, Photoshop and more -- Colorjack is also available as a Mac OS Widget so you can keep the power of a color wheel on your desktop at all times.

[via Digg]

If you're a CSS-slinging web designer who often peers into how other sites are designed, why not take it a step further and actually redesign them, live, in your browser? CSSFly is a tool that seems almost too good to be true: the service allows you to open a site in a frame, with another frame containing the site's markup allowing you to dig in. You get your choice of how and where the frames open, i.e. - markup on the top, bottom, left or right, but unfortunately the markup isn't colorized in any way to help shuffle through the code. Still, CSSFly is a handy way to tinker with virtually any CSS-driven site without having to get out the big guns or ask the site owner for an FTP login.