If you’re getting tired of the “33 Astonishing Examples” and “51 Unique Icon Sets” articles that keep getting published by the blog power houses, well, then you and I have a lot in common.

Not that there is anything wrong with scrolling through 44 jQuery tab examples, but — to be honest — it all becomes a bit of a blur, very quickly. To me, the real nuggets of useful information come in the form of shorter blog articles, usually focusing on one issue at a time, offering perhaps a handful of links to related resources.

So without any further ado, here are some online destinations that I have recently encountered and enjoyed because of a) the down-to-earth information they have to offer and/or b) the fact that they are rocking-and-rolling pretty much on their own:

Dew Lilly (Anne) – Freelance Web & Graphic Designer / Flagstaff, Arizona

http://www.website-and-graphic-design.com/blog/

Laura Spencer – Freelance Writer / North West Texas

http://freelancefolder.com/how-to-be-genuine-and-nice-in-a-web-20-world-and-why-its-important/

http://www.writingthoughts.com/

The Get Smart Blog (Bridget Ayers) / San Diego, California

http://www.thegetsmartblog.com/

PS: I just realized that all of those blogs are primarily written by women. Hmmm, not sure why that is, but just in case you were wondering, I do read tons of other blogs about web design, web development, Flex technology, database programming, CSS techniques and graphic design that are written by men. The ones I’ve listed here are just the most interesting that I’ve read in a while, as of right now.

Admit it: You can never have enough icons for your web applications. That’s what Marcis Gasuns thought, and so he came up with 512 Pixel LED Icon Set. (Click the image below for the full preview.)

If you like the general theme, the color scheme and the overall graphic design, there is an icon in there for just about everything. The author of these icons states that he was particularly inspired by three other icon sets:

1. Drunkey Love
2. Silk Icons
3. Fugure Icons

From the 512 Pixel LED Icon Set web page:

Some may ask: “How is our icon set different?” Drunkey’s, James’ and Kamiyamane’s icons have a total number of 3044, ours – exactly 500, but all original (only the most frequently requested variants are included). Led Icons set is not yet complete – if any important icons are missing, let us know – we’ll include.

Free Download at http://led24.de/iconset/

By the time they call in the GUI Police, it’s usually too late already.

You know the scenario, right? The development team (which, in a typical small business scenario does not include any user interaction designers) works like crazy on a web application for about a year. They implement cutting-edge functionality, over-the-top back-end contraption . . . and all kinds of “interesting” ways to use the same button for three different purposes, dependent upon the step in the workflow process, the same button will do three different things. Cool, eh?

Companies that focus on usability, human factors and graphical user interface design

Good web application GUI examples

Around that time, they show the web application to the boss, who in turn wants the Customer Support department to see it, too. Oh, and then Sales & Marketing join in as well. That’s usually about the time they realize that the end user documentation is missing.

If you’ve ever been in a situation like that, you probably know what’s coming. As soon as real people see the web application, they are going to have questions. By golly, you know, even though everything was supposed to be intuitive and straightforward, the people over 30 just don’t seem to get it. They can’t figure out that right-clicking that one icon (looks like a tin can but means ARCHIVE) is what you’re supposed to do on that one web apge. And so forth and so on.

After that, one very embarrassed development manager has a meeting with the boss. In a very diplomatic manner, the boss tells the development manager that “the end user experience needs to be finetuned a little bit.” The development manager then starts looking around for someone (anyone, really) who can define usability and hopes to have all the problems solved by the time he finds such a person. Perhaps even post an ominous message to that effect on craigslist, eh?

Back in the real world, the web application completion date gets delayed. Developers and their managers begin to stress out. Graphic designers get hired to fix something that nobody can explain in actual words; usually, somebody will just point at the web application and say something along the lines of, “We need this to work better.”

Inevitably, the budget for the project needs an increase, because now things need to get fixed and revised and re-tested. If everything goes well, somebody comes in and advises the team on usability, end user eye movement, GUI standards and a variety of issues involving white space, targetability of graphical user interface elements that need to be clicked, consistent fonts and a global color scheme.

However, the likelihood that the average small business in the United States ends up hiring someone like HFI, EffectiveUI or Cynergy Systems seems very small — due to the seemingly high cost associated with such companies. (This is by no means a scientific assessment, but based on the number of HR related web applications I have seen, tested and experienced, this conclusion seems very reasonable.)

