Government web sites are not typically up to date on their web technologies and design. If you go to most .gov sites and you will see archaic designs, bad usability and poor accessibility. Sites are often just a portal of a labyrinth of links. There are many reasons why government sites are lagging far behind those of corporates’, which are themselves lagging behind smaller, more agile companies. Paul Boag’s article 10 Harsh Truths About Corporate Websites pretty much summed up many difficulties government sites face too. More so, government sites take much longer time and effort to redesign and re-architect. There are a lot of legal and political issues involved.

This is why last year I was very excited to see Barack Obama’s campaign site. My review for his site didn’t cover the main reason why I was impressed. His emphasis on a modern and embracing site was rare for a politician at the time. Since I’ve been working within the government, both state and federal, I know just having a competent design team is not enough, the political will has to be there too. A lot of things have happened since I wrote that review: Mr. Obama went on to win the presidential election and launched a series of impressive federal government websites. The new whitehouse.gov went live seconds after the Inauguration ceremony. In the past few months, data.gov, recovery.gov, it.usaspending.gov were launched.

The man behind his internet campaign, Mr. Julius Genachowski was sworn in as the chairman of the FCC(Federal Communications Commission) a few weeks ago. He’s my new boss now. I have no doubt, that under his leadership, a much needed redesign of the FCC web site will launch soon.

I always thought the government sites needed the most help since they serve the general public. Currently most government sites suffer from these common problems:

• Information is hard for the public to find, due to poor usability.
• Not enough outreach to the public.
• Old, invalid, underlying coding.
• Accessibility issues for the handicapped.
• Graphical designs lack of elegance.
• Inconsistent branding.

To overcome some of these issues when redesigning:

• Have a clear vision of the site and architect information in a way that’s easy for the public to find.
• Take advantage of appropriate social media tools.
• In-house, contractor designers and developers must keep up with current web technology, usability and accessibility standards.
• IT Management needs to be on-board with the latest trends too. This, I think is the most important factor.

The new federal web sites launched are impressive, in terms of the design, informativeness and outreach. I love how consistent the branding is throughout these sites.

For the past few months, I was involved in redesigning the dtv.gov website. The team did a superb job given the time constraint. The old site was dated and didn’t have all the up to date information the public needed. With the redesign, the FCC stressed the importance of getting the public all the information they needed in preparation for the DTV transition. The news release was constantly updated, also many web apps were available on the site as well.

Recently I’ve met several people in real life or on twitter who share the same passion as me: to make a better government web. I met Macon Phillips, the new media director of the Whitehouse. He’s a big proponent for the use of social media tools to reachout to the general public. He’s behind the new whitehouse.gov and many other WH social media outlets such as Flickr, Youtube, Facebook and Twitter.

If you’re interested in social media for the government, I recommend following Jefferey Levy on twitter. Mr. Levy is the web director of EPA.gov, he led an impressive effort of putting the EPA in the forefront of interacting with the general public via appropriate use of social media sites.

Gov2.0 Links of Interest:

• webcontent.gov – run by the Federal Web Managers Council, this site provides guidelines for government agency sites.
• govloop.com – a Ning powered social network for people who are interested in the improvement of government web.
• government20club.org – I attended this conference back in March. A lot of good archived materials to read from here.
• gov2expo.com – Many gov2.0 projects will be showcased at the Expo in September.
• Sunlight Labs – is an open source development team that builds technology to make government more transparent and accountable. They’ve done some beautiful work.

I never thought I’d say this a year ago, but now is an exciting time to be a web designer working on a government project. The political will is definitely there. I believe many agencies, both state and federal will redesign their web sites to the standard the new administration set. Now is the time to fully utilize our skills to make those sites to serve the public better.

You see, in China (and most other Asian countries) you start competing in school from first grade. At the end of elementary school, you take a very difficult placement test to get in the magnet middle school. Only the kids who get in a magnet middle school have a shot at getting in a magnet high school, and that’s after they pass another difficult placement test. At the end of high school, students will take another test to get in a magnet college. For every one student that gets in, thousands don’t. The brightest students get to study abroad in a country like the US, which is the ultimate goal of this long and painful process of elimination. So the Chinese you meet here are the cream of the crop. Yes, you can say all the nerdy Chinese you meet here are smart, but I can also show you millions of big buff ones back home who are not.

