« Ambient Design's Art Rage | Main | MycroXaml - a Xaml Parser in <300 Lines of C# »
November 14, 2004
The Beautiful Picasa UI is Made of Dynamic PSD Files
I was snooping around in Picasa's "runtime" folder and found a bunch of Photoshop .PSD files. Sure enough, large parts of the UI are built in Photoshop. Layers are used to organize buttons, stand-ins, and cursors. Roll-overs are achieved with image replacement similar to JavaScript/DHTML. For example, the timeline view is just a 640x480 image with a tagged layer to hold the selected group's thumbnail and custom cursors defined in their own layer set.
Picasa's underlying graphics engine is most likely a simplified "Photoshop runtime" with a DOM to make it easy to target tagged elements imported from .PSD files. This is a smart architecture because it provides rapid UI prototyping and a consistent look-and-feel across different platforms. Designers can make changes in Photoshop then re-launch Picasa to see the results. Even better, end users can skin the application without having to learn any new tools.
The "runtime" folder also contains some simple scripts that bind UI elements to their .PSD counterparts, and define layout placement and visibility.
Posted by Devon at November 14, 2004 04:48 PM
Comments
Post a comment
Thanks for signing in, . Now you can comment. (sign out)
(If you haven't left a comment here before, you may need to be approved by the site owner before your comment will appear. Until then, it won't appear on the entry. Thanks for waiting.)