April 29, 2008 2 replies

The Prettier Side of Aggregation

Jeffrey Zeldman’s article, The vanishing personal site, brings to light what many of us have been wondering about in the back of our heads for a while now. Social networks that provide features often found in a personal website captured our fancies and stretched our virtual personas in all directions. That goes for both the knowledgeable and not so knowledgeable in web development.

The Question

It’s not really a bad thing, which Zeldman also stresses. The question is, now that you’ve scattered yourself all over the place, how are you going to put yourself back together?

Not that you need to; I’m sure not everyone would be interested in painstakingly picking up the pieces one by one and gluing them together. That’s why FriendFeed became an instant hit. But if you ask me, using another social network to put them all together does not feel good. Not one bit. I’d consider it another convenient (even organic) way to spread my own content. But that’s it. I still dream of the day I manage to tastefully put my stuff together in one place. Like these websites:

more

April 26, 2008 5 replies

tlbox: Bookmarking for Geeks

Created with programmers, system administrators, and web designers in mind, tlbox takes the very simple idea of saving bookmarks online. Now before you dismiss it as another one of those bookmarking websites like del.icio.us or Ma.gnolia, within minutes of using it you’ll find out it’s different enough.

How tlbox Works

tlbox menu in Firefox

tlbox integrates with Firefox (compatible up to Firefox 3). Once the add-on is installed, it appears as a dropdown menu much like your typical Bookmarks folder, except that it has a fixed set of iconized subfolders, ranging from “.net” to “xml”—basically categories that are relevant to computer geeks.

I thought this was a really great idea because previously, I was trying to organize all the web design resources I might find useful later on. I use del.icio.us for my online bookmarks, but even if I kept them neatly arranged with the help of tags, it’s became cumbersome to come back later and look them up. For example, if I wanted to look at my CSS-related bookmarks, I had to type in del.icio.us/sofimi/css into my browser.

But I wanted to do that within my browser window quickly. I tried it out with a local bookmarks folder, but I couldn’t share them with anyone else, or take them anywhere else for that matter (discounting syncing services like Google Browser Sync).

tlbox web interface

On the web, you can check out what other users are bookmarking, arranged by popularity and recency, and add them to your own “box”.

It’s also interesting to note the use of icons corresponding to each available category. This helps improve the user experience especially since bookmarking sites are almost always filled with text.

Improvements

I personally believe tlbox is a lifesaver. Unfortunately, it’s a very niche service, which means any chance of feature improvements will be slim to none, but I thought talking about it might draw in more geeks, more fans, and perhaps even potential investors! Seriously, I really wish the web gurus would take a hard look at it and see where it could improve.

The only thing that bothers me about tlbox is that when I save a site, the title of the page is truncated to 32 characters.

Rigidity vs. Flexibility

Even if its current capabilities are limited to computer-related bookmarks, it’s definitely easy to accommodate other categories. tlbox just needs to be a little more flexible. Just a little. I quickly got sold on this service exactly because it was not infinitely flexible like the tag-based bookmarking ones. I needed rigid categories in order to keep my links organized and easily discover related ones. And I believe other people might feel the same way.

April 23, 2008 4 replies

Baby Websites by Squarespace: Sharp Focus and Design

Baby Websites is a pretty interesting proposition. It’s a sub-section of hosted blogging platform Squarespace that caters specifically to the doting parents who want to show off their babies online.

The praise given by Business Week on the homepage reveals the competition Baby Websites is up against: .Mac. Sure, one can compare it to the rest of the blog software out there, but Baby Websites and .Mac pride themselves in more user-friendly interfaces and easier customization for a price.

Baby Websites by Squarespace

But that’s where the similarities end. The design of Baby Websites is Squarespace’s arrow that aims squarely at the target market. For once, the design of an Apple product looks like an afterthought! After you have seen Baby Websites, the .Mac website will look only satisfactory especially since it inherited its look from the rest of Apple.com.

.Mac by Apple

Of course, it’s the inside that counts. And Apple’s consistency with its subsites is no small feat. But you cannot discount the effects of pretty packaging. Apple knows that well. But good design is not just about making beautiful things. It’s also about purpose.

