Plan Web Site Design and Structure with ConceptDraw PRO WebWave Plug-in

1. From the template gallery, open the Conceptual Web Site template gallery. The Conceptual Web Site template gallery offers a wide range of templates where you can select a basic set of pages and their location for your site.

2. Open the template from the Site Structure section of the Template Gallery, or from the WebWave control panel (File>WebWave>Create Web site concept).

   

3. Navigate through the templates using the navigation buttons. Select one of the basic templates.

   

4. Customize the template using the necessary objects from the Conceptual Web Site Shapes library.

1. Start building the basic site prototype using the built example. The example will guide you through the development of the website scheme structure.

2. Open the Web Site Prototype Builder Example from the Site Structure section of the Template Gallery.

   

3. The scheme should start with the Root folder, which is normally followed by pages and other folders with various files. All the elements are joined together with a library connector. Now you can remove and add files from the scheme.

4. You can also build the scheme with the help of the Web Site Prototype Builder wizard. Open the wizard from the Site Structure section of the Template Gallery or from the WebWave control panel (File>WebWave>Wizards>Build up a site template). The wizard offers a set of libraries with different site structure objects for you to use.

ConceptDraw WebWave provides a set of tools to develop web page design. These tools can be found in the Design Mock Up section of the Template Gallery.

• Design Outline
  Start developing your page design with one of the Designing Mock Up templates.
  1. Add any object from the ConceptDraw PRO libraries to your template. To open the ConceptDraw libraries click the Library button on the toolbar. You can also use the ConceptDraw PRO drawing tools from the Drawing Tools toolbar.
  2. Double click to edit the text within the shapes, buttons and text blocks.

     

• Find Color Solution
  1. Open the ConceptDraw WebWave control panel from the File menu and choose Use Gamut Color Selector.
  2. Double click the color circle and click the arrow button in the top right corner.
  3. Select the Context menu and select from one of the color combination types:
     • Default Palette
     • Pastel Palette
     • Contrast Scheme

     

  4. If you wish to save your color settings to a separate file, click Generate CSS-file.
  5. Specify the location to save your file.
  6. You can use the specified information in html code for creation of web pages. To make changes within the html code color code, use the View Color Pallets option of the WebWave control panel. You can copy the required color, from the table of colors that includes the color code specification and paste it to the html code of the web page.

     

ConceptDraw WebWave provides tools to test link and file structure integrity.

• Build site map
  The best way to test site links is to generate a site map.
  1. Choose the Generate Site map wizard from the WebWave control panel.
  2. Enter the site URL in the dialog window.

     

  3. From the Settings window, select the Scan tab. Specify the depth level for the elements and you may need to login to gain access to the site you are going to scan by logging in. Click OK.

     

  4. The Layout tab enables you to choose the output diagram layout.

     

  5. From the Types tab, set the types of files you want to display.
  6. From the Protocols and Attributes tabs, specify the protocols, and page attributes..
• Explore web site file structure.
  ConceptDraw WebWave provides a special wizard to help create web site file structure schemes.
  1. You can run the wizard from the WebWave control panel (File>WebWave>Scan File Structure), or from the Site Structure section of the Template Gallery.
  2. Enter site URL in the dialog window.
  3. From the Settings window, select the Scan tab, you can specify the depth level for the elements, and restrict access to the site by a password control.

     

  4. The Layout tab enables you to choose the output diagram layout.
  5. From the Types tab, set the types of files you want to display.

     

  6. After setting all the parameters, click OK. A hyperlink site map will be generated.

     

With the help of tools provided by ConceptDraw PRO, you can build a database diagram that can be used by your website.

1. Start the Database Model Diagram wizard from the ERD&DataBase section of the Template Gallery.
2. Select the database type from the Select Data Source window.

   

3. If the required database is not listed click New. Select the database type and click Next.

   

4. In the ODBC Text Setup, specify the database name and click OK.

   

5. The database scheme will be generated as a ConceptDraw PRO document.

   

Download ConceptDraw PRO with WebWave Plug-in Free 30-day trial, , English

Operating Systems:

Macintosh® (Mac OS X 10.4.10 or later)     Microsoft® Windows® XP /VISTA

Languages:

English