I’ve been playing around with bebo a lot the last few days. (You can add me here, if you actually know me.)  More specifically I’ve been playing with their developer platform, which as you may or may not know is a clone of Facebook’s.

So aside from having an impressively low number of friends on the site, there are a number of usability issues and quirks I wish they would fix.  So here they are:

• Improve your navigation - finding apps, and things to do on the site is harder than it should be. Add a subnavigation menu or something! Or a sidebar.
• Improve the forums for apps
• Improve the documentation for developers, seriously all your revenue growth will come from this.
• Rework your app directory, facebook’s app directory stinks, and yours is already terrible and its been open for a few days.
• decide what your focus is going to be, are you all about the users, the relationships, or what? Once this decision has been made, rework your homepage and personal start page to reflect that.
• merge with virb. just to get their design.

If I had more time I would’ve posted screenshots and more. If Bebo wants me to do some ideas, they can contact me via my bebo page

So I’ve been playing around with grid based layouts a LOT lately. After seeing the blueprint css framework, I decided this was the perfect time to try designing with grids. For those of you who know me, I have been completely self taught as far as web design and interface design is concerned. Everything I know I learned from reading books or trial and error, so I don’t have the formal background most designers have regarding typography, style guides, etc. Anyway, back to the grids I saw on blueprint here, I decided to make my own grid template for laying out pages and wireframing them.
.
So to begin I went and created a pattern out of the background image in the grids sample above in photoshop. One thing to note with grids, they are supposed to be based on a font size as the defining unit for the sizes. Again, I’m not a graduate of any graphic design school, so my methodology might be weird. Here is how I start a design using grids (the wireframe at least).

Step 1: Create the canvas
First I usually create a document in photoshop 960px wide and 900px high (i’ve got a big screen, and usually end up making the page longer) and either a white or a transparent background. Here is a small example. Generally the grid layer I put over everything else, and make it translucent so i can see where everything is relative to the grid.

Another technique I tend to do is color code the site, so I have an idea of the content, the auxiliary material, the navigation, branding, etc. If you group the colors, it should help you get a better feel for what type of stuff you are really including in your design. Is your design looking 60% ads? Then chances are you need to rethink your site.

So with these steps in mind, you can theoretically start figuring out your layout/structure. The use of grids, especially frameworked grid layouts like Blueprint or YUI Grids will help you in regards to formatting your text, maintaining legibility, and giving your site a solid flow.

Next step will be an actual design, and then transitioning that design into a real xhtml site.

After getting stuck in vegas because of the delays associated with these storms, I realized that USair could have alleviated this problem by just creating a mobile version of their flight status page.

I could have logged on with my blackberry and been less frustrated. Now I get home, and see the following screen on usair.com. This is a perfect example of contingency design, or defensive design as the boys at 37signals would call it.  This is what happens when the design team isn’t expecting delays at EVERY airport the company services.

I would probably have made the div scrollable or once the number exceeds 4 cities, make the user click through. as is, that list is unusable.

So a distant relative of mine, Jorge Arango, in Panama (the country, not the party town in Florida) just posted info about their first usability/IA workshop in the area. UXCamp Panama was probably the first of its kind in all of central america, just don’t quote me on that.

Its great to see growth in the communities of web developers all over the world. Now if only we could get the UXCamp to come here to Miami too…