We will soon implement the Twitter OAuth to @tweetitow so we need a new website for it with all the shiznits and the shiny-glimmering design. Since, we do not have someone who can design the website because we’re too cheap and dirt poor, I have to trust my hidden talents.??
So this is how I came up with the soon new home page design of @tweetitow.
- First, look at all the different websites, observe, and copy their ‘design pattern’ in a subtle manner. So my resources are the following social sites:
- Twitter — of course,??Plurk,??Dailymile,??Foodspotting,??Picnik,??Flickr,??Foursquare,??Gowalla,??Posterous,??Tumblr,??Last.fm,??Hunch,??Boxee.tv,??Dropbox,??Box.net,??PBworks,??Brighkite,??Check.in,??Zingled,??Formspring.me,??Facebook,??Piclyf — because I love our own,??Loopt,??Wheedly — because I love the ‘boys’ behind it,??and many many others. Sorry if I forgot to mention you.
- If you look at them, social sites or service sites, their home pages contain more or less the same elements:
- There are the usual: Login button, About page, Contact Us, Help/FAQ, Blog. I think you call these ‘footer.’
- The SIGN UP/JOIN NOW/CREATE ACCOUNT button must be the biggest and most attractive element. That it will be the first to catch your attention. You must design it in a way that viewers are hypnotize to create an account.
- Then there is the one-liner description about the product/service. It’s usually a functional description of your product, but at the same time it must appeal to the emotions of the viewers. In short, you must have that one-liner cheesy feel good description about the product that your intended viewers can relate to. So if the LOUD signup button does not catches the attention of the viewers, the one-liner will be the back-up move.
- Giving your viewer a peek into what they can expect from your web application. Twitter does it by displaying streams of tweets, and the faces of users. Others have the usual demo video — boxee.net has a cute way of doing it but I’m not much fond of eye-candy websites. Others put headshots of their users. This will also serve as like the quick guide on how to use the application
- I do not know what’s the term for that, but you will sort of divide your page. Usually they will divide it into 4 — upper/lower left, and upper/lower right. Anyway, I hope you get the picture. I believe that’s how then you try to arrange the different elements in your page.
- And, the most important is that the LOGIN/SIGNUP link/button must be somewhere on the upper right area of the page. I’m not sure what’s the reason behind this. But we humans are already trained to look at that area if we want to log-in/signup so let’s stick with that. If we are going to place it somewhere, viewers might need to invest time and effort to look for it that they’d rather click the X of the browser.
- All in all the main story here is that do any thing to convince the viewer to create an account, and use your application.
From all the sites I look at, I really love the home page of Brightkite. I love the blend of color, and the cute illustrations. It looks fun, but not in a loud manner.??
So here is what I come up with after looking at the different sites. It’s a far cry from brightkite, but I hope the story is there. I want it something funny. This is just a draft, and I’m showing it off to hopefully get comments from a more knowledgeable people.
I copy the design from: posterous, last.fm, and gowalla.
The other concept in my wonderful mind is something like with a touch of Pinoy. I want a colorful jeep with images of our Sto. Ni??o, then take it from there. So I wish someone can implement the following in a fun way. Picture here credit to??.
Or, if all things fail, let’s do the minimalist way. Can you guess where I rip this off?
Ideas, concepts, and whatnots are all welcome!