I still remember the end of my elementary years. My school days were from 6am – 6pm. After I got home it was a brief dinner and then I studied until I went to bed. Everyday. Winter and summer breaks were short, also burdened with homework. During the final preparation for the middle school entry exam, I studied so hard the corners of my text book pages became translucent. I took every practice exam I could get my hands on, multiple times. I remember once I went to bed without being able to solve a math problem. I dreamed about it and solved it. I sprung off the bed and quickly wrote down the answers. I honestly didn’t know why I was so desperate to get in that magnet middle school. Maybe it had something to do with the constant reminder from my grandma “If you don’t get in this school, you’ll end up being a janitor.” My grandma had ways of mentally torturing a 12 year old.

The entry exam consisted of three tests: Chinese(100pts), math(100pts), and science(50pts) for a total of 250 points. The magnet middle school I applied for required a minimum of 247 points. I scored 247. I remember at the celebration party, my relatives and family friends gave me looks of approval. My father reminded me that this was only the beginning of an even tougher road.

Two months into the first semester in middle school I came to the U.S. to visit my mother. I ended up staying permanently. How could I not? School here was a cakewalk. Everyday was a vacation to me. I didn’t have to come to school at 6am to clean up the class room, there were janitors doing that. (Maybe they didn’t pass their middle school placement test, I used to think). The school bus, recess time, little homework, friendly teachers, field trips etc. Kids here were different. They seemed… happy and not stressed. America was heaven, no wonder why people wanted to come here.

My mother used to tell me that I got lucky, that I took a shortcut to the US. She said I had to study extra hard like my peers back in China. I tried to do that. But over time, I realized that I had no incentive. There was no need to be in the top of the class. There were no entry exams to get in high school, not even to enter college. There were no relatives or family friends that I had to impress. I didn’t learn anything new in math until I was a junior in high school; I was coasting off what I had learned in China.

I was being complacent and I was totally OK with it. It felt good just to be a kid. I even felt I deserved it. Although at times I thought of my friends back home who were going through the toughest time of their lives trying to get in the college of their dreams. It made me feel guilty. The guilt quickly went away as soon as I turned on MTV or video games.

Thanks to the internet, I regained my competitive spirit. In 1995 I got my first web design intern job. I had a strong urge to impress my manager and other interns in the office. If I didn’t do well, according to my mother “You’ll get fired, and you won’t be employed again.” I quickly realized I really loved this web design thing. Internet may get HUGE one day! And HUGE it became.

As the web evolved, I had to constantly learn new things, out of necessity as a web designer, but also out of passion. Simple HTML couldn’t match clients’ needs, so I learned Javascript, Flash, ASP, ASP.NET, and database programming. Eventually, I even got MCP on ASP.NET.

Then I got married and had kids. Life became comfortably routine. For a couple of years, I didn’t learn anything new at all. I felt even though my skills weren’t exactly up to date anymore, they were “adequate enough” to do my job. One thing about being complacent is that you give yourself excuses and sometimes you can even fool yourself. Deep down, I knew I had enough free time to learn new things if I didn’t watch TV or play games. I knew I wasn’t the only one who was being lazy. As one gets deeper into this thing called “life,” responsibilities creep up, and the urge to learn new things gets dimmer.

I started reading web design/programming blogs in the early 00s. I found many quality ones, and others through them. What I was amazed about them wasn’t just the good content, but also the bloggers who wrote them. Most of them were like me, having a full time job, married with kids. It was a wake up call for me. I really didn’t have any excuses to slack anymore.

Looking back at the times when I studied or worked hard towards something, whether it was the middle school entry exam, or the dotcom era skill-ups, I almost see the source of it was desperation. I have to ask myself, or anyone out there, why should desperation be the driving force out of complacency? As I get older, there isn’t a clear incentive. There are no more exams or the need to prove myself to anyone.

I’ve been productive for quite sometime now. Everyday, I learn something new on the web, via blogs, twitter, coworkers or readers like you. My driving force now is my passion for web design. It’s more than a 9 to 5 job. Whenever I sense that complacency is creeping up, I think of the summer of 89 when I was 12 years old, studying for that exam.

I’m curious about how other people fight complacency.