If I am a mother looking for a publishing solution for my baby’s website, which site will I seal the deal with? I would definitely prefer a product that shows exactly what it can do upfront. More moms will go, “I want to make a site that looks like that!” rather than examine all the pretty icons, specs, or videos one by one.

The .Mac page looks a bit too overwhelming for blogging newbies. Sure, it has great graphics and its features are neatly arranged in a grid, but that’s it. It’s just sitting pretty like that. Again, it now looks mediocre because exactly because it’s following a design convention it wasn’t meant to follow if it was supposed to appeal to its audience.

The first time I saw Squarespace I was enamored by it. Since then, I often find myself surprised whenever I discover a blog hosted on Squarespace for the simple reason that it looks different from the themes on the more popular blogging systems. Even the custom-designed ones seemed to carry the same airy, whitespace-filled aesthetic the default templates have. I believe a baby website is the perfect place to transfer that aesthetic, and Squarespace is an expert at it.

April 20, 2008 5 replies

The Inspiration that is Twitter

Whether you love it, hate it, or don’t get it, Twitter is a thing of fascination on so many levels. It’s supposed to be a one-trick pony, designed for the restless, the narcissists, and the stalkers (pick one) to answer one simple question: “what are you doing?”

Ironically, it has managed to spawn more innovations and hype—clients, web applications, memes, contests, meetups—than any of the big, bloated social networks. This is interesting because Twitter is not just a “web application”, which, literally, is an application that exists on and uses the Web. It’s an activity taking on many different forms in scattered locations, whose very nature seems viral, and whose openness seems almost unprecedented.

Identity and Branding

Twitter bird

Twitter has a stylized blue bird as its mascot. Although you don’t get to see it as often as its logotype, many Twitter apps have adopted the general idea of a bird to associate themselves with their mother app.

Twitter birds

The birds don’t even have to be blue, they don’t even have to look like the original Twitter bird. And the Twitter homepage doesn’t even show it, just several bird-themed illustrations.

Twitter clouds

Twitter’s colors and images have also been adopted by 3rd-party applications. Patterned backgrounds are definitely “in vogue” once more.

The design elements we can easily associate with Twitter has been called the Twitter Identity Transference Syndrome, TwITS. It’s clearly in effect when someone calls a completely unrelated bird logo a Twitter rip-off.

Interfaces

Twitter clients

Twitter users spend most of their time on their respective Twitter clients, whether it’s on the mobile phone, the Web, or the desktop. The most notable clients don’t vary greatly in features, although the biggest trend is integration with supporting Twitter applications like URL shorteners (more on that later), photo sharing, search, Hashtags, etc.

Snitter

Snitter’s users have created various custom themes, showing how versatile the Adobe AIR platform can be.

Twitter Botanicalls

Now here’s a completely different way of interacting through Twitter. Botanicalls lets plants “send” updates to their owners via Twitter when they need to be watered.

Design and Development

People are constantly looking for new avenues for their design and development experiments. Twitter, with its casual, even playful, atmosphere is the answer. Novel ideas, lots of bold colors, and almost always there are vector-based illustrations below.

overheard.it

Foamee

Strawpoll

Strawpoll Platform

Politweets

Color Wars

As an aside, one can always resort to mimicking the Twitter look. Twitterverse does not adopt the light blue color scheme but the logo and layout are a dead giveaway.

Twitterverse

TwitterNotes

Twitterholic clearly admits in its footer that it “ripped directly, and we mean directly, from Twitter.com”. Stealing the look, no matter how blatant, is an acceptable means of associating itself with Twitter. It’s on the opposite end of the TwITS spectrum.

Ironically, Twitter’s extensibility has more than made up for its lack of features. The websites above are the best examples of how you can create “groups” within Twitter. zefrank thought Twitter would be the perfect venue for Color Wars, and the whole thing just grew into a life of its own.

  • Hashtags lets you tag and track keywords within tweets.
  • Quotably makes threaded conversations possible.
  • Twubble finds your friends’ friends for you to follow.
  • Twixxer provides photo and video sharing features.

Twitter search is also another feature that is being improved upon by 3rd-party services. Why isn’t Twitter’s search function enough?

