{"id":14689,"date":"2018-10-02T11:00:55","date_gmt":"2018-10-02T09:00:55","guid":{"rendered":"https:\/\/www.diedruckerei.de\/magazin\/?p=14689"},"modified":"2025-04-29T09:00:09","modified_gmt":"2025-04-29T07:00:09","slug":"bewegte-bilder-cinemagraphs","status":"publish","type":"post","link":"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/","title":{"rendered":"Bewegte Bilder erstellen und erfolgreich damit werben: Cinemagraphs"},"content":{"rendered":"<p>Ist das klassische GIF mittlerweile wieder out? Eins ist klar: Einige Trends wiederholen sich immer wieder. Deshalb widmen wir uns einer anderen, sehr vielversprechenden Art von bewegten Bildern. Diese hatte schon vor einigen Jahren ihren Durchbruch und scheint bald wieder aufzubl\u00fchen: Cinemagraphs. Solche Bilder bewegen sich, wie auch GIFs, in Dauerschleife, haben aber sonst mit den Social-Media-Hits nicht viel gemein. Cinemagraphs sind n\u00e4mlich hochwertige Bilder, bei denen sich nach kurzer Betrachtung ein echter Wow-Effekt einstellt \u2013 und damit haben die Cinemagraphs ebenfalls echtes Hit-Potenzial f\u00fcr Ihre Werbezwecke.<!--more--><\/p>\n<p><strong>Inhalt:<\/strong><\/p>\n<ul>\n<li>F\u00fcr Ihr Marketing: Mit bewegten Bildern professionell werben\n<ul>\n<li><a href=\"#blog\">Webseiten und Blogs<\/a><\/li>\n<li><a href=\"#social\">Social Media Content-, Display- oder Canvas-Werbung<\/a><\/li>\n<li><a href=\"#news\">Newsletter<\/a><\/li>\n<\/ul>\n<\/li>\n<li>Bewegte Bilder selbst erstellen: Tool-Check\n<ul>\n<li><a href=\"#plotagraph\">Plotagraph<\/a><\/li>\n<li><a href=\"#flixel\">Flixel<\/a><\/li>\n<li><a href=\"#photoshop\">Adobe Photoshop<\/a><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<div class=\"custom-background-grey\">\n<p><strong>Cinemagraphs vs. GIF<\/strong><br \/>\nIn Cinemagraphs bewegen sich nur Teile des Bildes, w\u00e4hrend der Rest starr bleibt. Deshalb wirken die Fotos auch wirklich wie \u201ebewegte Bilder\u201c und nicht wie Videos. Im Gegensatz zu GIFs enthalten Cinemagraphs wesentlich mehr Farben und machen somit einen hochwertigeren Eindruck.<\/p>\n<\/div>\n<p>&nbsp;<\/p>\n<p>Das Beeindruckende an den bewegten Bildern: Eigentlich blickt man beispielsweise auf eine Frau, die sich im Pool in der Sonne br\u00e4unt, doch pl\u00f6tzlich tut sich was im Bild.<\/p>\n<div class=\"flx-embed\">\n<div style=\"position: relative; height: 0; padding-bottom: 56.25%; width: 100%;\"><iframe style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%;\" src=\"https:\/\/media.flixel.com\/cinemagraph\/i9jeipyw7955dpjvbnbp?hd=false\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n<div><span style=\"font-size: 8pt;\"><em>Quelle:\u00a0flixel.com\/cinemagraph\/ &#8211;\u00a0DomQuichotte<\/em><\/span><\/div>\n<\/div>\n<div class=\"flx-embed\">\n<div><\/div>\n<div>Auch anders herum entstehen interessante Effekte. Viel bewegt sich im Bild und wirkt wie ein Video bis man bemerkt, dass gewisse Teile starr bleiben und eigentlich ein animiertes Bild statt eines Videos betrachtet wird.<\/div>\n<div><\/div>\n<\/div>\n<div class=\"flx-embed\">\n<div style=\"position: relative; height: 0; padding-bottom: 56.25%; width: 100%;\"><iframe style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%;\" src=\"https:\/\/media.flixel.com\/cinemagraph\/6bfwuaefmottf8midnrm?hd=false\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n<div><span style=\"font-size: 8pt;\"><em>Quelle:\u00a0flixel.com\/cinemagraph\/ &#8211;\u00a0DomQuichotte<\/em><\/span><\/div>\n<div><\/div>\n<div class=\"flx-embed\">\n<div style=\"position: relative; height: 0; padding-bottom: 56.25%; width: 100%;\"><iframe style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%;\" src=\"https:\/\/media.flixel.com\/cinemagraph\/iayq1tlbf008ev7bltyc?hd=false\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n<\/div>\n<\/div>\n<div class=\"flx-embed\">\n<div><span style=\"font-size: 8pt;\"><em>Quelle:\u00a0flixel.com\/cinemagraph\/ &#8211;\u00a0DomQuichotte<\/em><\/span><\/div>\n<div><\/div>\n<div>Bewegte Bilder wie Cinemagraphs sind kein neuer Trend und wurden bereits 2011 professionell f\u00fcr Werbezwecke bekannter Marken produziert. So zum Beispiel auch von den Kreativschaffenden\u00a0<a href=\"http:\/\/cinemagraphs.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Jamie Beck und Kevin Burg<\/a> zur damaligen New Yorker Fashion Week. Und sie haben wirklich Potenzial, Webauftritte oder Werbung im Netz interessanter zu gestalten, ohne teure Videos produzieren zu m\u00fcssen.<\/div>\n<div><\/div>\n<h2 id=\"werben\">Bewegte Bilder professionell nutzen<\/h2>\n<p>Wie die bewegten Bilder produziert werden und was technisch dahintersteckt, erfahren Sie in der Tool-Vorstellung weiter unten. Eines kann aber schon an diesem Punkt vorweggenommen werden: Bewegte Bilder sind in der Herstellung wesentlich g\u00fcnstiger als aufwendig aufgenommene Werbevideos. Aber auch dort tut sich etwas im Bild, was die Aufmerksamkeit des Betrachters weckt und bindet. Die Dateigr\u00f6\u00dfe der Bilder ist zudem wesentlich kleiner als die eines Werbevideos, was eine schnellere Autoplay-Performance auf vielen Webseiten oder Blogs mit sich bringt. Und das ist wichtig, denn am besten \u201efunktionieren\u201c die Cinemagraphs, wenn sie sofort und in Endlosschleife abgespielt werden.<\/p>\n<div class=\"custom-background custom-background-donts\"><strong>Wichtig:<\/strong> Obwohl von bewegten<strong> Bildern<\/strong> die Rede ist, handelt es sich tats\u00e4chlich meist um <strong>Video-Dateien<\/strong>. Damit das animierte Bild in Dauerschleife abgespielt wird, liegt es nahe, das Videoformat als GIF-Datei umzuspeichern, da dieses Format das Video automatisch immer wieder erneut abspielt.<br \/>\nAber Achtung! Eine MP4-Datei kann unz\u00e4hlige Farben wiedergeben, ein GIF nur 256 \u2013 und diesen Qualit\u00e4tsverlust sieht man h\u00e4ufig recht deutlich. Versuchen Sie daher bei der Einbindung in Ihre Webseite, Blog oder \u00c4hnliches auf eine GIF-Umwandlung zu verzichten und die Loop-Funktion \u00fcber den Einbettungscode zu integrieren.<\/p>\n<figure id=\"attachment_14695\" aria-describedby=\"caption-attachment-14695\" style=\"width: 250px\" class=\"wp-caption alignleft\"><a href=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/MP4-Datei-Vergleich.png\"><img loading=\"lazy\" decoding=\"async\" class=\"td-modal-image wp-image-14695\" src=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/MP4-Datei-Vergleich-300x260.png\" alt=\"Das ruhige Meer unter einem klaren, blauen Himmel spiegelt die ruhige Atmosph\u00e4re wider, die oft in bewegten Bildern zu sehen ist. Sanfte, ged\u00e4mpfte T\u00f6ne betonen den sanften Horizont, wo Wasser auf Himmel trifft.\" width=\"250\" height=\"216\" srcset=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/MP4-Datei-Vergleich-300x260.png 300w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/MP4-Datei-Vergleich-534x462.png 534w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/MP4-Datei-Vergleich-696x602.png 696w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/MP4-Datei-Vergleich-485x420.png 485w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/MP4-Datei-Vergleich.png 722w\" sizes=\"(max-width: 250px) 100vw, 250px\" \/><\/a><figcaption id=\"caption-attachment-14695\" class=\"wp-caption-text\">Qualit\u00e4t einer MP4-Datei vs.<\/figcaption><\/figure>\n<figure id=\"attachment_14694\" aria-describedby=\"caption-attachment-14694\" style=\"width: 216px\" class=\"wp-caption alignleft\"><a href=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/GIF-Datei-Vergleich.png\"><img loading=\"lazy\" decoding=\"async\" class=\"td-modal-image wp-image-14694\" src=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/GIF-Datei-Vergleich-300x300.png\" alt=\"Ein ruhiger Blick auf das Meer mit sanften Wellen, die wie bewegte Bilder unter einem weiten, klaren blauen Himmel wogen. Am Horizont sind kleine Wolken zu sehen.\" width=\"216\" height=\"216\" srcset=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/GIF-Datei-Vergleich-300x300.png 300w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/GIF-Datei-Vergleich-150x150.png 150w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/GIF-Datei-Vergleich-420x420.png 420w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/GIF-Datei-Vergleich.png 460w\" sizes=\"(max-width: 216px) 100vw, 216px\" \/><\/a><figcaption id=\"caption-attachment-14694\" class=\"wp-caption-text\">umgewandelt in eine GIF-Datei<\/figcaption><\/figure>\n<\/div>\n<div><\/div>\n<\/div>\n<h3 id=\"blog\">Webseiten und Blogs<\/h3>\n<p>Im Header einer Webseite sind bewegte Bilder eine tolle M\u00f6glichkeit, um sofort die Aufmerksamkeit des Besuchers zu fesseln, ohne sie zu \u00fcberreizen. Auch Produktvorstellungen k\u00f6nnen mit Cinemagraphs wesentlich attraktiver gestaltet werden, nat\u00fcrlich abh\u00e4ngig von Branche und Produkt. Dieser Vorteil kann auch in Blogs gut genutzt werden, wobei immer beachtet werden sollte: Weniger ist mehr. Sobald sich auf der Seite irgendwann alles bewegt und schrille Werbeanzeigen in jeder Seitenleiste hinzukommen, ist der Wow-Effekt wieder verpufft.<\/p>\n<p><strong>Beispiele f\u00fcr Produktvorstellungen:\u00a0<\/strong><\/p>\n<div>\n<div class=\"flx-embed\">\n<div style=\"position: relative; height: 0; padding-bottom: 80.00%; width: 100%;\"><iframe style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%;\" src=\"https:\/\/media.flixel.com\/cinemagraph\/58wkj6qoxfdlu5u080f1?hd=false\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\" data-mce-fragment=\"1\"><\/iframe><\/div>\n<\/div>\n<p><em><span style=\"font-size: 8pt;\">Quelle:\u00a0flixel.com\/cinemagraphs\/advertising &#8211; CinePix<\/span><\/em><\/p>\n<div class=\"flx-embed\">\n<div>\n<div class=\"flx-embed\">\n<div style=\"position: relative; height: 0; padding-bottom: 52.76%; width: 100%;\"><iframe style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%;\" src=\"https:\/\/media.flixel.com\/cinemagraph\/n7u0t3tl0exu4ynqq8u6?hd=false\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n<\/div>\n<p><em><span style=\"font-size: 8pt;\">Quelle:\u00a0flixel.com\/cinemagraphs\/advertising &#8211;\u00a0<\/span><span style=\"font-size: 8pt;\">AndrewPavlidis<\/span><\/em><\/p>\n<\/div>\n<div style=\"position: relative; height: 0; padding-bottom: 80.00%; width: 100%;\"><iframe style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%;\" src=\"https:\/\/media.flixel.com\/cinemagraph\/42q0i5raed0h1yauych0?hd=false\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n<\/div>\n<p><em><span style=\"font-size: 8pt;\">Quelle:\u00a0flixel.com\/cinemagraphs\/advertising &#8211;\u00a0<\/span><span style=\"font-size: 8pt;\">CinePix<\/span><\/em><\/p>\n<\/div>\n<p><strong>Technische Einbindung:<\/strong> Das bewegte Bild kann \u00fcber das HTML-Video-Element integriert werden. Die Eigenschaften f\u00fcr \u201eAutoplay\u201c und \u201eLoop\u201c sollten mit im Code stehen und die Kompatibilit\u00e4t mit unterschiedlichen Browsern getestet werden. Auch WordPress l\u00e4sst das Einbetten des animierten Bildes ohne Probleme zu. Am einfachsten ist es, wenn das bewegte Bild auf YouTube oder anderen Plattformen wie <a href=\"https:\/\/flixel.com\/cinemagraphs\/fresh\/\" target=\"_blank\" rel=\"noopener noreferrer\">flixel.com<\/a> (eine Seite, die sich auf die Produktion und Verbreitung von Cinemagraphs spezialisiert hat) hochgeladen und anschlie\u00dfend auf Ihrer Seite eingebettet wird. Denn letztere Plattform bietet zum Beispiel fertige Embed-Codes zum Kopieren und Einf\u00fcgen an, die das Video im Autoplay und Loop abspielen.<\/p>\n<p>Beispielcode zum Einbetten eines bewegten Bildes als HTML-Element:<\/p>\n<pre>&lt;video width=\"320\" height=\"240\" autoplay loop&gt;\r\n&lt;source src=\"movie.mp4\" type=\"video\/mp4\"&gt;\r\n&lt;source src=\"movie.ogg\" type=\"video\/ogg\"&gt;\r\nYour browser does not support the video tag.\r\n&lt;\/video&gt;<\/pre>\n<div>\n<p>Beispielcode zum Einbetten eines bewegten Bildes aus der Media-Gallery (von WordPress):<\/p>\n<pre>[ video width=\"1200\" height=\"800\" \r\nmp4=\"https:\/\/www.diedruckerei.de\/magazin\/wp-content\/uploads\/2018\/09\/Test_Wasser\r\n-1200px-25fps-2.mp4\" loop=\"on\" autoplay=\"on\" ] [ \/video ]<\/pre>\n<p><em><span style=\"font-size: 8pt;\">(Hinweis: Bitte l\u00f6schen Sie die Leerzeichen vor und nach den Klammern bevor Sie diesen Code benutzen.)<\/span><\/em><\/p>\n<p>Beispielcode zum Einbetten eines bewegten Bildes auf YouTube:<\/p>\n<pre>&lt;iframe class=\"embed-responsive-item\"id=\"ytplayer\" type=\"text\/html\" width=\"640\" height=\"360\" src=\"https:\/\/www.youtube.com\/embed\/DWamwL9e3EY?&amp;autoplay=1&amp;loop=1&amp;rel=0&amp;showinfo=0&amp;color=white&amp;iv_load_policy=3&amp;playlist=DWamwL9e3EY\" frameborder=\"0\" allowfullscreen&gt;&lt;\/iframe&gt;<\/pre>\n<\/div>\n<p>Beispielcode zum Einbetten eines bewegten Bildes auf Flixel:<\/p>\n<pre>&lt;div class=\"flx-embed\"&gt;&lt;div style=\"position:relative; height:0; padding-bottom:56.25%; width:100%\"&gt;&lt;iframe style=\"position:absolute; top:0; left:0; width:100%; height:100%;\" src=\"https:\/\/media.flixel.com\/cinemagraph\/tpaqkloxud1mvjq08bfh?hd=false\" frameborder=\"0\" allowfullscreen allow='autoplay'&gt;&lt;\/iframe&gt;&lt;\/div&gt;&lt;\/div&gt;<\/pre>\n<h3 id=\"social\">Social-Media-Content-, Display- oder Canvas-Werbung<\/h3>\n<p>Was sich bewegt, ist interessant. Das gilt mittlerweile f\u00fcr das Posten auf jedem Social-Media-Kanal. Bewegte Bilder eignen sich sowohl f\u00fcr Display- und Canvas-Werbung in Facebook oder Instagram als auch f\u00fcr interessante Inhalte aus Ihrer Content-Strategie. Der Vorteil von solchen Bildern gegen\u00fcber Videos: Die Cinemagraphs werden als etwas schlichter wahrgenommen als Videos, da sich wesentlich weniger gleichzeitig bewegt, was das Auge wahrnehmen muss. Das ist zum einen angenehm f\u00fcrs Auge, zum anderen sehr interessant zu betrachten. Au\u00dferdem sollen Inhalte in sozialen Netzwerken unterhalten \u2013 und erz\u00e4hlen Sie uns jetzt nicht, dass Sie so weit gelesen haben, weil sie die lebenden Bilder nicht spannend finden.<\/p>\n<blockquote class=\"instagram-media\" style=\"background: #FFF; border: 0; border-radius: 3px; box-shadow: 0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width: 540px; min-width: 326px; padding: 0; width: calc(100% - 2px);\" data-instgrm-permalink=\"https:\/\/www.instagram.com\/p\/BbSTEDUgUeK\/?utm_source=ig_embed&amp;utm_medium=loading\" data-instgrm-version=\"12\">\n<div style=\"padding: 16px;\">\n<p>&nbsp;<\/p>\n<div style=\"display: flex; flex-direction: row; align-items: center;\">\n<div style=\"background-color: #f4f4f4; border-radius: 50%; flex-grow: 0; height: 40px; margin-right: 14px; width: 40px;\"><\/div>\n<div style=\"display: flex; flex-direction: column; flex-grow: 1; justify-content: center;\">\n<div style=\"background-color: #f4f4f4; border-radius: 4px; flex-grow: 0; height: 14px; margin-bottom: 6px; width: 100px;\"><\/div>\n<div style=\"background-color: #f4f4f4; border-radius: 4px; flex-grow: 0; height: 14px; width: 60px;\"><\/div>\n<\/div>\n<\/div>\n<div style=\"padding: 19% 0;\"><\/div>\n<div style=\"display: block; height: 50px; margin: 0 auto 12px; width: 50px;\"><\/div>\n<div style=\"padding-top: 8px;\">\n<div style=\"color: #3897f0; font-family: Arial,sans-serif; font-size: 14px; font-style: normal; font-weight: 550; line-height: 18px;\">Sieh dir diesen Beitrag auf Instagram an<\/div>\n<\/div>\n<div style=\"padding: 12.5% 0;\"><\/div>\n<div style=\"display: flex; flex-direction: row; margin-bottom: 14px; align-items: center;\">\n<div>\n<div style=\"background-color: #f4f4f4; border-radius: 50%; height: 12.5px; width: 12.5px; transform: translateX(0px) translateY(7px);\"><\/div>\n<div style=\"background-color: #f4f4f4; height: 12.5px; transform: rotate(-45deg) translateX(3px) translateY(1px); width: 12.5px; flex-grow: 0; margin-right: 14px; margin-left: 2px;\"><\/div>\n<div style=\"background-color: #f4f4f4; border-radius: 50%; height: 12.5px; width: 12.5px; transform: translateX(9px) translateY(-18px);\"><\/div>\n<\/div>\n<div style=\"margin-left: 8px;\">\n<div style=\"background-color: #f4f4f4; border-radius: 50%; flex-grow: 0; height: 20px; width: 20px;\"><\/div>\n<div style=\"width: 0; height: 0; border-top: 2px solid transparent; border-left: 6px solid #f4f4f4; border-bottom: 2px solid transparent; transform: translateX(16px) translateY(-4px) rotate(30deg);\"><\/div>\n<\/div>\n<div style=\"margin-left: auto;\">\n<div style=\"width: 0px; border-top: 8px solid #F4F4F4; border-right: 8px solid transparent; transform: translateY(16px);\"><\/div>\n<div style=\"background-color: #f4f4f4; flex-grow: 0; height: 12px; width: 16px; transform: translateY(-4px);\"><\/div>\n<div style=\"width: 0; height: 0; border-top: 8px solid #F4F4F4; border-left: 8px solid transparent; transform: translateY(-4px) translateX(8px);\"><\/div>\n<\/div>\n<\/div>\n<div style=\"display: flex; flex-direction: column; flex-grow: 1; justify-content: center; margin-bottom: 24px;\">\n<div style=\"background-color: #f4f4f4; border-radius: 4px; flex-grow: 0; height: 14px; margin-bottom: 6px; width: 224px;\"><\/div>\n<div style=\"background-color: #f4f4f4; border-radius: 4px; flex-grow: 0; height: 14px; width: 144px;\"><\/div>\n<\/div>\n<p>&nbsp;<\/p>\n<p style=\"color: #c9c8cd; font-family: Arial,sans-serif; font-size: 14px; line-height: 17px; margin-bottom: 0; margin-top: 8px; overflow: hidden; padding: 8px 0 7px; text-align: center; text-overflow: ellipsis; white-space: nowrap;\"><a style=\"color: #c9c8cd; font-family: Arial,sans-serif; font-size: 14px; font-style: normal; font-weight: normal; line-height: 17px; text-decoration: none;\" href=\"https:\/\/www.instagram.com\/p\/BbSTEDUgUeK\/?utm_source=ig_embed&amp;utm_medium=loading\" target=\"_blank\" rel=\"noopener noreferrer\">Ein Beitrag geteilt von Coca-Cola (@cocacolaeu)<\/a> am <time style=\"font-family: Arial,sans-serif; font-size: 14px; line-height: 17px;\" datetime=\"2017-11-09T19:16:59+00:00\">Nov 9, 2017 um 11:16 PST<\/time><\/p>\n<\/div>\n<\/blockquote>\n<p><script async defer src=\"\/\/www.instagram.com\/embed.js\"><\/script><\/p>\n<p><strong>Technische Einbindung:\u00a0<\/strong>Mit der Autoplay-Funktion von Facebook, Instagram und Co. starten Videos oder eben animierte Bilder ohne extra Klick auf das Foto. Mittlerweile k\u00f6nnen auch Profilbilder oder Werbeanzeigen auf Facebook mit bewegten Bildern eingestellt werden. Die Wiedergabe der Cinemagraphs ist auch auf neueren mobilen Ger\u00e4ten kein Problem. Stellen Sie aber unbedingt sicher, dass Ihr Bild im Loop abgespielt wird, damit der Bewegungseffekt des Motivs auch deutlich wird. Ist das animierte Bild nur drei Sekunden lang, so wird dem Betrachter nichts auffallen k\u00f6nnen.<\/p>\n<h3 id=\"news\">Newsletter<\/h3>\n<p>Auch auf diesem Gebiet sind bewegte Bilder sehr bereichernd. Der Seriengigant Netflix hat zum Beispiel zum Start der 3. Staffel von \u201eHouse of Cards\u201c ein solches im Newsletter platziert. Somit ist die Wahrscheinlichkeit gr\u00f6\u00dfer, dass sich die Leser an den Staffelstart erinnern und viele auf den Trailer klicken.<\/p>\n<div class=\"flx-embed\">\n<div style=\"position: relative; height: 0; padding-bottom: 114.94%; width: 100%;\"><iframe style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%;\" src=\"https:\/\/media.flixel.com\/cinemagraph\/f8yz1tdwi0jtppyq7oio?hd=false\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n<\/div>\n<p><span style=\"font-size: 8pt;\"><em>Quelle: blog.flixel.com<\/em><\/span><\/p>\n<p><strong>Technische Einbindung:<\/strong> Wenn das Bild in einen Newsletter eingebunden werden soll, kann in Ausnahmef\u00e4llen (auch wenn es eigentlich vermieden werden soll) das Umwandeln in ein GIF-Format helfen, die Dateigr\u00f6\u00dfe klein zu halten. Das GIF kann normal \u00fcber den Einbettungscode von Bildern integriert werden und die Dateigr\u00f6\u00dfe w\u00fcrde ein langes Laden der Newsletterinhalte vermeiden. Allerdings sollte unbedingt darauf geachtet werden, dass der Qualit\u00e4tsverlust nicht zu gro\u00df ist und das animierte Bild trotzdem noch qualitativ hochwertig aussieht.<\/p>\n<p>Beispielcode zum Einbetten eines bewegten Bildes im Newsletter (abgespeichert als GIF):<\/p>\n<div class=\"custom-background-grey\">\n<p>&lt;img src=\u201cXXXXX.gif\u201c width=\u201c600\u201c height=\u201c340\u201c alt=\u201cxx\u201c border=\u201c0\u201c hspace=\u201c0\u201c vspace=\u201c0\u201c&gt;<\/p>\n<\/div>\n<p>Wird das Bild als Video mit wesentlich mehr Farben und damit h\u00f6herer Dateigr\u00f6\u00dfe eingebettet, sollte unbedingt vorher getestet werden, ob das animierte Bild die Performance der Inhalte beim \u00d6ffnen des Newsletters beeintr\u00e4chtigt \u2013 sowohl in der Variante f\u00fcr den Desktop als auch f\u00fcr mobile Ger\u00e4te.<\/p>\n<h2 id=\"tools\">Bewegte Bilder selbst erstellen: Tool-Check<\/h2>\n<p>Um ein Bild zum Leben zu erwecken, braucht es ein gutes Auge und je nach Tool eine konstante Internetverbindung. Einige Tools bieten n\u00e4mlich sogar eine Online-Bearbeitung an. Je nach Tool ist als Ausgangsmaterial ein Bild oder aber ein Video n\u00f6tig.<\/p>\n<h3 id=\"plotagraph\">Plotagraph<\/h3>\n<p>Bei diesem Anbieter ist es im Gegensatz zu den anderen Tools m\u00f6glich, anhand einer Bilddatei ein bewegtes Bild zu erstellen. Bilder k\u00f6nnen hier auch online bearbeitet werden. Bei Plotagraph, genauer genommen \u201ePlotaverse\u201c, kann man sich kostenlos registrieren, um einen ersten Eindruck vom Tool zu bekommen. Die Bearbeitung geht hier sehr schnell, zumindest muss hierf\u00fcr nicht viel im Voraus produziert werden. Es muss nur ein geeignetes Bild aufgenommen oder ausgesucht und in das Tool geladen werden. Mithilfe eines Pinsels kann im Editor festgelegt werden, welche Teile im Bild starr bleiben sollen.<\/p>\n<figure id=\"attachment_14696\" aria-describedby=\"caption-attachment-14696\" style=\"width: 696px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"td-modal-image wp-image-14696 size-large\" src=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-1-1024x498.png\" alt=\"Eine rustikale Holzscheune steht unter einem dramatischen, wolkigen Himmel. Der Vordergrund ist mit einem roten Farbton bearbeitet, der einen Kontrast zu den dunklen Wolken bildet. Die Software Plotagraph verwandelt die Szene in bewegte Bilder und verleiht ihr mit auf dem Bildschirm sichtbaren Bearbeitungswerkzeugen Bewegung.\" width=\"696\" height=\"338\" srcset=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-1-1024x498.png 1024w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-1-300x146.png 300w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-1-768x373.png 768w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-1-696x338.png 696w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-1-1068x519.png 1068w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-1-864x420.png 864w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-1.png 1886w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/a><figcaption id=\"caption-attachment-14696\" class=\"wp-caption-text\">Screenshot der Maskierung in Plotagraph<\/figcaption><\/figure>\n<p>Durch Pfeile (orange und blau) k\u00f6nnen Sie festlegen, welche Richtung die Bildpixel in der sp\u00e4teren Bewegung einnehmen sollen. Sogenannte \u201eStabilisatoren\u201c helfen bei der genaueren Definition der Animation im Bild. In diesem Beispiel wurden bewusst Stabilisatoren im Wolkenhimmel gesetzt, um eine differenziertere Bewegung der Wolken zu erzielen.<\/p>\n<figure id=\"attachment_14697\" aria-describedby=\"caption-attachment-14697\" style=\"width: 696px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-2.png\"><img loading=\"lazy\" decoding=\"async\" class=\"td-modal-image wp-image-14697 size-large\" src=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-2-1024x498.png\" alt=\"Eine Holzscheune steht auf einer Wiese unter einem dramatischen, bew\u00f6lkten Himmel. Mithilfe der Bewegte-Bilder-Techniken und den Overlay-Tools, Animationspunkten und Einstellungen der Plotagraph-Software entsteht ein dynamischer Effekt auf den Wolken.\" width=\"696\" height=\"338\" srcset=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-2-1024x498.png 1024w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-2-300x146.png 300w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-2-768x373.png 768w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-2-696x338.png 696w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-2-1068x519.png 1068w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-2-864x420.png 864w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Plotagraph-2.png 1886w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/a><figcaption id=\"caption-attachment-14697\" class=\"wp-caption-text\">Screenshot der weiteren Bearbeitung in Plotagraph<\/figcaption><\/figure>\n<p>Die Bewegung der Bildpixel wird vom Tool automatisch berechnet. Zus\u00e4tzlich k\u00f6nnen Sie aber die automatisch berechnete Bewegung zeitlich beeinflussen. Umso k\u00fcrzer Sie die Dauer des animierten Bildes einstellen, umso schneller bewegen sich die definierten Bildpunkte. Abschlie\u00dfend kann das Projekt exportiert werden. Bezahlt man die Pro-Version nicht, erh\u00e4lt man eine MP4-Datei, die ein Wasserzeichen enth\u00e4lt. In der bezahlten Version stehen die Formate MOV, JPEG seg, PNG seq, animated PNG und GIF zur Auswahl.<br \/>\nDer Vorteil an diesem Tool ist unter anderem, dass Sie die Bearbeitung jederzeit \u00fcber den Play-Button unten in der Mitte \u00fcberpr\u00fcfen k\u00f6nnen, da das Bild mit Klick auf den Button in Endlosschleife abgespielt wird. So fallen schnell Ungereimtheiten und unnat\u00fcrliche Bewegungen auf.<\/p>\n<div style=\"width: 696px;\" class=\"wp-video\"><!--[if lt IE 9]><script>document.createElement('video');<\/script><![endif]-->\n<video class=\"wp-video-shortcode\" id=\"video-14689-1\" width=\"696\" height=\"463\" loop=\"1\" autoplay=\"1\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/www.diedruckerei.de\/magazin\/wp-content\/uploads\/2018\/09\/H\u00fctte-1200px-30fps.mp4?_=1\" \/><a href=\"https:\/\/www.diedruckerei.de\/magazin\/wp-content\/uploads\/2018\/09\/H\u00fctte-1200px-30fps.mp4\">https:\/\/www.diedruckerei.de\/magazin\/wp-content\/uploads\/2018\/09\/H\u00fctte-1200px-30fps.mp4<\/a><\/video><\/div>\n<p><strong>Fazit:<\/strong> Die Online-Anwendung ist auch auf dem Smartphone sehr performant. Entscheidet man sich f\u00fcr den Kauf der Pro-Version ist es durchaus sinnvoll, die Desktop-Version der Anwendung herunterzuladen. Das Tool kann allerdings nicht jedes Bild auf nat\u00fcrliche Weise zum Leben erwecken, da die genaue Bewegung der einzelnen Bildpunkte nicht ganz exakt beeinflusst werden kann.<\/p>\n<p>Sp\u00e4testens wenn sich Elemente wie Sonnenstrahlen im Vordergrund bewegen sollen, w\u00e4hrend der Hintergrund wie eine Bergkulisse starr bleiben sollen, st\u00f6\u00dft man an die Grenzen des Tools. Lassen sich jedoch Vorder- und Hintergrundbewegung klar im Bild unterteilen (wie Meer und Himmel zum Beispiel), so lassen sich mit Plotagraph sehr schnell bewegte Bilder erstellen. Und das mit nur einem Foto als Ausgangsmaterial. Flie\u00dfende Motive wie Wolken, das Meer oder reine Grafiken bieten sich gut f\u00fcr dieses Tool an.<\/p>\n<h3 id=\"flixel\">Flixel<\/h3>\n<p>Das Programm <a href=\"https:\/\/flixel.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Cinemapraph Pro von Flixel<\/a> ist speziell auf die Erstellung von Cinemagraphs ausgelegt. Auch hier hat man die M\u00f6glichkeit, das Tool zuerst kostenlos zu testen. Der gr\u00f6\u00dfte und wichtigste Unterschied zu Plotagraph ist, dass hier mit Videomaterial gearbeitet wird. Das bedeutet, die Bewegungen im Bild erscheinen wesentlich nat\u00fcrlicher, da es echte Bewegungen sind, die zu sehen sind. Im Voraus muss allerdings das Video nach bestimmten Bedingungen aufgenommen werden.<\/p>\n<p>F\u00fcr das bewegte Bild muss ein Video mit Stativ aufgenommen werden. Die R\u00e4nder des Videos sollten sich n\u00e4mlich nicht \u00e4ndern, sondern nur die Models oder das Motiv im Bild. Ihrer Kreativit\u00e4t sind keine Grenzen gesetzt, wenn es darum geht, was sich nun am Ende im Bild bewegen soll. Bevor Sie das Video aufnehmen, sollten Sie aber schon vor Augen haben, was Sie in Ihrem Cinemagraph umsetzen m\u00f6chten. Dementsprechend m\u00fcssen Sie Models Anweisungen geben oder die Kamera in entsprechenden Umgebungen positionieren.<\/p>\n<p>Im Anf\u00e4ngertutorial von Flixel soll eine Teeszene zum Leben erweckt werden, in der der Herr links an der Tasse nippt und die Dame rechts Tee einschenkt.<\/p>\n<figure id=\"attachment_14692\" aria-describedby=\"caption-attachment-14692\" style=\"width: 696px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"td-modal-image wp-image-14692 size-large\" src=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-1-1024x576.png\" alt=\"Ein Mann und eine Frau sitzen in einem gem\u00fctlichen Wohnzimmer und genie\u00dfen Tee. Die Frau schenkt aus einer Glaskanne Tee ein, die auf einem runden Tisch mit Snacks steht, w\u00e4hrend der Mann vorsichtig nippt. Im Hintergrund werfen das flackernde Kaminfeuer und die Kerzen bewegte Bilder, die warm an den W\u00e4nden entlangtanzen.\" width=\"696\" height=\"392\" srcset=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-1-1024x576.png 1024w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-1-300x169.png 300w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-1-768x432.png 768w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-1-696x392.png 696w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-1-1068x601.png 1068w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-1-747x420.png 747w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-1.png 1920w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/a><figcaption id=\"caption-attachment-14692\" class=\"wp-caption-text\">Auswahl eines Videoabschnitts in Cinemagraph Pro<\/figcaption><\/figure>\n<p>Wenn nun also das aufgenommene Video in Cinemapraph Pro hochgeladen wird, m\u00fcssen Sie zuerst einen kurzen Abschnitt im Video bestimmen und innerhalb davon ein Standbild definieren. Dieses Standbild ist das Ausgangsmaterial f\u00fcr das Cinemagraph.<\/p>\n<p>Im n\u00e4chsten Schritt wird maskiert. Das hei\u00dft, dass Sie mit einem Pinsel im ausgew\u00e4hlten Standbild all die Bereiche kennzeichnen m\u00fcssen, die sich sp\u00e4ter bewegen sollen.<\/p>\n<figure id=\"attachment_14693\" aria-describedby=\"caption-attachment-14693\" style=\"width: 696px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-2.png\"><img loading=\"lazy\" decoding=\"async\" class=\"td-modal-image wp-image-14693 size-large\" src=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-2-1024x555.png\" alt=\"Ein Mann und eine Frau sitzen auf St\u00fchlen um einen kleinen Tisch. Die Frau schenkt Tee aus einem Wasserkocher ein, w\u00e4hrend der Mann aus einer Tasse nippt \u2013 eine Szene, die Bewegte Bilder w\u00fcrdig ist. Ein gem\u00fctlicher Kamin mit Kerzen sorgt f\u00fcr W\u00e4rme, w\u00e4hrend die Benutzeroberfl\u00e4che der Bildbearbeitungssoftware dieses fesselnde Bild umgibt.\" width=\"696\" height=\"377\" srcset=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-2-1024x555.png 1024w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-2-300x163.png 300w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-2-768x416.png 768w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-2-696x377.png 696w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-2-1068x579.png 1068w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-2-775x420.png 775w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Flixel-2.png 1920w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/a><figcaption id=\"caption-attachment-14693\" class=\"wp-caption-text\">Maskierung der Bereiche, die sich sp\u00e4ter bewegen sollen<\/figcaption><\/figure>\n<p>Mithilfe der eben erstellten Maske schimmert nun an all jenen Stellen der zuvor bestimmte Videoabschnitt durch, \u00fcber die Sie mit dem Pinsel gefahren sind. Im restlichen Bild ist das ausgew\u00e4hlte Standbild zu sehen ist.<\/p>\n<p>Damit die Bewegung im Bild fl\u00fcssig ist, sollte der Videoabschnitt sorgsam ausgew\u00e4hlt werden. \u00dcber die Einstellungsm\u00f6glichkeiten \u201eBounce\u201c oder \u201eRepeat\u201c kann das Video hinter dem Standbild entweder vorw\u00e4rts, r\u00fcckw\u00e4rts und wieder vorw\u00e4rts oder immer wieder von vorne abgespielt werden. Die Wiederholungsdauer kann ebenfalls definiert werden.<\/p>\n<p><strong>Fazit:<\/strong> Hier kommt es also auf die perfekte Abstimmung von Videomaterial, ausgew\u00e4hltem Videoabschnitt und dem dazugeh\u00f6rigen Standbild. Das Programm ist sehr \u00fcbersichtlich gestaltet und mit allen n\u00f6tigen Werkzeugen zur Bearbeitung ausgestattet. Besonders die Export-Optionen erm\u00f6glichen es, das Cinemagraph optimal f\u00fcr soziale Medien oder sogar Facebook Ads vorzubereiten. Mit Cinemagraphs Pro lassen sich wirklich realistisch bewegte Bilder erzeugen, ohne dass man bei der Bearbeitung von zu vielen Funktionen erschlagen wird. M\u00f6chte man bewegte Bilder professionell nutzen, sehen wir das Tool als rentable Option.<\/p>\n<h3 id=\"photoshop\">Adobe Photoshop<\/h3>\n<p>Verf\u00fcgen Sie bereits \u00fcber die Creative Suite, m\u00fcssen Sie f\u00fcr bewegte Bilder nicht unbedingt ein Extra-Programm anschaffen. Diese lassen sich auch mit Photoshop C6 oder einer j\u00fcngeren Version erstellen. Hierbei muss nur teilweise etwas \u201egetrickst\u201c werden, da Photoshop eigentlich nicht auf Videobearbeitung ausgelegt ist.<\/p>\n<p>Doch seit Photoshop C6 k\u00f6nnen auch Videos ge\u00f6ffnet werden und eine Zeitleiste erscheint unten im Programm. Der Mediendesigner DomQuichotte, bekannt durch seine Tutorials auf fx-ray.com, zeigt in einem <a href=\"https:\/\/blogs.adobe.com\/creative\/de\/bewegte-bilder-so-entstehen-cinemagraphs\/\" target=\"_blank\" rel=\"noopener noreferrer\">Tutorial f\u00fcr Adobe<\/a> sehr anschaulich, wie man schnell zu einem bewegten Bild in Photoshop kommt. In Kurzform geht es darum (\u00e4hnlich wie beim Flixel-Programm Cinemapraph Pro) ein passendes Video aufzunehmen und einen geeigneten kurzen Ausschnitt zu definieren. Wenn Sie diesen Ausschnitt ausgew\u00e4hlt haben, k\u00f6nnen Sie ein Standbild daraus herauskopieren. Das Zauberwort hei\u00dft nun \u201eEbenenmasken\u201c. Mithilfe von Ebenenmasken k\u00f6nnen Sie jetzt n\u00e4mlich in diesem Standbild definieren, an welchen Stellen das darunterliegende Video zu sehen sein soll. Denn die Ebenen\u00fcberlagerung mit Videodateien funktioniert in Photoshop ebenso wie mit Bildebenen. Somit ist vorrangig immer das Bild zu sehen und nur an ausgew\u00e4hlten Stellen das Video darunter.<\/p>\n<figure id=\"attachment_14698\" aria-describedby=\"caption-attachment-14698\" style=\"width: 696px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/PS-Tutorial.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"td-modal-image wp-image-14698 size-large\" src=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/PS-Tutorial-1024x543.jpg\" alt=\"Ein Mann pr\u00e4sentiert auf der B\u00fchne eine Demo einer Bildbearbeitungssoftware. Auf dem Bildschirm sind Bewegte Bilder zu sehen \u2013 ein dynamisches Programm, das das Foto einer Person im Kleid vor einer ruhigen Wiese am Meer optimiert. Im Hintergrund ist ein sich wiederholendes Logomuster zu sehen.\" width=\"696\" height=\"369\" srcset=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/PS-Tutorial-1024x543.jpg 1024w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/PS-Tutorial-300x159.jpg 300w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/PS-Tutorial-768x407.jpg 768w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/PS-Tutorial-696x369.jpg 696w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/PS-Tutorial-1068x566.jpg 1068w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/PS-Tutorial-792x420.jpg 792w, https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/PS-Tutorial.jpg 1273w\" sizes=\"(max-width: 696px) 100vw, 696px\" \/><\/a><figcaption id=\"caption-attachment-14698\" class=\"wp-caption-text\">Screenshot aus dem Tutorial von\u00a0DomQuichotte, Quelle: blogs.adobe.com<\/figcaption><\/figure>\n<p>Der Vorteil von der Bearbeitung in Photoshop: Wenn Sie das ausgew\u00e4hlte Standbild in ein Smartobjekt konvertieren, haben Sie hier weiterhin alle M\u00f6glichkeiten der Bildbearbeitung. Ob RAW-Filter oder andere Anwendungen \u2013 Ihr bewegtes Bild k\u00f6nnen Sie nach dem gleichen Schema bearbeiten, wie Sie auch Ihre anderen Produkt- oder Shootingbilder bearbeiten w\u00fcrden.<\/p>\n<div class=\"custom-background-grey\">\n<p>Interessant: In Photoshop lassen sich aber nicht nur Videos zu einem bewegten Bild zaubern. Auch ein reines Foto l\u00e4sst sich mit Hilfe der Zeitleiste so bearbeiten, dass es sich sp\u00e4ter bewegt. Allerdings ist diese Methode etwas unflexibler, da man versucht durch Maskieren und Transformieren (zum Beispiel Vergr\u00f6\u00dfern) eine Bewegung zu simulieren. Hier funktionieren \u2013 wie auch bei <a href=\"#plotagraph\">Plotagraph<\/a> \u2013 wieder eher flie\u00dfende Motive, wie etwa Wolken oder Wasser.<\/p>\n<\/div>\n<p><strong><br \/>\nFazit:<\/strong> Wenn Sie fit in Photoshop sind oder noch besser bereits mit der Zeitleiste im Programm vertraut sind, wird Ihnen diese Variante der Bearbeitung am leichtesten fallen. Denn neben der Erstellung des bewegten Bildes k\u00f6nnen Sie wie beschrieben alle n\u00f6tigen Retusche- und Filter-Bearbeitungen am Bild anwenden. So m\u00fcssten Sie kein neues Programm anschaffen und bleiben flexibel.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Wir widmen uns einem Bildtrend, der unserer Einsch\u00e4tzung nach bald wieder aufbl\u00fchen wird: bewegte Bilder, auch Cinemagraphs genannt. <\/p>\n","protected":false},"author":24,"featured_media":14691,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9,47],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Bewegende Bilder erstellen: Tolle Effekte dank Cinemagraphs<\/title>\n<meta name=\"description\" content=\"Bewegte Bilder wie Cinemagraphs sind ein Bildtrend, der bald wieder aufbl\u00fchen k\u00f6nnte. Das m\u00fcssen Sie bei der Erstellung und beim Marketingeinsatz beachten.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Bewegte Bilder erstellen und erfolgreich damit werben: Cinemagraphs\" \/>\n<meta property=\"og:description\" content=\"So erstellst du sie und wirbst erfolgreich damit.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/\" \/>\n<meta property=\"og:site_name\" content=\"onlineprinters.ch Magazin\" \/>\n<meta property=\"article:published_time\" content=\"2018-10-02T09:00:55+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-29T07:00:09+00:00\" \/>\n<meta name=\"author\" content=\"Ramona\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:title\" content=\"Bewegte Bilder erstellen und erfolgreich damit werben: Cinemagraphs\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Beitragsbild_bewegte-Bilder.jpg\" \/>\n<meta name=\"twitter:label1\" content=\"Verfasst von\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ramona\" \/>\n\t<meta name=\"twitter:label2\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data2\" content=\"13 Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/\",\"url\":\"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/\",\"name\":\"Bewegende Bilder erstellen: Tolle Effekte dank Cinemagraphs\",\"isPartOf\":{\"@id\":\"https:\/\/de.onlineprinters.ch\/magazin\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Beitragsbild_bewegte-Bilder.jpg\",\"datePublished\":\"2018-10-02T09:00:55+00:00\",\"dateModified\":\"2025-04-29T07:00:09+00:00\",\"author\":{\"@id\":\"https:\/\/de.onlineprinters.ch\/magazin\/#\/schema\/person\/d79ba2db96e33e04ed71525f52bb1eb9\"},\"description\":\"Bewegte Bilder wie Cinemagraphs sind ein Bildtrend, der bald wieder aufbl\u00fchen k\u00f6nnte. Das m\u00fcssen Sie bei der Erstellung und beim Marketingeinsatz beachten.\",\"inLanguage\":\"de-DE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de-DE\",\"@id\":\"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/#primaryimage\",\"url\":\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Beitragsbild_bewegte-Bilder.jpg\",\"contentUrl\":\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Beitragsbild_bewegte-Bilder.jpg\",\"width\":1068,\"height\":580,\"caption\":\"Bewegte Bilder\"},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/de.onlineprinters.ch\/magazin\/#website\",\"url\":\"https:\/\/de.onlineprinters.ch\/magazin\/\",\"name\":\"onlineprinters.ch Magazin\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/de.onlineprinters.ch\/magazin\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de-DE\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/de.onlineprinters.ch\/magazin\/#\/schema\/person\/d79ba2db96e33e04ed71525f52bb1eb9\",\"name\":\"Ramona\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de-DE\",\"@id\":\"https:\/\/de.onlineprinters.ch\/magazin\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2017\/10\/Blogbild-3-150x150.png\",\"contentUrl\":\"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2017\/10\/Blogbild-3-150x150.png\",\"caption\":\"Ramona\"},\"description\":\"H\u00e4tte, h\u00e4tte, Fahrradkette \u2013 ich bin ein Fan davon die Dinge konsequent anzupacken und versuche weniger verpassten Gelegenheiten nachzuh\u00e4ngen. Jeden Tag \u00f6ffnen sich neue T\u00fcren und in unserer schnelllebigen Zeit der selbstf\u00fcllenden K\u00fchlschr\u00e4nke, Next-day-deliverys und twitternden Pr\u00e4sidenten sind das jede Menge. Nach meinem Studium der Medienkommunikation habe ich mich vor allem den spannenden Entwicklungen des Online Marketings verschrieben. In meinen Artikeln m\u00f6chte ich die neuen Trends und Inspirationen auf diesem Gebiet so lebhaft und praxisnah wie m\u00f6glich an die Leser weitergeben.\",\"url\":\"https:\/\/de.onlineprinters.ch\/magazin\/author\/ramona\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Bewegende Bilder erstellen: Tolle Effekte dank Cinemagraphs","description":"Bewegte Bilder wie Cinemagraphs sind ein Bildtrend, der bald wieder aufbl\u00fchen k\u00f6nnte. Das m\u00fcssen Sie bei der Erstellung und beim Marketingeinsatz beachten.","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:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/","og_locale":"de_DE","og_type":"article","og_title":"Bewegte Bilder erstellen und erfolgreich damit werben: Cinemagraphs","og_description":"So erstellst du sie und wirbst erfolgreich damit.","og_url":"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/","og_site_name":"onlineprinters.ch Magazin","article_published_time":"2018-10-02T09:00:55+00:00","article_modified_time":"2025-04-29T07:00:09+00:00","author":"Ramona","twitter_card":"summary_large_image","twitter_title":"Bewegte Bilder erstellen und erfolgreich damit werben: Cinemagraphs","twitter_image":"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Beitragsbild_bewegte-Bilder.jpg","twitter_misc":{"Verfasst von":"Ramona","Gesch\u00e4tzte Lesezeit":"13 Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/","url":"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/","name":"Bewegende Bilder erstellen: Tolle Effekte dank Cinemagraphs","isPartOf":{"@id":"https:\/\/de.onlineprinters.ch\/magazin\/#website"},"primaryImageOfPage":{"@id":"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/#primaryimage"},"image":{"@id":"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/#primaryimage"},"thumbnailUrl":"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Beitragsbild_bewegte-Bilder.jpg","datePublished":"2018-10-02T09:00:55+00:00","dateModified":"2025-04-29T07:00:09+00:00","author":{"@id":"https:\/\/de.onlineprinters.ch\/magazin\/#\/schema\/person\/d79ba2db96e33e04ed71525f52bb1eb9"},"description":"Bewegte Bilder wie Cinemagraphs sind ein Bildtrend, der bald wieder aufbl\u00fchen k\u00f6nnte. Das m\u00fcssen Sie bei der Erstellung und beim Marketingeinsatz beachten.","inLanguage":"de-DE","potentialAction":[{"@type":"ReadAction","target":["https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/"]}]},{"@type":"ImageObject","inLanguage":"de-DE","@id":"https:\/\/de.onlineprinters.ch\/magazin\/bewegte-bilder-cinemagraphs\/#primaryimage","url":"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Beitragsbild_bewegte-Bilder.jpg","contentUrl":"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2018\/10\/Beitragsbild_bewegte-Bilder.jpg","width":1068,"height":580,"caption":"Bewegte Bilder"},{"@type":"WebSite","@id":"https:\/\/de.onlineprinters.ch\/magazin\/#website","url":"https:\/\/de.onlineprinters.ch\/magazin\/","name":"onlineprinters.ch Magazin","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/de.onlineprinters.ch\/magazin\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de-DE"},{"@type":"Person","@id":"https:\/\/de.onlineprinters.ch\/magazin\/#\/schema\/person\/d79ba2db96e33e04ed71525f52bb1eb9","name":"Ramona","image":{"@type":"ImageObject","inLanguage":"de-DE","@id":"https:\/\/de.onlineprinters.ch\/magazin\/#\/schema\/person\/image\/","url":"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2017\/10\/Blogbild-3-150x150.png","contentUrl":"https:\/\/de.onlineprinters.ch\/magazin\/wp-content\/uploads\/2017\/10\/Blogbild-3-150x150.png","caption":"Ramona"},"description":"H\u00e4tte, h\u00e4tte, Fahrradkette \u2013 ich bin ein Fan davon die Dinge konsequent anzupacken und versuche weniger verpassten Gelegenheiten nachzuh\u00e4ngen. Jeden Tag \u00f6ffnen sich neue T\u00fcren und in unserer schnelllebigen Zeit der selbstf\u00fcllenden K\u00fchlschr\u00e4nke, Next-day-deliverys und twitternden Pr\u00e4sidenten sind das jede Menge. Nach meinem Studium der Medienkommunikation habe ich mich vor allem den spannenden Entwicklungen des Online Marketings verschrieben. In meinen Artikeln m\u00f6chte ich die neuen Trends und Inspirationen auf diesem Gebiet so lebhaft und praxisnah wie m\u00f6glich an die Leser weitergeben.","url":"https:\/\/de.onlineprinters.ch\/magazin\/author\/ramona\/"}]}},"_links":{"self":[{"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/posts\/14689"}],"collection":[{"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/users\/24"}],"replies":[{"embeddable":true,"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/comments?post=14689"}],"version-history":[{"count":8,"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/posts\/14689\/revisions"}],"predecessor-version":[{"id":42027,"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/posts\/14689\/revisions\/42027"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/media\/14691"}],"wp:attachment":[{"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/media?parent=14689"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/categories?post=14689"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/de.onlineprinters.ch\/magazin\/wp-json\/wp\/v2\/tags?post=14689"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}