Friday, January 30, 2009

Speedgeeking: The Amazing Tabbed Table

I had the pleasure of being able to participate in Speedgeeking this year at Lotusphere and while it's hard on the voice, it's really a lot of fun. For those not familiar with speedgeeking, it's much like speed dating. Each presenter is at a separate table and groups of attendees spend 5 minutes getting a "crash course" in whatever that presenter's topic is. After 5 minutes, they go to the next station and so on for 1 hour. To keep it fun and lively, an MC is continually calling out the time and rowdily making people move along. It's a bit of a challenge to distill a topic down into a meaningful 5 minute pitch and presenting the same content (loudly) 12 times straight is certainly harder than it seems, but the effort is totally worth it.

As I promised to the attendees of that speedgeeking session, I'm including my sample database here to play around with. If you didn't get to attend, then read on to learn more about "The Ever Amazing Tabbed Table: Cool UI Tricks Anyone Can Do" (and by anyone, I mean developers...admins couldn't handle this ;-)

Get the database here

I think tabbed tables are an excellent design element for making good UIs in Lotus Notes. I'm continually amazed at the uses that you can come up with for this versatile element. For speedgeeking, I demonstrated four popular design pattern uses for the tabbed table, primarily focused on their programmatic aspect.

So what will you find in the sample database? Four cool techniques including:

Fade In/Fade Out

Fade In/Out Example

Wizards Example

Rotating Headlines

Headlines Example

Elegant Navigation

Navigation Example

All of these techniques are extremely easy, can be setup in a few minutes and can be used over and over again. To me, simple is elegant. I hope you enjoy and find some new uses in your own applications.


janeg said...

Chris, you never cease to amaze! Excellent demo, can't wait for an opportunity to try out the navigator technique, and the fade, and the headlines ... lol, ok, all of 'em. Thanks so much for sharing :)

Elijah Lapson said...

This is great thank you so much for sharing. Curious how you got the "highlight" effect on the navigator. I will dig deeper.


Edith said...

What a pity that is blocked by our Webwasher! I really would like to get your demo - is it available from somewhere else?

Chris Blatnick said...

@Edith...send me an e-mail ( and I'll send it to you directly.

Anonymous said...

Thank you so much for sharing. I got your link from Developer Tips Newsletter.