Linking, Popularity

Because tweets are limited to 140 characters only, Twitterers have to use URL shortening services when they share long links in their messages. Twitter uses TinyURL by default, but so many others have popped up since. URL shorteners have been around for a while, but Twitter is probably the web app that skyrocketed their popularity. I personally use is.gd as it is the shortest one I’ve seen, though I’m curious how other people choose theirs.

  • nsfw.in - for websites that are not safe for work!
  • linkbun.ch - for combining multiple websites into one
  • rickroll.it - not limited to rickrolling people though!

For the “Twitter purists” who believe you should only tweet what you are doing, not what website you find interesting, then are you saying all the clever little Twitter apps shouldn’t exist? There are even half a dozen websites built solely to track the most buzzworthy links on Twitter:

TwitterPoster

And websites that rank Twitter users according to popularity:

Humor

Twitter LOLcat

Early birds (excuse the pun) in the Twitter game will fondly remember LOLcats serving as the website’s error messages. It was very crude compared to the rest of the look of the site, but people loved it. And because Twitter wentgoes down a lot, many people saw and grew accustomed to it. They have since disappeared and have been replaced.

Twitter shirts

What is it about Twitter that’s got everyone a-twitter?

April 16, 2008 2 replies

The Latest Launches from 9rules and Paul Scrivens

There was a time then the words Paul “Scrivs” Scrivens and 9rules were synonymous to Wisdump. It feels like those days are so far away, but every once in a while something takes us back, like today.

9rules Relaunch and Submission Rounds

9rules is one of those communities that you have to be part of to understand. There’s no community on the Web that is quite like it.

It’s both exclusive—official members are handpicked during each submission round—and openmy.9rules brings everyone else into the conversation. It’s not just a social network, it’s a social content network. It’s constantly evolving, growing, and concocting experiments that redefine what it means to socialize on the web.

On April 30th, 9rules will launch a new (or is it old?) version of its website, but that’s not the only date present and future members should mark on their calendars. There’s also a new set of submission rounds, the first of which is on May 7th (followed by August 6th and November 5th).

More from 9rules

As an aside, check out these 9rules-related links they’ve been cooking up:

  • 3by9, a blog written by the 9rules team
  • Quofda, which stands for question of the day
  • Expert Idiot, a blog about internet companies

There’s one more website I’ll discuss with more detail below.

Emersian, a design blog by Paul Scrivens

Just how prolific Paul Scrivens is boggles the mind. Emersian is an unpretentious blog about design. One of his latest entries, You Are Not A Designer, is sheer proof of that. I particuarly enjoyed this bit:

The problem is how many people can design solutions to fix the problems a site has? How many people can take the ideas of their client and translate them properly to the screen? How many designers can look passed their own style and design a site that fits the current project?

… Push your limits. Test your boundaries. Designers like to work within their comfort zone because they know what they will like. Make something ugly to possibly come up with some ideas on how to make something beautiful. When you need inspiration create your own.

He ends the piece saying Emersian is an exercise in expressing his love of design, not his expertise in it. Once again we come across a website redefining what popular notions dictate otherwise. That design is more about learning prevailing over knowing, purpose over trendiness, foundations over superficiality, possibilities over limits. It’s always a struggle balancing these pairs, but that’s part of the job.

April 12, 2008 3 replies

Don’t Make Commenting Difficult

Websites are built almost solely on its communities. In the case of blogs, the communities hang out in the comments section. That’s where all the socialization and exchange of ideas take place. But writing a thoughtful comment alone is difficult enough. Don’t make it any harder for your readers.

This is one of the most horrifying comment areas out there:

techwithoutwires.com comment section

Now that’s a long scroll. This isn’t from a product landing page or a shopping site with pages upon pages of “special” offers. This is a blog, for crying out loud!

Let’s assume for a second that only the top box (which is the actual comment form) exists and focus on that. It’s just too busy! My eyes were all over the place with the sprawling combination of boxes and text.

I know it takes effort to align form elements. (Or not, since this particular site uses tables to do that.) But it would be much easier on the eye if all the input fields appeared in a linear fashion, one after the other, to minimize the confusion.

