Interaction design visio
Download
1 / 54

Interaction Design: Visio - PowerPoint PPT Presentation


  • 117 Views
  • Uploaded on

Interaction Design: Visio. About MS Visio. MS Visio is a tool that allows you map user workflows, website sitemaps, website pages, software screens, forms, charts, database models etc. Launching Visio. Click the Start button Point to Programs Click Microsoft Visio.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' Interaction Design: Visio' - roth-guthrie


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

About ms visio
About MS Visio

  • MS Visio is a tool that allows you map user workflows, website sitemaps, website pages, software screens, forms, charts, database models etc


Launching visio
Launching Visio

  • Click the Start button

  • Point to Programs

  • Click Microsoft Visio


Open a new drawing file without basing it on a template
Open a new drawing file without basing it on a template

  • On the File menu, point to New, and then click New Drawing

  • An unscaled drawing page opens without stencils


Drawing shapes
Drawing Shapes

  • Select either rectangle or ellipse tools

  • Move cursor to drawing page

  • Draw shape

  • Selected shape is displayed


Selecting a shape
Selecting a Shape

  • Select Pointer Tool

  • Select Shape

  • Outline appears on shape..

  • You can now format the shape etc..


Formatting shapes
Formatting Shapes

  • Select shape

  • Right click on mouse and select Format

  • View Format menu and select option


Changing colour
Changing Colour

  • Select shape

  • Right click on mouse and select Format

  • Select Fill and choose options

  • Alternatively, select fill shortcut from menu bar


Changing outline style
Changing Outline Style

  • Select shape

  • Right click on mouse and select Format

  • Select Line and choose options


Adding text to shape
Adding Text to Shape

  • Select shape

  • Double click on shape and write text


Inserting text
Inserting Text

  • Select Text tool

  • Draw text box

  • Write Text


Moving shape
Moving Shape

  • Select shape

  • Move shape around using up and down keys on keypad or by dragging


Drawing lines
Drawing Lines

  • Select Line Tool type from tool bar

  • Options include Line tool, Arc Tool, Freeform Tool & Pencil Tool- To draw a straight line, use Line Tool- To draw curved line, select Arc Tool


Drawing straight lines
Drawing Straight Lines

  • Select Line Tool

  • Move cursor to page and draw line in specific direction

  • Line appear on page

  • Now you can format your line e.g. change style, colour etc


Drawing types templates
Drawing Types & Templates

  • MS provides a range of drawing types

  • For example …Block Diagram, Building Plans, Database, Electrical Engineering, Flowcharts, Forms and Charts, Map, Mechanical Engineering, Network, Organization Chart, Process Engineering, Project Schedule, Software, Web Diagram

  • Each drawing type contains a range of templates


Templates
Templates

  • A template includes everything you need to create a drawing, from the drawing page to shapes and styles

  • Using a template ensures consistency across your drawing files, so you can focus on what goes on the page while the template provides a consistent starting point

  • But you don’t have to use templates, you can create drawings from scratch…


Templates1
Templates

  • When you start a drawing based on a template, a Microsoft Visio file opens that contains the following:

  • One or more stencils containing related shapes.

  • A blank drawing page that has a grid and measurement system appropriate for the type of drawing you are creating.

  • For scaled drawing types, a drawing page set up with the correct scale and page size.

  • Styles for text, lines, and fills appropriate to the type of drawing you are creating.


Create a new drawing based on a template
Create a new drawing based on a template

  • Click the Start button, point to Programs, and then click Microsoft Visio

  • On the File menu, point to New, and then click Choose Drawing Type

  • In the Category list, click the category of drawing you want to create

  • Under Template, click the specific type of drawing you want to create


Templates of interest to us
Templates of Interest to Us

  • You can use a number of templates, if wish

  • Browse through templates in the following drawing types:- Software e.g. Windows User Interface- Web Diagram- Workflow


Sample drawings
Sample Drawings

  • Visio provides sample drawings for each drawing type

  • On the File menu, point to New, and then click Browse Sample Drawings.

  • Locate the drawing you want to open, and then double-click the name of the drawing


Open existing drawing files
Open existing drawing files

  • On the File menu, click Open

  • In the Look In list, open the folder that contains the file or files you want to open

  • To open a single drawing file, select it.

  • To open multiple drawing files, press CTRL and then click the files you want to open.

  • Click Open