Bonus Question

Below is the final question on my middle school entry math exam. Go at it.

Last week I stumbled upon an essay titled Ten Things I Have Learned written by famed graphic designer Milton Glaser. It was great read, I highly recommend it. Item #5 in the essay caught my attention:

LESS IS NOT NECESSARILY MORE.
Being a child of modernism I have heard this mantra all my life. Less is more. One morning upon awakening I realised that it was total nonsense, it is an absurd proposition and also fairly meaningless. But it sounds great because it contains within it a paradox that is resistant to understanding. But it simply does not obtain when you think about the visual of the history of the world. If you look at a Persian rug, you cannot say that less is more because you realise that every part of that rug, every change of colour, every shift in form is absolutely essential for its aesthetic success. You cannot prove to me that a solid blue rug is in any way superior. That also goes for the work of Gaudi, Persian miniatures, art nouveau and everything else. However, I have an alternative to the proposition that I believe is more appropriate. ‘Just enough is more.’

It made me reflect on my approach to web design. I start with the purpose of the site, then identify the core elements to execute the functions. I tend to leave out the extras. So to me, “less” is “more” in the sense of serving the purpose of the site without distractions. This site is a prime example.

However, such design obviously isn’t appropriate for every type of site. When we think of “less is more,” we tend to paint of picture of something that’s bare and minimalistic. I like Mr. Glaser’s “enough is more” approach better. Because “enough” is when it’s appropriate.

I’ve started to re-evaluate the design of this site. Being a personal site, I feel I have some freedom to dictate how things are. So far, the goal is to put most emphasis on the articles, not the branding of the site, or myself even. But admittedly, I’ve sacrificed some usability by steering away from convention. Perhaps, I need to find that point of being “enough.”

Last time, something this tragic happened was about 20 years ago, near home.

Last time, I was too young to remember.

Last time, I was probably too indifferent to care even if I could remember.

This time, I will.

I have the same observations about how people dress themselves. Same drill: mismatching colors, textures and styles. Of course, all my judgments are based on my own preference. In the scenarios listed, there are reasons why people decorate or dress the the way they do. Maybe it’s financial, or maybe it’s because they simply don’t care.

Or maybe, they just have bad taste.

There, I said the T word. I actually resent calling out on people’s (lack of) tastes. It makes me feel like a pretentious prick. What people do in their personal lives doesn’t concern me. However, having good taste is  extremely important when it comes to designing for the public.

I’ve sat on many interviews for web designers in the past. When I review their CV or portfolio site, the first thing I look for is if they have good taste. This isn’t the same as how competent they are with graphic softwares or how knowledgeable they are with code. Tools can be learned and mastered over time. Developing good taste on the other hand, takes a lot longer. Sometimes, I even wonder if it is something of nature, rather than nurture.

Good taste determines how elegant and polished the end product is. Some may dismiss it as “fluff” or superficial, self absorbed hipster talk. “As long as it’s functional.” I don’t buy that and never have. When it comes to product or graphic/web design, how it looks and feel are just as important as how it functions. For a product, it begins at packaging; for a web site, the impression is established within the first few seconds of visit.

Form follows function-that has been misunderstood. Form and function should be one, joined in a spiritual union.

- Frank Lloyd Wright

I don’t think having a formal design training is necessary for having good taste. Some of the clients, PMs and programmers I’ve worked with definitely had “an eye” for the aesthetics. Although they may not be able to execute it, but they knew if something looked and felt good or not, therefore were able to offer valuable critiques. On the other hand, those who didn’t were just a nightmare to work with, and often hindered the quality of the delivery.

Last week I read Dustin Curtis’ follow up article on his AA.com redesign. I feel Mr X’s pain, and agree with Dustin’s view on the importance of having a good taste:

There’s a common attribute that makes for good designers, good engineers, good employees, and good companies. For a long time, I couldn’t figure out what it was. Was it practice? Was it skill? Was it innate ability? Turns out, it’s none of those. It’s taste.

What constitutes good taste? I’ll leave the floor open for that one.