Most lilkely, somebody in the organization knows someone who has done something like this before — or worse, they know someone who knows someone else. As a result, a lot of usability and graphical user interface work goes to people who don’t necessarily do such work on a regular basis. Quite frequently, this kind of work goes to ad agencies and creative design outfits who know all about dazzle but very little about the particular workflow of the web application.

In the end, usability and graphical user interface work gets a bad rap. Developers tend to get even more frustrated, because the decision to make all buttons blue (instead of gray) does not seem to solve the actual problems the boss wanted to have fixed. Even worse, some smooth-talking creative designers find a way of justifying almost everything with the right spin on it, and when the boss buys into a series of such arguments, the development team feels as though all hope is lost.

So much for the typical bad-case scenario. Now let’s take a look at the flip side of that coin.

If you end up hiring someone who knows what their doing and/or has done similar work before, chances are, the developers will have to re-program some of their work, but the reasons for doing so will actually be the solutions to the overarching problems.

For example, the boss, the manager and even the developers might agree that the order process is cumbersome and confusing. So they look ath the one web page on which all of this takes place. They have some very precise questions for the usability and GUI expert, and they want to know whether the buttons should be in a different color, and would it make more sense to have the drop-down on the left side or on the right?

OK, that’s good. People are thinking about stuff. Unfortunately, in some cases it makes absolutely no sense to focus on such a small aspect of the entire web application. Chances are — and this is not meant to be offensive rather eye-opening — if we’re worried about this sort of thing, we’ve overlooked something else entirely.

Don’t get me wrong. I’m not writing this with an “ I KNOW IT ALL AND YOU KNOW NOTHING” attitude. For many years, I used to struggle with myopia in the sense that isolated web page (or software screen) designs were thrown at me out of context. Only when I stepped back and worked through the way the entire web application (or desktop software program) was supposed to work did I have an AHA moment. Most of the time. Not always.

And, yes, I still struggle through the GUI design and usability process. Things change all the time, and we certainly don’t ever want to take anything for granted. And you never really want to be in charge of your own web application (doing the usability, the GUi design and the programming all by yourself) — that only leads to system-centric design.

In a nutshell, realizing that it takes an outsider to take on those tasks is a critical first step to getting things right (or at least righter). And by outsider, I’m not necessarily talking about someone from a third party. It can absolutely be a staff member, just not the same staff member who has other stakes in the development process (or is the lead developer of the project).

Such findings have been previously documented by others who deal exclusively with software design and usability. If my memory seves me correctly, even well renown usability expert Jakob Nielsen has brought up this particular point on a number of occasions. So have others, but let’s move on.

If we allow an outsider to take a look at the workflow — and what we’re ultimately attempting to allow the end user to accomplish — we will often find that, in an effort to get things done and do those things in an awesome way, we ended up over-developing. I’m not saying we developed too much, but I am suggesting that we typically end up being too clever for our own good.

For example, consider a simple HR process in which the web application needs to evaluate an employee’s performance. In this web application, you get to evaluate a number of performance factors (such as timeliness, accuracy, working with others, etc.). You rate an employee on each individual performance factor, and to get from one factor to another, you click the NEXT button.

Then, when all factors have been evaluated, and there is no more next factor to advance to, you get to mark the perfromance evaluation as “ready to meet in person.” Only now, the clever web application has switched the NEXT button ot a MARK AS READY button. Sure, it might actually be a totally different button (from a developer’s point of view), but as far as the end user can tell, the buttons are in the same place, look the same and only one of them shows up at a time — so why wouldn’t it be the same button?

Now presume the meeting process is over and the performance evaluation can be taken to the next level. Yes, you are right: The developers changed the button again, and now it states COMPLETE. Pretty clever, eh?

The point of this little example is that sometimes, as developers who are knee-deep involved and invested in the development, worrying about deadlines and project milestones, we can easily get too close to the technicalities and the functionality of a web application. All the pressures tend to make us forget that not everybody is as computer-savvy as we are, and somebody else might just not get it (especially if the end user only uses the web application a couple of times per year).

To follow up on the scenario I mentioned above, it was actually much more helpful (to the end users) to break up the factor evaluation part of the performance measurement web applciation into three separate web pages (or screens):

1) evaluation

2) meeting follow-up

3) completion

More work? Yes, if you consider that an existing web page had to be broken apart into three separate web pages. More satisfaction? Yes, even the boss was happy and found such an approach reasonable. Could this have been avoided? Absolutely.

