About 3D Timelines - Part II.
Tuesday, April 29, 2008
When I designed the first product (a web-based document management system) for Bee Documents back in 2002, I started with pen and paper and then used Adobe InDesign to complete the prototype.
Since that time I have used Apple's Keynote software to do design and prototyping for dozens of websites and desktop applications. For me it has several advantages over Photoshop, which is the classic tool of choice for this kind of work:
- I find it much faster to draw and make adjustments with Keynote.
- The effects (rounded corners, tinted fills, gradients, drop shadows) are all very Mac like.
- I can link up the Keynote presentation and add animated actions to simulate the interactive behavior of the application.
- People who are not designers can participate in the design with me since it is intuitive to drag things around and make changes using Keynote
As an example, see the following two screenshots. The image on the left is the Keynote file I used to design the "T2" website. This was one of several possible designs that I can created. When I played the Keynote file, I could interact with the links and videos as if it was a real website. The image on the right a screen capture of the real website.
However, as well as the current process is working for me, I keep thinking about cinematic software, touch interfaces, animation, motion, and "No Limits Design". The technical barriers are falling for this kind of software. I'm concerned that prototyping tools that encourage page-by-page designs may limit creativity.
To that end, I have been experimenting with video as a prototyping tool as well as some motion graphics tools such as Apple's Motion.
Several months ago, I transformed the 3D Timeline idea that I had sketched into the following video using Apple's Motion:
I wanted to be able to test readability of the timeline at distances and get a sense for whether this would be a useful feature that helps solve the challenges of presenting timelines or if it was only eye candy.
...to be continued...
I like the animation concept a lot. I would suggest having event notes as some sort of drop down that you see only when the event is highlighted. It will keep the look from being cluttered, as only one event would be displaying notes at a time.
Another thought, in addition to the 3D would be an animation similar to the Dock, where items enlarge when you mouse over them (and then the comments drop down). This would prevent crowding in either 2 or 3 dimensions. This would be very helpful for the type of presentations I do, which are often more interactive or unscripted.
One more thought (last one, I promise) would be to allow descenders to drop from either the right or left of a text block (and both sides for a start/end event. Some of my timelines end up looking "uneven" and I think this could be largely solved by running a descender down the right side and the text going out to the left. Some folks might not care for it, but I think it would allow me to visually balance some of my work better.
Post a Comment