I was checking my RSS feeds on the iPhone, only to discover that the WI-FI in my house was down. This could only mean one thing: the cats turned the power strip off, again. So I went downstairs to my home office and there it was, a dead power-strip sitting on the floor, stiff, with all my electronics plugged into it. My cats have a habit of playing tag with each other at warp-speed, and their favorite spot to slam their furry bodies into is the power-strip for some reason.

After I turned the power back on, I decided to finish my morning online reading on my Dell desktop instead. A bad feeling sunk in after I pressed the power button. Nothing happened. I pressed again, still nothing. Yep, my Dell died. I suddenly had a flash back of how my previous PCs died. My last Dell died in a in a similar fashion, except for instead of the cats, it was my then one year old son playing “on, off, on, off” game with the red switch on the power-strip. The PC before that, I had to retire due to slow performance over time.

I was pretty upset, because I just got this Dell last year. I normally don’t expect much from Dell. They’re cheap, but I had hoped it’d last for least another couple years or so. There I was, fuming. I had planned to do quite a bit of work on the computer that day. Also I was just so fed up having to repair/replace computers. My wife and kids gathered around and tried to comfort me. Then suddenly, like a scene from A Christmas Story, I said “Everyone go upstairs get dressed, we’re going out!”

I was on my way to get a Mac.

I couldn’t believe I was doing it. Over the years, I had numerous PC vs. Mac conversations with my Mac using friends. Being a long time PC user since early 90s, I always defended my hardware and OS of choice. I had many fond memories of PC. I remember configuring the config.sys and autoexec.bat files to load different games and applications; playing games, lots ‘n lots of games; learning Photoshop 2.0 and eventually web development. I never bought the argument that designers should use Mac as my friends told me. To me, Mac, PCs are just tools. Photoshop is Photoshop, regardless what OS they’re on.

However, I don’t use computer the same way I used to. I no longer play games, or care about hardware, software optimization. I just want to use a tool that works, and works well. I don’t want to spend time fixing the tool, I just want to use it. Maybe that’s why I decided to get a Mac.

Twenty minutes later, we arrived at the Apple store. Ten minutes after that, I walked out with an 24″ iMac.

When I got home, I encountered the most pleasant computer un-boxing experience I’ve ever had. Inside of the box, there was the display, a soft power cord and a tiny box containing the keyboard and mouse. That was it. No panflits, no thick instruction books, no heavy duty cables. Everything was so clean. The whole set up took no more than 2 minutes until I saw the welcome video (But I did clean my office for about an hour before that). The user experience starts with packaging.

It’s been a week since I’ve had my first Mac. So far I love everything about it. I love the fact that many details are put in the UI. It’s not just how pretty things look, but also how they function. The learning curve switching from PC to Mac wasn’t as high as I expected. After all, most software I use are the same on both systems. There are things I’m still getting used to, such as I have to hit cmd+Q to truly quit an app. I’m also learning all the keyboard shortcuts as well.

I’m not ready to call myself a “Mac” yet. I don’t think I’ll ever be since there’s always a place in my heart for PC. There’s just too much nostalgia to let go completely. Having said that, I’m thoroughly enjoying the transition. Apple products aren’t just about software or hardware, it’s the whole user experience package. I can clearly see that now.

The term “Urban Ronin” is something of a concept of I’ve had for a while. It has evolved over the years. It started out as a story concept, inspired by my two favorite mangas, Vagabond and City Hunter. The story involved a wandering person, a creative type(I never pinpointed what his exact profession would be) wandering through the city, encountering interesting situations.

I don’t have the skill to draw a full blown comic book, so that concept simply served as the plot lines of my day dreams in classroom when my mind wandered off. The next version of it was a fashion concept. It seemed more realistic. I imagined it to be a clothing line, inspired by the feudal samurai attires: loose and free-flowing. It’d be something I’d wear myself. I did some research about concept art to prototypes. The cost of hiring a decent seamstress to tailor my sketches to the real thing is rather costly for a hobby. So that was that.

I can’t really explain my attachment to the term Urban Ronin. Perhaps it just has a nice ring to it. Or maybe the concept allures me. A modern day ronin roaming aimlessly in the city. His future is unforeseen and dangerous. Maybe it’s just an altered ego I created for myself since it’s the opposite of what my real life is.