Linear is not always necessary, but always keep forms as simple as possible, if you can help it. Take a cue from Smileycat’s comment form design showcase and note how functional and uncluttered those forms are.

Okay, so you get through the ordeal of leaving a comment, but this blog says you’re not done yet! It continues to nag you with the “Blog this at your site” and the “Tell a friend” sections. It doesn’t help that the lack of comments subconsciously discourages the reader from actually commenting. Even if there are any comments, those two extra panels have already separated the reader from the “leave a comment zone” since the comment box is now too far away.

The Share This button is certainly more desirable, both in form and function, than these bulky boxes. If you don’t think a button will cut it, what about collapsible panels with JavaScript?

Since the comment form above belongs to a blog in a blog network, many more readers will be turned off and confused by this comment form on several different blogs. It’s not too difficult to elminate this usability problem: Don’t complicate the process. Don’t ask too many questions. Don’t look desperate. Just let them comment.

April 9, 2008 8 replies

Feed Awareness (or the lack thereof)

In an effort to raise awareness about syndication on the Web, Daily Blog Tips has started campaigning for another online event: RSS Awareness Day, which happens on May 1st.

Now I have got to wonder why we have to be so specific and tackle only RSS feeds and not feeds and syndication in general. Why call it RSS Awareness Day when it should be called Feed Awareness Day instead?

And they wonder why

Copyblogger asks, “will RSS ever go mainstream?” Again, that’s asking the wrong question! It’s like explaining how Gmail works, instead of how email does. And they’re wondering why very few people are using RSS—correction—feeds.

Eliminate the confusion

Choosing to shine the spotlight on RSS alone becomes another obstacle to actually understanding—and not just becoming aware of—web feeds. It confuses the very people we want to educate.

RSS is a standard, not the standard. The default feed format for WordPress blogs may be RSS, but on Blogger, it’s Atom. You can’t even guarantee that blog platforms offer RSS feeds. How will you explain that to people who unwittingly discover this fact? And how will you explain all the other buttons that are not labeled RSS, but XML, Atom, or RDF instead? You’d be opening an unnecessary can of worms.

Some friendly reminders:

  • RSS is a feed format.
  • RSS stands for several things, including “Really Simple Syndication”, “RDF Site Summary”, and “Rich Site Summary”
  • (Note: RDF stands for Resource Document Format.)
  • RSS is a feed format written in XML.
  • (Note: XML stands for Extensible Markup Language.)
  • Atom is another feed format.
  • (Note: Atom stands for nothing.)

If you’ve been on the Web long enough you might appreciate all these acronyms, but ordinary people don’t. Do them a favor and make it simple for them. Do not recite the list above to them (that was just there for your geeky pleasure). Just explain what you can do with a feed, and how easy it is to use.

Awareness, truth, simplicity

The feed icon is a standard for not just RSS, but all types of web feeds. And just as this icon has helped us understand feeds in a symbolic, abstracted way, we should do the same for those who haven’t understood yet.

Please, if you’re going to start a campaign about awareness for normal people, convince them how easy it is for them to participate. Don’t geek it up. Do it right.

April 8, 2008 say something

Presenting the Best of Wisdump

Wisdump has a lot of content. A lot of great content. It’s been around since 2004 and amidst all the changes this website has gone through, the most important thing is for readers to gain access to these thoughtful, timeless articles that would otherwise be buried in the archives. Ladies and gentlemen, the Best of Wisdump is here.

Now I’m not too happy about arranging these posts reverse chronologically, but for now it will do. But I would also like to know what you think are the best posts on Wisdump, and how we should present them. Should we let readers rate posts? Use a popular posts plugin? Let your voice be heard in the comments!

April 5, 2008 13 replies

Standardizing Icons for the Web

The Web would be much more chaotic than it already is without standards. Today we’re going to talk about how various content on the web is being represented by standardized icons. Several groups of people have come together and agreed upon these simple yet distinct icons for identifying syndicated, OPML, geotagged, shareable content.

It’s interesting to note how these standardized icons emerged. The OPML, geotag, and open share icons all base their design on the feed icon. They each consist of a white symbol on a square box with rounded corners. The boxes have a subtle diagonal gradient and an inner border which gives a slightly beveled effect.

