Making a Splash
- User Features
- Developer Features
- Making a Splash
- Get Into Shape
- Wrap Up
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
First impressions can make or break a project. If your prototype begins with an ugly logon form that crashes if you enter the wrong password, your customers will walk away with the impression that your program is buggy and unprofessional. It doesn't matter that this is just a prototype and the final application will work flawlessly. If the first thing the customers see is a crash, that's what they'll remember.
On the other hand, if the first thing the customers see is the eye-catching splash screen shown in Figure 1, that's what they'll remember. A good splash screen can go a long way toward convincing your customers that the project will be a success. After all, if you thought of a little detail like adding a splash screen to the first version of the prototype, how can any other details slip past you?
){kind=link}
Figure 1 Make a good first impression with an eye-catching splash screen.
Of course, you still need to make sure the prototype works. If it has a counterintuitive user interface, doesn't satisfy the customers' requirements, and crashes a dozen times in as many minutes, a glitzy splash screen won't save you. However, if the prototype behaves reasonably well and gives the customers no nasty surprises, it's the splash screen they will talk about next week around the water cooler.
This article describes an easy-to-use splash screen from three points of view. First, it explains the splash screen's features that the user sees while running the prototype. Second, it tells how the developer building the prototype uses the splash screen. Third, it explains how the splash screen works. This is the fun part that tells how to cut a form into shapes, use special fonts, draw rotated text, and so forth.
User Features
The splash form described here can run in two modes: as a splash screen and as an about dialog box. When the prototype starts, it displays the splash screen shown in Figure 1. While the screen is displayed, the main program continues to load. In Figure 1, you can see the main program, titled TestSplash, sitting beneath the splash screen. After three seconds, the splash screen unloads itself and the user can work with the application normally.
If the user opens the Help menu and selects About, the splash screen appears as an about dialog box. When used as an about dialog box, the form displays the text Ok in the dot under the exclamation mark, as shown in Figure 2. If the user clicks this text, the form unloads. The user can also unload the form by pressing the Return or Escape key. The form does not automatically unload itself after three seconds when it is used as an about dialog box.
){kind=link}
Figure 2 The user can close the about dialog box by clicking the Ok button.
Whenever the form is visible, it disables the main program so the user cannot work with it. In particular, the user cannot open the Help menu and select the About command. If the user did that, the program would try to display the splash form while it was already visible, and that would cause problems.
Disabling the main program also makes the user wait until the splash screen goes away when the program first starts. It will annoy the user if the splash screen stays visible for too long, so I wouldn't recommend making it stay displayed any longer than three seconds.
The splash form has three other interesting features from the user's point of view. First, it is a topmost window, so it always stays above other windows (expect possibly other topmost windows). The user can open another program and work with it, but the splash form remains on top even when it doesn't have the focus.
Second, the form displays custom cursors when the mouse is over certain areas on the form. When the mouse is over the Ok button, the cursor changes to a left-pointing hand, as shown in Figure 2. That gives the user a clue that clicking this area does something special (closing the form).
When the mouse is over the text http://www.vb-helper.com inside the exclamation point, the cursor changes to an upward-pointing hand that is similar to the one displayed by Internet Explorer when you move the mouse over a link. If the user clicks on this text, the program opens the VB Helper home page in the system's default Web browser. Naturally, you will want to change this URL for your prototype.