Once again, the point here is not to belittle web application developers who have to call in the GUI Police after the fact. The point is to convince stakeholders to consider usability and graphical user interface design up front.

1. Web application developers, web designers and UI experts need to be involved in the design and development process from the start. (Let’s add a member from the Documentation team as well.)
2. That’s not to say that they should be cross-trained in each others’ areas of expertise; it simply means that they need to run things by each other and work through the planning phases together.
3. As ridiculous as this may sound to some people in 2009, do some user-centered research upfront. Even if your product enters Version 5, you might want to do a reality check and find out whether the old, etsablished workflow still applies or not. If possible, invite a few local clients to meet with you and talk about the ways in which their people use the web application. Call it a focus group and get the boss to pay for drinks and donuts.
4. Even more ridiculous, come up with paper prototypes, demonstrating the workflow and the key elements for each step of the way. Draw these by hand until you’ve run them by a few people. Use tape to add (removable and/or flippable) dialog boxes. Hang them up on a wall or a white board, and walk through each step with the product developer or a subject matter expert. Meet in groups or with one individual at a time — as long as you find out what works, what is expected and what might be unacceptable.
5. Don’t ever be afraid to ask questions and try out new things. If you’re not sure about something, ask now. If you’re going to commit a blunder, do it now during the planning and prototyping phase. It will be cheap and easy to rectify. (Committing those blunders during beta testing is going to cost money and cause a lot of stress, but that’s still better than fixing and revising things after the official product release.)

While most of my observations and explanations may come across as common sense to most of you, dear readers, I am hopeful that there is a hidden nugget in all of this for one or two of you.

Perhaps I might be forgiven for being somewhat opinionated about how to be n effective usability & GUI expert by listing a few additional ideas about being (or becoming) a usability & GUI person in general.

• Pay attention to the way software works — or deosn’t. If something works well for you (for example, Microsoft Word 2003), try and figure out why it works. If something annoys you (for example, Microsoft Word 2007), on the other hand, try and figure out what it is that makes it hard to get things done. Most of all, nurture ideas about what you could do to improve the software.
• Read, read and read. Get your hands on books by software design evangelists, usability experts, human factors experts and others who are engaged in making software and web appications work for the rest of the world. A few names that come to mind are JoAnne Hackos, Robert M. Gagne, Jakob Nielsen, Alan Cooper, Kathy Baxter, Donald A. Norman, Deborah J. Mayhew, Patrick W. Jordan, etc.
• If you don’t have easy access to any of their books, look up their web sites, search for podcasts, find their videos on YouTube or just simply go to town on Google.
• Find a mentor. If any usability or GUI authorities hold workshops, seminars or give keynote addresses near you, attend. It’s also a good idea to put your ear to the ground and find out who’s considered an expert in those fields in your geographical area. Perhaps you could meet up with one of them for occasional chats or visits. Perhaps they would allow you to call them (or send them e-mail messages) once a month to find out what’s new in the field?
• Volunteer to be involved in product reviews at work. Or jump at every opportunity to conduct usability testing (with actual end users) or participate in reviews. You may not always have a lot to bring to the table (especially if there already is a designated usability expert), but you will certainly learn something new every time you engage.
• Take screenshots of good examples. Start your own collection on flickr or photobucket. Give credit where credit is due, and cite the sources (you will be glad you did when you finally find a good use for one of the design approaches you saw several months ago).
• Participate in GUI and usability discussion on message boards, join relevant groups on LinkedIn and on Facebook. Listen to others. Follow the links of those people who seem to have the best comments. Ask for follow-up clarifications if somebody mentions something you’ve never heard of.
• If at all possible, get yoru hands wet on a few freelance projects (if you are a full-time employee somewhere else). Don’t worry about the money (yet). Try and find someone locally, so that you can meet with them in person to discuss their GUI & usability needs.
• Unless you know how to use Photoshop (or something just like it), find a graphic designer with whom you could collaborate. Ten out of nine times [sic] it is important to show your clients what you mean by mocking up a few examples.
• Most of all, don’t have an IT’S MY WAY OR THE HIGHWAY attitude. Almost every situation involving GUI design & usability advice requires some sort of compromise. Perhaps it’s impractical to re-program the entire web application, and you need to make do with what you have. You’re going to have to negotiate with project managers, developers and CEOs. Be tactful. Make your point, support it with evidence from current studies and tests, and then present two or three solutions in such a manner that your clients can gracefully decline Option A but still feel in control when accepting Option B or C.

Companies that focus on usability, human factors and graphical user interface design