Due to work and family lately, I haven’t had much time to post longer articles here. I have however been posting random and interesting links on Twitter. Sharing findings is something I enjoy doing since BBS days. However, I find myself spamming Twitter just a bit too much lately with links. So I’ve decided to start a Tumblr blog for that purpose instead.

Introducing Urban-Ronin.com

This tumblr blog is set up for quick postings of random thoughts, and interesting findings I encounter on the web. It covers mostly design and art, and sometimes bizzaros. If you’re interested, please check it out.

I am very impressed with Tumblr. The setup process was very quick and painless. Its bookmarklet is superb, making posting very easy. I can also post through the iPhone app. Its template system is not as advanced as Wordpress’s. But it doesn’t need to be really. I modified an existing minimal theme, there are still some tweaking to do. There’s also a huge Tumblr blogger community. You can “follow” others’ blogs.

Enjoy.

Five Star restaurant/bar was my favorite hang out place in my single years. I have many fund memory of that place. In fact, I met my wife there. I loved the place because during my wacky freelance days, its late hours suited me perfectly. I’d head to Five Star for a drink or two around midnight, then begin my all-nighter when I got home at 2am. There was a certain quality about the place that I loved. The staff was friendly and genuine, and the place wasn’t crowded. Everytime I went, I was able to carry on interesting conversations with the regular patrons.

Soon the word got out that Five Star was the hip place to be. It got more and more crowded. The staff become too swamped to talk to everyone. What used to be sincere and intimate chatters turned into short and cordial greetings. It also become increasingly hard to find a seat or hear what my friends were saying over the noises. Five Star soon became a full blown packed night club.

I felt like I’d lost a special place. I found myself going at slow hours, so I could regain some peace and quiet. Not surprisingly, the old regulars did the same.

Then a new night club opened down the street, all the club hoppers went there instead. Because, it was the hip place to be. Five Star became my Five Star again thanks to their exodus. I was able to sit down and hear people again. I remember one night a guy came in and said, “This place is dead…” then promptly left. I wonder if this place was ever alive to him to begin with.

These days I don’t go out much anymore. In between working on my blog and side projects late at night, I socialize with people on Twitter. Yesterday I had an interesting conversation with @mktgdouchebag and @NathanBowers, see below:

I believe people’s online behaviors mimic their real life behaviors. Twitter has gotten noisier than when I first joined. One good thing about Twitter is that I can choose who I follow or converse with. But as its popularity grew, I have a hard time telling who’s truly interested in having a two way conversation versus those who want to shove a URL down my throat. At least not easily right away. There is much noise.

Twitter, like many other social media sites, is just a tool. It is what you make of it. Those who don’t see the true value of it will quickly move onto the next bigger things, or quit all together. Maybe I am waiting for the day when those Twitter becomes quieter, so I can sit down and have a drink with my friends.

Quick search in a nutshell, allows you to turn a typical routined web search process into a command line shortcut. For example, instead of going to wikipedia.com to enter the search terms there, you can use “w mySearchTerm” from Firefox’s address bar.

To set up a quick search, simply go to the site first. In my example, I’ll use Wikipedia.com.

Right click on the search input field, choose “Add a keyword for this search.”

On the next step, give your search a meaningful name. You can use whatever for the keyword. I use “w” for Wikipedia. This will become the shortcut “command.” I recommend putting all your quick searches in a folder. In my case, I name the folder “Quick Searches.”

That’s it. If you look at the property of the quick search bookmark you just saved:

http://en.wikipedia.org/w/index.php?title=Special%3ASearch&search=%s

“%s” will be the parameter used for the search. To use the quick search, simply to go the address bar of Firefox, and type “w yourSearchTerm.” I have shortcuts set up for search based sites I frequent.

Note the “Add a keyword for this search” option is only available when you right click on text input field. It does not appear for textarea. If you want to set up a quicksearch for a site that uses textarea there are couple ways to do this. First being looking at the form action string, and manually add that to a quicksearch bookmark.

I prefer the second way, by rewriting page’s HTML using Firebug. Take Google’s translate page for example, the default search input is a <textarea>.

By using Firebug’s HTML editor, you can modify the code on the client side. I changed <textarea> to a <input type=”text” />. This then enables the menu to have the option to add quick searches.

You can also use multiple parameters for quicksearch, but it involves some javascript. Lifehacker has an excellent tutorial on this topic.

