{"__v":3,"_id":"55b5744c0977a4190061928c","category":{"__v":1,"_id":"55b57982ef36f32100563fc8","pages":["55b57b32ef36f32100563fcb"],"project":"55b41741c8f1ca1700e5e194","version":"55b41742c8f1ca1700e5e197","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2015-07-27T00:21:22.499Z","from_sync":false,"order":4,"slug":"tutorials-creating-illustrations-with-publisher3d","title":"Tutorials: Creating Illustrations with Publisher3D"},"project":"55b41741c8f1ca1700e5e194","user":"55a6dc0c112cf20d003a3196","version":{"__v":10,"_id":"55b41742c8f1ca1700e5e197","project":"55b41741c8f1ca1700e5e194","createdAt":"2015-07-25T23:09:54.255Z","releaseDate":"2015-07-25T23:09:54.255Z","categories":["55b41742c8f1ca1700e5e198","55b526b3ef36f32100563f7c","55b5278910db590d00e7f78e","55b527a210db590d00e7f78f","55b527b310db590d00e7f790","55b527d3ef36f32100563f7d","55b5285610db590d00e7f792","55b57982ef36f32100563fc8","588111a7ca3cb60f00018f0d","588111d49e24c01900508c5d"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.0.0","version":"1.0"},"updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-07-26T23:59:08.106Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":2,"body":"[block:callout]\n{\n  \"type\": \"warning\",\n  \"title\": \"Suggested Product: Publisher3D\",\n  \"body\": \"Alternatively, this tutorial can be completed using Pages3D Professional after completion of the “Pages3D Primer” tutorial.\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Create a Second Illustration\"\n}\n[/block]\nThat’s a nice graphic.  Let’s save it as an illustration.\n[block:callout]\n{\n  \"type\": \"success\",\n  \"body\": \"- Click on the “New” button in the Storyboard Panel.\\n- Name this illustration “Sectioned View” and like before uncheck the box next to “Edit Markups Now” (If you accidentally click OK without unchecking this box, just click the Done button that appears in the top-right of the view before proceeding.)\\n- Observe that your Storyboard Panel now displays your first illustration and the sectioned one that you just created.\\n- Explore clicking back and forth between each thumbnail in the Storyboard Panel. Notice that the 3D view changes to reflect the viewpoint, render style and section properties saved with each illustration.\",\n  \"title\": \"Create Another Illustration\"\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/Owh9zcU8SmkdOaxM7dEw_image049.png\",\n        \"image049.png\",\n        \"302\",\n        \"166\",\n        \"#722b2f\",\n        \"\"\n      ],\n      \"caption\": \"Storyboard with a transition between two illustrations\"\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Use Transitions to Animate\"\n}\n[/block]\n\nWhen the second illustration was displayed in the Storyboard panel, an extra block was added between the two illustrations. This block, labeled” Auto” by default”, represents the transition and timing during an animation.\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/Sa0iB1URgmtQXxZGtST5_image051.png\",\n        \"image051.png\",\n        \"550\",\n        \"358\",\n        \"#82482d\",\n        \"\"\n      ],\n      \"caption\": \"Right-clicking to edit a transition\"\n    }\n  ]\n}\n[/block]\n\n[block:callout]\n{\n  \"type\": \"success\",\n  \"body\": \"- Click on the box labeled “Auto” between the illustrations.\\n- Observe that the view immediately displays the illustration preceeding the transition and animates through to the illustration that follows the transition.\\n- Right-click on the transition to bring up a menu for setting the transitions properties. You can set the type of transition and the timing from this menu.\\n- From the menu, choose Transition > Accelerate\\n- Right click again, and from the menu choose Duration > 5.0s\\n- Now, click the transition again, notice that it is now labeled “Accel”.\\n- Observe that the 3D view animates slower this time, taking 5 seconds to complete\",\n  \"title\": \"Edit the Transition\"\n}\n[/block]\nThere are other transition options available. The transitions that include a 2 are used when there are moving parts and a moving viewpoint. The 2 indicates that half of the time the transition will be moving the part and the other half of the time the viewpoint. Since we do not yet have any moving parts, we can ignore these options until later.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Reset the 3D View\"\n}\n[/block]\nThere are times when you would like to disable the current illustration and start from a clean 3D view. For example, the second illustration currently has a section view setup. At this point we are ready to create a new 3D illustration that does not have the section plan active.\n[block:callout]\n{\n  \"type\": \"success\",\n  \"body\": \"- Click on the “Section View” illustration in the Storyboard Panel.\\n- Press the ESCAPE key on the keyboard.\\n- Observe that the section plane is disabled, the selected set is cleared and the illustration name field is cleared.\",\n  \"title\": \"Reset the View\"\n}\n[/block]\nPressing ESCAPE initializes some properties of the 3D view and is a quick shortcut to clearing one illustration so that work can begin on the next one.  This will set the view up so that no illustration is active, the markup overlay is cleared, the selection set is cleared and the section plane is turned off. This will NOT show hidden parts or modify the explode state.\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Create a Third Illustration\"\n}\n[/block]\nOur third illustration will isolate the sole subassembly included in our model and we will then add a markup overlay.\n[block:callout]\n{\n  \"type\": \"success\",\n  \"title\": \"Create a Third Illustration\",\n  \"body\": \"- From the Model Ribbon, click on “Model Panel” to display the model panel.\\n- In the model panel, click on the subassembly, labeled “SpindleSubss” to select it.\\n- Now right click the model tree in the model panel and choose “Isolate”.\\n- Observe that the 3D view now only shows the subassembly.\\n- For this illustration, we do not want it to be selected, so CTRL left click the background of the 3D view to deselect it. (Alternatively, you could press ESCAPE to deselect it.)\\n- Now, create a new illustration by clicking  the “New” button in the Storyboard Panel.\\n- Name this one “Markup View” and this time leave the checkbox labeled “Edit Markups Now” checked.\\n- Click OK to enter edit-markups mode.\\n- Observe that the 3D view is now enclosed with an orange box indicating markup-edit mode and there is a “Done” button in the upper-right corner of the 3D view.\"\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/6BDyzUxcRMyAnro3hqtY_image053.png\",\n        \"image053.png\",\n        \"800\",\n        \"546\",\n        \"#c28d30\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Add Front Plane Markups\"\n}\n[/block]\nPublisher3D includes a variety of markups. We will start with simple 2D text and image overlays, and then add a 3D markup. The illustration saves the markup information, so changing illustration will change markups or remove them if the illustration does not include any markups.\n\nFirst let’s add a simple title as an overlay for this illustration.\n[block:callout]\n{\n  \"type\": \"success\",\n  \"title\": \"Enter Markup Mode\",\n  \"body\": \"- Click the “Illustrate Ribbon”\\n- Verify that you are in edit-markups mode. If you are, then the view will be enclosed in an orange box, and the “Edit” button will be shown as pressed in the Illustrations ribbon group.\"\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/TtCJyhhQPiXaEBeVM2A7_image055.png\",\n        \"image055.png\",\n        \"198\",\n        \"108\",\n        \"#304972\",\n        \"\"\n      ],\n      \"caption\": \"Illustrations Ribbon Group (Edit)\"\n    }\n  ]\n}\n[/block]\nIf you are not in edit-markup mode, simply click the “Edit” button in the Illustrations group.\n[block:callout]\n{\n  \"type\": \"success\",\n  \"title\": \"Add a Text Markup\",\n  \"body\": \"- Click on “Text” in the Illustration Tools group.\\n- Observe that the 3D view now displays a grid overlay which indicates the drawing plane for the markup. Also, notice that when you mouse over the 3D view, the mouse cursor indicates that you are ready to draw a markup onto the grid.\\n- Left-click in the top left, hold down the mouse, drag out a box about the size of one of the major grid divisions, then release the mouse button.\\n- Notice that when the mouse is released, a dialog box is displayed for entering text.\\n- Enter “Spindle Subassembly” the text box and click OK.\\n- The text is now displayed using the currently selected font. Notice that the text is selected as indicated by the handles.\\n- Change the font size to 18 by using the pulldown in the Font group on the Illustrate Ribbon.\\n- Now, use the color pulldown in the Font group to change the text color to the top blue color.\"\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/s5iskpu6QTSSNe9c29GT_image057.png\",\n        \"image057.png\",\n        \"1022\",\n        \"532\",\n        \"#7289df\",\n        \"\"\n      ],\n      \"caption\": \"Markup Text\"\n    }\n  ]\n}\n[/block]\nPublisher3D includes a set of images that are useful for technical documentation. Let’s add a generic “inspection” icon.\n[block:callout]\n{\n  \"type\": \"success\",\n  \"title\": \"Add an Image Markup\",\n  \"body\": \"- Verify that you are still in edit-illustration mode by verifying that the “Edit” button on the Illustrate Ribbon is depressed and there is an orange border around the 3D view.\\n- Click on the pulldown arrow beneath the Image button in the Illustration Tools ribbon group. Scroll down and click on the magnifying glass icon.\\n- Observe that the mouse cursor indicates that you are ready to drag out the image.\\n- Left click, hold down the mouse, drag a small square about the size of a major grid division in the bottom-right corner below the 3D model, the release the mouse.\\n- If your image has an outline, you can turn this off  from the “Line” pulldown in the Color ribbon group. Pick “No Line” at the bottom.\\n- Click “Done”.\\n- Observe that the grid is hidden and the Storyboard updates the illustration thumbnail to include the markups that you have added.\"\n}\n[/block]\n\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/9IEHCUKOR1KD8sd7Qhq0_image059.png\",\n        \"image059.png\",\n        \"950\",\n        \"604\",\n        \"#817030\",\n        \"\"\n      ],\n      \"caption\": \"Image Markup\"\n    }\n  ]\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Add 3D Markups\"\n}\n[/block]\nMarkups can be drawn onto a 3D plane as well. These are called 3D markups and are very useful for adding arrows and other indicators of action in the 3D space. Like other markups, they are associated with an illustration and will not be displayed with other illustrations.\n[block:callout]\n{\n  \"type\": \"success\",\n  \"title\": \"Add a 3D Markup\",\n  \"body\": \"- Verify that the “Markup View” illustration is selected in your storyboard. If it is selected, then it will be highlighted with an orange border. If it is not selected, then click it in the Storyboard panel to select it.\\n- Click on the pulldown under “Grid” in the Draw Plane ribbon group and select “3D-XY”.\\n- Notice that the grid plane used for drawing markups is now displayed in 3D space.\\n- We now need to position the grid in the Z-axis. Click “Position Grid” in the Draw Plane ribbon group.\\n- Notice that the mouse cursor.\\n- Click on the model about halfway down to set the grid intersection. This is the plane that you will draw markups onto.\\n- Now, click on the pulldown under “Shapes” in the Illustration Tools ribbon group and the select an Arrow shape.\\n- Notice that the mouse cursor indicates that it is ready to draw a shape onto the grid.\\n- Left click on the 3D grid, hold the mouse button down, drag out the position for your arrow and then release the mouse button.\\n- Notice that the markup is created and then automatically selected.\\n- Use the handles to scale and rotate the arrow as desired. Hold down CTRL while rotating to lock rotations to increments of 45 degrees.\\n- Click “Done” to accept the changes.\\n- Use the mouse to rotate the 3D view and observe the behavior of the 3D markup.\"\n}\n[/block]\n\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Reset the View, Again\"\n}\n[/block]\nNow that we have added this illustration and are ready to move on to our next illustration, let’s reset the view again.\n[block:callout]\n{\n  \"type\": \"success\",\n  \"title\": \"Reset the View\",\n  \"body\": \"- Press the ESCAPE key to clear the illustration. This will clear the markups.\\n- Right click the 3D view and select “Show All” from the 3D menu. This will bring back the parts the we hid to create the previous illustration.\\n- In the Viewpoint ribbon group, click on the Home button.\"\n}\n[/block]","excerpt":"Continue creating illustrations and learn about markups.","slug":"your-second-and-third-illustrations","type":"basic","title":"Your Second and Third Illustrations"}

Your Second and Third Illustrations

Continue creating illustrations and learn about markups.

[block:callout] { "type": "warning", "title": "Suggested Product: Publisher3D", "body": "Alternatively, this tutorial can be completed using Pages3D Professional after completion of the “Pages3D Primer” tutorial." } [/block] [block:api-header] { "type": "basic", "title": "Create a Second Illustration" } [/block] That’s a nice graphic. Let’s save it as an illustration. [block:callout] { "type": "success", "body": "- Click on the “New” button in the Storyboard Panel.\n- Name this illustration “Sectioned View” and like before uncheck the box next to “Edit Markups Now” (If you accidentally click OK without unchecking this box, just click the Done button that appears in the top-right of the view before proceeding.)\n- Observe that your Storyboard Panel now displays your first illustration and the sectioned one that you just created.\n- Explore clicking back and forth between each thumbnail in the Storyboard Panel. Notice that the 3D view changes to reflect the viewpoint, render style and section properties saved with each illustration.", "title": "Create Another Illustration" } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/Owh9zcU8SmkdOaxM7dEw_image049.png", "image049.png", "302", "166", "#722b2f", "" ], "caption": "Storyboard with a transition between two illustrations" } ] } [/block] [block:api-header] { "type": "basic", "title": "Use Transitions to Animate" } [/block] When the second illustration was displayed in the Storyboard panel, an extra block was added between the two illustrations. This block, labeled” Auto” by default”, represents the transition and timing during an animation. [block:image] { "images": [ { "image": [ "https://files.readme.io/Sa0iB1URgmtQXxZGtST5_image051.png", "image051.png", "550", "358", "#82482d", "" ], "caption": "Right-clicking to edit a transition" } ] } [/block] [block:callout] { "type": "success", "body": "- Click on the box labeled “Auto” between the illustrations.\n- Observe that the view immediately displays the illustration preceeding the transition and animates through to the illustration that follows the transition.\n- Right-click on the transition to bring up a menu for setting the transitions properties. You can set the type of transition and the timing from this menu.\n- From the menu, choose Transition > Accelerate\n- Right click again, and from the menu choose Duration > 5.0s\n- Now, click the transition again, notice that it is now labeled “Accel”.\n- Observe that the 3D view animates slower this time, taking 5 seconds to complete", "title": "Edit the Transition" } [/block] There are other transition options available. The transitions that include a 2 are used when there are moving parts and a moving viewpoint. The 2 indicates that half of the time the transition will be moving the part and the other half of the time the viewpoint. Since we do not yet have any moving parts, we can ignore these options until later. [block:api-header] { "type": "basic", "title": "Reset the 3D View" } [/block] There are times when you would like to disable the current illustration and start from a clean 3D view. For example, the second illustration currently has a section view setup. At this point we are ready to create a new 3D illustration that does not have the section plan active. [block:callout] { "type": "success", "body": "- Click on the “Section View” illustration in the Storyboard Panel.\n- Press the ESCAPE key on the keyboard.\n- Observe that the section plane is disabled, the selected set is cleared and the illustration name field is cleared.", "title": "Reset the View" } [/block] Pressing ESCAPE initializes some properties of the 3D view and is a quick shortcut to clearing one illustration so that work can begin on the next one. This will set the view up so that no illustration is active, the markup overlay is cleared, the selection set is cleared and the section plane is turned off. This will NOT show hidden parts or modify the explode state. [block:api-header] { "type": "basic", "title": "Create a Third Illustration" } [/block] Our third illustration will isolate the sole subassembly included in our model and we will then add a markup overlay. [block:callout] { "type": "success", "title": "Create a Third Illustration", "body": "- From the Model Ribbon, click on “Model Panel” to display the model panel.\n- In the model panel, click on the subassembly, labeled “SpindleSubss” to select it.\n- Now right click the model tree in the model panel and choose “Isolate”.\n- Observe that the 3D view now only shows the subassembly.\n- For this illustration, we do not want it to be selected, so CTRL left click the background of the 3D view to deselect it. (Alternatively, you could press ESCAPE to deselect it.)\n- Now, create a new illustration by clicking the “New” button in the Storyboard Panel.\n- Name this one “Markup View” and this time leave the checkbox labeled “Edit Markups Now” checked.\n- Click OK to enter edit-markups mode.\n- Observe that the 3D view is now enclosed with an orange box indicating markup-edit mode and there is a “Done” button in the upper-right corner of the 3D view." } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/6BDyzUxcRMyAnro3hqtY_image053.png", "image053.png", "800", "546", "#c28d30", "" ] } ] } [/block] [block:api-header] { "type": "basic", "title": "Add Front Plane Markups" } [/block] Publisher3D includes a variety of markups. We will start with simple 2D text and image overlays, and then add a 3D markup. The illustration saves the markup information, so changing illustration will change markups or remove them if the illustration does not include any markups. First let’s add a simple title as an overlay for this illustration. [block:callout] { "type": "success", "title": "Enter Markup Mode", "body": "- Click the “Illustrate Ribbon”\n- Verify that you are in edit-markups mode. If you are, then the view will be enclosed in an orange box, and the “Edit” button will be shown as pressed in the Illustrations ribbon group." } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/TtCJyhhQPiXaEBeVM2A7_image055.png", "image055.png", "198", "108", "#304972", "" ], "caption": "Illustrations Ribbon Group (Edit)" } ] } [/block] If you are not in edit-markup mode, simply click the “Edit” button in the Illustrations group. [block:callout] { "type": "success", "title": "Add a Text Markup", "body": "- Click on “Text” in the Illustration Tools group.\n- Observe that the 3D view now displays a grid overlay which indicates the drawing plane for the markup. Also, notice that when you mouse over the 3D view, the mouse cursor indicates that you are ready to draw a markup onto the grid.\n- Left-click in the top left, hold down the mouse, drag out a box about the size of one of the major grid divisions, then release the mouse button.\n- Notice that when the mouse is released, a dialog box is displayed for entering text.\n- Enter “Spindle Subassembly” the text box and click OK.\n- The text is now displayed using the currently selected font. Notice that the text is selected as indicated by the handles.\n- Change the font size to 18 by using the pulldown in the Font group on the Illustrate Ribbon.\n- Now, use the color pulldown in the Font group to change the text color to the top blue color." } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/s5iskpu6QTSSNe9c29GT_image057.png", "image057.png", "1022", "532", "#7289df", "" ], "caption": "Markup Text" } ] } [/block] Publisher3D includes a set of images that are useful for technical documentation. Let’s add a generic “inspection” icon. [block:callout] { "type": "success", "title": "Add an Image Markup", "body": "- Verify that you are still in edit-illustration mode by verifying that the “Edit” button on the Illustrate Ribbon is depressed and there is an orange border around the 3D view.\n- Click on the pulldown arrow beneath the Image button in the Illustration Tools ribbon group. Scroll down and click on the magnifying glass icon.\n- Observe that the mouse cursor indicates that you are ready to drag out the image.\n- Left click, hold down the mouse, drag a small square about the size of a major grid division in the bottom-right corner below the 3D model, the release the mouse.\n- If your image has an outline, you can turn this off from the “Line” pulldown in the Color ribbon group. Pick “No Line” at the bottom.\n- Click “Done”.\n- Observe that the grid is hidden and the Storyboard updates the illustration thumbnail to include the markups that you have added." } [/block] [block:image] { "images": [ { "image": [ "https://files.readme.io/9IEHCUKOR1KD8sd7Qhq0_image059.png", "image059.png", "950", "604", "#817030", "" ], "caption": "Image Markup" } ] } [/block] [block:api-header] { "type": "basic", "title": "Add 3D Markups" } [/block] Markups can be drawn onto a 3D plane as well. These are called 3D markups and are very useful for adding arrows and other indicators of action in the 3D space. Like other markups, they are associated with an illustration and will not be displayed with other illustrations. [block:callout] { "type": "success", "title": "Add a 3D Markup", "body": "- Verify that the “Markup View” illustration is selected in your storyboard. If it is selected, then it will be highlighted with an orange border. If it is not selected, then click it in the Storyboard panel to select it.\n- Click on the pulldown under “Grid” in the Draw Plane ribbon group and select “3D-XY”.\n- Notice that the grid plane used for drawing markups is now displayed in 3D space.\n- We now need to position the grid in the Z-axis. Click “Position Grid” in the Draw Plane ribbon group.\n- Notice that the mouse cursor.\n- Click on the model about halfway down to set the grid intersection. This is the plane that you will draw markups onto.\n- Now, click on the pulldown under “Shapes” in the Illustration Tools ribbon group and the select an Arrow shape.\n- Notice that the mouse cursor indicates that it is ready to draw a shape onto the grid.\n- Left click on the 3D grid, hold the mouse button down, drag out the position for your arrow and then release the mouse button.\n- Notice that the markup is created and then automatically selected.\n- Use the handles to scale and rotate the arrow as desired. Hold down CTRL while rotating to lock rotations to increments of 45 degrees.\n- Click “Done” to accept the changes.\n- Use the mouse to rotate the 3D view and observe the behavior of the 3D markup." } [/block] [block:api-header] { "type": "basic", "title": "Reset the View, Again" } [/block] Now that we have added this illustration and are ready to move on to our next illustration, let’s reset the view again. [block:callout] { "type": "success", "title": "Reset the View", "body": "- Press the ESCAPE key to clear the illustration. This will clear the markups.\n- Right click the 3D view and select “Show All” from the 3D menu. This will bring back the parts the we hid to create the previous illustration.\n- In the Viewpoint ribbon group, click on the Home button." } [/block]