Design the form layout
After finalizing your data sources, you can begin designing and positioning your fields in the form layout area. Common design layout options that are available in Word are also available in InfoPath. The ability to format text, add color, insert hyperlinks, add images, and use layout tables are some of the design features available. In addition, you can utilize the many form-control options such as checkboxes, date picker, or rich-text boxes to control your data display. For the best organization and position placement control, I recommend layout tables as the way to organize and position your data fields on the page. After the table structure is in place, you can drag your data sources to the desired table cell position on the form layout, and add controls, color, and other formatting. To create the layout table, choose Table → Insert → Layout Table or click the layout link from the Design Tasks panel to select a pre-defined table layout.
For usability, break your form into sections with a separate layout table for each content section. Form design best-practice suggests that users complete forms more accurately if they are presented with blocks of fields grouped together by relation. For example, group your needs-analysis fields together in one table. Place your learning content outline in a separate layout table. The power of color will also help separate information into defined groups. Choose Format → Color Schemes to set up different colors for layout tables. As you begin creating different layout views for your form, color schemes will help differentiate the document views. I’ve made a Captivate movie available that illustrates this. See the Resources section for more information.
Add Form Controls
After positioning fields in your table layout, review your fields to determine if a form control might display the information more efficiently. For example, I have a field called contentType. This field describes the type of interaction the e-Learning will be: demonstration, exercise, video, or synchronous learning. To control user data entry, it is best to display this field as a drop-down list box. (See Figure 10.) Right-click the field in the layout form, select Change To... from the menu and select List Box. Right-click the field again and select Properties. Here you can enter the values for your list box. Click the add button in the bottom right corner to add values. Use the arrow buttons to reorder any values and click OK. Note that in the data structure, you can convert only fields to form controls. You cannot convert groups (the folder icons).
Figure 10 It may be advisable to add form controls (such as drop-down lists or option buttons) in order to make it easier for users to fill in the fields.
As you design your form, periodically preview it to see how the form will function. Click the Preview Form button to view and enter data into the form. To return to the design view, click the Close Preview button. (See Figure 11 for the location of these buttons.)
Figure 11 Use the Preview Form button as you design to see how your form will function.
Design the views
Remember earlier, when discussing some of the problems in creating rapid design, I mentioned dealing with multiple documents and versions. Creating multiple views in one InfoPath document is the solution to this dilemma. A view is a defined form-specific display setting that is saved within the form template, and applied to the form data when the user fills out the form. The same data fields are available for each view; however, you can filter out fields for specific users. (See Figure 12 ) Creating different views for each of the instructional design forms streamlines the process. An InfoPath document can have a design document view, a story board view, and an SME view. If you need an audio script for your voiceover talent, just create a view that displays only the voiceover text. To create additional views, select the Views link from the Design Tasks panel. From the Actions menu at the bottom select Add a New View and type in a descriptive name for the view.
Figure 12 InfoPath makes it easy to deal with versioning and with the needs of multiple contributors, by making it easy to set up views.
There is a shortcut for creating views. Since the views share the same data source, after creating a new view, copy the fields and layouts from another view and paste into the new view. Modify the fields for this view as needed, and change the color scheme design of the table layout as well so that users can easily tell one view from another.
There are also some tricks for using views. Give your views descriptive names based on their purpose — for example, design document, or SME review. You may designate one view as the default by right clicking the view and selecting Set as Default. This is the view that will automatically be visible when the form opens. I usually designate the SME view as the default view. Other users can access the desired view from the View menu in the published form. To prevent editing of specific fields in a view, right-click the field, select the Display tab and check the Read-only box.
Publish the form
You have created your data source, designed the form layout, and created custom views as needed. All that is left is to publish the form. Choose File → Publish and walk through the Publishing Wizard. Prior to publishing, ensure that you have designated a shared location to publish the form. All users must have access to this location. A Web server or Microsoft Share Point Content Server are the best locations, however, a shared network directory folder works as well. The Publishing Wizard will prompt you to select the desired location to complete the publishing process. (See Figure 13.)
Figure 13 The Publishing Wizard helps you select the hosting location to complete the publish process.
Think of a published InfoPath template form as a Word template. Double-clicking the template to open it will generate a new blank form from the designed template.
After you have published a form, you can still modify the form data sources and design. To open a published form, you must choose File → Open and browse for the InfoPath document (it will have a .XSN file extension) or right-click the InfoPath document in a folder and choose Design from the shortcut menu. You cannot double-click a document to open in Design view as this will generate a template of the InfoPath form.
InfoPath Gotchas!
There are a few things to remember when using InfoPath.
- First, as with any Microsoft product, there are always Service Packs and updates. With InfoPath 2003, you will want to make sure that you at least have SP1 installed as well. You can download this from Microsoft’s Web site. Choose Help → About Microsoft InfoPath to check that SP1 has been installed. Microsoft is now releasing InfoPath 2007, so make sure everyone is using the same version.
- All users must have InfoPath installed on their computer to access InfoPath documents. In addition, InfoPath documents have the restriction that they must publish to a shared directory or Web site where everyone who uses the form has access. The upside to this is that you only have to make any new data elements or any layout changes once in the source document. Once published, all previous versions of the document will update with the changes when the documents are opened the next time. So, for example, I received a request to change the font size in the documentation from 10 to 12 — after 20 XML documents had already been created. I changed the font size in the master template, republished it, and all the documents based on that template updated to the size 12 font.
- If you are using graphics in your document, these graphics will not export over when exporting a document to a Microsoft Word version. Here are some solutions. If you have some kind of PDF software, choose File → Print and choose PDF print format. PrimoPDF is free PDF software (http://www.primopdf.com) you can use if you don’t have Adobe Acrobat. The other option is to copy the picture from the InfoPath document by selecting Edit → Copy and pasting it in the correct position in the Word document.
Conclusion
Harnessing the power of XML with InfoPath can expedite your design phase, through the creation of reusable design documents. Remember to carefully plan your data and structure with the entire team before jumping into the InfoPath document design. By creating forms that employ usability and display audience-specific information, you can streamline your design flow and tailor the process to meet the needs of your team and learning programs.
Resources
Additional documents and Captivate tutorials are available from http://www.id-webworks.com/documents/ infopath.zip. Books:
Aitken, Peter, Powering Office 2003 with XML, Wiley Publishing, Inc., 2004.
Robbins, Thom, Programming Microsoft InfoPath: A Developer’s Guide, Charles River Media, 2004. Watt, Andrew H., Microsoft Office InfoPath 2003 Kick Start, Sams, 2004.
Barker, F. Scott., Beginning InfoPath 2003, Wrox, 2005.