Feed Icon

Feed Icon

The feed icon was introduced to us by Mozilla and is used for syndicated feeds in either RSS or Atom. You can instantly infer that it stands for a signal being beamed to the rest of the world. This icon is so popular that it has been transformed in so many ways to match websites and tastes. (It’s even been turned into a real-life pillow!) But now matter how many bells and whistles designers add onto it, the icon is a much more comforting sight than other buttons and chicklets labeled XML, RSS, Atom, My Yahoo!, Bloglines, or whatnot. Icons say so much more than words than obscure acronyms—which ordinary Internet users don’t even understand. They don’t need to!

Visit the feed icon page.

OPML Icon

OPML Icon

Related to feeds is OPML, which is an XML format for outlines. Its popular use right now is listing a group of feeds. Think feed reader reading lists and blogrolls. They can easily be shared with the OPML document format. Compared to the feed icon, the OPML icons is not as meaningful, but it’s still catchy especially since it looks like an “O”.

Visit the OPML icon page.

Geotag Icon

Geotag Icon

Geotagging is basically adding geographical information to certain content, such as photos, through a link. The geotag icon is a pushpin on a globe, which stands for pointing out a certain location in the world. It’s a really good symbol (though if you read Jeremy Keith’s tweet you might think differently from now on). It’s just that the globe looks too small for the pushpin.

Visit the Geotag icon page.

Open Share Icon

Open Share Icon

You might have heard about the Share Icon, which came from Alex King’s excellent plugin, ShareThis. We’ve talked about the service here on Wisdump not too long ago, but there’s been a controversy surrounding the use of the share icon itself. Thus, the Open Share Icon Project was formed to address such limitations.

The open share icon shows a hand passing an object to another hand. It also looks like an eye. This is much more descriptive than the share icon, which is a node branching out into two like a binary tree, if you’re familiar with Computer Science, and feels too tech-y for the mainstream crowd. A star could have been an easy choice for an icon, since it’s used in both Internet Explorer and Flock to denote “favorites” or bookmarks, but the act of sharing isn’t conveyed with it.

Visit the Open Share Icon page.

More Standard Icons?

Are there any more standard icons out there? The Microformats project has put together several icons that can be used for such. Semantic Web, anyone?

What sort of actions and content on the web actually need icons like these? File uploads and downloads? Email addresses? Tags? Asking these questions makes me want to discover what the next generation of web technologies will give us. It could be something we haven’t even imagined before.

Steal These Icons

If these icons aren’t used, they’re all for naught. We all want some consistency on the web, especially it’s made of tons of information constantly being created each second. Especially when the technologies that provide this information are still very new. Using these icons means turning data into more meaningful and properly labeled content we can all identify and understand more easily.

April 1, 2008 7 replies

Really Good Ideas from April Fools’ Pranks on the Web

It seems the online world is the perfect place for all the madness taking place every April 1st, but I’ve noticed some of the pranks circling the Web today are really good ideas and worth discussing here on Wisdump.

Gmail Custom Time

Gmail Custom Time

Gmail users have long wanted a send email in future time feature to avoid unnecessary follow-up and back-and-forth emailing, but Google spins it around. In addition to “never delete another email again”, there’s “never send another late email again”. You can send an email timestamped as far back as April 1, 2004, which is when Gmail was launched and a clue right there how legit this feature is.

Many people would love to have custom time/date stamps on their emails—I know I would. But it becomes a case of deception versus productivity. Will Google continue to draw the line? Do you see this happening in the future? If you can do it with blog posts, why not emails? If you’ll remember last year’s prank, Gmail Paper, it’s another great idea that asks “why not?” too. (And, if anything, testimonials don’t make a product believable.)

Also check out Google’s other pranks for this year:

  • Virgle (see also Larry and Sergey’s video), the first human colony on Mars
  • gDay, which lets you search content on the internet before it is created
  • Google Wake Up Kit, a system that sends increasingly annoying alerts (SMS, water bucket, bed-flipping device) to wake you up - it’s potentially a good idea, but it’s not as subtly executed as Gmail’s pranks so I won’t elaborate on it

