{"id":10338,"date":"2026-01-10T22:37:09","date_gmt":"2026-01-10T14:37:09","guid":{"rendered":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/"},"modified":"2026-01-10T22:37:09","modified_gmt":"2026-01-10T14:37:09","slug":"configure-an-animation-effect","status":"publish","type":"post","link":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/","title":{"rendered":"Ein Animationseffekt konfigurieren"},"content":{"rendered":"<p>Wenn Sie Visual Paradigm Online verwenden, k\u00f6nnen Sie Ihrer Gestaltung Animationen hinzuf\u00fcgen, um sie ansprechender zu gestalten. Bei der Animation von Flipbooks k\u00f6nnen einige Effekte weiter angepasst werden. In diesem Video zeigen wir Ihnen, wie Sie einen Animationseffekt konfigurieren.<\/p>\n<div class=\"epyt-video-wrapper\"><iframe allow=\"fullscreen; accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen=\"\" class=\"__youtube_prefs__ epyt-is-override no-lazyload\" data-no-lazy=\"1\" data-origheight=\"480\" data-origwidth=\"854\" data-skipgform_ajax_framebjll=\"\" height=\"480\" id=\"_ytid_66407\" loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/ZAq33Aoh-CA?enablejsapi=1&amp;autoplay=0&amp;cc_load_policy=0&amp;cc_lang_pref=&amp;iv_load_policy=1&amp;loop=0&amp;modestbranding=0&amp;rel=1&amp;fs=1&amp;playsinline=0&amp;autohide=2&amp;theme=dark&amp;color=red&amp;controls=1&amp;\" title=\"YouTube player\" width=\"854\"><\/iframe><\/div>\n<h2>So f\u00fcgen Sie einer Komponente eine Animation hinzu<\/h2>\n<ol>\n<li>Klicken Sie auf das Animations-Symbol am unteren Rand des Editors, um die Animations-Zeitleiste zu \u00f6ffnen.\n<p id=\"SKVxSDN\"><img alt=\"\" class=\"alignnone wp-image-11816\" decoding=\"async\" height=\"86\" loading=\"lazy\" sizes=\"auto, (max-width: 360px) 100vw, 360px\" src=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114458-1.png\" srcset=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114458-1.png 285w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114458-1-150x36.png 150w\" width=\"360\"\/><\/p>\n<\/li>\n<li>W\u00e4hlen Sie die Komponente aus, und das Animations-Panel \u00f6ffnet sich rechts, dort k\u00f6nnen Sie eine Animation f\u00fcr die Komponente ausw\u00e4hlen.\n<p id=\"PGhgXNS\"><img alt=\"\" class=\"alignnone wp-image-11817\" decoding=\"async\" height=\"421\" loading=\"lazy\" sizes=\"auto, (max-width: 184px) 100vw, 184px\" src=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535-131x300.png\" srcset=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535-131x300.png 131w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535-66x150.png 66w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535.png 269w\" width=\"184\"\/><\/p>\n<\/li>\n<\/ol>\n<p><strong>Tipp:<\/strong> Wenn Sie den Mauszeiger \u00fcber die Symbole bewegen, wird eine Live-Vorschau f\u00fcr die ausgew\u00e4hlte Komponente angezeigt.<\/p>\n<h2>Ein Animationseffekt konfigurieren<\/h2>\n<ol>\n<li>\u00d6ffnen Sie die Animations-Zeitleiste, und klicken Sie auf den Effekt in der Zeitleiste, der mit der ausgew\u00e4hlten Komponente in Ihrer Gestaltung verkn\u00fcpft ist. Der zugeh\u00f6rige Effekt wird ebenfalls im Animations-Panel ausgew\u00e4hlt.\n<p id=\"ymKdohk\"><img alt=\"\" class=\"alignnone wp-image-11818\" decoding=\"async\" height=\"256\" loading=\"lazy\" sizes=\"auto, (max-width: 495px) 100vw, 495px\" src=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114749-1-300x155.png\" srcset=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114749-1-300x155.png 300w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114749-1-1030x531.png 1030w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114749-1-768x396.png 768w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114749-1-150x77.png 150w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114749-1-400x206.png 400w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114749-1.png 1274w\" width=\"495\"\/><\/p>\n<\/li>\n<li>F\u00fcr die meisten Animationen k\u00f6nnen wir sie mit weiteren Optionen bearbeiten. Dr\u00fccken Sie das Zahnradsymbol in der oberen rechten Ecke des Effekts, dann werden die Detailoptionen angezeigt. Zum Beispiel k\u00f6nnen Sie die Richtung der Animation konfigurieren.<br \/>\n<img alt=\"\" class=\"alignnone wp-image-11819\" decoding=\"async\" height=\"358\" loading=\"lazy\" sizes=\"auto, (max-width: 285px) 100vw, 285px\" src=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114816-239x300.png\" srcset=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114816-239x300.png 239w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114816-119x150.png 119w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114816.png 256w\" width=\"285\"\/><\/p>\n<p id=\"oHSBveM\"><img alt=\"\" class=\"alignnone size-full wp-image-11820\" decoding=\"async\" height=\"165\" loading=\"lazy\" sizes=\"auto, (max-width: 273px) 100vw, 273px\" src=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114845-1.png\" srcset=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114845-1.png 273w, https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114845-1-150x91.png 150w\" width=\"273\"\/><\/p>\n<\/li>\n<\/ol>\n<p><strong>Tipp:<\/strong> Nachdem Sie die Animation hinzugef\u00fcgt haben, k\u00f6nnen Sie sie in der Zeitleiste finden. Bearbeiten Sie die L\u00e4nge, um die Geschwindigkeit der Animation zu steuern.<\/p>\n<p>\u00a0<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Wenn Sie Visual Paradigm Online verwenden, k\u00f6nnen Sie Ihrer Gestaltung Animationen hinzuf\u00fcgen, um sie ansprechender zu gestalten. Bei der Animation von Flipbooks k\u00f6nnen einige Effekte weiter angepasst werden. In diesem Video zeigen wir Ihnen, wie Sie einen Animationseffekt konfigurieren. So f\u00fcgen Sie einer Komponente eine Animation hinzu Klicken Sie auf das Animations-Symbol am unteren Rand [&hellip;]<\/p>\n","protected":false},"author":8,"featured_media":10339,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_lmt_disableupdate":"","_lmt_disable":"","footnotes":""},"categories":[43],"tags":[],"class_list":["post-10338","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-graphic-design","loop-entry","clr"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.3 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Ein Animationseffekt konfigurieren - Visual Paradigm Bloggen<\/title>\n<meta name=\"description\" content=\"When using VP Online, you can add animation to your design to make it more attractive. The animation can be further customized.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Ein Animationseffekt konfigurieren - Visual Paradigm Bloggen\" \/>\n<meta property=\"og:description\" content=\"When using VP Online, you can add animation to your design to make it more attractive. The animation can be further customized.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/\" \/>\n<meta property=\"og:site_name\" content=\"Visual Paradigm Bloggen\" \/>\n<meta property=\"article:published_time\" content=\"2026-01-10T14:37:09+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535-131x300.png\" \/><meta property=\"og:image\" content=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535-131x300.png\" \/>\n\t<meta property=\"og:image:width\" content=\"131\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"vpmiku\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535-131x300.png\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"vpmiku\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"2\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/\",\"url\":\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/\",\"name\":\"Ein Animationseffekt konfigurieren - Visual Paradigm Bloggen\",\"isPartOf\":{\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/blog.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/12\/2026\/01\/Screenshot-2022-04-27-114535-131x300-1.png\",\"datePublished\":\"2026-01-10T14:37:09+00:00\",\"dateModified\":\"2026-01-10T14:37:09+00:00\",\"author\":{\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/#\/schema\/person\/fd29bf8bc7b4d0d994dc63a4a7af5458\"},\"description\":\"When using VP Online, you can add animation to your design to make it more attractive. The animation can be further customized.\",\"breadcrumb\":{\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#primaryimage\",\"url\":\"https:\/\/blog.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/12\/2026\/01\/Screenshot-2022-04-27-114535-131x300-1.png\",\"contentUrl\":\"https:\/\/blog.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/12\/2026\/01\/Screenshot-2022-04-27-114535-131x300-1.png\",\"width\":131,\"height\":300},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/blog.visual-paradigm.com\/de\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Ein Animationseffekt konfigurieren\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/#website\",\"url\":\"https:\/\/blog.visual-paradigm.com\/de\/\",\"name\":\"Visual Paradigm Bloggen\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/blog.visual-paradigm.com\/de\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/#\/schema\/person\/fd29bf8bc7b4d0d994dc63a4a7af5458\",\"name\":\"vpmiku\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\/\/blog.visual-paradigm.com\/de\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/ab2186f84c99495f4067f33cdf031a0a?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/ab2186f84c99495f4067f33cdf031a0a?s=96&d=mm&r=g\",\"caption\":\"vpmiku\"},\"url\":\"https:\/\/blog.visual-paradigm.com\/de\/author\/vpmiku\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Ein Animationseffekt konfigurieren - Visual Paradigm Bloggen","description":"When using VP Online, you can add animation to your design to make it more attractive. The animation can be further customized.","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:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/","og_locale":"de_DE","og_type":"article","og_title":"Ein Animationseffekt konfigurieren - Visual Paradigm Bloggen","og_description":"When using VP Online, you can add animation to your design to make it more attractive. The animation can be further customized.","og_url":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/","og_site_name":"Visual Paradigm Bloggen","article_published_time":"2026-01-10T14:37:09+00:00","og_image":[{"url":"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535-131x300.png","type":"","width":"","height":""},{"width":131,"height":300,"url":"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535-131x300.png","type":"image\/png"}],"author":"vpmiku","twitter_card":"summary_large_image","twitter_image":"https:\/\/blog.visual-paradigm.com\/wp-content\/uploads\/2022\/04\/Screenshot-2022-04-27-114535-131x300.png","twitter_misc":{"Verfasst von":"vpmiku","Gesch\u00e4tzte Lesezeit":"2\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/","url":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/","name":"Ein Animationseffekt konfigurieren - Visual Paradigm Bloggen","isPartOf":{"@id":"https:\/\/blog.visual-paradigm.com\/de\/#website"},"primaryImageOfPage":{"@id":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#primaryimage"},"image":{"@id":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#primaryimage"},"thumbnailUrl":"https:\/\/blog.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/12\/2026\/01\/Screenshot-2022-04-27-114535-131x300-1.png","datePublished":"2026-01-10T14:37:09+00:00","dateModified":"2026-01-10T14:37:09+00:00","author":{"@id":"https:\/\/blog.visual-paradigm.com\/de\/#\/schema\/person\/fd29bf8bc7b4d0d994dc63a4a7af5458"},"description":"When using VP Online, you can add animation to your design to make it more attractive. The animation can be further customized.","breadcrumb":{"@id":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#primaryimage","url":"https:\/\/blog.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/12\/2026\/01\/Screenshot-2022-04-27-114535-131x300-1.png","contentUrl":"https:\/\/blog.visual-paradigm.com\/de\/wp-content\/uploads\/sites\/12\/2026\/01\/Screenshot-2022-04-27-114535-131x300-1.png","width":131,"height":300},{"@type":"BreadcrumbList","@id":"https:\/\/blog.visual-paradigm.com\/de\/configure-an-animation-effect\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blog.visual-paradigm.com\/de\/"},{"@type":"ListItem","position":2,"name":"Ein Animationseffekt konfigurieren"}]},{"@type":"WebSite","@id":"https:\/\/blog.visual-paradigm.com\/de\/#website","url":"https:\/\/blog.visual-paradigm.com\/de\/","name":"Visual Paradigm Bloggen","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blog.visual-paradigm.com\/de\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Person","@id":"https:\/\/blog.visual-paradigm.com\/de\/#\/schema\/person\/fd29bf8bc7b4d0d994dc63a4a7af5458","name":"vpmiku","image":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/blog.visual-paradigm.com\/de\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/ab2186f84c99495f4067f33cdf031a0a?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/ab2186f84c99495f4067f33cdf031a0a?s=96&d=mm&r=g","caption":"vpmiku"},"url":"https:\/\/blog.visual-paradigm.com\/de\/author\/vpmiku\/"}]}},"modified_by":"vpjick","_links":{"self":[{"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/posts\/10338","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/users\/8"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/comments?post=10338"}],"version-history":[{"count":0,"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/posts\/10338\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/media\/10339"}],"wp:attachment":[{"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/media?parent=10338"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/categories?post=10338"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.visual-paradigm.com\/de\/wp-json\/wp\/v2\/tags?post=10338"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}