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...
Monday, April 28, 2008
One of the most challenging aspects of working with timeline charts is presenting them to an audience. Timeline charts often have fractal like complexity, with both the entire context of a large chart as well as the individual event details being of equal importance in digesting the meaning behind a chart. Printing can be a challenge as fitting a complex timeline on one page makes the details very small, but spanning many pages is not a good solution either.
Presenting timelines on a projected screen can be challenging for the same reasons. Either you need to show the timeline so small that there is no detail visible, or you need to zoom in and lose the context.
Last summer, while I was attending Apple's WWDC developers conference, I was pondering this problem and drawing sketches in my notebook. During the conference, folks from Apple where showing some of the amazing new graphics capabilities in Leopard and encouraging developers to make their software "cinematic."
I was inspired by the thought that I might allow customers to create cinematic timelines while, at the same time, solve the issue of presenting timelines to groups using a projected screen.
My idea was to treat the timeline as a physical object that could be viewed in 3D perspective. If you looked down the timeline on edge, you could see many events off in the future and the events near the "front" would be nice and large. If each event was also a little door that could swing out parallel to the screen as it was selected, it would solve the distortion problem for the selected event as well as making it clear which event was highlighted.
Here is the sketch I drew back in June 2007:
However, back in June I was hard at work preparing the release of Bee Docs' Timeline 2.0. and didn't have time to add any major new features. So the idea had to remain in my notebook along with all of the other "big ideas" that live there.
Story to be continued...
Monday, April 21, 2008
We've been doing some design work to refresh the Bee Documents website. Currently we don't have product screenshots on the main website but a Google search will search will turn up this page from a few years ago which is sadly out of date.
I was doing some thinking about what timelines to use for the new screenshots and it occurred to me that it would be much better to feature some real customer timelines instead of using contrived examples. We would give you credit of course, and maybe include your picture and a quote about the work you do (the page is still in the concept stage)...
If you are willing to help out, would you please send me an e-mail of your best or most interesting timeline to date?
My e-mail is Adam at Bee Documents dot com
Thursday, April 17, 2008
This is a web-based timeline service called circaVie. After you try it out, I'd appreciate your thoughts. Do you think it is intuitive to navigate? Does it present the information clearly? Would the information you are presenting work well in a format like this?
Also, for this one I would like to ask how would you feel about the advertising they are showing on each timeline page. Would it be worth it for you to have ads on your documents in exchange for free services?
Thursday, April 10, 2008
Introducing Milo. Born 4/6/8.
Thursday, April 03, 2008
David Huyng, developer of the SIMILE open-source timeline project, sent me a link to this highly customized SIMILE timeline that the BBC created for Easter week. The BBC seems to have some of the best examples of interactive timelines on the web these days.
Check it out and let me know what you think of it.
Wednesday, April 02, 2008
Thank you for all of your valuable comments and insight regarding the BBC Timeline I posted a few days ago. In that same spirit, I'd like to point out the following from the NY Times website and gather your thoughts:
Please give it a spin and let me know what you think. Do you think it is intuitive to navigate? Does it present the information clearly? Would the information you are presenting work well in a format like this?
Tuesday, April 01, 2008
Here is a movie that shows how automatic tick marks work and demonstrates the new manual settings available in Bee Docs' Timeline 2.0.9. Enjoy!
I have just finished Bee Docs' Timeline 2.0.9.
However, this new version updates timeline documents to a new format which means that files opened with 2.0.9 will no longer open in previous versions of the software. This is true even if they are only opened and not explicitly saved.
Because of this I am doing some extra testing and am going to release it as a beta for a few days before I add it to the automatic update. If you would like to try the new release, please make a backup copy of your timeline documents first.
After you make your backup and delete existing versions of the application, you are welcome to download a copy of Timeline 2.0.9 (beta). Please send me you feedback!
New in Bee Docs' Timeline 2.0.9:
- Manual tick mark settings!
- Event links are now included in copy and paste operations
- Improved automatic tick marks for timelines spanning 1AD
- Improved automatic tick marks for timelines spanning less than 2 hours
- Fixed freeze when importing certain malformed RSS feeds
- New document format (not compatible with earlier releases)
Labels: timeline release 2.0.9 beta