Links to various companies that promote usability, human factors, graphical user interface design and such in a good way:

Human Factors International

Jakob Nielsen’s Web Site

Nielsen Norman Group

EffectiveUI

TandemSEVEN

UX Roast

Cynergy Systems, Inc.

Web application with good GUI implementations, resources, etc.

Examples of web sites and web applications that have implemented best practices in terms of usability, human factors, graphical user interface design and such.

WebAppers

User Interface Resource Center

Envato

Yahoo Design Pattern Library for GUI Developers

AudioJungle

Good.is

Digitalmash 

CollabFinder

Postbox 

RedBrick Health 

GUI Design & Prototyping Tools 

Circle of Web / Technology & Marketing Professionals

Having been previously self-employed, I’m currently considering the idea of building a close-knit network of like-minded web professionals.

This would not be a new company but rather a loosely connected circle of individuals who already work on their own but sometimes need help to get projects done. Everyone brings in their own business, but if you need resources to tackle the work, ta-dah, here we are.

Personally, I only have a few clients with sporadic work at the moment. Then again, I am only doing “my own thing” on the side. However, I have had to turn down larger projects, too, because I simply didn’t have the time and resources to commit to something of a larger magnitude as a moonlighter. 

So, the goal here is to help each other out with various projects and identify key solution providers for graphic design, web programming, Flash development, database maintenance, GUI design, sales, print publishing, marketing, documentation, SEO, RIA, etc.

Ideally, this group of collaborators would also live in relative proximity to Lehi, Saratoga Springs, American Fork, Draper, Sandy, Bluffdale, South Jordan (give or take a ZIP Code or two).

Each individual would remain “as is” (e.g., small business, DBA, LLC, freelancer or whatever the chosen status) but would also be ready, willing and able to help out with other people’s projects.

Ideally, the members of this group would bring in new business and consider staffing the various roles from within the group first and foremost.

Requirements:

• This requires commitment. No fly-by-night or “let’s try this for a week” attitude. Must have a few projects under the belt and be willing to show some professional examples.
• Work must be of professional quality. We’re not talking award-winning here (although that would always be a bonus), but the fruits of your labor should be professional and demonstrate your abilities.
• A sense of humor. Personally, I do get down to business and work long, hard hours to get the job done. However, if I can’t work with people who enjoy life and like to laugh every now and then, I might as well join a corporate environment. If you feel the same way, read on.
• Honesty. We all want to make money, and the most efficient way to do that (in my opinion) is to produce good work, follow through on commitments to clients and do what you say you will do. Slacking off and missing deadlines is the death knell of many consultancies. So unless you’re prepared to put in an honest day’s work and stick to your commitments, I’d rather pass.

Other than that, I am simply looking for one or two collaborators in each of the following areas:

Web Design, Web Development, Web Application Development, SEO, Web Marketing, Database Design & Development, Flash Design & Development, Valid (x)HTML, Valid CSS, Rich Internet Application Design & Development, Graphic Design, Graphical User Interface Design, JavaScript Development, CSS Development

Interested? Ideas? Connections? Send me an e-mail message to webgyver [at] webgyver [dot] com

Every now and then, someone comes up with something that seems so simple, it makes you wonder why you didn’t think of that yourself. Then you start thinking of all the possibilities that this new technology or gadget has to offer, the many uses and the smiles on your clients’ faces… and you realize that the person who came up with this thing is a genius.

May I introduce to you: jPlayer by Happyworm (who cites Mark Boas, Mark Panaghiston and Silvia Benvenuti as the essential key players in the development of this super awesome multi-media jQuery add-on).

Don’t get me wrong, by the way. I didn’t mean to say that the jPlayer jQuery MP3 player plug-in is a simple thing. It just seems so simple, and like all things that seem simple, there’s a ton of work and thought and sweat that goes into it.

In the end, the easier and simpler it looks to the people who will be using it, the more work it requires to craft it.

OK, but rather than gushing on and on about the many possibilities and the various configurations of jPlayer, please go and check it out yourself at the jPlayer demo page. All I would like to say is that several ideas came to my mind immediately when I found out about jPlayer:

• Build audio training directly into web applications
• Finally add audio jukeboxes in a straightforward and stylish manner to all those band web sites I’m working on
• Provide audio annotations to blogs and photo web sites

