–Geoff-Hart.com:–Editing, Writing, and Translation

—Home —Services —Books —Articles —Resources —Fiction —Contact me —Français

You are here: Resources --> 2001 --> Using VBA to prototype a software interface
Vous êtes ici : Ressources --> 2001 --> Using VBA to prototype a software interface

Using VBA to prototype a software interface

by Geoff Hart

Previously published as: Hart, G. 2001. Using VBA to prototype a software interface. http://soltys.ca/techcomm/articles/Using_VBA_to_Prototype_a_Software_Interface.html

In general, most of us get good screen captures of real applications using tools such as SnagIt. However, there are occasional situations in which it would be helpful to create your own dialog box. Sometimes the dialog or window already exists in the software you're documenting, but is difficult to capture properly (e.g., because of unsuitable magnification or poor choice of text vs. background colors); sometimes you want to present a quick prototype to developers to illustrate a suggested interface improvement; and sometimes you need to create something entirely fictitious to illustrate a point. (That's the source of this article, by the way; I'm writing a chapter in an upcoming textbook and needed to mock up some illustrative screenshots to match an example I described.) Last but not least, we occasionally see conversations on the techwr–l mailing list that lead up to a recommendation that the techwhirler create a mockup of the screen in Corel or another graphics program.

Although you could certainly plead with the developers to use their interface design tools to mock up the dialog box for you, you can also do the work yourself if you have access to a copy of most Microsoft Office applications, such as Microsoft Word, Microsoft Excel, or Powerpoint. (Other software may offer similar features.) These applications include Visual Basic for Applications (VBA), which includes all the tools that you need to develop an interface.

Trust me, this is easier than it looks from the description. For this article, we'll use Excel. With a new document open in Excel:

  1. Open the Tools menu, and select Macros, followed by Visual Basic Editor (VBE).
  2. In VBE, open the Insert menu and select UserForm. Excel pops up a window named "UserForm1", accompanied by a palette that contains various icons representing things that appear in dialog boxes (e.g., checkboxes).
  3. Drag the appropriate dialog box elements from the tools palette into the UserForm1 window, and edit their labels by clicking on the text (e.g., change "Label1" to "User name:").
  4. Use the Format menu to arrange and align the items you've created.
  5. Open the View menu and select Properties Window.
  6. Double-click on the form you just created in the list that appears at the left of the screen.
  7. In the properties window at the bottom of the screen, find the field labeled Caption and enter the text that will appear within the dark blue border at the top of the dialog box.

Voila! Instant, professional-looking dialog box.

To display the dialog box so you can grab it with your screen capture software:

  1. Open the Tools menu and select Macros.
  2. Name the macro, and click the Create button.
  3. Enter the following text:

    Sub test()
    UserForm1.Show
    End Sub

  4. Close VBE. You'll now find yourself back in Excel.
  5. Open the Tools menu and select Macros, then Macros.
  6. Run the macro you just created.
  7. Smile and look foolish; you just created your very own dialog box.
  8. Capture the screenshot.

Thanks to my colleague Marc Arsenault for revealing this tip and providing the VBE expertise to write the macro.

©2004–2024 Geoffrey Hart. All rights reserved.