About stencils and masters
About stencils and masters

  • When you start a new drawing by opening a template, one or more task-related stencils open next to the drawing page

  • Stencils store masters, which you can drag onto a page to add shapes to your drawing

  • To find masters that do not appear on an open stencil, open additional stencils


Open additional stencils
Open additional stencils

  • On the File menu, point to Stencils, and then click Open Stencil

  • Double-click the solution folder that contains the stencil or stencils you want to open

  • To open a single stencil, select it

  • To open multiple stencils, press CTRL and click the stencils you want to open

  • Click Open


Close a stencil
Close a stencil

  • Right-click the stencil title bar

  • Click Close


Change how shapes are displayed on a stencil
Change how shapes are displayed on a stencil

  • Right-click a stencil title bar, and then do one of the following

  • To display icons and names, click Icons and Names

  • To display icons only, click Icons Only

  • To display shape names only, click Names Only

  • To display icons, names, and shape descriptions, click Icons and Details


About microsoft visio drawing file summary properties
About Microsoft Visio drawing file summary properties

  • You can assign summary properties, such as title, subject, author, and description, to Microsoft Visio drawing files to help you and other users search for and identify the files

  • For example, if you create a file and enter "Company Picnic" for the subject, you can later locate the file by searching for that term

  • After you save a file for the first time, the Drawing Properties dialog box appears by default


About microsoft visio drawing file summary properties1
About Microsoft Visio drawing file summary properties

  • On the Summary tab, you can type the title, subject, author, the author's manager, and a company name. You also can assign a category and keywords and describe the file, and you can specify whether to save a preview of the first page of the drawing file or of all pages in the file


Saving your work
Saving Your Work

  • As you work on a drawing, save the drawing file frequently

  • When you change a stencil or template, save these files too

  • How you save a Microsoft Visio drawing file (*.vsd) or XML drawing file (*.vdx) affects what happens the next time you open it


Saving your work1
Saving Your Work

  • The first time you save a file, you are prompted to save property information e.g. author, title etc

  • If you enter this information, it appears in the Open Dialog box, to help you identify the file

  • You can save a drawing as a template (*.vst), an XML template (*.vtx), that you can use as a model for other drawings

  • To prevent someone from editing your drawing, you can save it as read-only


Save a drawing file for the first time
Save a drawing file for the first time

  • On the File menu, click Save As

  • In the Save in list, open the folder in which you want to save the file

  • In the File name box, type a name for the drawing file, and then click Save

  • On the Summary tab of the Drawing Properties dialog box, enter any information you want to associate with the file, and then click OK


About shapes and drawings saved in jpg gif or png format
About shapes and drawings saved in .jpg, .gif, or .png format

  • You can save a Microsoft Visio drawing in one of the following graphic formats

  • .jpg (Joint Photographic Experts Group)

  • .gif (Graphics Interchange Format)

  • .png (Portable Network Graphic)

  • These are all formats that you can distribute over the Internet or your intranet

  • Virtually all Web browsers support the .jpg and .gif formats


About shapes
About Shapes format

  • The term shape refers to anything on a drawing page:

  • Shapes drawn with the drawing tools

  • Shapes dragged from stencils

  • Connector lines connecting shapes

  • Blocks of text

  • Objects from other programs that are imported, embedded, or linked

  • Guides


Shapes and formatting
Shapes and Formatting format

  • You cannot apply all types of formatting to all shapes

  • For example, you cannot apply a fill format to lines, text blocks, and embedded objects, and you cannot apply a line format to text blocks

  • A shape's appearance is determined by the formatting applied to that shape

  • Formatting consists of many individual settings, separated into three groups: fill, line, and text


Styles shapes
Styles & Shapes format

  • You can assign a styleto a shape as a way to determine the shape's formatting

  • When you assign the same style to many shapes, those shapes share common, standardized formatting


Styles templates shapes
Styles, Templates & Shapes format

  • You can assign more than one style to a single shape

  • You can assign a different style for fill, line, and text to a shape

  • When you change styles, you change all the shapes that use that style

  • For this reason, changing styles is an efficient way to globally change the look of the shapes in your drawing


Local formatting
Local Formatting format

  • You can make custom changes to any aspect of a shape's formatting

  • These changes become part of that shape, overriding the formatting defined by its assigned styles

  • This process is called local formatting


