{"id":20743,"date":"2011-10-24T17:57:18","date_gmt":"2011-10-24T15:57:18","guid":{"rendered":"http:\/\/onsoftware.en.softonic.com\/?p=20743"},"modified":"2025-07-02T01:55:29","modified_gmt":"2025-07-02T08:55:29","slug":"how-to-make-animations-on-your-iphone-or-ipad","status":"publish","type":"post","link":"https:\/\/cms-articles.softonic.io\/en\/how-to-make-animations-on-your-iphone-or-ipad\/","title":{"rendered":"How to: Make animations on your iPhone or iPad"},"content":{"rendered":"<p>Want to make your own cartoons on your iPhone or iPad? Install <strong>Dink<\/strong> on your iOS device and you\u2019re just a few steps away from becoming the next Walt Disney or Tim Burton.<\/p>\n<p>Dink, available for 99 cents <a href=\"http:\/\/itunes.apple.com\/us\/app\/dink\/id468497050?mt=8\"><strong>in the App Store<\/strong><\/a>, is a surprisingly powerful animation app that allows you to make your own cartoons quickly and with little effort. Dink\u2019s user interface is a bit confusing to start with though, so I\u2019ve put together a quick guide to help you get started in this fun application.<\/p>\n<h3>Step One: Create a new animation<\/h3>\n<p>Dink\u2019s front screen doesn\u2019t make it completely clear where to start. What you actually need to do is to click the \u2018+\u2019 button to dive into a new animation.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-20748\" title=\"dink1\" src=\"https:\/\/articles-img.sftcdn.net\/sft\/articles\/auto-mapping-folder\/sites\/3\/2011\/10\/dink1.jpg\" alt=\"Dink One\" width=\"482\" height=\"322\" srcset=\"https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink1.jpg 482w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink1-120x80.jpg 120w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink1-300x200.jpg 300w\" sizes=\"auto, (max-width: 482px) 100vw, 482px\" \/><br \/>\n<!--more--><\/p>\n<h3>Step Two: Open the project window<\/h3>\n<p>Click on the blank image at the bottom of the main page and you\u2019ll open the project menu. Give your production a name by clicking on the text at the top of the screen. In order to start drawing and animating, you need to tap the middle of the square in the center of the screen.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-20750\" title=\"dink2\" src=\"https:\/\/articles-img.sftcdn.net\/sft\/articles\/auto-mapping-folder\/sites\/3\/2011\/10\/dink21.jpg\" alt=\"Dink Two\" width=\"482\" height=\"322\" srcset=\"https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink21.jpg 482w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink21-120x80.jpg 120w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink21-300x200.jpg 300w\" sizes=\"auto, (max-width: 482px) 100vw, 482px\" \/><\/p>\n<h3>Step Three: Draw your character<\/h3>\n<p>Begin by drawing your character on the screen. This is just a case of dragging your finger around the screen. You\u2019ll find all of the drawing tools in the toolbar on the right. Aside from the brush tool, there\u2019s Fill, Eraser, Selection tool and a Circle tool. Dink even supports layers, if you\u2019re feeling really creative!<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-20751\" title=\"dink3\" src=\"https:\/\/articles-img.sftcdn.net\/sft\/articles\/auto-mapping-folder\/sites\/3\/2011\/10\/dink3.png\" alt=\"Dink Three part one\" width=\"480\" height=\"320\" srcset=\"https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink3.png 480w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink3-120x80.png 120w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink3-300x200.png 300w\" sizes=\"auto, (max-width: 480px) 100vw, 480px\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-20753\" title=\"dinkthrettwoo\" src=\"https:\/\/articles-img.sftcdn.net\/sft\/articles\/auto-mapping-folder\/sites\/3\/2011\/10\/dinkthrettwoo.png\" alt=\"Dink Three Two\" width=\"480\" height=\"320\" srcset=\"https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dinkthrettwoo.png 480w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dinkthrettwoo-120x80.png 120w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dinkthrettwoo-300x200.png 300w\" sizes=\"auto, (max-width: 480px) 100vw, 480px\" \/><\/p>\n<h3>Step Four: Create a new frame by copying from the previous one<\/h3>\n<p>The simplest way to animate with Dink is to create a copy of the current frame and use it to make the next one. Just tap the copy frame icon from the pull-out on the left to create a new frame with your original drawing.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-20756\" title=\"dink4\" src=\"https:\/\/articles-img.sftcdn.net\/sft\/articles\/auto-mapping-folder\/sites\/3\/2011\/10\/dink41.png\" alt=\"Dink Four\" width=\"480\" height=\"320\" srcset=\"https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink41.png 480w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink41-120x80.png 120w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink41-300x200.png 300w\" sizes=\"auto, (max-width: 480px) 100vw, 480px\" \/><\/p>\n<h3>Step Five: Edit the next frame<\/h3>\n<p>Using a technique called \u2018onion skinning\u2019, you can now make changes to the character in the second frame to produce the first movement of the animation. Use the selection tool from the right-hand menu (the dotted line square) to draw around your image. Now slide it with your finger in the direction you want the motion to go. You can change various aspects of the image between frames. Notice that the previous frame is displayed in gray behind this one to help you reposition things successfully.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-20757\" title=\"dink5\" src=\"https:\/\/articles-img.sftcdn.net\/sft\/articles\/auto-mapping-folder\/sites\/3\/2011\/10\/dink5.png\" alt=\"Dink Five\" width=\"480\" height=\"320\" srcset=\"https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink5.png 480w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink5-120x80.png 120w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink5-300x200.png 300w\" sizes=\"auto, (max-width: 480px) 100vw, 480px\" \/><\/p>\n<h3>Step Six: Continue editing<\/h3>\n<p>Repeat this process of using the copy frame tool, selecting the image, then repositioning the next frame until you&#8217;ve reached the point where you want the animation to stop. Make good use of the pinch to zoom function for your creations, because it helps you be more precise.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-20759\" title=\"dink6\" src=\"https:\/\/articles-img.sftcdn.net\/sft\/articles\/auto-mapping-folder\/sites\/3\/2011\/10\/dink6.png\" alt=\"Dink Six\" width=\"480\" height=\"320\" srcset=\"https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink6.png 480w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink6-120x80.png 120w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink6-300x200.png 300w\" sizes=\"auto, (max-width: 480px) 100vw, 480px\" \/><\/p>\n<h3>Step Seven: Preview your animation<\/h3>\n<p>Clicking the film strip in the top-left corner of the screen will take you back to the project screen, where you can preview your cartoon by clicking on the play button.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-20760\" title=\"dink7\" src=\"https:\/\/articles-img.sftcdn.net\/sft\/articles\/auto-mapping-folder\/sites\/3\/2011\/10\/dink7.png\" alt=\"Dink Seven\" width=\"480\" height=\"320\" srcset=\"https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink7.png 480w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink7-120x80.png 120w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink7-300x200.png 300w\" sizes=\"auto, (max-width: 480px) 100vw, 480px\" \/><\/p>\n<h3>Step Eight: Share it with the world<\/h3>\n<p>If you think your creation is good enough to share with the world, you\u2019ll find a number of ways to publish it from Dink. Besides posting it to Facebook, Twitter or YouTube, you can export the finished cartoon to your device\u2019s library, as a GIF animation or a movie file.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-20761\" title=\"dink8\" src=\"https:\/\/articles-img.sftcdn.net\/sft\/articles\/auto-mapping-folder\/sites\/3\/2011\/10\/dink8.png\" alt=\"Dink Eight\" width=\"480\" height=\"320\" srcset=\"https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink8.png 480w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink8-120x80.png 120w, https:\/\/articles-img.sftcdn.net\/auto-mapping-folder\/sites\/3\/2011\/10\/dink8-300x200.png 300w\" sizes=\"auto, (max-width: 480px) 100vw, 480px\" \/><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Want to make your own cartoons on your iPhone or iPad? Install Dink on your iOS device and you\u2019re just a few steps away from becoming the next Walt Disney or Tim Burton. Dink, available for 99 cents in the App Store, is a surprisingly powerful animation app that allows you to make your own &hellip; <a href=\"https:\/\/cms-articles.softonic.io\/en\/how-to-make-animations-on-your-iphone-or-ipad\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;How to: Make animations on your iPhone or iPad&#8221;<\/span><\/a><\/p>\n","protected":false},"author":2006,"featured_media":20760,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","wpcf-pageviews":0},"categories":[2441],"tags":[],"usertag":[],"vertical":[],"content-category":[],"class_list":["post-20743","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-how-to"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/posts\/20743","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/users\/2006"}],"replies":[{"embeddable":true,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/comments?post=20743"}],"version-history":[{"count":1,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/posts\/20743\/revisions"}],"predecessor-version":[{"id":334036,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/posts\/20743\/revisions\/334036"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/media\/20760"}],"wp:attachment":[{"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/media?parent=20743"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/categories?post=20743"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/tags?post=20743"},{"taxonomy":"usertag","embeddable":true,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/usertag?post=20743"},{"taxonomy":"vertical","embeddable":true,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/vertical?post=20743"},{"taxonomy":"content-category","embeddable":true,"href":"https:\/\/cms-articles.softonic.io\/en\/wp-json\/wp\/v2\/content-category?post=20743"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}