Oct 29, 2009

Images replace words

A picture is worth a thousand words. In general, images are more powerful than words when it comes to clarifying parts of our communication. Maybe ALL of our communication -- this can be the subject of another topic -- but since we have relied so much of our communication on words (spoken or written), here I will take a stance that words and images are both essential and compensate each other.

I will use two examples to illustrate how images effectively replaces words to make the whole communication shorter and clearer. One is a presentation slide from Garr Reynolds, a presentation guru and the author of the bestselling book, Presentation Zen. It shows the power of pictorial aspects of images ( = photos and illustrations). Another is an informative map from Information Architects, a Tokyo-based interaction design firm. Their informative maps show the symbolic aspects of images ( = patterned symbols and icons)

Presentation Zen
Presentation Zen is an impractical advice about making practical presentation (Sorry Garr, your advice is so sweet and motivative that it almost sounds like music, but is hard to follow to me). Nevertheless, being a guru, his presentations are highly aesthetic and easy to understand. Let's break one of his presentations down and see how images are used.
Slide No.1: Seduction. Come on, it's gonna taste like a raw sushi. What does a sushi image has to do with presentation? Nothing. But it has a loose connection with the word "Zen" (both are from Japan) and anyhow, most of us love sushi, or have heard it is delicious.
Slide No.2: Example. This is how you reduce clutter. Here, a series of stones shows what it means to reduce clutter. By showing a set of stones built on fragile balance and making it more stable step by step, Reynolds effectively demonstrates both the definition of reduction and the effects behind it.
Slide No.3: Catalyst. Open up your heart, now. We all have different ideas about abstract words such as emotions, as used in this slide. What shall we do to demonstrate such words? The answer: let the audience come up with their own definitions. A beautiful image of a nature always work well for this purpose.
Slide No.4, 7, and 8: Focus. Read the words. In these slides, Reynolds uses the lack of image to guide users to focus on the texts (which is the default usage of presentation slides) but since his previous images were so effective, users also notice that something is missing, which also enhances his "less is more" philosophy (slide No. 7).
Slide No.5: Humor. I know how you feel. Reynolds shows his sense of humor and humiliation by laughing at his own expense (presentation IS boring, isn't it?). This image shows the power of visual clearance; unlike verbal humor, we don't need to think hard (sometimes) what the punchline is.
Slide No.6: Future. This is where you can apply what you have learned today. The image shows the future (or current) possibility -- where the presentation philosophy can be applied in our real life.
Slide No.9: Switch. That's it, thank you ladies and gentlemen. The image demonstrates clearly that the slide is over (we all know that it is not always that clear), with grace and appreciation. What works better than an image of a theater curtain?

Information Architects
Based in Japan but originated in Europe, the members of the design firm Information Architects organizes information (especially that related to the web) in a series of 3D-like interactive maps. Titled Web Trend Map, users not only understand the "big picture" but also dive into each of the presented website easily. The unique part? They map information on real locations. The following is such map for Infographics web sphere, mapped over geographics of Manhattan, New York. Let's see what makes this map effective, in terms of graphical symbols and wayfinding.

Icon: graphical icons makes it easier to identify the website because the real profile photos are copied from the original websites. It is not only easier than creating original icons for each website, it is also more effective.
Symbol:all information is presented according to a set of design rules (including icons). Even the title texts are presented in icon-like manner, making the whole presentation a collection of symbols. Once users get used to the rules, identifying information becomes easy because even text search turns into graphical (symbol) search which requires less brain power.
Wayfinding: I know -- even though the map is based on Manhattan, aside from landscape there is nothing that resembles the real location. Nevertheless, mapping websites onto a pseudo-location works well for wayfinding, because we are wired to memorize a particular place (in this case, a website) with regard to its surrounding markings. Isn't it easy to memorize a location when it is presented like "cross the Brooklyn bridge, turn to the left, walk two blocks"?

Bonus: Why not have a gigantic web trend map covering the whole web sphere, based on Tokyo's rail system (which is arguably as complex and 1/100th as convenient as the Internet)?

Oct 22, 2009

Social bookmark, taxonomy

I have started to use Delicious.com (former Del.icio.us, I guess) to keep my design/writing/inspiration related bookmarks in one place. I was nervous: I have never used a social bookmarking service before and I rarely bookmark a website even in the browser in my computer. Here is the link.



Setting up an account in Delicious and bookmarking the first website were completed in 5 minutes. No Help, User Forum, "Expert" Blog was necessary. This is what I LOVE about Web2.0 services. Good-bye to my days of tap-dancing at installation step No.3 for hours, filling my stomach with rage and barely suppressing the desire to grab a hammer.

Sometimes we only realize our behavioral patterns when they are laid in front of us. The screenshot on the right shows the top 10 tags of my bookmark. Do I see any pattern here? (Aside from the top two tags "msptc605" and "design", which basically are titles of this bookmark)

The answer is yes; my bookmark is heavily front-loaded with ideas. The four top tags -- Inspiration, creativity, idea, and ux (user experience) -- they are some of the most overrated, hyped marketing buzzwords of all time. They also present a surprisingly accurate portrait of what interests me. I can say I am fairly obsessed about understanding the fundamental trend that moves our society rather than following what comes out of it.

Tagging, or folksonomy (folk + taxonomy = casual labeling),  is what social bookmarking is about. The original taxonomy focused on systematically organizing complicated information, such as species and atoms. When taxonomy acquired popularity among us mortals, it turned into folksonomy. After all, collecting favorite items and labeling them are one of our basic desires. We collect shoes, photos, quotes, and, er, stamps. I confess. I did.

Recently, another twist has been added to folksonomy and its application: the Web. What did the Web allow us to do?
  • To collect information, not only physical objects
  •  To share and connect with others easily
A bulk of our collections has become information-oriented, publicly shared in a massive scale, which has never occurred before. Folksonomy, or people's labeling behavior, has adjusted to this trend by standardizing the tag to a set of common keywords to be recognized by as many people as possible. We can summarize this trend as follows.
  1. Taxonomy meant systematic classification of information by professionals.
  2. Collecting information became easier, therefore taxonomy became personalized and folksonomy was born.
  3. Sharing information became easier due to the Web, therefore folksonomy has evolved into a standardized tagging structure (still ongoing).
  4. Streamlined tagging encourages creation of huge tag database, which will create its own application (see next paragraph).
Is social bookmarking a democratic taxonomy that allows the community to peer review the content of the Web, or is it a disorganized collection of personal preferences?
Both are true, as in any "big question". There, we can go to bed; we have two more days until Friday evening.

But seriously, I believe both are collect. We do collect our personal preferences in disorganized manner. but nevertheless social bookmarking works as a peer review system by counting the number of people who tagged a piece of information using the same keyword. If we frame this question as "either or", we will miss the whole picture. The strength of social bookmarking lies in its filtering mechanism, the power to present trends and statistics out of "disorganized personal preference".

Do I believe that social bookmarking is:
  • Democratic taxonomy? - Yes. We now "own" labeling.
  • Peer review of the content of the Web? -Yes. In general, the more bookmark a web has, the more useful the content of the website is. Here, the work "useful" does not mean "to anybody" or "historically" or "scientifically". If people want to read more about Paris Hilton, and TMZ.com provides a detailed report of her recent life and acquries 10,000+ bookmarks, then it is a "useful" information at that moment. Maybe even historically: "This day 30 years ago, a record number of bookmarks were recorded over Paris..."
  • Disorganized collection? -Yes. We all start collecting information that way. One of the great features of social bookmarking application is automatic filing: we put tag, the software stores the information in organized manner. Once we as users find it out, we become even more lazier about organizing information in the first place...
  • Personal preferences? - Yes. What else?
We see that the social bookmark enhances our personal life. How about our professional life? In the earlier paragraphs I found my social bookmark pretty accurately reflected where my interest lies, even though the bookmark only contained 18 sites. I believe the same will apply to other people. We can peek into a person't interest and professional world through his social bookmarks. Social bookmarks works as an indirect approach to duplicate his thinking pattern, knowledge base, even wisdom, and more - we can expand our own idea based on his experience.

The most obvious application of "social bookmark as a professional tool" is training -- to let students, interns, or any sort of newcomer to an organization to catch up with its philosophy or business. Unlike traditional textbooks and seminars, bookmarking is cheap, accessible, and can be upgraded easily. But it is also a static, Web1.0 usage: learners mainly receive information, only occasionally contributing with new items.

I think if we push the envelope further and use social bookmarking's collaboration and peer review feature (to shift the focus from the "source" side to "users" side) more extensively, we might come up with a new application for our work life. One trend I would like to see is the "democratizing" nature of social bookmarking affect the traditional, top-down corporate culture and turn it into team-oriented, flat organization. Today, being "flat" is used as a keyword for double-standard: on the surface, it means democratizing the society and workplace; deeper inside, it means taking advantage of other people more systematically.

Can social bookmarking (combined with other forces) socialize our culture?

Oct 18, 2009

Web 2.0: Past, Present, and Future

Four years have passed since Tim O'Reilley and his pals famously started endorsing the new era of the Internet: Web 2.0. Some people got excited, some got sceptical, commenting "Isn't it just a marketing buzzword?" Looking back, I think we were all missing the point by asking that question, because everybody knew something was happening. The right question could have been: "Does Web 2.0 describe accurately what is going on?"

The way we interacted with the Internet had been changing -- it was getting much "closer" to our physical life -- and we needed a word to describe it, because we weren't only excited about the change; we were also scared of it (I believe that was why some people tried to blush it off as a buzzword). Web 2.0 might not have captured the tangible details of the changes we were experiencing, but it worked perfectly as a blanket term, capturing the "feeling" we had.

But again, four years, which amounts to a generation in the Internet, have passed. Let's take a closer look at Web 2.0; what it was about and how it has evolved into the current Internet we have (I name it Web 2.5).

Web 2.0: From viewing to using

Web 2.0 largely described the transition in how we interact with the Internet from "viewing" to "using". The Web 1.0 usage (viewing) was summarized in this phrase, "surf the web", that described how we initially interacted with the Internet. Users moved from one website to another, viewing static images and texts, just like a surfer riding along waves of information. Was it fun? Maybe yes. But the whole interaction was largely about receiving existing information. If there was any interaction between the user and the web, it was downloading files and photos; still, a passive activity.

Then slowly, we started to go deeper: uploading files, writing comments, and even chatting with our friends. Yes, the technology for interaction existed long before Web 2.0 caught our attention. I remember playing deathmatch games online using Doom (to get away from the pressure of thesis writing), and it was 1994. But we had to wait until the dot-com bubble and its burst for the interaction to become widely available, and for users to become aware of the power they had in their hands.

Thanks to a handful of companies and online communities that survived the dot-com bubble, "interacting" with the web started to creep in to our online activities. Instead of just viewing, we searched using Google, shopped using Amazon, exchanged using Craigslist, and contributed using WikiPedia. That is what Web 2.0 is about: from viewing to interacting.

Here I summarize what I believe are characteristics of Web 2.0.
  • From passive to aggressive: As I explained in the previous paragraphs, users no longer just sit there and click the Next/Back button. Interaction, not viewing, is the new way to communicate on the Internet. Welcome back, Mr. Keyboard.
  • User-contributed content: Add user reviews to Amazon, trackback or comment on a blog, Edit some lines in Wikipedia... the degree of contribution varies but users take siginifant roles in content creation.
  • From installation to registration: Desktop application is so Web 1.0. Welcome to the online service era, where users no longer need to fill the system administrator's role....well, this was the promise of "Web 2.0 companies", anyhow. We know the reality took a different road, but that will be discussed in the next paragraph.
  • Free is the beginning, not the end: Make something users want, increase your community, then figure our how to make a profit. That is the business model what Google and countless other companies followed.
Web2.5: From using to living in

Now what? What has changed since 2005? The answer might be everything, if we focus on the specifications and features of the Internet, and nothing, if we take a step back and glance at the overall trend. Interaction is the norm, it hasn't changed at all, has it?

I believe an important trend, which did not receive much attention back in 2005, has been emerging: the "community" experience realized by social networks and post-Web 2.0 applications, including Facebook, MySpace, YouTube, and Twitter.

In these applications, we all create our online persona and broadcast our activities inside the community or to the external world. What is special about these applications? Answer: users themselves are the content, as opposed to users interacting with the content. The service provider only prepares the framework: user interface, registration scheme, widgets, and so on. We can argue that social networks are virtual realities minus 3D graphical projections (and audio).

Otherwise, have things changed? Here I summarize how characteristics of Web 2.0 has evolved to today's Internet, Web 2.5 as I call.
  • From aggressive to passive-aggressive: We will never go back to the silent view era, but we are also not pushing the "aggressive" interaction too further. A Tech Crunch article summarizes the recent trend of mixturing static (passive) and dynamic (aggressive) communication into one service (i.e. the way we communicate in real life), as in Google Wave.
  • User-created content: Especially in social networks, users are no longer mere "contributers." In many cases, they create all of the content, including the "old" Web2.0 organizations: Craigslist, Wikipedia, etc.
  • Registration and installation: Did everything move from desktop to online, eliminating standalone software packages? Well, no. Some people say it is a matter of time, but for the time being, desktop applications and web applications live together. The broadband got wider, but also CPUs and memories got faster and bigger. What really has become "online" is software distribution: now it is hard to find any software that cannot be bought online for download.
  • Free is the beginning and the end: What happened to the "how to make money" discussion? None of the social networks are charging money to users who only access to basic functionalities. They charge money to users who wants to do something extra; in other words, the "collect money from everybody (eventually)" mantra has been replaced by "collect money from heavy users (encourage everybody to become them, eventually)."
Let's go back to the "community" aspect on Web 2.0 (or 2.5). Regarding this topic, I am especially interested in how we create and manage our online persona for online communities (online identity). In other words, I am wondering why we behave differently online than in offline and do not feel (too) strange about it.
Personally, I am seeing notable difference between my online and offline persona, as follows:
  • I am more social online than offline.
  • I am more talkative online than offline.
  • I am more humorous online than offline.
  • I have more acquaintances online than offline.
For example, in my Facebook and during my chat, I frequently hug my friends, send them gifts, invite them to events, all of which I seldom do in my offline world. As I observe my friends, I see similar patterns; looks like everybody behaves "differently" online. The scary part is, we all behave consistently (with integrity) online, as if we were born that way. I have even acquired a habit of ditching my pre-formed idea when I meet my online friends in real-life for the first time.

I am not sure where this split-persona behavior goes. Maybe we fuse the online and offline persona, maybe we will comfortably live with multiple personality. I haven't found a good resource on the Internet discussing this split personality issue yet...

Oct 13, 2009

Technical Writer -- the 28th best job in America

CNNMoney has updated The Best Jobs in America annual survey for 2009. Technical Writer is in the list at 28th.

I find this article very interesting: if we pretend we know nothing about technical communication and judge Technical Writer as a career option solely from this study, the logical conclusion might be "rock-solid" at best, "bored to death" at worst.

All parameters in "Quality of Life Rating" show grade B, the annual salary range sits comfortably between $50,000 and $100,000, and even the overall position in the list - 28th out of 50 - walk the middle of the road.

New Jersey Institute of Technology (NJIT)'s slogan is "The edge in knowledge" but at least in Technical Communication, this study implies there is no edge at all: it says we are the nuggets, air hockeies, Wii Fit of science and technology...enough.

Of course I personally find technical communciation a very edgy field, waking up every most mornings with excitement as being a technical writer smile

Oddly I do not feel much stress doing this job, probably because whenever I feel stressful, I remember my previous job as an FAE, enduring being yelled at customers' site and sleeping at odd hours.

Oct 10, 2009

Reviewing a website design: old vs. new

This is a study of website redesign, comparing the new with the old.
Wenceslao Almazán website old: http://www.wenceslaoalmazan.com/links/oldpage/wenceslaoalmazan.html
Wenceslao Almazán website new: http://www.wenceslaoalmazan.com/

I prefer the new design to the old one. At first sight, I thought the new design made the website more dynamic and fancier, but sacrificed usability. But after playing with both sites for a while, I changed my idea. The new version not only provides more fun, but also is easier to navigate (for me).

The old website lists categories and links in aligned manners. All the major links are listed at the left or bottom, and the animated gimmicks are used only as playful accents, not as the major navigation scheme. However, after viewing some of the links, I found the old website hard to use for the following reasons:

* Everything is compact (nice), including the letters and portfolios (not nice). I started to look closely, leaning on the display of my laptop.
* There is no way to control the animation - do I have to watch the whole loop each time?
* I couldn't find the 'back' button to the main menu easily.

The new website looked too random, too interrupting on the surface: but I found its navigation scheme is consistent, actually.

* Because the portfolio presentations do not jump to different page structures, navigating the website and finding the 'hidden' button became fun - because I was sure I won't get stuck in one place.
* I could control the animation and also watch the overview of each of his portfolio category.
* I no longer had to squeeze my eyes to read the texts and view his works.

I think the artist wanted to create a website that is fun to be around, and he did it brilliantly without sacrificing usability. He even considered conservative users: the good old text links are also available at the bottom.

I do think functional-wise, the old website was better. But I also think functionality (or usability) should be the one to support the design (the main message), not the other way around.

Oct 2, 2009

Evolution of a Google site website part 1: creation

The screenshot below shows the initial design of a Google site I am going to develop. It should evolve into a visual-based learning site for an audience like me, who prefers visual, reflective, and conceptual learning material over verbal, linear, and practical material.


It is a no-frill website (I thought about making it completely black-and-white but wasn't brave enough) with a large main content area and a sidebar at the right. Because it is a learning site, the audience should not receive visual clutters from the backgrounds and peripherals; the structure is kept simple so that all attentions from the audience go to the upcoming learning material at the center.
Aside from narrowing the main content area, I currently have no idea about how to design this website to make it work more effectively as a learning site. As I modify the visual appearance, I will record the process here in this blog.

10 Tips on Writing the Living Web

I met this article seven years ago, when I was still contemplating whether or not to create my own blog. Movable Type was in its infancy, so writing on the web still required a considerable amount of system administration work, which provided a good excuse not to write on the web.

Then Typepad came out, and together with several online articles, I finally gained enough push at my back to start my blogging life. 10 Tips on Writing the Living Web was one of these articles.

It reads more like a philosophy than a traditional collection of tips. None of the tips offer technical insights such as font selection, formal or informal word usage, and so on. But the article warmly encourages the readers all along, culminating at the last tip, Relax! At the same time, it does not sugar coat the reality: if we need to invest a considerable amount of energy into writing, it says so (Write often). If we have to be brave enough to speak the truth, it says so too (Stand up, speak out).

I read the article again thanks to the collection of links from Professor Ronkowitz, and I am amazed at how timeless it is. No part of this article feels old, even after seven years (= 70 internet years). I recommend this article to anybody who is wondering if it is worth writing seriously on the web.

Oct 1, 2009

How to write an effective biography

The definite guru on graphic design and typography for us dummies, Robin Williams, puts her 'real bio' on her official website. It is a story of an incredible life from an ordinary person who took an incredible path by choice. I went there hoping to get a tip or two on writing an effective self introduction. I did get a tip. A big one:

You want to write a good biography? Live a life.

Here is a long snippet. Few words can encourage us more than this paragraph to move on with what we believe in.
I am a teacher. It is my path. It is what I am supposed to do. No matter what is going on outside--divorce, unhappiness, anger, poverty, death--when I walk into my classroom nothing else exists except my students and our work. Teachers certainly don't teach for the money. Real teachers teach because they are supposed to. I didn't plan do what I'm doing. When I was in high school I had a small business teaching swimming in my parents' backyard, and all the moms and dads assumed I was going to be a kindergarten teacher. "A teacher!" I exclaimed with dismay. "Oh no, I will do something much more exciting than be a teacher!" It took many years for my path to unfold, and I had no clue where it was leading. But now that I am here, I see that it happened the way it was supposed to. I did not know I was on a path, but I see now that having the courage to live in the "wisdom of uncertainty," to take jobs I had a passion for instead of the ones that offered the most benefits and highest pay, to be willing to struggle to happily make ends meet rather than live in a miserable partnership, to take the anger and bitterness after a divorce and direct that energy to getting my own life together rather than trying to get money out of him, eventually led me to a very satisfying place, a place that offers so much more to me than I ever thought would happen in my life.
This is the book from her that any aspiring designer should own.
The Non-Designer's Design and Type Books, Deluxe Edition

P.S. This biography is also totally funnier than the recent works from the actor with the same name. I think he agrees.