Local formatting1
Local Formatting format

  • When you apply a style to a shape, you can do one of the following:

  • Preserve any local formatting in the shape

  • Remove all local formatting and force the shape to use only the style's formatting


Local formatting2
Local Formatting format

  • For example:

  • If a computer shape in a network diagram has the Net-Normal style assigned, you can change the shape's text from normal to italic

  • If a process shape in a flowchart has the Flow-Normal style assigned, you can change the fill color of the shape from white to blue


Default styles
Default Styles format

  • You can define default fill, line, and text styles for your drawing

  • When you use a drawing tool to draw a new shape, the new shape is assigned the default styles


Default styles1
Default Styles format

  • However, if no shapes on a drawing page are selected and you change any formatting, the new formatting is applied to all new shapes you draw until you reapply the original setting

  • For example, if you click the Bold button, all shapes you subsequently draw will have bold text until you turn bold off


Related shapes often have the same formatting
Related shapes often have the same formatting format

  • Formatting for shapes you drag from stencils is defined by styles that you can edit

  • Frequently, the same styles are applied to all related shapes on a stencil

  • Therefore, you can change the formatting for all the shapes in a drawing at once by editing the styles


Undo format

  • If you make formatting changes to a shape and then decide you prefer the previous formatting, undo your formatting immediately

  • Or, you can revert to the styles associated with the shape's master


Templates2
Templates format

  • When you know that you'll be creating multiple drawing files that need a consistent look, you can create a template on which to base all the drawings

  • Creating your own template eliminates the need to open the appropriate stencils, create styles, and establish page settings for each drawing file, because they are all contained in one place


How styles become part of a template
How Styles become part of a Template format

  • To make a particular style available in future drawings, you can either define or edit the current drawing in an existing template or save the drawing file as a new template

  • The new style becomes part of that template

  • When you define or edit styles in a drawing file, the changes you make are available only in the current drawing


How styles become part of a template1
How Styles become part of a Template format

  • To make a style available in drawings you'll create later, you can define or edit it in an existing template or save the drawing file in which you created the style as a new template

  • The style will be included in every new drawing you create that is based upon that template

  • When you edit or define a style, the color palette in the template on which you base your drawing determines the colors you can choose


How styles become part of a template2
How Styles become part of a Template format

  • All Visio templates use a default color palette

  • You can change the color palette a drawing uses or modify the colors within the default color palette


When to create a template
When to Create a Template format

  • Create a template when you make drawings that consistently use the same stencils, styles, and page settings

  • Then you can base new drawings on this template, and you can distribute the template to other people


Creating a template
Creating a Template format

  • The easiest way to create a template is to create a drawing file that has the settings you want, open the stencils you want, and then save the drawing as a template (.vst) file

  • If you simply want to change some of the settings of an existing Visio template, you can base a drawing on that template, save it with a new name, and then make your changes


Apply styles
Apply styles format

  • Select one or more shapes to format

  • On the Format menu, click Style, and from the Text style, Line style, and Fill style lists, click the styles you want, and then click OK

  • To continue working on styles, click Apply instead


Define a new style
Define a new style format

  • On the Format menu, click Define Styles

  • Under Style, in the Name list, click <New style>, and then type a name for the new style

  • To base a new style on an existing style, click that style in the Based on list

  • Under Includes, select the attributes that you want your style to include

  • A style can include any combination of text, line, and fill attributes


Define a new style1
Define a new style format

  • Under Change, click Text, Line, or Fill to change the settings for that attribute

  • Specify the settings you want for each attribute you selected


Defining a new style
Defining a New Style format

  • To add the new style and, if you selected shapes in your drawing, apply it to the selected shapes and close the dialog box, click Apply

  • To add the new style and, if you did not select any shapes in your drawing, close the dialog box, click OK

  • To add the new style and continue working on styles in the dialog box, click Add


Edit a style
Edit a Style format

  • On the Format menu, click Define Styles

  • Under Style, in the Name list, click the style you want to edit

  • To rename the style, click Rename, type a new name for the style, and then click OK

  • To change the style settings, under Change, click the attributes you want to edit


Edit a style1
Edit a Style format

  • When you have finished editing, do one of the following

  • To add the changes to the style and close the dialog box, click OK (when no shapes are selected) or click Apply (when shapes are selected)

  • To add the changes and continue working in the dialog box, click Change


ad