Home :: Products :: ConceptDraw WebWave :: Lessons :: QuickStart        

Prev :: Content :: Next


The distinctive feature of ConceptDraw Web Wave is a set of remarkable wizards that will prompt us the proper sequence of actions and help us cope with the most complex tasks. In the manual there is description of wizards, where you can learn in detail which wizard is what and what tasks it is intended to solve. Normally, each wizard helps to solve one specific task: analyse a structure of the existing site and present it as a hyperlink map or as a file digram; build a prototype of a new web site on the basis of the old one or from scratch; use Color Generator for the color scheme of the site. But usually tasks before us are quite complex. They require solving many other tasks and using various means. In this series of Lessons we will consider solving some of such complex tasks by means of the only program.

Lesson 1. Studying the structure of an old web site for support / restructuring.

It is not always easy to digest the fruits of someone's labor. And if we need to go on working with them, then knowing each and every detail is just critical. For more efficient work with an existing web site we need to know its exact structure. This task, as well as other accompanying questions, can easily be solved with ConceptDraw WebWave .

Common task : discover the structure of an existing site that uses a database.

1. Build the site structure scheme with the help of the wizard Web Site Structure Scanner .
2. Build the diagram of the existing database.
3. Add links from the site map to the intranet and to the database.

  • 3.1. Hyperlink from a shape to another document.
  • 3.2. Hyperlink from a shape to a page.
  • 3.3. Adding a background in case the shape already contains a hyperlink .
  • 3.4. Hyperlink from a shape to a shape.

 

1. Building the site structure scheme with the help of Web Site Structure Scanner .

First, we create a hyperlink site map. Open Template Gallery and start the wizard Web Site Structure Scanner from the category Site Structure. The very first dialog will require a link to the ftp-address of the site.

In the field Enter URL enter the link.

In the dialog, different parameters can be set. For this, call the setting dialog by selecting Settings . On the tab Scan you can set the nesting level of the elements, and also restrict access to the site with a password. The tab Layout allows to choose a type of the text to be contained in the shape, a scale for each level and a variant for building a scheme. On the tab three, the names of files to be displayed in the scheme should be specified. By default, all types are included (with the option Generic:*.* enabled). If you wish some files to be excluded from the scheme, disable the options on the tab.

Scan Settings

Layout Settings

After setting the parameters, press OK .

The program will generate the hyperlink site map.

Hyperlink Site Map
Zoom 13%

Hyperlink Site Map
Zoom 100%

Task: Scan the given site http://conceptdraw.fileburst.com/Materials/webwave/scan_site/en/ by setting the following parameters:

  • Nesting level : 4
  • Scale: Root - 100%, the second level - 75%, the third level - 50%, the other levels - 25%
  • Scheme N 2
  • All types of files should be included

 

2. Building a diagram of an existing database.

To build a diagram of a database used by our site, start the wizard Database Model Diagram from Template Gallery, the category ERD&DataBase. The dialog will offer to choose a database:

Select Data Source

How to add a database

Let us make the task a bit harder. If there is no required database in the list, let us create it. For this task, we will use our own text database. Press New and open the dialog to choose a format for the database, and pick Microsoft Text Driver from the list.

Create New Data Source

In the next dialog, specify the database name:

ODBC Text Setup

On pressing OK , the program will add the specified database to the list and will open it in the document.

Then press OK in the opened dialog, and he program will generate the scheme for the database.

Scheme for the Database

Task: Build the scheme of the database you already have. To complicate the task, you can create a new one.

 

3. Adding hyperlinks from the site map to the intranet and to a database.

All the elements required for completion of our task are ready. Each of them is located in a separate document. But if necessary, they all can be collected into one multi-page document. For this, add the corresponding number of pages and copy the contents of the other documents to them. To add a new page to your document, use Add from the menu Page, and in the opened dialog Add Page specify the page name.

Note: You can easily switch among the document pages with the help of the arrows or with the pop-up menu at the bottom of the screen:

Pop-up menu

Now, let us join the documents with hyperlinks. In our case, we can provide a link from one shape to another, and from a shape to the entire document (page).

To assign a hyperlink, you need to select the shape, to which the hyperlink will be assigned, and then call the dialog Hyperlink from the menu Insert or from the context menu of the shape with the help of Hyperlink / Edit. s

3.1. Hyperlink from a shape to another document.

In the dialog, enable the option File or application and specify the path to the document by using Browse.

Hyperlink Dialog

3.2. Hyperlink from a shape to a page.

In the dialog, enable the option Current Document and specify the required page.

Current Document

Now, by double-clicking on such a shape, we get to a linked document or a page.

Task: Assign to one of the tables on the database scheme a hyperlink to the web site scheme.

3.3. Adding a background shape in the case when a shape contains a hyperlink.

In the document with the site scheme all the shapes already have hyperlinks to the corresponding web pages. That's why, let us create some background shape (to which a link will be assigned) and join it to our shape.

To create a background shape, use a library. For this, open the required library with the help of Open Library Open Library on the toolbar Main, or with the help of Library / Open from the menu File . You can also create a background shape by uniting several objects into one. For this, select the shapes and use Group from the menu Shape or Object / Group from the context menu of a shape. Place the background shape next to ours and send it to the back. For this, select a background shape and use Display Order / Send to Back from the menu Shape, or from a shape's context menu Object / Send to Back. To make our shape move together with the background one, if we need to relocate it, group these two objects by the known method.

Note: To create a background shape, you can also use drawing tools on the toolbar Drawing Tools (they also can be enabled in the menu Insert), or paste a picture with the help of Picture in the menu Insert.

Task: Choose the library Entity Relationship in the section ERD & Database. From the library, extract three Entity shapes and group them. Then place the background shape to the back relatively to the shape "Server", and group them.

Entity Relationship

3.4. Hyperlink from a shape to a shape.

To join two shapes with a hyperlink you need to assign the number (ID) from one shape to another. To find out a shape's number, see the floating dialog Information, that can be started from the menu View with the help of Floating Dialogs / Information. For this, select an object and see its number in the field ID.

Floating Dialog-Information

Now, assign a hyperlink from one shape to another. For this, in the dialog, enable the options File or application (to join it to a document page - Current Document ) and Page (if there are several pages, choose the required one from the pop-up list). In the field File or application, specify the shape's name by choosing it with Browse . From the pop-up list Object choose an ID of a shape, to which our shape is to be joined, and press OK.

File or Application

Task: Assign a hyperlink to the shape "Server" (to its background shape to be more precise) to a shape from the database scheme.

Note: For more details on assigning hyperlinks, see the Chapter Hyperlinks.

Summary: in this Lesson we have learned how to scan an existing web site and build its file structure; build a database scheme; assign hyperlinks to other documents, pages and shapes; create new shapes and perform some operations.


Prev :: Content :: Next

 
Subscribe to CS Odessa Newsletter
      Copyright 2008 Computer Systems Odessa Corporation. All rights reserved.
SEARCH