{"id":31642,"date":"2023-01-27T10:43:42","date_gmt":"2023-01-27T18:43:42","guid":{"rendered":"https:\/\/www.tynker.com\/blog\/?p=31642"},"modified":"2023-06-13T08:52:13","modified_gmt":"2023-06-13T15:52:13","slug":"tynkers-vector-drawing-tool","status":"publish","type":"post","link":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/","title":{"rendered":"We Improved Tynker&#8217;s Drawing Tool"},"content":{"rendered":"\n<p>Do you love creating your own original artwork in Tynker? We have a surprise for you! We&#8217;ve added <strong>Vector <\/strong>support to Tynker&#8217;s Drawing Tool! It makes all kinds of amazing artistic applications possible.&nbsp;<\/p>\n\n\n\n<p>Just take a look at some of the cool characters that Tynker coders created for the <a href=\"https:\/\/www.tynker.com\/play\/code-jam\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Winter Code Jam<\/strong><\/a>!<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video autoplay controls loop muted src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20230111102208\/kid-animation-compilation.mp4\"><\/video><figcaption class=\"wp-element-caption\"><em>Inspired artwork created by kids on Tynker! Artwork courtesy of users: LilPotato, Invincible Soda, and Spurious Table<\/em><\/figcaption><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-transparent ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-6a02d127067fd\" class=\"ez-toc-cssicon-toggle-label\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #206be5;color:#206be5\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #206be5;color:#206be5\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input type=\"checkbox\"  id=\"ez-toc-cssicon-toggle-item-6a02d127067fd\"  aria-label=\"Toggle\" \/><nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#Why_Vector\" >Why Vector?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#How_To_Use_Tynkers_Vector_Editor\" >How To Use Tynker&#8217;s Vector Editor<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#Community_Showcase_Create_a_Winter_Scene\" >Community Showcase: Create a Winter Scene<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#Create_Animations\" >Create Animations<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#1_Preview_Animation\" >1. Preview Animation&nbsp;<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#2_Copy_Costume\" >2. Copy Costume<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#3_Click_and_Drag\" >3. Click and Drag<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#4_Trash\" >4. Trash&nbsp;<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#Points_and_Handles\" >Points and Handles<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#Digital_Tracing_Paper_The_Onion_Skin_Tool\" >Digital Tracing Paper: The Onion Skin Tool<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#Import_SVGs\" >Import SVGs<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#The_Pen_Blocks\" >The Pen Blocks<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#More_Free_Stuff\" >More Free Stuff!<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Why_Vector\"><\/span>Why Vector?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>The new-and-improved Vector Drawing Tool lets you draw cartoony shapes and precise lines. Here are some of the other benefits you&#8217;ll see if you give the <strong>Vector Drawing Tool <\/strong>a try:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Your artwork scales up and down, without losing quality<\/li>\n\n\n\n<li>Animate with ease \u2014 squish, rotate, and squeeze objects to create animations fast<\/li>\n\n\n\n<li>Work with <strong>layers <\/strong>to control your artwork precisely \u2014 <strong>group <\/strong>objects together and much more<\/li>\n\n\n\n<li>No more &#8220;jaggy lines&#8221;&nbsp;<\/li>\n<\/ul>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161210\/codey-vector.png\" alt=\"A version of Codey, the Tynker mascot, drawn in Tynker's Vector Drawing Tool \" class=\"wp-image-31644\" width=\"106\" height=\"182\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161210\/codey-vector.png 424w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161210\/codey-vector-175x300.png 175w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161210\/codey-vector-87x150.png 87w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161210\/codey-vector-150x257.png 150w\" sizes=\"auto, (max-width: 106px) 100vw, 106px\" \/><\/figure>\n<\/div>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_To_Use_Tynkers_Vector_Editor\"><\/span>How To Use Tynker&#8217;s Vector Editor<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Create a new project on Tynker or open your favorite existing <strong>Project<\/strong>. Then add a new actor, by going to <strong>Add Actor &gt; Drawing Tool. <\/strong>You&#8217;ll see something like this appear.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"468\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161234\/vector-editor-1024x468.png\" alt=\"Tynker's Vector Drawing Tool shown with a blank screen. The pencil tool is selected, and color options appear at bottom\" class=\"wp-image-31645\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161234\/vector-editor-1024x468.png 1024w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161234\/vector-editor-300x137.png 300w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161234\/vector-editor-150x69.png 150w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161234\/vector-editor-768x351.png 768w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161234\/vector-editor-1536x702.png 1536w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161234\/vector-editor-2048x936.png 2048w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161234\/vector-editor-1280x585.png 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>You&#8217;ll see tools on the left. Click to select a tool, then notice how the tool&#8217;s Options appear at the bottom of the screen. In this view, the <strong>Pencil <\/strong>tool is selected (at left), and you can see coloring options at the bottom.&nbsp;<\/p>\n\n\n\n<p>Here&#8217;s what each tool does, from top to bottom:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162233\/select-tool.png\" alt=\"Drawing Tool Selection icon\" class=\"wp-image-31656\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162233\/select-tool.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162233\/select-tool-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><strong>Selection.<\/strong> Anything drawn on the stage can be selected. You can move the object, rearrange its layer order, flip it, and much more using the tools at the bottom! Notice the color controls. The number indicates your current <strong>outline width<\/strong>, which you can think of as &#8220;how wide&#8221; lines are drawn. Experiment to get the hang of these.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"66\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161349\/image22-1-1024x66.png\" alt=\"\" class=\"wp-image-31646\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161349\/image22-1-1024x66.png 1024w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161349\/image22-1-300x19.png 300w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161349\/image22-1-150x10.png 150w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161349\/image22-1-768x49.png 768w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161349\/image22-1-1536x99.png 1536w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161349\/image22-1-1280x82.png 1280w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161349\/image22-1.png 1684w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Here&#8217;s a quick demonstration of using the Selection tool to adjust a shape&#8217;s Fill and Outline.<\/p>\n\n\n\n<figure class=\"wp-block-video aligncenter\"><video autoplay controls loop muted src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161433\/fill-outline.mp4\"><\/video><figcaption class=\"wp-element-caption\"><em>First, choose a color to Fill your shape. Then choose a color and width for the shape&#8217;s Outline.&nbsp;<\/em><\/figcaption><\/figure>\n\n\n\n<p><strong>BTW. <\/strong>Inside of the Selection Tool, you&#8217;ll find an advanced way to animate:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161506\/point-selection.png\" alt=\"Drawing Tool Point Manipulation icon\" class=\"wp-image-31648\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161506\/point-selection.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161506\/point-selection-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><strong>Point Manipulation. <\/strong>This is one trick that makes vector artwork special. You can customize the curves and angles of any object. See the section called <strong><a href=\"#handles\">Points and Handles<\/a><\/strong> below for a complete walkthrough. Be patient as you get the hang of things: Working with vector art can take time to learn.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162249\/pencil-tool.png\" alt=\"Drawing Tool Pencil icon\" class=\"wp-image-31657\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162249\/pencil-tool.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162249\/pencil-tool-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><br><strong>Pencil.<\/strong> Draw freehand using the Pencil tool. This tool is best for creating lines and borders in your drawings. Choose your color using options at the bottom.&nbsp;<br><br><\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162257\/brush-tool.png\" alt=\"Drawing Tool Brush icon\" class=\"wp-image-31658\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162257\/brush-tool.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162257\/brush-tool-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><br><strong>Brush. <\/strong>Draw freehand using the Brush tool. Instead of creating single lines, you&#8217;ll be able to draw complex shapes as well.&nbsp;<br><br><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"488\" height=\"280\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161548\/image1-1.png\" alt=\"\" class=\"wp-image-31649\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161548\/image1-1.png 488w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161548\/image1-1-300x172.png 300w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161548\/image1-1-150x86.png 150w\" sizes=\"auto, (max-width: 488px) 100vw, 488px\" \/><figcaption class=\"wp-element-caption\"><em>The Pencil tool shown at left. It excels at creating lines and curves, not complex shapes like these. The Paintbrush tool shown at right. The resulting shape is much easier to change.<\/em><br><\/figcaption><\/figure>\n<\/div>\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162310\/eraser-tool.png\" alt=\"Drawing Tool Eraser icon\" class=\"wp-image-31659\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162310\/eraser-tool.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162310\/eraser-tool-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><br><strong>Eraser.<\/strong> Remove drawn objects from the page. (You can also <strong>Select<\/strong>, then <strong>Delete <\/strong>objects to remove them too.)<br><br><\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162324\/text-tool.png\" alt=\"Drawing Tool text icon\" class=\"wp-image-31660\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162324\/text-tool.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162324\/text-tool-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><br><strong>Text.<\/strong> Add labels or draw text of any sort. Choose your font and size after selecting this tool.&nbsp;<br><br><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162341\/paintbucket.png\" alt=\"Drawing Tool paint bucket icon\" class=\"wp-image-31661\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162341\/paintbucket.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162341\/paintbucket-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><br><strong>Paint Bucket.<\/strong> Fill shapes in your drawings, fast, using this tool. <strong>Tip: <\/strong>Not working as you expected? The Fill tool works on objects that are <em>already drawn<\/em>, like paths or shapes. Try drawing with the Pen or use the Shapes tool <strong>first<\/strong>. <\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162346\/line-tool.png\" alt=\"Drawing Tool Line icon\" class=\"wp-image-31662\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162346\/line-tool.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162346\/line-tool-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><br><strong>Draw Shape Tool. <\/strong>Use this tool to draw line segments or enclosed shapes.<br><br><br><\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162352\/shapes.png\" alt=\"Drawing Tool Shapes Icon\" class=\"wp-image-31663\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162352\/shapes.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162352\/shapes-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><br><strong>Shapes Library. <\/strong>Icons, shapes, and clipart that you can use in your projects!&nbsp;Find icons, speech bubbles, music notes, and stickers of every kind.<br><br><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"389\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161649\/image13-1-1024x389.png\" alt=\"Sample shapes from Tynker's Drawing Tool: Red Heart, Speech bubble, Pink Musical Note\" class=\"wp-image-31650\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161649\/image13-1-1024x389.png 1024w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161649\/image13-1-300x114.png 300w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161649\/image13-1-150x57.png 150w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161649\/image13-1-768x292.png 768w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161649\/image13-1.png 1170w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162408\/move-tool.png\" alt=\"Drawing Tool Move Canvas icon\" class=\"wp-image-31664\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162408\/move-tool.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162408\/move-tool-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p><br><strong>Move Canvas. <\/strong>Click and drag to pan around your canvas.&nbsp;<br><br><br><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161710\/image8-1.png\" alt=\"Drawing Tool Zoom Controls \" class=\"wp-image-31651\" width=\"144\" height=\"98\"\/><\/figure>\n<\/div>\n\n\n<p><br><strong>Zoom Controls.<\/strong> Notice how Zooming tools are in the lower right, too. The <strong>(+)<\/strong> button zooms in and the <strong>(-)<\/strong> button zooms out. Click the square to choose a Zoom Level.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Community_Showcase_Create_a_Winter_Scene\"><\/span>Community Showcase: Create a Winter Scene<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Take a closer look at some amazing animations created for Tynker&#8217;s <a href=\"https:\/\/www.tynker.com\/play\/code-jam\/\" target=\"_blank\" rel=\"noreferrer noopener\">Winter Code Jam<\/a>. <\/p>\n\n\n\n<p>An animated greeting card by Tynker user Panther!<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20230111104958\/winter-greeting-card-by-Panther.mp4\"><\/video><\/figure>\n\n\n\n<p>An impressive animation sequence from Tynker user Invincible Soda! Go to the gallery below to watch their complete animation.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20230111132109\/winter-scene-soda4.mp4\"><\/video><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>The art team at Tynker was impressed by the original animations of user Jeffery_Human! An adorable animation that was created with the utmost care and precision!<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20230111130247\/make-snowman-jeffery4.mp4\"><\/video><\/figure>\n\n\n\n<p>Need a laugh? Try &#8220;Smores Gone Wrong&#8221; from Tynker user Dragon Catcher. <\/p>\n\n\n\n<figure class=\"wp-block-video\"><video controls src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20230111130941\/smores-gone-wrong3.mp4\"><\/video><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>Browse all the totally amazing <strong>kid-created<\/strong> Tynker projects here! All entrants should be proud of the cool creations you&#8217;ve made. Thank you for sharing your creativity. <\/p>\n\n\n\n<p class=\"has-text-align-center\"><a class=\"sf-button large accent standard \" href=\"https:\/\/www.tynker.com\/play\/code-jam\/\" target=\"_blank\"><span class=\"text\">BROWSE WINTER CODE JAM<\/span><\/a>\n\n\n\n<p>And don&#8217;t forget, you can <strong>Remix <\/strong>any Tynker Community project, so you can see <strong>exactly <\/strong>how they work. Read on to see how you can achieve these cool animation effects on your own!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Create_Animations\"><\/span>Create Animations<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>You can use Costumes to animate actors. Notice a list of all the costumes for an Actor on the right (<strong>Add Actor &gt; Drawing Tool<\/strong>). This area has a bunch of handy features for previewing, duplicating, and controlling animations, whether you&#8217;re working with Vectors or Bitmap.&nbsp;<\/p>\n\n\n\n<p>Let\u2019s take a look:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"388\" height=\"637\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161812\/image5-1.png\" alt=\"The frame controls (costumes) in Tynker's Drawing Tool \" class=\"wp-image-31652\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161812\/image5-1.png 388w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161812\/image5-1-183x300.png 183w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161812\/image5-1-91x150.png 91w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161812\/image5-1-150x246.png 150w\" sizes=\"auto, (max-width: 388px) 100vw, 388px\" \/><\/figure>\n<\/div>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1_Preview_Animation\"><\/span>1. Preview Animation&nbsp;<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Plays a video preview of your costumes in sequence.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2_Copy_Costume\"><\/span>2. Copy Costume<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>This creates a duplicate of the current costume. You can edit costumes to quickly create frames of an animation.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3_Click_and_Drag\"><\/span>3. Click and Drag<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Move costumes up-and-down to <strong>reorder <\/strong>the sequence of your costumes (frames).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"4_Trash\"><\/span>4. Trash&nbsp;<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Discard a costume (frame).<\/p>\n\n\n\n<p><strong>TIP:<\/strong> Try rotating or moving shapes to create frames of your animation quickly! <\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"294\" height=\"234\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221201082949\/flappy-bird-opt.gif\" alt=\"\" class=\"wp-image-31726\"\/><\/figure>\n<\/div>\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"handles\"><span class=\"ez-toc-section\" id=\"Points_and_Handles\"><\/span>Points and Handles<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Here&#8217;s a quick crash course in Bezier curves and how they work in applications like Tynker&#8217;s Drawing Tool.&nbsp;<\/p>\n\n\n\n<p>Consider the line below. The <strong>points <\/strong>of the line are the white squares. Notice how the point in the lower right is currently selected. The two blue circles are that point&#8217;s <strong>handles<\/strong>. Each point along this line has handles just like this one, that can be clicked and dragged to adjust the curve.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"409\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161904\/image6-2.png\" alt=\"A bezier curve showing points and handles in the Tynker Drawing Tool \" class=\"wp-image-31653\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161904\/image6-2.png 800w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161904\/image6-2-300x153.png 300w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161904\/image6-2-150x77.png 150w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161904\/image6-2-768x393.png 768w\" sizes=\"auto, (max-width: 800px) 100vw, 800px\" \/><\/figure>\n\n\n\n<p>You can move or rearrange points \u2014 and add or delete points, too, to any existing line or shape. The best way to get familiar with these ideas is practice. Try drawing freehand with your mouse, then adjust the curves afterwards. Here&#8217;s how:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Draw a line or shape with the <strong>Pencil <\/strong>tool \u2014 don&#8217;t forget you can <strong>Undo <\/strong>if you don&#8217;t like your first try.<\/li>\n\n\n\n<li>Then choose the <strong>Point Manipulation <\/strong>tool (it&#8217;s inside the <strong>Selection <\/strong>tool) \u2014 notice how you can now see points on the line you drew.<\/li>\n\n\n\n<li>Click an individual point, and handles for that point appear. Try moving the point.&nbsp;<\/li>\n\n\n\n<li>Click and drag a handle to change the curve! Don&#8217;t forget, you can <strong>Undo <\/strong>this action too.<\/li>\n\n\n\n<li>Try deleting a few points, if your line isn&#8217;t so smooth \u2014 try to make a smooth curve. Click <strong>Delete \ud83d\uddd1\ufe0f <\/strong>at the bottom.<\/li>\n\n\n\n<li>Try adding points, too. Click on an existing path in your drawing, and you&#8217;ll see a new point and handles appear.&nbsp;<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-video aligncenter\"><video autoplay controls loop muted src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129161944\/editing-points.mp4\"><\/video><figcaption class=\"wp-element-caption\"><em>Play around with a simple curved line to explore how the tools work<\/em><\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Digital_Tracing_Paper_The_Onion_Skin_Tool\"><\/span>Digital Tracing Paper: The Onion Skin Tool<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Drawing your own animations by hand? You can use the Onion Skin tool to show how nearby frames of animation look. This tool is like digital tracing paper!&nbsp;<\/p>\n\n\n\n<p>Follow along to see how it works. To draw a new actor yourself, go to <strong>Add Actor &gt; Drawing Tool<\/strong>. Then let\u2019s suppose you\u2019ve already drawn a single frame, like this dog, that you\u2019re happy about and ready to start animating.&nbsp;<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"561\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170229\/image16-1.png\" alt=\"Frame of a dog\" class=\"wp-image-31666\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170229\/image16-1.png 600w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170229\/image16-1-300x281.png 300w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170229\/image16-1-150x140.png 150w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure>\n<\/div>\n\n\n<p>Let\u2019s add a few frames of animation\u2014so that this dog wags his tail. <\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170307\/image14-1.png\" alt=\"Drawing Tool's Copy Costume button\" class=\"wp-image-31668\" width=\"66\" height=\"53\"\/><\/figure>\n<\/div>\n\n\n<p>First, copy the starting costume using the <strong>Copy Costume<\/strong> button.&nbsp;Then switch to your new costume, erase the parts you want to change\u2014for us, that\u2019s the dog\u2019s tail.&nbsp;<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"593\" height=\"556\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170250\/image26.png\" alt=\"\" class=\"wp-image-31667\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170250\/image26.png 593w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170250\/image26-300x281.png 300w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170250\/image26-150x141.png 150w\" sizes=\"auto, (max-width: 593px) 100vw, 593px\" \/><\/figure>\n<\/div>\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170330\/image24-1.png\" alt=\"Drawing Tool's Onion Skin icon\" class=\"wp-image-31669\" width=\"110\" height=\"110\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170330\/image24-1.png 110w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129170330\/image24-1-96x96.png 96w\" sizes=\"auto, (max-width: 110px) 100vw, 110px\" \/><\/figure>\n<\/div>\n\n\n<p>Then click the <strong>Onion Skin<\/strong> button:&nbsp;Just like real-life tracing paper, this shows a translucent overlay of nearby frames, so you can use it as guidelines for your next frame of animation.&nbsp;<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"567\" height=\"525\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129175809\/image27.png\" alt=\"Drawing Tool Onion Skin is demonstrated, showing a dog's ghostly tail\" class=\"wp-image-31670\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129175809\/image27.png 567w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129175809\/image27-300x278.png 300w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129175809\/image27-150x139.png 150w\" sizes=\"auto, (max-width: 567px) 100vw, 567px\" \/><\/figure>\n<\/div>\n\n\n<p><\/p>\n\n\n\n<p>Draw the tail of the dog in a slightly different spot for each successive frame, using the <strong>Onion Skin<\/strong>, <strong>Copy Costume<\/strong>, and <strong>Animation Preview <\/strong>tools, as you work. You can also squeeze, squish, or rotate objects using the <strong>Point Manipulation <\/strong>tool. You could even create simple animations by changing fills and outline widths! <\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/lh4.googleusercontent.com\/dSV61bvpPjzibynWff4beJ3_m2r39RbdTJ9lJCghayY7ZIBwdQTZoYK7oOuQ2XBst_mJVp_Srr-K_sTKtn4ZvsPkFYr4DBPrTVgwMd0I-yeQv6ILtc5uYFv11JqA4v4RP4xmI5Fz\" alt=\"A completed animation of a dog\"\/><\/figure>\n<\/div>\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"854\" height=\"499\" src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20220810162837\/dog-sequence.png\" alt=\"Frames of the dog animation shown in sequence\" class=\"wp-image-28458\" srcset=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20220810162837\/dog-sequence.png 854w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20220810162837\/dog-sequence-300x175.png 300w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20220810162837\/dog-sequence-150x88.png 150w, https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20220810162837\/dog-sequence-768x449.png 768w\" sizes=\"auto, (max-width: 854px) 100vw, 854px\" \/><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Import_SVGs\"><\/span>Import SVGs<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>You&#8217;ll also see all-new file support for <strong>importing SVGs<\/strong>, a file format called <strong>Scalable Vector Graphics<\/strong>. This means you can create Tynker-compatible artwork in vector-drawing tools like Inkscape (<a href=\"http:\/\/inkscape.org\">inkscape.org<\/a>), Inkpad (for iPad users), Adobe Illustrator (<a href=\"http:\/\/adobe.com\">adobe.com<\/a>), and dozens of similar applications.&nbsp;<\/p>\n\n\n\n<p>You can import SVG images using <strong>Add Actor &gt; Upload Image<\/strong> \u2014 or import a costume within the Drawing Tool using the \u22ee menu in the upper right.&nbsp;<\/p>\n\n\n\n<p><strong>BTW.<\/strong> The original drawing mode for Tynker is called <strong>Bitmap <\/strong>mode, which is a kind of digital artwork where each individual pixel&#8217;s color is specified, precisely. Prefer it? No problem. You can revert to bitmap mode at any time. You can upload bitmap files as well: PNG and JPG files are already supported by Tynker.&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-video aligncenter\"><video autoplay controls loop muted src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20230111153525\/snowman-cool-coder.mp4\"><\/video><figcaption class=\"wp-element-caption\"><em>Making a Snowman, created by Tynker user Cool Coder<\/em><\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"The_Pen_Blocks\"><\/span>The Pen Blocks<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Want to explore a <strong>totally different<\/strong> way of making animations and artwork with Tynker? Try exploring the Pen Blocks, which makes actors draw as they move. Create patterns, draw geometric shapes, and more.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video autoplay controls loop muted src=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221129162133\/spin.mp4\"><\/video><\/figure>\n\n\n\n<p class=\"has-text-align-center\"><a class=\"sf-button large accent standard \" href=\"https:\/\/www.tynker.com\/blog\/tynker-toolbox-the-pen-blocks\/\" target=\"_blank\"><span class=\"text\">THE PEN BLOCKS<\/span><\/a>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"More_Free_Stuff\"><\/span>More Free Stuff!<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Want more? Read the rest of our free tutorials in the Tynker Toolbox series:&nbsp;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/tynker-workshop-basics\/\"><strong>Tynker Workshop Basics<\/strong><\/a> \u2014 Learn about coordinates and start coding with Tynker.<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/animation-tool\/\"><strong>The Animation Tool<\/strong><\/a> \u2014 Learn about frame-based animation and other animation tips.<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/tynker-toolbox-the-character-creator\/\"><strong>The Character Creator<\/strong><\/a> \u2014 Take control of custom rigs using the Animation blocks.<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/text-tricks\/\"><strong>Text Tricks<\/strong><\/a> \u2014 Work with speech bubbles and more. Tell your own stories, put on a play, or make a computer write poetry!<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/tynker-toolbox-the-sound-blocks\/\"><strong>The Sound Blocks<\/strong><\/a> \u2014 Play music with code! Add custom sound effects, too. Tynker\u2019s music tool supports MIDI and MP3.&nbsp;<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/the-synth-blocks\/\"><strong>The Synth Blocks<\/strong><\/a> \u2014 Create your own sound effects and instruments! You can create crunchy dubstep drops, glitchy chiptunes, or instruments from any style of music you can imagine!&nbsp;<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/tynker-toolbox-code-block-tricks\/\"><strong>Code Block Tricks<\/strong><\/a> \u2014 Get top-secret ninja tips for writing code fast in Tynker Workshop.&nbsp;<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/tynker-toolbox-the-physics-blocks\/\"><strong>The Physics Blocks<\/strong><\/a> \u2014 Create games or simulations with gravity, collisions, and more. Think: <em>Angry Birds<\/em> and <em>Marble Madness<\/em>.<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/the-ar-blocks\/\"><strong>The Augmented Reality Blocks<\/strong><\/a> \u2014 Want to use video or photos in your programs? Try the AR Blocks, which let you code your own selfie!&nbsp;<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/tynker-toolbox-the-ai-blocks\/\"><strong>The AI Blocks<\/strong><\/a> \u2014 The AI blocks are three extensions that make learning about artificial intelligence fun and exciting.&nbsp;<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/debugger\/\"><strong>The Debugger<\/strong><\/a> \u2014 Learn about Tynker\u2019s data debugger and get bug-fixing tips.<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/tynker-toolbox-the-tutorial-builder\/\"><strong>The Tutorial Builder<\/strong><\/a> \u2014 Did you ever make a really cool Tynker Block project and wish you could teach the whole world exactly how you did it? Now you can!<\/li>\n\n\n\n<li><a href=\"https:\/\/www.tynker.com\/blog\/articles\/ideas-and-tips\/tynker-toolbox-the-python-editor\/\"><strong>The Python Editor<\/strong><\/a> \u2014 Looking for a challenge? Ready for your next step on your coding journey? Learn Python with Tynker too, and take the plunge into text-based coding.&nbsp;<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Do you love creating your own original artwork in Tynker? We have a surprise for you! We&#8217;ve added Vector support to Tynker&#8217;s Drawing Tool! It makes all kinds of amazing artistic applications possible.&nbsp; Just take a look at some of the cool characters that Tynker coders created for the Winter Code Jam! Why Vector? The new-and-improved Vector Drawing Tool lets [&hellip;]<\/p>\n","protected":false},"author":25,"featured_media":31703,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[510,12],"tags":[430,432,429],"class_list":["post-31642","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-block-coding","category-ideas-and-tips","tag-basics","tag-creative-coding","tag-tynker-toolbox"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>We Improved Tynker&#039;s Drawing Tool - Tynker Blog<\/title>\n<meta name=\"description\" content=\"Do you love creating your own original artwork in Tynker? We have a surprise for you! We&#039;ve added Vector support to the Drawing Tool!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"tynker&#039;s-vector-drawing-tool\" \/>\n<meta property=\"og:description\" content=\"Do you love creating your own original artwork in Tynker? We have a surprise for you! We&#039;ve added Vector support to the Drawing Tool!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/\" \/>\n<meta property=\"og:site_name\" content=\"Tynker Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Gotynker\/\" \/>\n<meta property=\"article:published_time\" content=\"2023-01-27T18:43:42+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-06-13T15:52:13+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221130105512\/paint-resize2.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"1073\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Tynker Team\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@gotynker\" \/>\n<meta name=\"twitter:site\" content=\"@gotynker\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Tynker Team\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"14 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"We Improved Tynker's Drawing Tool - Tynker Blog","description":"Do you love creating your own original artwork in Tynker? We have a surprise for you! We've added Vector support to the Drawing Tool!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/","og_locale":"en_US","og_type":"article","og_title":"tynker's-vector-drawing-tool","og_description":"Do you love creating your own original artwork in Tynker? We have a surprise for you! We've added Vector support to the Drawing Tool!","og_url":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/","og_site_name":"Tynker Blog","article_publisher":"https:\/\/www.facebook.com\/Gotynker\/","article_published_time":"2023-01-27T18:43:42+00:00","article_modified_time":"2023-06-13T15:52:13+00:00","og_image":[{"width":1200,"height":1073,"url":"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221130105512\/paint-resize2.png","type":"image\/png"}],"author":"Tynker Team","twitter_card":"summary_large_image","twitter_creator":"@gotynker","twitter_site":"@gotynker","twitter_misc":{"Written by":"Tynker Team","Est. reading time":"14 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#article","isPartOf":{"@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/"},"author":{"name":"Tynker Team","@id":"https:\/\/www.tynker.com\/blog\/#\/schema\/person\/934d769f4839cb9df678306ee728f671"},"headline":"We Improved Tynker&#8217;s Drawing Tool","datePublished":"2023-01-27T18:43:42+00:00","dateModified":"2023-06-13T15:52:13+00:00","mainEntityOfPage":{"@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/"},"wordCount":1898,"publisher":{"@id":"https:\/\/www.tynker.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#primaryimage"},"thumbnailUrl":"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221130105720\/paint-resize2-1.png","keywords":["Basics","Creative Coding","Tynker Toolbox"],"articleSection":["Block Coding","Ideas and Tips"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/","url":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/","name":"We Improved Tynker's Drawing Tool - Tynker Blog","isPartOf":{"@id":"https:\/\/www.tynker.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#primaryimage"},"image":{"@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#primaryimage"},"thumbnailUrl":"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221130105720\/paint-resize2-1.png","datePublished":"2023-01-27T18:43:42+00:00","dateModified":"2023-06-13T15:52:13+00:00","description":"Do you love creating your own original artwork in Tynker? We have a surprise for you! We've added Vector support to the Drawing Tool!","breadcrumb":{"@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#primaryimage","url":"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221130105720\/paint-resize2-1.png","contentUrl":"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20221130105720\/paint-resize2-1.png","width":2400,"height":1400},{"@type":"BreadcrumbList","@id":"https:\/\/www.tynker.com\/blog\/tynkers-vector-drawing-tool\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Coding for Kids","item":"https:\/\/www.tynker.com\/"},{"@type":"ListItem","position":2,"name":"Blog","item":"https:\/\/www.tynker.com\/blog\/"},{"@type":"ListItem","position":3,"name":"We Improved Tynker&#8217;s Drawing Tool"}]},{"@type":"WebSite","@id":"https:\/\/www.tynker.com\/blog\/#website","url":"https:\/\/www.tynker.com\/blog\/","name":"Tynker Blog","description":"Tynker makes it fun and easy to learn computer programming. Get started today with Tynker&#039;s easy-to-learn, visual programming courses designed for young learners in grades K-12.","publisher":{"@id":"https:\/\/www.tynker.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.tynker.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.tynker.com\/blog\/#organization","name":"Tynker - Coding for Kids","url":"https:\/\/www.tynker.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.tynker.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20220713063303\/appicon-120.png","contentUrl":"https:\/\/images.tynker.com\/blog\/wp-content\/uploads\/20220713063303\/appicon-120.png","width":120,"height":120,"caption":"Tynker - Coding for Kids"},"image":{"@id":"https:\/\/www.tynker.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Gotynker\/","https:\/\/x.com\/gotynker","https:\/\/www.instagram.com\/tynkercoding\/","https:\/\/www.pinterest.com\/gotynker\/","https:\/\/www.linkedin.com\/company\/tynker"]},{"@type":"Person","@id":"https:\/\/www.tynker.com\/blog\/#\/schema\/person\/934d769f4839cb9df678306ee728f671","name":"Tynker Team","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.tynker.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/53c002ba171d44324489e00b00f5b0ebf381cabfef3347db5e6d5257409d92ba?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/53c002ba171d44324489e00b00f5b0ebf381cabfef3347db5e6d5257409d92ba?s=96&d=mm&r=g","caption":"Tynker Team"},"url":"https:\/\/www.tynker.com\/blog\/author\/lpateltynker-com\/"}]}},"_links":{"self":[{"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/posts\/31642","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/users\/25"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/comments?post=31642"}],"version-history":[{"count":49,"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/posts\/31642\/revisions"}],"predecessor-version":[{"id":34594,"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/posts\/31642\/revisions\/34594"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/media\/31703"}],"wp:attachment":[{"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/media?parent=31642"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/categories?post=31642"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tynker.com\/blog\/wp-json\/wp\/v2\/tags?post=31642"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}