Red, White, and ... Aqua
Pages: 1, 2
Here I go
To put my money where my mouth is, in each new article I'll build a hypothetical application that illustrates the guidelines I'm covering. Today's application is called "Paint" and will be based on the photo-illustrative icon I created in my last article. Together we will complete each step, and by the end of the project we should have a well-designed, 95%-100% Aqua-compliant application. I'll leave some room for personal preferences and the fact that Apple changes the OS every few months.
I am Dock, keeper of icons
In building your amazing Aqua application, one of the most important things to consider is the Dock. There are three things your app needs to be "Dock Compliant." Now, I write this knowing that the Dock will be going through some major changes soon, but for the most part, these should still hold true.
Number 1: Dock Location
Due to the positioning of the Dock, remember that when you build an application, you have to be sure that new document window sizes and positions do not violate the Dock's space. Dock is temperamental and Dock loves his space. If you default to a window size that expands behind the dock, users will have a difficult time reaching the navigation and resize areas at the bottom of the screen. I can personally say that more than once I have been rather peeved that I couldn't get to an area of the window to resize because the default window settings always pop up behind the Dock. In addition, the new Dock in 10.1 will allow users to position their Dock location on either side of the screen as well.
Okay, I just told you what Apple wants you to look out for with window positions, but in the real world, not everyone uses the hiding feature of the Dock, and it is unrealistic to be able to predict where each user will place their Dock at any given day or how large they will have it. However, you can build a feature into your application that allows spacing for the Finder. You can give users the option of where to position their windows and what area of the screen not to cross. I know that BBEdit provides me with this feature, and I wish more developers gave me more control over my windows.
Number 2: Dock Clicks
Clicking an application in the dock should always bring forward an active window. If the user clicks on an open app's icon in the Dock, the application is active and all unminimized windows come along with it. I have found a few problems with windows behaving independently of their application.
For example, if you see an AIM window peeking out from behind your browser and you click on it, that window will come to the front, but the main application window will not. The Mail.app/Activity Viewer is another example. The Aqua system of layers works well in many instances, but not in all. Thank goodness that the Dock is always there to come to the rescue. I know that clicking on an application icon in the Dock will always result in not only the application coming to the front, but also any non-minimized windows associated with it. And if the application is active but no windows are open, clicking on the Dock icon should create a new window in that application.
Number 3: Dock Animation
Not quite as entertaining as Shrek, but Dock animation can be an important and useful function in your application. For example, Dock animation is a helpful way to indicate the status of your application.
But limit your animations to whatever is required to communicate the necessary information. Avoid annoying animations that discourage ease of use. Ask yourself, "What do I need to show the user, and what is the cleanest way possible to achieve that?" A good example is the Mail application for Mac OS X. Whenever a new message arrives, the Dock icon changes appearance to indicate a changed state.
Other examples of these animations might be to show the status of an FTP transfer, the progress of media being digitized, or an updated time signature. And don't forget that users may want to have some control over this, so give them plenty of options, including the ability to turn these functions off.
For my Paint application, I created a series of icons to simulate a rendering algorithm. While the application is performing this CPU-intensive task, you can always see the status of the document by the icon changing in the Dock.
I hope you find these suggestions useful. Stick around for future columns while we learn how to be a good Aqua citizen together. Maybe we can even come up with an oath?
I promise to do my duty, to Apple and my country...
Rendered photo-illustrative icon
Comply to Dock
Adhere to system appearance
Adhere to layout guidelines
Adhere to window models
Adhere to file locations
Build help file
Read more Designing for Aqua columns.
Return to the Mac DevCenter.