Visio Insights
The official blog of the Microsoft Visio product team

  • Visio Insights

    Wireframe Shapes in Visio 2010

    • 41 Comments

    Visio has long been regarded by interaction designers and information architects as an essential tool in their work. Many software wireframes (aka software mockups) are built using Visio, and they can range from mobile software, interactive web sites, to enterprise application software.

    In the past, Visio included a set of Windows XP stencils for such work. For Visio 2010, we decided to refresh those stencils by providing a brand new set of Wireframe shapes that are generic and not specific to the operating system. The intent is to offer the UX community with medium-fidelity UI shapes and icons that can be used to create wireframes for general software design for a wide variety of platforms (e.g. mobile, internet, windows). As an example, see the following mockup of Microsoft Internet Explorer and the homepage of Microsoft.com using the new Wireframe shapes (mockup is on the left, and the actual software is on the right):

    IEmockup

    This new set of shapes not only allows easier creation of wireframes, but offer many customization options to meet specific design needs. Let’s further examine what Wireframe shapes are included in Visio 2010 and what functionalities are added to make building wireframes easier.

    UI Dialogs, Controls, Toolbars and Icons

    First, to create a Wireframe Diagram, go to New > Software and Database > Wireframe Diagram:

    clip_image004[6]

    Similar to previous Windows XP UI shapes, Visio 2010 offer UI shapes for building dialogs, controls, and toolbars. What’s new however is the addition of common UI icons for Windows, web, and multimedia applications. Here is the full set of Wireframe shapes that is included:

    clip_image006[6]

    Resizable and Configurable

    Customizing wireframe UI components are easier than ever. Most Wireframe shapes are resizable and offer options to customize the visuals. For example, a button is a common control and has configurable state options through the right-mouse action menu:

    clip_image007[6]

    Working with Themes and Formatting

    Unlike previous Windows XP UI shapes, the new Wireframe shapes also allow users to customize the look of the UI elements through Themes or formatting. With Themes, users can easily customize color and effects schemes that can be applied to all UI components easily. Moreover, individual controls can be formatted to indicate highlight or indicate different UI states. As an example, the diagram below shows what the wireframes looks as default (no Themes applied), and with Themes applied:

    clip_image009[6]

    Controls as Containers and Lists

    With the introduction of Containers (see earlier blog post for more details), Wireframe shapes such as Dialog form, Application form, and Panel are built as Containers to “contain” any control that is placed inside it. By being a Container, when you move a Dialog form, all controls contained inside it will also move with it.

    Also, Wireframe controls such as Tree Control, Drop-down Menus, List Box are shapes to utilize the new list feature, similar to Cross-functional Flowcharts and Data Graphic Legends. Lists allow users to easily add new element to be contained in a List shape through a blue arrow, as demonstrated below in a Drop-down Menu control:

    clip_image010[6]

    As a result, users no longer need to add shapes through multiple drag-drop or copy-paste operations. Instead, the blue arrow allows for a super quick way to add a lot of UI components while properly aligning and arranging the items at the same time.

    Feedback Welcome

    We are excited to bring users a brand new set of Wireframe shapes that offer greater versatility and broader application. Please use the Send a Smile feedback tool or comment on this post if you have feedback on the Wireframe shapes.

  • Visio Insights

    Visio 2010: Better with Windows 7

    • 6 Comments

    Windows 7 is here, and it makes it easier to find and work with your favorite applications. This post details the work we did in Visio 2010 to take advantage of new Windows 7 features, to make working with Visio documents even easier.

    Multiple Documents in Visio 2010 and the new Windows 7 Taskbar

    The new Windows 7 taskbar presents a unified interface for launching and switching between applications and documents within them. With Windows 7 and Visio 2010, it is now easier to work with multiple Visio documents at the same time.

    We received lots of feedback on the Technical Preview asking for the ability to preview open Visio documents as multiple taskbar items. We listened, and now in the Visio 2010 Beta you can see previews of each Visio document directly from the taskbar, similar to Word and PowerPoint:

    clip_image002

    By clicking on a thumbnail, you can switch directly to a specific Visio document. If you hover over a thumbnail, Windows shows you a full-size preview of what that window looks like, through a feature called Aero Peek. With Visio 2010 and Windows 7, working with multiple documents at the same time is simple.

    For more on the Windows 7 task bar, see this blog post on the Engineering Windows 7 Blog.

    Dual Display Support

    Another common request we receive is to enable Visio documents to be edited on separate monitors, similar to Word and PowerPoint. While Visio still displays multiple documents in the same application window, there is a workaround to enable dual display support: launch two instances of Visio.

    You can do this in Windows 7 by launching Visio, and then right clicking the Visio icon and clicking on the “Microsoft Visio 2010” item. This will launch a second instance of Visio.

    clip_image004

    Now that you have two instances running, move one instance of Visio to your second monitor. You can then open two separate files in two separate windows. Even though you’re running two instances of Visio, they are both represented by the same icon in the Windows 7 taskbar, so it’s easy to switch between documents.

     

    Multi Touch in Visio 2010

    If you have a touch-enabled device, Windows 7 allows you to interact with your PC with your fingers. This feature, called Windows Touch, brings a set of gestures to the operating system that can be used in the OS and several applications.

    We’ve integrated support for several Windows Touch gestures in Visio 2010:

    • Panning: You can use one or two fingers to pan and scroll a document. This makes it easy to navigate Visio diagrams.

    clip_image006

    • Zooming: With two fingers, you can pinch and pull on an area of your Visio document to zoom in on it or zoom out.

    clip_image008

    • Two Finger Tap: If you tap the screen with two fingers, Visio will restore your view by invoking the “Fit page to current window” command.

    clip_image010

    The above scenarios work directly on the drawing surface, and in full screen mode! Check out the video below to see multi touch in action!  (Note: there is no audio).

     

     

     

     

     

     

     

     

     

     

     

     

     

     

    As seen in the video, we have also integrated the same touch support in the Visio Viewer and in Outlook 2010 preview mode. If you receive a Visio diagram as an attachment, you can use these touch gestures to navigate the diagram directly in Outlook 2010. Click here for more information about Windows Touch

    As usual, feel free to drop us a comment on the blog or use the Send a Smile feature in the Visio 2010 Beta to let us know what you think.

  • Visio Insights

    Visual Updates to Shapes in Visio 2010

    • 5 Comments

    One of the goals of the Visio 2010 release is to make it easier to create attractive, presentation-quality diagrams. Previously on this blog, we have discussed our improvements to backgrounds, layout, routing, and themes. Visio 2010 also features improvements to the default look of many templates, as well as over 500 newly designed shapes. Below are a few highlights of these changes.

    New default theme

    Many Visio 2010 templates feature a new, consistent set of default line, font, and shadow properties that help make diagrams look more modern. Here is an example comparing part of a Visio 2007 flowchart with a Visio 2010 flowchart:

    V12 flowchart

    In addition to these general enhancements, below are some specific templates we made significant changes to.

    Directional Map

    The Landmark Shapes stencil in the Directional Map template has around 30 newly designed shapes. Here are a few:

    Directional Map Shapes

    Workflow

    The Workflow Shapes template also has around 30 newly designed shapes. Here are a few:

    Workflow Shapes 

    Calendar

    Here is a calendar created in Visio 2010, with our newly designed calendar and icon shapes:

    clip_image037

    Timeline

    Visio 2010’s timeline shapes have a sleek new look. Here is an example:

    clip_image039

    The above are just a few examples. Here is a more comprehensive list of stencils and templates with new or updated shapes:

    • Six Sigma
    • Data Graphics Legend
    • Containers
    • Callouts
    • Business Process Modeling Notation (BPMN)
    • BPMN Pools & Lanes
    • Basic Flowchart
    • Compliance
    • Cross-functional
    • SharePoint Workflow
    • Wireframe
    • Backgrounds
    • Borders
    • Timeline
    • Web site map
    • Calendar
    • Workflow
    • Landmarks

    We are interested in your feedback on these visual updates. You can use the Send a Smile feedback tool or comment on the blog to let us know what you think.

  • Visio Insights

    Improvements to multi-page document support in Visio 2010

    • 22 Comments

    In this post, we’ll talk about the improvements we’ve made in Visio 2010 to make it easier to work with multi-page documents. With these changes, Visio provides more control when you copy and paste shapes between pages, as well as more efficient page tab management and navigation.

    Copying and pasting shapes

    The biggest change with copy/paste is that if you copy shapes from one page and paste them to another, the shapes will paste to exactly the same location as on the first page. In prior versions of Visio, the shapes would always paste to the center of the window. This change makes it easier to make an identical copy of a page or to create a multi-page document that has incremental changes between pages. For example, you might have a series of flowcharts that begin with the same set of steps or a storyboard that walks through a UI design.

    If you want the pasted shapes to go to a certain location on a page, rather than to the position they were copied from, you can right-click on the page at the location you want them to be placed, and choose “Paste” in the right-mouse menu. The shapes will paste to the spot where you right-clicked:

    image 

    Managing page tabs

    We’ve made several improvements to the page tabs to make them easier to use and more consistent with the sheet tabs in Microsoft Excel.

    First, there is a new Insert Page button at the end of the page tabs, which lets you quickly add a series of pages to the end of the page tab order:

    image 

    If you right-click on a page tab and choose Insert Page, the new page is inserted immediately after the page tab you right-clicked on, rather than at the end of the tab order. So you can insert the page where you want it, rather than having to add the new page at the end before dragging it to the desired location:

    image 

    Since the settings in the Page Setup dialog box apply to the currently active page, we’ve added the Page Setup command to the page tab’s right-mouse menu to provide quick access to that page’s settings:

    image

    Pages in Visio can be either foreground or background pages. Foreground pages are the pages you build your diagram on. Background pages have special behaviors and are intended as a place to put objects that you want to appear on multiple foreground pages. To help you distinguish between background and foreground pages, the names on background page tabs are italicized as a hint that they are different:

    image

    Right-clicking on the forward/backward navigation buttons to the left of the page tabs brings up a menu of all of the pages in the document, so you can move quickly from one page to another:

    image

    Finally, if you want to make all the pages in your document the same orientation or size, you can apply the same setting to all of them at once, instead of having to set it for one page at a time. Click on the Orientation or Size buttons on the Design tab in the ribbon, and then right-click on the setting you want in the menu. Choose to apply it to all the pages in your document or only the current page:

    image 

    All of these improvements were in direct response to feedback we heard from customers, so please continue providing us with more great feedback. Drop us a comment on the blog or use the Send a Smile feature in the Visio 2010 Beta to let us know what you think.

  • Visio Insights

    The Improved Dynamic Grid in Visio 2010

    • 19 Comments

    In Visio 2010, we’ve made it easier to align and space shapes to make your diagrams look neat and organized. In a previous post we covered our new layout improvements that help clean up existing diagrams. In this post, we’re going to cover how improvements in Visio’s Dynamic Grid can help you drag a single shape and more easily position it in relation to other shapes on the page.

    Turning On the Dynamic Grid

    The Dynamic Grid is turned on by default for most diagram templates. You can turn it on or off by toggling the checkbox in the View tab:

    clip_image002

    Aligning shapes

    To see the Dynamic Grid in action, simply drop a shape next to another shape and notice the orange lines that automatically appear:

    clip_image003

    In the example above, Visio detected that the selected shape matched the centerline of a nearby shape. If the shapes were of different sizes, Visio would attempt to align the shapes based on edge boundaries such as the top, bottom, left, or right edges of shapes in addition to the centerline:

    clip_image004

    Note that the Dynamic Grid only aligns the same edge boundaries of shapes. For example, a top edge of a shape will snap to the top edge of another shape, but not to the bottom edge of another shape.

    Spacing shapes

    The Dynamic Grid also displays orange line segments when evenly spaced shapes are found close to each other. This is useful for easily placing shapes in equal distances from one another. Simply drop a shape next to other evenly spaced shapes to see these line segments in action:

    clip_image005

    The Dynamic Grid scans both horizontally and vertically when displaying feedback. This allows you to easily position shapes in relation to many surrounding shapes:

    clip_image006

    Snapping to the Dynamic Grid

    When either an alignment or spacing relationship is found between shapes, Visio will gently snap the shape you have selected to an invisible grid. This snapping behavior makes it easy to grab a shape using the mouse and position it next to other shapes.

    Page margins and centerlines

    To help position shapes within a page, the Dynamic Grid also supports margins around pages. You can snap to page margins by simply dragging a shape towards the top, bottom, left or right margins of a page. If the page is completely empty, you can also snap to the center of the page.

    Container margins and centerlines

    To help position shapes within a container, the Dynamic Grid also supports container margins and centerlines. You can snap to containers, such as swimlanes, by simply dragging a shape around the container margin or in the center of the container:

    clip_image007 clip_image008

    We hope you enjoy using the new Dynamic Grid feature and we’re interested in your feedback. You can use the Send a Smile feedback tool or comment on the blog to let us know what you think.

  • Visio Insights

    BPMN support in Visio 2010

    • 57 Comments

    Business Process Modeling Notation (BPMN) is a standard maintained by the Object Management Group which gives businesses the ability to understand their business processes using a graphical notation and to communicate these processes in a uniform manner. The basic BPMN shapes are similar to traditional flowcharting shapes, which makes modeling in BPMN easy for new users. For advanced users, the BPMN standard contains a large number of detailed shapes—more specialized versions of the basic shapes—which are useful when modeling complex interactions or precise behaviors within a process.

    Companies have told us that they would like to enforce a standardized notation, like BPMN, within their organization to ensure that processes are graphically expressed in a consistent manner. Based on this feedback, we introduced the following support for BPMN in Visio 2010.

    • We support all shapes defined in the BPMN 1.2 standard.
    • Our BPMN shapes have associated element attributes, as specified by the standard.
    • Using Diagram Validation, a user can check the visual correctness of a diagram against logical rules specified in the standard.

    You can find the BPMN Diagram template under the Flowchart category on the New tab of the Backstage View.

    Backstage

    The BPMN Diagram template contains five stencils of BPMN shapes: the BPMN Basic Shapes, BPMN Events, BPMN Activities, BPMN Gateways and BPMN Connecting Objects stencils.

    Stencils

    For new BPMN users, all the basic BPMN shapes are located on the BPMN Basic Shapes stencil. For more advanced users, additional BPMN shapes can be derived from the basic shapes or taken from the other BPMN stencils.

    You can derive a more specialized shape from a basic shape by right-clicking on the shape. The menu below shows how you would change a Task to a Standard Loop Task or a Multi-Instance Loop Task. Each of these shapes have different graphical symbols to distinguish them and different BPMN properties, or attributes, associated with them.

    RMA

    Notice the BPMN Attributes… option located at the bottom of the above menu. This option launches the Shape Data window which displays the shape’s BPMN attributes, properties specified by the BPMN standard. This gives advanced BPMN users to option to edit the complete set of BPMN attributes associated with a shape.

    Shape Data

    The BPMN Diagram template and shapes take advantage of many of the new Visio 2010 features. You will notice that the ease of use and flowcharting improvements in Visio 2010 make it easy to build visually-appealing BPMN diagrams. Below, we focus on some of the other Visio 2010 features that you will encounter when using the BPMN template and shapes.

    Diagram Validation

    The BPMN standard contains a large number of rules about the visual, structural and semantic properties of a diagram: these rules must be satisfied in order to comply with the standard. The standard documentation is long and it is hard for new users to understand its intricacies. We use Diagram Validation to help users ensure that their BPMN diagrams are visually conformant with the standard.

    The BPMN Diagram template includes validation rules based on the BPMN 1.2 standard. This means that you can use the Check Diagram button on the Process tab to check for visual issues with your BPMN diagram. After you validate your diagram, any issues are listed in an Issues window.

    Validation

    To easily find shapes with issues, you can click on an issue and the corresponding shape will be selected. Once you fix the issues, you can check the diagram again to confirm that there are no longer any problems. This makes it much easier to create a BPMN-compliant diagram.

    Containers

    Expanded Sub-Process and Group shapes in the BPMN template are Containers. This means you can take advantage of all the built-in container logic. For example, when you move an Expanded Sub-Process, all the member shapes move automatically. In addition, when you select an Expanded Sub-Process or Group, you see the containers contextual tab, which gives you the ability to further customize these shapes.

    Contextual Tab

    Callouts

    The Text Annotation shape in the BPMN template is a Callout. A callout points at or references another shape, which we call the “target” of the callout. When a target shape is moved, copied or deleted, any callouts attached to the shape will be moved, copied or deleted too.  Thus callouts stay with their target shapes, though you can reposition the callout to any offset from its target.

    Text Annotation

    Cross-functional Flowcharts

    The Pool /Lane shape in the BPMN template allows you to add a Pool or Lane shape to your diagram. This shape is based on our Cross-functional Flowchart (CFF) shape, which means that Pools and Lanes are easy to manipulate using CFF functionality. For example, to add more lanes, you can mouse along the edge of the cross-functional flowchart to where you want to add the lane and a blue arrow will appear. Click on the blue arrow and voila, you have a new lane!

    CFF

    The BPMN template combines a large number of new Visio 2010 features to make building BPMN-compliant diagrams easier. Both new and advanced BPMN users will benefit from the depth of functionality available while using this template.

    We are interested in your feedback on the new BPMN functionality. You can use the Send a Smile feedback tool or comment on the blog to let us know what you think.

  • Visio Insights

    Subprocesses and Hyperlinks

    • 9 Comments

    You may recall that simplifying Process Management is one of the core areas we focused on in Visio 2010.  Many Visio users build large process diagrams and a common tactic is to segment them into manageable, reusable pieces.  Typically, processes are broken down into parts on different pages within the same document, or in some cases into separate documents.  These subprocesses may be organized around ownership of the process, the people and groups who are related to them, or simply around the size of the diagram.  Visio 2010 adds explicit support to create new subprocesses and reference existing ones.

    1b

    When the diagram authors are building their diagrams, we found that they may take different approaches depending on the circumstances of what they are designing or documenting.  Some build out from a higher level and know where subprocesses need to be referenced or created, adding subprocess shapes that act as placeholders for the subprocess that will be filled in later.  Others build out full detail and then go back to move parts of the diagram into subprocesses.  To reference each of these subprocesses, a hyperlink is typically added to a shape that refers to the entire subprocess.  Visio 2010 builds on these common characteristics and provides ways to automate much of the manual work around creating subprocesses.

    The Create New command is designed to help you build out a brand new subprocess represented by the selected shape.  This will insert a new blank page and add the page name and a hyperlink pointing to the new page to the selected shape.

    2

    The Link to Existing command allows you to create a hyperlink on the selected shape that points either to a page in the current document or to an external document, such as one stored in a Visio Process Repository.

    3

    The Create from Selection command is used when you want to move a number of shapes from your current page onto a new subprocess page.  Visio adds a new page, moves the selected shapes to the new page and adds a subprocess shape to the current page.  The new shape represents the new subprocess and contains the name of the new page as well as a hyperlink pointing to it.

    Selection moved to a new subprocess 4
    New subprocess shape in higher-level process 5
    Subprocess page 6

    Hyperlinks are used to jump to and from the various subprocesses, so we looked toward our Ease of Use goals and made a few changes to how hyperlinks, in general, are managed.  We improved hyperlink navigation in Visio 2010 by allowing you to Ctrl+Click on a shape to follow a hyperlink, which is common elsewhere in Office.  The hyperlink still exists in the context (right-click) menu, and we added an entry point to the hyperlink dialog to make it easier to manage the links on your shape.  Some of you are probably thinking, “Hey, Ctrl+Click is already used to select multiple shapes!”  Not to worry – if you click to select a shape and then use Ctrl+Click to add more shapes to your selection, that still works.

    7 8

    You can add your own hyperlinks to shapes using the Hyperlink command on the Insert menu, which should be familiar from the other Office programs.

    9b

    You may notice that the Hyperlink button is disabled if no shapes are selected.  When rethinking the interface for Visio 2010, we found that many users accidentally added a hyperlink to the page rather than a shape because they didn’t have a shape selected.  We also found that page hyperlinks are used mainly in custom templates or solutions and infrequently enough otherwise that we felt it was better to help users avoid accidents in the common case.  Page hyperlinks can still be added via the API or PageSheet.  And what about document hyperlinks?  Developers can add those through the API or DocumentSheet and end users can do it in the Backstage View.  Click the File tab, and go to the right side of the Info tab, where document properties are listed.

    10 11

    As usual, feel free to drop us a line about this using Send a Smile, or here on the blog.

  • Visio Insights

    Video: Process Diagrams in Visio 2010

    • 5 Comments

    Recently Mark Nelson from the Visio team sat down with Harry Miller (off-screen) to discuss some of the improvements in Visio 2010 related to process diagrams.  The video includes explanations of our Process Management investments as well as demos for Cross-functional Flowchart, BPMN diagram and Validation features.

     

    Get Microsoft Silverlight

     

    The conversation is the latest in a video series titled “Visio: Drawing on Experience” posted on Microsoft TechNet.  Other videos featuring some of our Visio MVPs can be found here: http://edge.technet.com/Tags/Visio/

  • Visio Insights

    SharePoint Workflow Authoring in Visio Premium 2010 (Part 1)

    • 14 Comments

    Visio has long been the tool of choice for documenting processes. Ever since the introduction of workflow support in Microsoft Office SharePoint Server 2007, we have been hearing from customers, “wouldn’t it be great to visualize SharePoint workflows in Visio like flowcharts? Wouldn’t it also be great to go from Visio business process diagrams to executable workflows on SharePoint?”

    In Visio Premium 2010, we have partnered with the SharePoint Designer team to bring you that functionality to life. In this blog post and the next, we will introduce to you how you can author SharePoint workflows just like any flowcharts in Visio, and how such workflows can then be imported into SharePoint Designer 2010 for further editing before it can be executed in SharePoint.

    What are SharePoint Workflows?

    First of all, what are SharePoint Workflows? Workflow is just another way of saying process flow, something most Visio users are already familiar with. In SharePoint, there are pre-defined common activities (e.g. Send email) that can be executed together with others, and together this forms a “workflow”. Some SharePoint workflow examples include: document approval workflow, expense approval workflow, and document review feedback workflow. A user may originally create the business workflow in Visio, as shown below:

    clip_image002

    That same workflow, implemented as a SharePoint Workflow, can look like the following in SharePoint Designer 2010:

    clip_image003

    So how can you go from a business flowchart in Visio to a workflow published to SharePoint?

    Starting from Visio: New SharePoint Workflow Template

    In Visio Premium 2010, we are introducing a brand new drawing template just for SharePoint Workflow. When you start up Visio, you can go to New->Flowchart->Microsoft SharePoint Workflow in order to start authoring a Visio SharePoint Workflow from scratch.

    clip_image005

    This is especially handy for Business Analysts or Process Analysts who are already familiar with flowcharting in Visio, but would like to automate the workflow to be executed in SharePoint.

    Upon opening the drawing, you will notice that key SharePoint activities are available in three separate stencils: SharePoint Workflow Actions, SharePoint Workflow Conditions, and SharePoint Workflow Terminators. Every SharePoint activity directly maps to those available in SharePoint Designer 2010.

    clip_image007

    To start authoring a SharePoint workflow, simply drop shapes to the drawing canvas, just like creating any basic flowchart in Visio. Note you can modify the original shape text and replace it with text more relevant to your business process:

    clip_image009

    Exporting Workflow to SharePoint Designer 2010

    When you are done with authoring your workflow, you can export it in a file that can be imported by SharePoint Designer 2010. By exporting the workflow to SharePoint Designer 2010, SharePoint specialists or IT professionals alike can further parameterize the workflows by binding workflow activity fields with SharePoint lookups and then publish as executable workflows.

    To export, simply go to the Process tab, and click Export:

    clip_image010

    Visio will automatically validate the workflow first to make sure the workflow is valid (for more information about our validation feature, see this earlier blog post). In the event that your workflow has issues, an Issues window will pop up, and the shape with the issue will be highlighted.

    clip_image012

    After you fix all issues, the workflow will be exported as a Visio Workflow Interchange (*.vwi) file, which can be imported into SharePoint Designer 2010.

    Upcoming Post: Part 2 of SharePoint Workflow Authoring in Visio Premium 2010

    In the next blog post, we will discuss in more detail about the round-tripping capabilities between SharePoint Designer 2010 and Visio 2010. We will also discuss the ability to publish Visio workflow visualization through SharePoint Designer 2010. So stay tuned! And don’t forget to send us feedback through the Send a Smile feedback tool or comment on this post!

  • Visio Insights

    Introducing the Microsoft Visio 2010 Beta SDK

    • 10 Comments

    A Beta release of the Microsoft Visio 2010 SDK is now available for download! Due to high demand for an early version of the SDK, we have released a Beta version of the SDK with a partial set of supported features. Additional features and functionality will be available in the RTM version of the Visio SDK.

    There are two versions available depending on whether you are running the 32-bit or 64-bit version of Visio. It is important to install the right version of the SDK to ensure that all the SDK tools function correctly.

    The Microsoft Visio 2010 SDK contains the following items:

    1. Tools
    2. Sample applications
    3. Visual Studio Add-on Wizards
    4. Documentation
    5. Visio Type Libraries and C++ Library Files

    We explain these items in more detail below. Features listed with an asterisk (*) are not supported in the Beta version of the Visio SDK.

    Tools

    Once you install the Visio SDK, you will see SDK Tools available on the Developer tab in Visio.

    SDK tools

    The Event Monitor tool watches for events that are raised in Visio and it can help you debug your solution when handling events.

    The Persistent Events tool provides a user interface that lets you add and modify persisted events.

    The Print ShapeSheet tool provides a user interface that lets you print the contents of a ShapeSheet.

    The Visio SDK also includes the Microsoft Visio Solution Publishing Tool*, which is an executable that you can run from outside Visio. This tool works with Windows Installer to add Visio-specific entries, such as Visio add-ons (.vsl and .exe files), stencils (.vss and .vsx files), templates (.vst and .vtx files), and Help files (.chm files), to the PublishComponent table of the .msi file that you create to install your solution on your users' computers.

    Sample applications

    The Visio SDK also includes a number of sample applications written in either Microsoft Visual Basic .NET, Microsoft Visual C#, or Microsoft Visual C++. You can experiment with these samples as you develop your own custom solutions for Microsoft Visio 2010. By default, the sample applications target the 32-bit version of Visio 2010.

    After installing the Visio SDK, you will see a new category of template on the New tab of the Backstage View.

    clip_image003

    The samples are not functional, however, until after they are built in Visual Studio and then installed using the generated setup.exe or .msi file. Once a sample application is installed, the application can be launched by opening the corresponding template in the SDK folder shown above. The only exception is the Office Plan Sample, which uses the Microsoft Visio 2010 Drawing Control inside a Microsoft Windows Form and is launched from outside Visio. The available sample applications are shown below.

    The Flowchart Chart Sample (available in C#, VB.NET and C++*):

    clip_image005

    The TreeView Sample* (available in VB.NET):

    TreeView

    The Office Plan Sample (available in C#):

    clip_image007

    Add-on Wizards

    The Visio SDK installs wizards for creating Visio add-on projects in Microsoft Visual Studio 2005 and Microsoft Visual Studio 2008. These Wizards let you set up new Visio add-on projects in Microsoft Visual Basic .NET, Microsoft Visual C#, and Microsoft Visual C++, and create corresponding setup programs to install add-ons. Once you have used the wizard to create a Visio project, you can explore the project code and settings to learn more about how Visio add-ons should work.

    VisualStudioWizard

    Microsoft Visual Studio 2010 also includes wizards to generate Visio 2010 VSTO add-in projects. The Visio SDK is not required to use these wizards.

    clip_image009

    Documentation*

    The Visio SDK includes documentation like the Visio Automation Reference, the Visio ShapeSheet Reference, the Visio Save As Web Reference, the Visio Viewer Reference and the Visio XML Reference. In addition, it includes the Code Sample Library—a library of interesting code samples. Note that the documentation included with the Beta SDK is Visio 2007 documentation.

    Libraries

    We also include a number of support files in the SDK. We provide type libraries for three application programming interfaces (APIs) that Microsoft Visio 2010 exposes: the Visio type library, the Save as Web type library, and the Microsoft Office Visio Drawing Control type library. In addition, we provide support files to help C++ developers automate Visio. The Beta versions of these support files are in this release of the SDK.

    Things to expect at RTM

    Along with the content described above, we are working on some new features for the RTM version of the SDK. We are currently planning to release the following additions at RTM:

    1. A new VSTO Add-in Sample Application that uses a "ClickOnce" post-deployment action to install Visio template and stencil files,
    2. Guidance for reconfiguring the SDK sample applications to target the 64-bit version of Visio 2010,
    3. New code samples in the Code Sample Library for API functionality added in Visio 2010, and
    4. Documentation for new Visio 2010 API and ShapeSheet functionality.

    Feedback welcome!

    As you explore the SDK and use the tools provided, we encourage you to provide feedback about your experience. You can use the Office 2010 Send a Smile functionality to send us feedback about the SDK, or you can comment on the blog.

  • Visio Insights

    Visio 2010 Beta Released

    • 8 Comments

    This morning Microsoft announced that the Beta versions of Microsoft Office 2010, SharePoint Server 2010, Project 2010 and Microsoft Visio 2010 are now available!  You can download Visio 2010 Beta here.  This is a public Beta, so anyone can install and use it.

    Changes in the Beta

    Visio 2010 Beta has numerous refinements based on customer feedback from the Technical Preview.  The most visible changes can be found in the Backstage View.  This area has been redesigned to feel more integrated with the rest of the Ribbon, as is explained in the Office 2010 Engineering blog.  Also there are several visual updates.  In the screenshot below, you can see the new look of the Backstage View found under the File tab.

    image 

    Saving files to SharePoint is also different in Visio 2010 Beta.  Now saving to a SharePoint location, saving to a Visio Process Repository and publishing to Visio Services have been combined into a single place.  You simply choose a location and then select whether to save out a standard Visio Drawing or a Visio Web Drawing.

    image

    In the other ribbon tabs, you will find visual updates to Themes and a more functional set of Callouts.  For improved ease of use, we’ve refined the behaviors of several diagramming features including adjusting the sensitivity of AutoConnect.

    image

    image

    You will also find functional and visual updates to Containers, Cross-functional Flowchart shapes, BPMN shapes, Data Graphics Legends and Wireframe shapes.  If you created diagrams with these shapes in the Technical Preview, please be aware that your existing diagrams will have the Technical Preview version of the shapes while new diagrams created in the Beta will have the new versions of these shapes.  Also for Cross-functional Flowchart diagrams, significant shape and functionality changes mean that Technical Preview diagrams will open in the Beta but will not be editable.

    More information about the features of Visio 2010 can be found on this blog.  End user help is also available on the Microsoft Office Beta site.

    Visio Services Beta and Visio SDK Beta

    Coinciding with the release of Visio 2010 Beta, we are releasing the Beta version of Visio Services as part of Microsoft SharePoint 2010 Beta.  You can download SharePoint 2010 Beta from MSDN here.   In addition we are releasing a Beta version of the Visio Software Development Kit, a download for solution developers.  We will provide more information about the Visio SDK Beta in an upcoming post.

    Send Us Your Feedback

    We encourage you to download the Beta and give us your feedback.  We’re rapidly approaching the end of the Visio 2010 development cycle, and your feedback is essential to ensure a high quality final product.  You can comment on the posts on the blog or use the Send a Smile tool to let us know what you think.

    Send A Smile in Windows Taskbar

  • Visio Insights

    Installing and Configuring Visio Services

    • 2 Comments

    With the past few posts we’ve shown you how you can share your diagrams with everyone using Visio Services. In this post, we’ll talk about how IT Administrators can provision and configure Visio Services in SharePoint 2010. Visio Services is included in SharePoint Server 2010 Enterprise Client Access License (ECAL). This post is intended to show you how to quickly get started with provisioning Visio Services, and to give you an idea of what things you should consider for configuration. The instructions in this post assume that you have already installed SharePoint 2010.

    Quick Start with the Farm Configuration Wizard
    SharePoint 2010 includes a Farm Configuration Wizard that makes it easy to quickly provision services, assign a service account, create a web application, and create a site collection. The easiest way to start using Visio Services is to use the Farm Configuration Wizard from Central Administration.

    When you first install SharePoint 2010, you will be prompted to run this wizard. You can also easily run it again later from central administration:

    farm config

    Once you’ve launched the wizard, choose to have the wizard walk you through configuration. As one of the first steps of the wizard, you need to assign a service account, and then choose which services you want to provision. Make sure that “Visio Graphics Service” is checked. Visio Services is implemented in SharePoint 2010 as a single shared service called the Visio Graphics Service.

    Select all the other services you would like to provision and click Next. (If you want to connect Visio diagrams to Excel workbooks, make sure “Excel Services” is checked too!)

    farm config 0

    (Note: image above does not show the full list of services available in the wizard)

    The Farm Configuration Wizard will provision the checked services, and then prompt you to create a site collection. You can choose to create a new site collection, or do this step manually later. For a quick configuration, choose the “Team Site” template and create a new site collection:

    farm config 5

     

     

    (Notice the Visio Process Repository template! For more info see our earlier post: Using a Visio Process Repository)

    After the wizard is finished, you can access your site with Visio Services enabled. To publish a web diagram to your site, see the following posts:

    Configuration Options
    The Farm Configuration Wizard gets you up and running quickly. If you want to work with all the configuration options, there are two ways you can do so:

    • Central Administration (web user interface)
    • PowerShell (command line interface)

    Central Administration provides a web-based user interface for configuring all the service settings for Visio Services. If you prefer to use a scripting environment, you can use PowerShell to accomplish all the same tasks.

    This TechNet article contains information about performing common configuration actions for Visio Services through both PowerShell and Central Administration. You can use also use the Get-Help cmdlet in PowerShell to see more information about and examples of specific cmdlets.

    External Data Connections and Authentication
    Recall that Visio Services allows you to share data-driven visualizations that are connected to live data. (For more info, see section “Refreshing data-driven diagrams” of this post). Supported data sources include:

    • SQL
    • SharePoint Lists
    • Excel Workbooks hosted in SharePoint
    • Any OLEDB/ODBC data sources that have recent drivers

    When Visio Services renders drawings that are connected to Excel Services and SharePoint lists, permissions and authentication are managed by SharePoint, and Visio Services uses the identity of the person viewing the drawing. This way, if a user tries to view a Visio diagram that is connected to an Excel workbook that they do not have rights to view, they will not be able view the Visio diagram.

    When connecting to data sources that are external to SharePoint, such as SQL or ODBC data sources, additional configuration may be required to enable Visio Services to connect to them. Visio Services can authenticate with external data sources in any of the following ways:

    · Integrated Windows Authentication

    · Secure Store Service (requires additional configuration)

    · Unattended Service Account (requires additional configuration)

    For more information about these authentication methods and how to plan for them, see this TechNet article.

    Trusted Data Providers
    Visio Services maintains a list of trusted data providers, so that you can manage what data sources the service is allowed to connect to. If a user creates a web drawing that is connected to a data source that is not trusted, Visio Services will not attempt to connect to the data source.

    By default, trusted data providers include Excel Services, SharePoint lists, SQL databases, and some other ODBC data sources. You can easily add to or remove from this list using Central Administration and PowerShell.

    trusted data providers

    Visio Services also allows you to create your own custom data providers to connect to additional data sources. These custom data providers need to be added to the trusted data providers list before the service will connect to them. We’ll be talking more about custom data providers in future blog posts.

    Visio Services Settings
    Visio Services has some global settings that allow you to optimize performance, caching, and security. Specifically, you can control:

    • Caching
      Visio Services caches web drawings to improve performance. Caching allows multiple people to view the same diagram without forcing the server to render it every time. If a diagram changes, it is automatically removed from the cache. You can control how long diagrams are kept in the cache.

    • Data refresh interval
      Data-driven diagrams and the data sets behind them are also cached. Caching data sets allows a user to view a data-driven diagram repeatedly without forcing the server to query the underlying data every time. This affects how quickly a user will see a change in data reflected in their diagram. You can control how long data sets are cached for.
    • Maximum File Size
      To safeguard performance, you can control the maximum size of a web drawing that Visio Services will render.

    For more information about Visio Services settings, see this TechNet article. We will also be talking more about how to optimize settings in a future blog post.

    This post was a summary of the various installation and configuration options you have for Visio Services. As you try out Visio Services, please let us know what you think, either by commenting on the blog or via Send a Smile.

  • Visio Insights

    Building Visio 2010 – A Look Behind the Scenes

    • 0 Comments

    The Visio Product Team has been working for several years to design, code, test and deliver Visio 2010.  It takes lots of coordination and collaboration to develop a complex software application.  While there are many roles involved in the engineering process, it is the Program Managers, Developers and Testers that work together the most closely from beginning to end.  Program Managers gather customer input and design the features for the release.  Developers are the coders responsible for implementation of the software.  Testers ensure both high quality and that the capabilities really address the customer scenarios we have targeted. 

    Microsoft has created a series of videos describing Office 2010 (the full wave of products being released) and some of the roles people play in the engineering process.  Here is a video about the engineering behind Visio 2010 from the perspective of the Tester.

  • Visio Insights

    Embedding a Web Drawing in a SharePoint Page

    • 4 Comments

    Previously we showed how Visio Services lets you view diagrams in the browser. By default Visio Web Drawings open in their own web page for a full screen viewing experience. Visio Services also allows Visio Web Drawings to be embedded in other SharePoint pages.

    Using the Visio Web Access web part you can embed either static or data-driven Visio Web Drawings in SharePoint pages adding visual flair and insights to portal pages and dashboards. By centralizing relevant information onto one page, viewers save time and can, at a glance, understand the state of their business.

    Take a look below at a Supply Chain Dashboard featuring a Visio Web Access web part in the top left – in this case the data-driven visual quickly helps ground viewers in the current state of a supply chain, and its proximity to a relevant Excel chart, documents and links makes decision making and implementation easy.

    image 

    Embedding the Visio Web Access Web part in a SharePoint page

    To embed a Web Drawing in a page, you must be a site administrator for that page with either "Contribute", "Approve", "Manage Hierarchy", "Design" or "Full Control" permissions. Given you are an administrator, adding a Web Drawing to a page is as easy as editing the page and placing a Visio Web Access web part on it. To do so, follow the steps below:

    1. Click on "Edit" tab and then hit the "Edit Page" button
    2. Click on a web part zone on the page
    3. Click on "Insert" tab and then hit the "Web Part" button
    4. Select the "Office Client Applications" category and select the "Visio Web Access" web part
    5. Press the "Add" button

    At this point, an empty Visio Web Access web part should appear on your page. It looks like this:

    image

    To assign an existing Web Drawing to display in this Web Part follow the “Click here to open the tool pane” link, this will surface the UI see below and will switch the page into Edit mode. This is called the web part’s the tool pane.

    image

    Type in the URL to the Web Drawing you want to display in the text box, or better yet, use the browser button to navigate the SharePoint folder structure to find the drawing in question. Once the URL is in the input field, hit either the “Apply” or “Ok” buttons at the bottom of the configuration panel and voilà – your Web Drawing is now embedded in the page.

    image

    Note that you can only embed Web Drawings that are hosted within the same SharePoint farm as the site hosting the web part. Also note that Visio Services checks the permissions of page viewers before it renders a Web Drawing -- if the viewer doesn’t have at least “View” permissions, Visio Services will not render the Web Drawing.

    To complete the dashboard shown at the beginning of this article, repeat the process by adding other SharePoint and Office web parts.

    Further Configuring the Visio Web Access Web Part

    If you look below the “Web Drawing URL” property in the tool pane (see the tool pane image above), you’ll see a host of other properties you can set to customize the Visio Web Access web part. They include: 

    Property Label

    What the customization does

    Override the Web Drawing's default initial view using the web part's current page, pan and zoom

    By default, when the web part displays a Web Drawing, it opens the page of the drawing that was open when the drawing was last saved, keeping the same zoom level and pan coordinates.

    You can override this to display, by checking this box and manipulating the diagram directly in the web part; Visio Services will persist the current pan, zoom and page settings when you click “Ok” or “Apply”.

    Force raster rendering

    If the person viewing the Web Drawing has Silverlight 3.0 or later installed, the Web Drawing will be rendered using Silverlight.Otherwise, the Web Drawing is rendered as an image file in PNG format.

    If you would prefer that the Web Part never use Silverlight, even if it is installed on the viewer’s computer, you can select this option.

    Automatic Refresh Interval

    If the Web Drawing is connected to an external data source, you can have the Web Part check the data source periodically to get the latest data.

    Type the number of minutes you would like for the interval between data refresh attempts. Leave this at 0 (zero) if you prefer that users refresh the data manually by clicking the Refresh button on the Visio Web Access web part . Values must be integers and greater or equal to 1.

    Note that while a page designer may set the automatic refresh rate to occur frequently, a high refresh rate may tax the server. The Visio Services service administration may throttle this centrally by using the “Minimum Cache Age” service setting to improve performance.

    Expose the following shape data items to web part connections

    If you’ve linked the Visio Web Access web part to another web part via the “Send Shape Data To” web part connection, the data fields that you specify in this box are sent to the other web part on each shape click. Make sure to separate data field names you want to send with semi-colons.

    If you’re not familiar with web part connections, don’t worry… we’ll have a detailed post about them in the future.

    Various options in the “Toolbar and User Interface” section

    The options available in this section of the tool pane are tools that are available to the Web Drawing viewer to navigate the Web Drawing.

    You can remove tools from the UI that you don’t want users to see by clearing the check box beside those items. However, users will still be able to perform some of the actions using the mouse or keyboard shortcuts. To disable functionality completely, use the options in the Web Drawing Interactivity section.

    Note that un-checking the last option “Show default background” will make the web part background, which is by default gray, transparent.

    Various options in the “Web Drawing Interactivity” section

    Select the check boxes beside the options that you want to disable for users of the Web Part.

    As with any SharePoint web part, the Visio Web Access web part inherits and will honor the settings found in the “Appearance”, “Layout” and “Advanced” sections of the web part configuration panel.

    Try it out!
    Try out various web part configurations to understand which configuration best suits your needs and tell us about it either by commenting on the blog or via Send a Smile.

  • Visio Insights

    Publishing Diagrams to Visio Services

    • 6 Comments

    In our last post, we talked about Visio Services--a new feature of SharePoint 2010 that extends the reach of Visio diagrams considerably. Visio Services lets you:

    • View diagrams in the browser even if you don’t have Visio installed
    • Refresh data-driven diagrams in the browser
    • Integrate diagrams into SharePoint applications

    In this post, we explain how to create a Visio Web Drawing (*.VDW) file using Visio Professional 2010 or Visio Premium 2010. The Visio Web Drawing (*.VDW) is a new Visio file type that allows diagrams to be rendered in full fidelity in the browser using Visio Services on SharePoint 2010.

    When you save a file in Visio 2010, you will see the option in the Save As dialog to save your diagram as a Web Drawing.

    Web Drawing file type

    You can also easily create a Visio Web Drawing using the Save to SharePoint billboard on the Share tab of the Backstage View. This billboard allows you to quickly select a SharePoint location and the Web Drawing file type for saving your diagram.

    Save to SharePoint

    Clicking on Save to SharePoint at the bottom of the billboard opens the Save As dialog so you can confirm or refine your selection.

    Save As

    To use the default publishing options, press Save. You now have a diagram ready for viewing in the browser!

    By default, Visio automatically opens a browser so you can see your diagram as others will see it in the browser. You can turn off this behavior from the Save As dialog.

    Save As Dialog

    You can also click on Options at the bottom of the Save As dialog to launch the Publish Settings dialog. Using this dialog, you can select the pages that display and, for data connected diagrams, the data sources that refresh in the browser.

    Publish Settings

    Visio Services allows you to refresh data-driven diagrams in the browser to present the most up-to-date view of the underlying data. The data sources selected in the Publish Settings dialog will be the data sources that refresh. Visio Services supports refreshing the following data sources:

    • SQL Tables & Views
    • WSS Lists
    • Excel Workbooks hosted in SharePoint
    • Generic OLEDB/ODBC data sources

    In addition to giving you the option to customize your publish options, the Publish Settings dialog also indicates publishing issues. For example, in the image above, the data source titled “Sales data” has a warning icon beside it. This sales data is stored in a local Excel Workbook: this data source is not supported by Visio Services because it is stored on a local machine. If you want the data from an Excel Workbook to refresh with Visio Services, you should save the workbook to a SharePoint site, link your diagram to the workbook on SharePoint and then save your diagram to the SharePoint site.

    On save, Microsoft Visio 2010 generates a Web Drawing file which is in fact a package containing:

    1. the native Visio representation of the diagram (a .VSD file), used to edit the file in Visio, and
    2. meta data re-generated on each save, used by Visio Services to render the web drawing in the browser.

    Once your Visio Web Drawing file is saved to SharePoint, you can continue to work with it in Visio. Visio Professional 2010 and Visio Premium 2010 both fully support Visio Web Drawing files. This means that you can edit Visio Web Drawing files using the complete set of features provided by Visio.

    As you try out Visio Services, please let us know what you think, either by commenting on the blog or via Send a Smile.

  • Visio Insights

    Introducing Visio Services

    • 3 Comments

    Last week at the SharePoint Conference, the Visio team unveiled Visio Services – a new feature of SharePoint 2010 that extends the reach of diagrams considerably. In a nutshell, Visio Services lets you:

    • View diagrams in the browser without needing Visio on your machine
    • Refresh data-driven diagrams in the browser
    • Integrate diagrams into SharePoint applications

    Let’s take a look in more detail at the features behind each of these scenarios.

    Viewing diagrams in the browser

    A Visio diagram, saved to a SharePoint document library as a Visio Web Drawing (a *.VDW file) using Visio Professional 2010 or Visio Premium 2010, can be viewed in any web browser by simply clicking on its file entry in the document library.

    image

    The diagram renders in full fidelity in the browser if the person viewing the diagram has Silverlight installed on their machine or as a PNG if not; Visio Services renders seamlessly anything you can draw in Visio. Take a look below to get a feel for the experience:

    image

    Visio Services enables you to navigate diagrams using easy to use and familiar metaphors for panning, zooming, switching pages, following hyperlinks and discovering shape data. You can also open any Visio Web Drawing in Visio using the “Open in Visio” button. Note that the person viewing the diagram can do so:

    • …in any browser (Internet Explorer, Firefox, Safari etc…)
    • …on any platform
    • …without leaving the browser
    • …without installing Visio, the Viewer or the Drawing Control
    • …without needing to accept multiple dialogs or browser warnings

    Also note that because the diagrams are stored in SharePoint document libraries, diagram creators get a variety of useful document management features from SharePoint such as diagram access control using permissions, diagram change tracking using versioning and the ability to attach diagrams to SharePoint workflows.

    Refreshing data-driven diagrams

    Visio Services has ported Visio’s data connectivity features to the browser! In case you’re not familiar with those features please take a look at “Show it like it is: connect data to your Visio diagram” for a quick summary. Note this demonstration is in done in Visio 2007, but these features are also available in Visio 2010.

    In a nutshell, before Visio Services renders a data-driven diagram it fetches the diagram's linked data from an external data source and updates diagram visuals accordingly. Note that once posted to SharePoint, your diagram is a living document that will always represent the current state of your data visually. You never need to update manually again!

    Visio Services supports refreshing diagrams connected to one or more of the following data sources:

    • SQL (using either Kerberos, Single Sign On & Unattended Authentication)
    • SharePoint Lists
    • Excel Workbooks hosted in SharePoint
    • Any OLEDB/ODBC data sources that have recent drivers

    If the data source you plan to connect your diagrams to isn’t in the list above, don’t worry: Visio Services supports “Custom Data Providers” which enable you, with a few lines of code, to wrap your existing data source into one that Visio Services can consume. We’ll talk about writing your own “Custom Data Provider” in subsequent blog posts.

    Finally, note that Visio Services supports refresh on open, user-triggered refresh as well as automatic periodic refresh.

    Integrating Visio diagrams into SharePoint Applications

    Visio Services also enables you to embed Visio Web Drawings, regardless of whether they are static or dynamic, into SharePoint applications. Depending on your skill level with web technologies there are three ways of doing so:

    Integration method

    Scenario enabled

    Skill set required

    The Visio Web Access web part

    You can now embed Visio diagrams into SharePoint pages.

    You should know how to create a web part page in SharePoint.

    Web Part Connections

    You can enable limited interactivity between the Visio Web Access web part and another on the page, without code. A typical example of this type of interactivity is to trigger one web part to show extra relevant information about a particular shape when it’s clicked in the Visio web part.

    You should know how to create a web part page in SharePoint as well as how to set-up Web Part Connections.

    The Visio Services Mash-up API

    You can enable rich interactivity on your web part page by manipulating the different Visio web diagram objects programmatically. A typical example of this type of interactivity is to show custom visual overlays when the person viewing the diagram hovers over a particular shape.

    You should know how to code JavaScript and/or ASPX pages.

    The main take-away is that with very little effort you can add visualization to your dashboards and with a bit more page authoring or some coding you can add rich interactivity between Visio Services and other components on the page. For those of you hungry for details, we’ll be delving into the details of all of these integration features in future blog posts.

    How it all works

    For the curious among you, here’s a recap of the architecture of Visio Services:

    architecture 

    Availability and Requirements

    Visio Services is scheduled to ship as part of the SharePoint Services 2010 ECAL and will be available in the up-and-coming Beta and RTM releases of SharePoint in both hosted and non-hosted flavors.

    In Conclusion

    The complete breadth of Visio diagrams can now be shared and refreshed in SharePoint, regardless of whether the person viewing them has Visio installed on their machine. What’s more you can now integrate rich data visualizations into SharePoint dashboards and applications with little effort.

    There is much, much more to tell you about this brave new world of browser-based data visualization called Visio Services… but for now, we’ll let you digest this high level overview and start thinking about how browser-based data visualization using Visio Services can be useful to your organization. Stay tuned to the blog, we should have instructions on how to set-up Visio Services and how to create Visio Web Drawings in the next few weeks.

    As you try out Visio Services, please let us know what you think, either by commenting on the blog or via Send a Smile.

  • Visio Insights

    Visio 2010 Beta coming soon…

    • 0 Comments

    It’s been several months since the Technical Preview was released and we started talking about Visio 2010 on this blog.  The product team has been hard at work responding to your feedback, fixing bugs and polishing the application.  Next month we are scheduled to release the Visio 2010 Beta, which will be open to the public.  If you haven’t had the opportunity to try Visio 2010 for yourself, this is your chance.

    Sometimes it’s hard to wait patiently for new software releases, so to put your mind at ease we’ve created a special alert system that will notify you when you can download the Beta.  Head over to http://visiotoolbox.com/2010/ and click on the big green button.  You’ll also find a handy diagram explaining the software delivery process (approximately) and several other pages highlighting some of the new capabilities of Visio 2010 and Visio Services.

    image

  • Visio Insights

    Using a Visio Process Repository

    • 2 Comments

    We frequently speak with Visio users whose organizations need to manage collections of process diagrams. Many of these users are employing basic methods such as storing these documents on network file shares. However, these methods leave much to be desired. For instance, end users frequently ask us questions like:

    • How can I make sure I’m always editing the most recent version of a process diagram?
    • How can I find out about updates made to the process diagrams that interest me?

    Additionally, the administrators and managers who supervise these document repositories often ask us questions like:

    • How can I monitor whether my organization’s diagrams comply with our internal standards?
    • How can I easily find all processes that involve a particular department?

    To address the above pain points, we have created the Visio Process Repository, a new SharePoint site template that is available out of the box with SharePoint 2010. It leverages SharePoint’s collaboration features -- including check-in and check-out, versioning, and workflow -- and integrates with several of Visio’s new process management features. The result is that in just a few clicks, a SharePoint administrator can create a Visio Process Repository that is pre-configured for easy storage and management of Visio process diagrams.

    Here is the home page of an example Process Repository:

    Process Repository homepage

    As shown in the sidebar above, a Repository site contains a library for documentation, a task list, and a discussion board. But most important is the “Process Diagrams” document library, which is designed to store processes. This document library comes pre-populated with several templates that can be used to create new process diagrams. (However, you can store other diagram types in a Repository; these particular templates are available simply for convenience.)

    New Document Menu

    Let’s say you use the Cross-Functional Flowchart template to create the following diagram in Visio:

    Finished CFF

    Once you’re finished and (optionally) have checked your diagram for errors using the Validation feature, you can save your document back to the Repository through the “Save to SharePoint” billboard in the Backstage:

    Save to SharePoint

    Then, when you navigate back to your Repository, your process diagram will be listed in the Process Diagrams document library as shown in the image below. Note the two special columns marked by the red rectangles:

    • The Keywords column displays the swimlane headings of each cross-functional flowchart in the document library. The diagram above had swimlanes titled “Engineering” and “Management”; these swimlanes are reflected in the document library below, providing useful at-a-glance information on who is involved in the process.
    • The Category column displays the validation status of each document. This makes it easier for administrators and managers to monitor whether the processes in their Repository conform to their organization’s standards.

    Doc lib columns 

    Since the Process Repository is built on top of SharePoint 2010, you can also take advantage of other SharePoint features. For instance, you can configure workflows, set up automatic email notifications for when documents change, and view revision history for a given document. Also, with Visio Services users can view the processes in their browser in a single click, even if they do not have Visio installed on their computers. For instance, this is what the above cross-functional flowchart looks like when viewed in a browser:

    CFF in Visio Services

    We hope this quick tour of the Visio Process Repository feature gives you ideas for how you can use a Process Repository (as well as related Visio 2010 features like Validation and Visio Services) in your organization. Please let us know what you think, either by commenting on the blog or via Send a Smile.

  • Visio Insights

    Announcing SharePoint 2010 and Visio Services

    • 1 Comments

    Yesterday Microsoft released details about SharePoint 2010 at the SharePoint Conference in Las Vegas.  SharePoint 2010 is a major release, covering a tremendous array of collaboration capabilities.  You can read the overview on the SharePoint team blog.  A notable feature in SharePoint 2010 is Visio Services.  Here is the summary of Visio Services from our original description of the Visio 2010 release:

    Visio 2010 can take data-refreshable diagrams and publish them to SharePoint for broad distribution to anyone with a web browser. Visio Services performs data refresh and rendering on the server and delivers up-to-date diagrams in the browser. The diagram author no longer needs to repost the diagram every time the data changes, and diagram viewers no longer need the Visio client to see the diagram.

    image

    Beyond simply viewing the latest version of a diagram in the browser, Visio Services enables interactive dashboards or mash-ups.  You can show a Visio diagram in a web part and define interactions between the diagram and other web parts on a page.  For example, in the image above, selecting a computer shape in the diagram will display detailed information about that computer on the right side.  Additionally, choosing one of the radio buttons on the right side will select the shapes in the diagram that match that criteria.

    The Visio team is showing Visio Services in depth at the SharePoint Conference this week.  Initial feedback from the conference attendees has been quite positive.  We’ll have a lot more Visio Services information to share on the blog next week, but there are other ways that Visio integrates with SharePoint 2010.  Coming up this week we look at one example.

  • Visio Insights

    Data Graphics Legends in Visio 2010

    • 2 Comments

    Many of you are familiar with the work we did in Visio 2007 to make it easier to surface data that exists in your diagram in a visual form. Data graphics allow you to add refreshable data visualizations to the shapes in your diagram. See our previous posts Microsoft Office Visio 2007 Released and Customizing Data Graphics for more information.

     No data  Data graphics!
    image image

    One thing users have asked us for is a way to describe the data graphics used in the diagram – a legend. Visio 2010 adds the ability to insert a legend that documents the data bars, icon sets and color by values in data graphics applied to shapes on the page. You can do this using the Insert Legend button on the Data tab.

    image

    Visio creates the legend at the upper right corner of the page. The legend contains a separate section for each data field referenced in the data graphics’ definitions. The descriptions for each legend item are obtained from the data graphics.

    image

    The legend is customizable, so you can add, remove and rename sections and shapes to make the legend look just right for your particular diagram. Legends also pick up the theme applied to the page, or they can be manually formatted.

    image

    The legend is made up of a number of shapes and uses containers to keep the different parts of the legend organized. The top-most shape is a list, a special type of container that arranges its members in a regular, linear pattern. The members of that list are containers, each of which represents a data field from the data graphics. Inside each container is another list, this one invisible, which keeps the individual legend items neatly arranged.

    image

    You can select a legend item and use the arrow keys on your keyboard to reorder them, or you can drag them around the list. You can also drag them out, delete them or drag your own shapes in. The same can be done with the containers that correspond to each data field. If you click the blue insert arrow on the outer list, Visio adds an empty container for your own use. While this will not have the inner list, you are free to add any shapes you wish.

    image

    To preserve the customizations you might make to the legend, Visio does not update it as you edit your data graphics or change which data graphics are applied to shapes on the page. Simply insert a new legend once you are done making changes. Delete the existing one or move it out of the way if you need to bring anything over.

    Finally, for the developers out there, you can drop a legend using Page.DropLegend in the Visio API and specify custom outer list and field container masters.

    We’re happy to be able to close this gap in data visualization and are interested in your feedback via Send a Smile or a comment here on the blog.

  • Visio Insights

    Data Graphics in Visio 2010

    • 12 Comments

    In Visio 2007, we introduced the data graphics feature to make it possible to display data on shapes using text callouts, data bars, or icons, or by coloring the shapes based on the data. As the data changes, the data graphics update accordingly.

    With data graphics, Visio diagrams can be used to visualize dynamic data in powerful and succinct ways. For example, data graphics are used on these network server shapes to show their network name, operating system, and IP address as text callouts that appear next to them. Data bars show CPU speed and memory, and an icon is used to indicate each server’s current status. The data associated with each shape can be conveyed at a glance.

    image

    In Visio 2010, we’ve given the data graphics feature a makeover to integrate it into the ribbon and to address feedback we heard from users. We also added a legend feature, but we’ll talk about that in an upcoming post.

    As in Visio 2007, before you can display data using a data graphic, you first need to have some data in your shapes. You can add the data manually in the Shape Data Window for each shape, or you can import the data into the diagram from an external data source like an Excel worksheet or a SQL database, using the Link Data to Shapes button on the Data tab. The data will appear in the External Data Window.

    image

    Once you drag a row of data from the External Data Window onto a shape to establish the link to the shape, a set of data graphics is created in the Data Graphics gallery, which replaces the task pane used in Visio 2007. The first data graphic in the gallery is automatically applied to the data-linked shape.

    image

    You can also create a new data graphic or edit one of the data graphics that Visio built for you in the gallery.

    In addition to integrating the user interface into the ribbon, we made some improvements to the dialog boxes based on user feedback. First, if you want to change the way a data field is displayed in the data graphic, you no longer have to delete the data field item and add a new one. For example, if you want to make an item display as an icon instead of a text callout, you can simply edit the item…

    image

    …and switch its display type from Text…

    image

    …to Icon Set.

    image

    When you edit a data graphic, we now give you a choice between applying the changes to all shapes with that data graphic applied (the only option in Visio 2007) or only to the selected shapes, using radio buttons at the bottom of the Edit Data Graphic dialog box. The latter choice makes a copy of the data graphic and applies it to the selected shapes.

    image

    Visio 2007 users asked us for more control over the formatting of text and other elements in data graphics. In Visio 2010, you can choose the font size used for the value and label in a text callout or data bar, and you can specify the width of the callout.

    image

    Please check out the new Data Graphics user interface and let us know what you think, either by commenting on the blog or (if you’re using the Visio 2010 Technical Preview) via Send a Smile.
  • Visio Insights

    Live Rendering Shapes in Visio 2010

    • 3 Comments

    For several releases Visio has enhanced the appearance of shapes in diagrams by adding isometric projections or themes with gradients and shadows.  All the while, their appearance in the Shapes Window has been unchanged.  The 32x32 pixel icons have been limited to 16 colors (reminiscent of the EGA color palette  from 1984).  Thus the Shapes Window icons have not kept pace with the visual updates on the drawing surface.

    Visio 2010 remedies that with a feature called Live Rendering.  We briefly mentioned this feature in the Shapes Window article, but we’ll go a little deeper here. Live Rendering replaces a shape’s icon with an image of what the shape actually will look like on the page.  You can see the full color spectrum used in the gradient fills.  You can see the anti-aliasing applied to the geometry and text.  If there is currently a theme applied to the page, Visio will even show the shape with the theme applied.  What you see is what you get.

    image 

     

    Supporting Live Rendering in Your Custom Shapes

    Live Rendering is also available for any of your own custom shapes.  Visio 2010 takes the existing setting for automatically generating icons for shapes and repurposes it as a setting for Live Rendering.  If you right-click on one of your own shapes in the Shapes Window and choose Edit Master > Master Properties, you can see the revised property.

    image

    Of course, Live Rendering may not be the best option for every shape.  Perhaps you prefer the icon to be more of an abstraction than a realistic portrayal of the shape.  Sometimes the shape has so much detail that it is not understandable in 32x32 pixels.  Maybe the shape is oblong and does not scale down to a 1:1 aspect ratio well.  In these cases it is best to stick with the shape icon, which is still limited to 16 colors in order to maintain file compatibility with previous releases.

    Custom Crop Regions

    However, there is a common situation that we felt was important to support with Live Rendering.  Sometimes only a portion of a shape is visually distinct from other shapes in the same stencil.  After all, shapes that are found in the same stencil are probably related, so they may share some common visual attributes.  In these cases the distinction may be too small to be useful when displaying the shapes as icons.  To alleviate this problem, Live Rendering supports custom crop regions.  Instead of rendering the full extents of a shape and shrinking that to icon size, Visio can render a specific region of a shape and use that for the icon.

    Let’s see an example from the shapes in Visio 2010’s SharePoint Workflow content.  There are dozens of workflow shapes that correspond to activities you can perform with SharePoint.  Each shape consists of a rectangle with a text label and a thumbnail image.

    image

    You can see that the thumbnails are the most visually distinctive part of the shapes.  What happens when you put these in the Shapes Window and turn on Live Rendering?  Unfortunately the details are lost.  In prior releases your only option would be to manually draw an icon using the 16 color palette and live with a very poor representation of the shape.  With a custom crop region, Visio only displays the relevant portion of the shape.

    image

    A custom crop region is specified by adding a User-defined cell to the Pagesheet of the master shape in the Master Edit Window.  Add a cell named User.msvPreviewIconCropToPage and set the value to 1.  Then modify the size of the page and the position of the shape on the page such that only the portion of the shape you want rendered overlaps the page.  You can look at the masters for the SharePoint Workflow shapes or the Callouts for more examples.

     

    Live Rendering shapes in the Shapes Window is an important part of the overall user interface update in Visio 2010.  For shape designers, Live Rendering and custom crop regions provide new opportunities for showcasing your rich, graphical content.  Please let us know what you think by using the Send a Smile feedback tool or commenting on the blog.

  • Visio Insights

    Annotating Diagrams with Callouts in Visio 2010

    • 9 Comments

    One of the guiding principles for the Visio 2010 user interface is that commonly used shapes should be easily accessible.  We showed how the Quick Shapes view in the Shapes Window aggregates the shapes from multiple stencils together.  There are also common shapes that are useful in many different kinds of diagrams.  These are exposed directly in the Ribbon through shape galleries.  We looked at Containers and Backgrounds and Borders previously.  In this post we examine Callouts.

    image

    A callout is an annotation on a diagram that provides more information about a shape.  Callouts are Visio shapes themselves, which differentiates them from other forms of annotation such as comments.  Callouts are part of the visible drawing and can be edited and formatted like any other shape.  A callout points at or references another shape, which we call the “target” of the callout.  It is placed in proximity its target and may have a line connecting to it.  The connecting line is called a “leader”.

    To add a callout shape in Visio 2010, select the target shape on the page and then click on the Callout dropdown in the Insert tab.  You will see the Callout gallery with many different styles of callouts.  Hover over a style to see it applied as a Live Preview and then click the style to add the callout.  The callout appears slightly above and right of the target shape.  (Note in the Technical Preview build the callout is placed a little too close by default and overlaps the target.  This will be corrected in the next beta release.)

    image

    Callout shapes are not new to Visio 2010, but Visio 2010 gives callout shapes special behaviors.  When a target shape is moved, copied or deleted, any callouts attached to the shape will be moved, copied or deleted too.  Thus callouts stay with their target shapes, though you can reposition the callout to any offset from its target.  Callout shapes are also designed to be displayed in front of other shapes.  Even if you add new shapes to a page and overlap them with callouts, the callouts will appear in front.

    There are additional options for the visual style of callout shapes, which you can access by right-clicking on a callout.  The Callout Style flyout menu allows you to switch to a different geometric style and has the same choices as the Insert Callout gallery in the ribbon.  The Orientation flyout menu lets you control which side the callout’s leader attaches to.  Callout Line controls the visibility and placement of the leader line.  Finally you can choose whether the callout shape resizes to fit the amount of text in the shape.

    image

    We hope you find the improved callout behaviors and convenient access from the ribbon a welcome addition to Visio 2010.  Feel free to tell us what you think through the Send a Smile feedback tool or by commenting on this post.

  • Visio Insights

    Automatic Page Sizing in Visio 2010

    • 38 Comments

    When you start a new diagram, you typically begin with a single drawing page that is the size of a standard piece of printer paper.  Many diagrams grow beyond the size of a single printed sheet.  Visio 2010 adds a dynamic page sizing capability that responds as you draw, so you no longer have to manually adjust your page size to your diagram.

    As you draw beyond the edge of the current page, Visio expands the page in that direction by one additional tile, or printer paper sheet.

    image

    image

    If you live preview adding a shape with AutoConnect, Visio also previews the tiles that will be added.  As you drag shapes outside the current page or drag shapes from the Shapes window, Visio shows a translucent preview of the new tiles that will be added if the shape is dropped in its current location.

    image 

    All sorts of things can affect the size of your diagram when printed, including adding shapes, deleting shapes, moving shapes, adding or removing text and changing text properties.  Any of these will alert Visio to update the page larger or smaller to keep the drawing within full tiles.

    Start with this: image
    Add more text: image
    Delete the shape: image

    You may also notice that the depiction of page breaks and margins is different than in Visio 2007.  We simplified the look of page breaks and many people will find them similar to Excel’s.  Margins are now a clear white area around the entire page.  We think you will find this much more clear than the grey bars in past versions of Visio.  We also enable showing page breaks and margins by default in new drawings, to help make it clear how Visio is adjusting your page.

    This auto sizing behavior is controlled using the Auto Size toggle button on the Design tab.  If you click the dialog launcher and open the Page Setup dialog, you’ll see we replaced the now-defunct “Same as printer paper size” option with “Let Visio expand the page as needed”.  The sharp-eyed Visio expert will notice that the “Size to fit drawing contents” option is also gone from the dialog.  Since that item was more of a one-time action than a persistent state of tightly fitting the page to the diagram, we moved it to the Page Size dropdown and renamed it “Fit to Drawing”.

    image image

    Since we’re talking about page sizing, it’s also worth taking a quick look at manual page adjustments.  The Orientation and Size dropdown buttons on the Design tab surface the most commonly-used items from the Page Setup dialog.

    image image

    When Auto Size is enabled, these reflect the orientation and size of the printer paper (the tiles in the drawing page), because Auto Size controls the size of the page based on the printer paper settings.  Changing them changes the orientation and size of the printer paper settings.  If you change these, the number of tiles required to contain the diagram may also change, so your drawing page may change size.

    Size = Letter (8.5” x 11”)
    Orientation = Landscape
    image
    Size = Letter (8.5” x 11”)
    Orientation = Portrait
    image

    When Auto Size is disabled, these reflect the orientation and size of the drawing page, because you are controlling it, not Visio.  Changing them sets both the drawing page and the printer paper settings, to keep them in sync.

    Size = Letter (8.5” x 11”)
    Orientation = Landscape
    image
    Size = Letter (8.5” x 11”)
    Orientation = Portrait
    image

    Essentially, we made Orientation and Size work as expected depending on context – whether Auto Size is on or off.  That is, whether you have Visio taking care of the page size or if you are doing it.

    We hope these additions will help you to more easily, and more fluidly, build and edit your diagrams.  As usual, send us any feedback you have using Send a Smile or through a comment on the blog.

  • Visio Insights

    Inserting and Deleting Shapes in Visio 2010

    • 10 Comments

    Diagram maintenance is a task that everyone performs, and many users spend much of their time in Visio maintaining existing diagrams.  We realize that a fair amount of the time you spend maintaining your diagrams is spent in the mechanics of the task, rather than achieving the goals of updating the concept the diagram represents.  There are some clear gains we can effect to make your life easier as you go about editing your diagrams.

    Consider a typical flowchart.  You documented an internal process and now need to add some steps to the process diagram.  Prior to Visio 2010, this meant facing what could be a tedious task of ungluing connectors, selecting and dragging shapes to make room for the new ones, adding the new ones, positioning them neatly, re-gluing connectors, adding new connectors and moving the other shapes into position to leave you with a nice, neat diagram.

    In Visio 2010, as part of our focus on ease of use and improving core process diagramming, we have simplified this basic, repeated task dramatically.  Now, all you need to do is drag your new shape out and drop it on the connector you wish to split.  Visio highlights the endpoints of the connector to make it clear which connector will split.  When you drop, Visio moves all the “downstream” shapes over just enough to make room for the new shape.  Visio takes care of positioning the new shape so that it is aligned with and evenly spaced from the shape upstream from it.

    Before: image
    Hover: image
    After: image

    Visio identifies which shapes are “downstream” from the insertion point, moves them in the right direction the right amount and places the new shape in just the right spot.  The lower left rectangle is connected downstream from the inserted shape, but is to its left, so did not need to move.

    At some point you may need to remove a few steps from your diagram.  Prior to Visio 2010, this meant deleting shapes, deleting excess connectors, re-gluing the remaining connectors to the remaining shapes and moving those shapes to align and space evenly with the rest of the diagram.

    In Visio 2010, we take care of the connector healing for you.  When you delete a connected shape, Visio checks how many connectors go into and out of the shape, and which ones have text.  If it is clear how to re-glue the connectors without changing the diagram and which connectors can be removed without losing text, Visio deletes the extraneous connectors and re-glues the remainder.

    image

    We made an explicit decision not to move the remaining shapes to fill in the empty space, as that could easily lead to all those downstream shapes – which could be numerous – overlapping another part of the diagram.  Fortunately, you can simply select which shapes should tighten up and use Auto Align or Auto Space to help you neaten up the diagram.  As you can see above, we also preserve connectors that have text, even when that means not healing.  Text on connectors is important, so better safe than sorry.

    As mentioned, we enabled this behavior for cases where we can make a safe conclusion about how the connectors should heal.  Other than to prevent losing text, when else don’t we try to heal?  If there is more than one connector coming into and going out of the shape being deleted, then it is ambiguous how all the shapes should be re-connected together.  Typical examples of this are shown below.

    image

    Our hope is that these additions, while seemingly small, will have a big impact on reducing your workload as you maintain the millions of Visio diagrams you have all created.  Let us know how this works for you using Send a Smile or through a comment on the blog.

Page 3 of 8 (181 items) 12345»