The term “creative gap” is a way of describing the difference between what we as artists can visualize ourselves creating and what we actually create. Sometimes we nail it and the gap is nil. Other times, as you might imagine, there’s a huge disparity and the gap is wide. Whether we lack vision, skills, timing, whatever – it can get frustrating to set out to create a masterpiece, and settling for a different kind of piece, if you know what I mean. You envision it like an Edward Weston, but what you get is more like an Edward Scissorhands. – Chase Jarvis

As a web designer, I can definitely relate. Over the years, the gap for me has narrowed since when I first started my career, but has not completely disappeared. At times, I still reflect on what I could’ve done differently after a site is launched. Drawing from experience, here are a few tips I’ve learned to narrow that gap, ordered from general to specifics:

Be Versatile

A manager I once worked for referred to web designers as “jack of all trades, master of none.” As ignorant as his comment sounded, I have to say at the time(1996) it was justified. Our role was a rather unique one – people who sported the title “Web Designer” came from different backgrounds: print designers, multi-media designers, programmers, marketers etc. I do not want to get into the discussion of “should designers code,” but I want to stress the fact that the more you know, the more it helps with your design. If you just spend several hours every week learning about client/server programming, over time you’ll gain the knowledge of whether a certain design element is feasible to implement or not. Know the importance of accessibility and usability. Not only this helps your design skills, but also makes you a more marketable designer.

Be Resourceful

There are tons of design resources out there today. Even if you’re a fervent blog reader, do you actually fully utilize what you read? Come up with an organized system for bookmarking useful resources you find, that way you’ll retrieve them easily when you do need them. I use delicious and stumbleupon for bookmarking.

If you have a lot of design blogs in your RSS reader, create different categories for them based on their specific type of content. If you follow other designers or programmers on twitter, take advantage of the “favorite” feature too. Do tutorials if you have the time. But keep in mind tutorials are about the process, not the end result.

Learn the Business Side

When you take on a project, learn the business behind the client’s site. This doesn’t mean a mere requirement gathering. Pro-actively, ask about the day to day operations, what kind of goals they would like to accomplish through their site. Pretend that you’re part of their staff and see things from their perspective. This helps to align your design decision to their business goals. Often you can’t just learn everything from a static list of “business requirements.”

Avoid Lorem Ipsum

To me Lorem Ipsum is a crutch. It’s easy to use it to come up with a perfectly laid out design. Copy is an important part of the design and is often ignored. Having the real copy early on helps you to see a better picture. Sometimes the clients may not have the copy ready for you when you’re starting a new site. This is why learning the client’s business operations is important. You can help them to come up with text that’s most effective for the site’s purpose.

Test Extreme Cases

This should happen during the layout phase, whether you’re sketching with a pencil or in software. Try your menu link items with various text lengths – do they still fit? How about adding two or three more links? If your design’s aesthetic is dependent on grid alignment, what happens if there’s very little content or a lot of content in one box? Planning ahead and making sure the design is flexible and scalable will save you a lot of time down the road.

Sell Your Design

I find the biggest challenge always comes down to a people problem. When the client wants to change a particular color, layout, or a stock photo, what do you do? Some designers have the mentality that since the clients pay the check, then do what they want. A servile attitude, so to speak. By doing so, you’re diminishing your authority and expertise in client’s eyes. You need to be able to justify every single design decision you make to the client. One way to get around the “design by committee” problem is to re-iterate to the client what the goal of the site is. If they are aware your best interest is for their gain, then everything else is simply a means to an end. Focus on the end users of the site; often, your clients are not the end users.

Don’t be Afraid to Start Over

Some designers tend to be attached to their initial design, especially if they spent a great deal of time on it. They eventually find themselves putting band aids on something that just doesn’t work. Re-evaluate the design, in the most subjective way.

It’s also possible that during the design process, you find new or better techniques for the implementation. Starting over will save you time later, and it also produces a better end result.

Learn From Your Mistakes

A man’s errors are his portals of discovery.
– James Joyce

No project I worked on was ever flawless; there’s always something to be learned. With every lesson learned, one less mistake is made in the future.

Share Yours

How do you narrow your creative gap? I’d love to hear it. I’ll end this post with a video of Ira Glass (This American Life).