One caveat, though, just in case you’re picky about Flash or the Flash Player: Yes, there is invisible Flash involved. You need to be able to store and access SWF files on your web server. That’s nothing fancy, really, but it might be a hassle for the 1% or 2% or Internet users who do not have the Flash Player installed on their systems.

And now, dear reader, if you’d please excuse me, I have some development tests to do, involving MP3 audio.

Michael Fitchett, who runs the Fitchett blog, has posted a simple but very educational Flex example, showing how to display XML data from an RSS feed in a datagrid, using E4X as the resultFormat.

What’s so amazing (to me) is that :

1. It is simple
2. It works
3. It shows you ho the E4X syntax works
4. It does some extra stuff on top of that
5. Michael Fitchett is providing the source code for all of that

The majority of experienced Flex developers agree that E4X is the best format to work with XML data in Flex. Unfortunately, if you’re trying to find code examples of how to make that work, you can spend hours on end to find what you’re looking for. And even then, all you get are random snippets with partial solutions.

Thanks to Michael, I was able to finish a personal project (trying to learn how to work with E4X so that I’m prepared when I take on actual XML projects in the future). In the end, it was all about making a couple of syntax changes . . . and magically, everything began to work.

However, unlike some of the people I sometimes work with, I would never say, “Oh, was that all?”*

I am very grateful for the example and the inspiration.

*Have you ever worked on somebody’s computer to fix an annoyance? Or look at someone else’s code to get them over a hump that was causing work to be delayed? By the time they call you, it’s already been hours or a day since they last did anything productive. Then you come by and look at the problem, try a few things, and POOF, it works. After that, they just shrug their shoulders and say something like, “Oh was that all? I could have done that.”

Time-sensitive post: This post refers to an offer I received in my in-box on or about April 20, 2009. Because I have no idea how long this deal will last, I recommend you shop around and do some price comparison before taking my word for it.

Usually, I hate to plug other people’s products or services, but this deal seems too good to keep it all to myself. You get 600 TAIYO YUDEN DVD-Rs for about $129.00 (plus free standard shipping).

Nope, I don’t get a commission! At any rate, if you’re interested in deals like this, go visit Supermediastore.com and poke around.

Don’t blame me, if you end up ordering more than one thing, though. These guys have some pretty good deals on electronics and computer supplies.

The easiest way to switch the default application that handles the “View | Source” process in Internet Explorer is, in my opinion, using View Source Editor from Iconico Software.

The software is free. It’s amazingly simple. They don’t pay me a commission for plugging their product. No adware. No spyware. And have I mentioned already that it is simple and fast?

View Source Editor Download Link

However, if you crave pain and that “do it yourself” feeling, you can also use the Windows Registry to change IE’s default handling of displaying the source code for web pages.

The blog editor at My Digital Life has a nice explanation of the process posted. Here’s a preview of what they have to say:

There are some things in life that I just take for granted. Having e-mail links (mailto) in Firefox open up Gmail was one of them, until I had to start all over with a new computer at work.

To associate Gmail quickly with mailto links in Firefox, open up Firefox and go to Tools | Options | Applications. Then scroll down until you see the row with the “mailto” content type, and select “Use Gmail” from the list of available options next to it.

Then click OK and get out of there.

If you’re interested in additional information about making Gmail your default e-mail client, please check out Robby Stein’s tips at the Official Gmail Blog.

Hope that helps.

Disclaimer: This is not an April Fools joke.

If you just can’t find a file that you know should exist somewhere on your Windows Server, and you’ve been reassured that you have administrator rights, take a quick look under the hood of the built-in Windows Search utility.

By default (it seems), the “Search hidden files and folders” option has been turned off in Windows XP and Windows Server 2003.

This is very annoying, especially when you go to the trouble of setting up all Windows directory options to show hidden & protected files (in Windows Explorer by way of Tools / Folder Options / View).

Nonetheless, there is no connection between those settings and the scope of the Search utility.

To illustrate the terrible side effects all of this can have: Recently, I made a complete fool of myself in front of Marketing and Corporate IT, because I couldn’t find another employee’s Dreamweaver cache file in that user’s profile. Then I started digging through the directory manually and eventually stumbled across the file (which, of course, was not in a documented location, since they are using the latest version of Dreamweaver CS4).

Surely, I thought, the Search utility should find it now. Wrong. Even searching through the file’s parent directory — knowing the file was there — came up empty. As tedious as it seemed at the time, I poked around with the Search utility, turned on that important setting, and suddenly the files started showing up in the search results.

And then I started writing apology e-mail messages to everyone.