Whew! Google’s been busy this year!

ProBlogger Launches PayPerTweet

Darren Rowse on ProBlogger has launched a way to monetize Twitter with PayPerTweet. This totally makes sense because we’ve long wondered how Twitter could possibly be penetrated by advertisers, and we get a pretty viable answer.

Problem is, Twitter is a pretty trustworthy environment right now—you follow only whom you want to and the second they start spamming you, “unfollow” is always one click away. PayPerTweet is not just a prank but an addressing of the question we’ve all had on our minds: who will cross the line and bring advertising to Twitter? Are we there already? Will you tolerate it? Perhaps fake tweets like announcing PayPerTweet and other pranks—rickrolling is such a big thing these days—is the closest thing we’ll ever get to sneakiness (read: sponsored tweets) on Twitter.

Another great thing about the PayPerTweet announcement is that because it’s a blog-based prank, the comments section clearly shows who got punk’d and who managed to call BS. And you can discuss in a follow-up post the success (or failure) of your prank. We thus find out that PayPerTweet came from an actual proposal to advertise via Twitter for $20. Darren Rowse refused the offer.

Tufte joins SlideShare board of advisors; No more bullet points

Renowned information design expert Edward Tufte joins SlideShare’s board of advisors to help guide people in presenting visual information the proper way. The online slideshow service will employ technologies that automatically eliminate bullet points, chartjunk, and other distracting elements from presentations.

Even if you’re remotely interested in design, you probably believe the world will become a better place by throwing out crappy PowerPoint slides. But is Microsoft to blame for all the ugly, overloaded, and difficult-to-read slides? Can and should software encourage and impress upon its users the principles of good design? And since we know that PowerPoint, as well as Word, was made for business, should we expect people in non-design industries to have rudimentary design sense (i.e., should it be part of their job description)?

Spirit of ‘98 Wordpress Theme

Spirit of ‘98 WordPress Theme

Darren Hoyt releases a WordPress theme that showcases the hottest web design techniques ten years ago. How nostalgic! When you click on the preview image, a JavaScript alert comes up, saying, “Happy April Fool’s — seriously, you were gonna download this?”

I wonder how many people actually clicked, or if Darren Hoyt kept track of how many did. Using this theme would be a really good April Fools’ prank; too bad no real theme files were created. Update (April 7, 2008): Somebody actually did a similar prank! Jasongraphix redesigned his site with the “90s look” on April 1st! There’s always the possibility that somebody out there actually finds this theme attractive. This got me thinking: did you really think that old school web design was tasteful back then? Do you think the current web design trends will be considered attractive in the future?

In 1998 I was a freshman in high school and we were supposed to create webpages on a slow, 16-color (yes, literally 16 colors only, not 16-bit) computer, with no graphics program, and had to make do with whatever images were installed on the PC. My geekier-than-thou classmates were fooling around with DHTML alerts and scrolls, and I was too flabbergasted at the limitations of the computer I was using to even see how it was possible to create a decent-looking website. Today, I see people worship the Apple aesthetic, but bash rounded corners and other bright, shiny, glassy Web 2.0 looks, then proceed to play tug-of-war between light, clean, grid-based minimalism and dark, dirty, anything-goes maximalism.

Update (10:48 PM):

Helvetica Serif

Helvetica Serif

The Serif announces that FontFont will release a Helvetica Serif, which is a digital recreation of the sketches by Max Miedinger’s granddaughter.

If the little nuances in the image above don’t already give away the impression that this is a less than spectacular typeface and couldn’t possibly match the sans serif that is Helvetica, that’s okay. But know that having a serif version of Helvetica is a really big deal, quite an impossible one actually. (Update 04/02/08: Stephen Coles of Typographica.org reports in the comments there’s Helserif by Phil Martin.) Helvetica stands for everything a serif typeface isn’t. Do you think Miedinger would come up with a serif typeface just for the heck of it? Do we need a Helvetica Serif? Who should be tasked to create it?

I hope you’re having as much fun this April Fools’ as I am. Don’t forget to check out the most popular April Fools’ Day pranks on the web then go vote for them here.