On today's Internet, a Web site cannot afford to be old fashioned. An antique Web site is a dusty, unvisited vestige of yesteryear. Today's sites have to be interactive, multimedia experiences that create a lasting impression...sites that will get revisited often. The software industry has been bursting with new Web design tools, but it's still hard to find a WYSIWYG tool which can be used to design HTML pages that include the latest browser tags and plug-ins, let alone one that can be used to create dynamically produced documents. This type of program would create a unique experience for each viewer. Macromedia is well known for its animation and Web graphics tools. Now Macromedia has gone even farther into multimedia Web development with Backstage Designer Desktop Studio. In this issue, you'll learn about Backstage Designer Desktop Studio, and find out how it can make your site a unique experience for everyone who wanders onto it.
Macromedia's Backstage Designer Desktop Studio is a complete Web authoring suite. Using Backstage Studio you can create and manage Web sites that include interactive features such as database access, electronic mail, and threaded discussion group forums. Without writing HTML, CGI or custom programs, you can create Web pages that:
- Post form data to a database
- E-mail form data to a particular recipient
- Generate report pages from a database using tables and formatted text
- Allow users to update database information
- Contain discussion groups
- Implement user profiles that dynamically create the page for the user
- Contain dynamic content such as date, time, and pagehit counts
- Are no longer browser dependent
- Utilize new Web features such as Java applets, Shockwave plug-ins, and Active-X controls
The Backstage Designer Desktop Studio is made up of four separate programs that work together: Backstage Designer, Backstage Manager, Backstage Server, and the Backstage Object Library. Backstage Designer is the WYSIWYG HTML design interface that is used to create the actual Web pages and web-based applications using Backstage objects. The Backstage Manager is a Web site management tool that allows the designer to see an overview of the entire Web site and work on the site remotely. The Backstage Server and Object Library work in conjunction with the Web server software to build Web pages dynamically.
Backstage installed from the single CD ROM automatically, and by following the simple dialog boxes I was able to provide all the necessary information to complete the installation. Backstage Designer comes with a 184-page user's guide that takes you from installation to the advanced use of Backstage objects, as well as an online help system that includes an overview, step-by-step procedures, a command, HTML and toolbar reference. I glanced through most of the printed user's guide, and was able to use Backstage Designer like a pro within a couple of hours.
The Backstage Manager (see Figure 1) is a tool that gives you a visual representation of the applications you develop with Backstage. The Manager gives you two categories of Web sites: local and remote. The local sites are the ones that you are still working on, while remote sites are still in development. After a site is complete, Manager automatically posts it to a remote site using FTP. The Manager enables a developer to download the entire application, update it, and when it's complete, Manager updates the remote site. The Manager is tightly integrated with Designer and the Backstage Object Libraries, making the development of a Web site a unified process.
To start a new project, you open the Backstage Manager, and choose File | New | Project from the menu. A new project icon appears in the Projects panel of the Manager, which is set up visually much like the Microsoft Explorer. You rename the project the same way you would using the Explorer, by clicking on the name next to the icon, and typing the new name. After you have created a new project, you create a new HTML document the same way. Then, by double-clicking on the new HTML icon in the Projects panel, the Backstage Designer is launched. Backstage Designer, the HTML editor, is where most of the work is done. The first thing to do is to set the page properties, such as background color or image, text color, link color, etc. This is done by selecting File | Page Properties from the Designer menu. These properties are easily set by filling out the dialog box that pops up.
Designer also features buttons for including Java applets, Active-X controls and Netscape Plug-Ins. The user interface is very intuitive and easy to use. Let's put it this way: If you can use a word processor, you can use Designer.
Assuming that you already have ODBC installed on your machine, connecting to a data source with Designer is not difficult. First, you must specify the data source by going into your Control Panel and double-clicking the 32-bit ODBC icon. Then you add and name the database that you wish to use, and close the control panel. You are now set to connect to the database in your Web application. To incorporate the database onto your page, you open the File | Properties dialog box again, and go to the Backstage Page Extensions tab. To add a Backstage extension to your page you choose Add, and make a selection from the two choices available, in this case Database Connection. You then choose Connect and type in the name that you previously gave the datasource in the Control Panel. From here you'll go back to the Page Properties dialog box by clicking OK. After closing the Page Properties dialog box you're back at the HTML page you were working on. After selecting the place that you want the user to enter the information from that will then go into the database, you choose Insert | Form from the menu, and select Backstage Handles Form. Then you are asked for the URL of the return page that the user will see after they submit the form. After closing the dialog box, you continue with the creation of the actual form itself, and then you create the return page. It sounds a little intensive, but it is really a simple step-by-step process that is very easy to follow using Backstage Designer.
When a user requests a page that contains a Backstage object, Backstage uses a CGI script called ibGate.exe to "notify" the Backstage server that it needs to deliver a certain page, which it constructs from the Backstage Web page after parsing for Backstage objects. It converts any Backstage objects it finds into HTML. Backstage objects can include:
Backstage objects are added by using the Backstage Designer, and selecting Insert | Backstage object from the menu. After selecting the type of object you want, you set the properties by double-clicking on the object's icon. That's all there is to it.
- Actions - Enables Next Data Page and Previous Data Page hyperlinks to be added to pages to allow data that has been retrieved from databases to be shown
- Community Objects - Allows a Web based Discussion Group to be built
- Content Generators - Presents user Browser Information; Conditional Include; Date and Time; Backstage Table; Backstage Text; Pagehit Counter
- Debug Objects - Displays HTTPS parameters that are passed to a page
Backstage Designer Desktop Studio does a lot to simplify the task of setting up dynamic Web sites. Your site's visitors can have completely individual experiences, with a minimum of effort and time. The user interface is simple, intuitive, and extensive. It not only features a complete WYSIWYG development environment, but also allows the advanced developer to directly code the page. With Backstage Designer Desktop Studio, Macromedia isn't simply keeping up with the future, they are defining it.
About the Author
Scott Clark is the Webmaster for Phoenix Applied Technology, (http://www.phoenixat.com), an ISP in Kissimmee, Florida. Scott is the Product Review
Editor for "Java Developer's Journal" and a Contributing Editor for "Web Developer Magazine." Scott hosts the Java Message Exchange (http://www.phoenixat.com/java), a Web based Java forum, and WebToolz, (http://www.webtoolz.com) the Webmaster's Resource.