{"id":7318,"date":"2012-06-04T12:12:56","date_gmt":"2012-06-04T10:12:56","guid":{"rendered":"http:\/\/flaven.fr\/?p=7318"},"modified":"2012-06-04T12:12:56","modified_gmt":"2012-06-04T10:12:56","slug":"ajouter-un-effet-dentree-et-un-effet-de-sortie","status":"publish","type":"post","link":"https:\/\/flaven.fr\/2012\/06\/ajouter-un-effet-dentree-et-un-effet-de-sortie\/","title":{"rendered":"Ajouter un effet d&#8217;entr\u00e9e et un effet de sortie"},"content":{"rendered":"<p><!-- 3WDOC - Aide - Management des effets - Ajouter un effet d'entr\u00e9e et un effet de sortie  --><\/p>\n<p><!-- effets, timeline, effet d'entr\u00e9e, effet de sortie, \u00c9v\u00e9nement, HTML5, \u00e9v\u00e9nement, apparition, show, jQuery, rich-media, Cloud, webdoc, s\u00e9quence, m\u00e9dias, 3WDOC, compte, action, l'article, audio, nuage, codec, CSS, CSS3, domaine, HTML5, Jquery, m\u00e9dias, mp4, Photos, SEO, diaporama, style, jQuery --><\/p>\n<p>Un des \u00e9l\u00e9ments essentiels du webdesign et de l&#8217;exp\u00e9rience utilisateur con\u00e7us avec 3WDOC est la possibilit\u00e9 d&#8217;ajouter des effets sur les nombreux m\u00e9dias qui composent votre cr\u00e9ation. Il s&#8217;agit notamment des effets d&#8217;entr\u00e9e et des effets de sortie qui d\u00e9finissent l&#8217;apparition et la disparition d&#8217;un \u00e9l\u00e9ment dans votre <code>timeline<\/code>. <\/p>\n<p><b>Dans cette exemple, nous allons attacher un effet d&#8217;entr\u00e9e \u00e0 une piste <code>article<\/code>. Evidemment, les effets peuvent \u00eatre affect\u00e9s \u00e0 d&#8217;autres pistes comme des images par exemple. La proc\u00e9dure d&#8217;ajout d&#8217;un effet d&#8217;entr\u00e9e est identique \u00e0 celle d&#8217;ajout d&#8217;un effet de sortie.<\/b><\/p>\n<p><iframe loading=\"lazy\" src=\"http:\/\/player.vimeo.com\/video\/42619938?title=0&amp;portrait=0&amp;color=ff0179\" width=\"960\" height=\"601\" frameborder=\"0\" webkitAllowFullScreen mozallowfullscreen allowFullScreen><\/iframe><\/p>\n<p><b>En s\u00e9lectionnant la piste <code>article<\/code> via le <code>player<\/code>, on acc\u00e8de ensuite aux diff\u00e9rents onglets de param\u00e9trage de cette piste. Il suffit ensuite de se placer sur l&#8217;onglet <code>Effet<\/code>, puis on clique sur l&#8217;encart <code>EFFET D'ENTR\u00c9E<\/code>. Pour l&#8217;effet de sortie, il suffirait alors de cliquer sur l&#8217;encart <code>EFFET DE SORTIE<\/code><\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/011_effect_article_1_960.jpg\" title=\"3WDOC - Aide - Management des effets - Ajouter un effet d'entr\u00e9e et un effet de sortie\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/011_effect_article_1_960.jpg\" alt=\"3WDOC - Aide - Management des effets - Ajouter un effet d'entr\u00e9e et un effet de sortie\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>Dans la boite de dialogue, 3WDOC a mis \u00e0 disposition un certain nombre d&#8217;effets jQuery. Ces effets sont disponibles dans le menu d\u00e9roulant. En s\u00e9lectionnant un effet, vous allez faire apparaitre tous les param\u00e8tres propres \u00e0 l&#8217;effet. Dans notre exemple, nous choisissons l&#8217;effet <code>drop<\/code><\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/011_effect_article_2_960.jpg\" title=\"3WDOC - Aide - Management des effets - Ajouter un effet d'entr\u00e9e et un effet de sortie\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/011_effect_article_2_960.jpg\" alt=\"3WDOC - Aide - Management des effets - Ajouter un effet d'entr\u00e9e et un effet de sortie\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>Une fois le choix effectu\u00e9, il reste \u00e0 choisir les param\u00e8tres de cet effet : la dur\u00e9e et les autres caract\u00e9ristiques propres \u00e0 l&#8217;effet. Attention, la dur\u00e9e d&#8217;un effet s&#8217;exprime toujours en millisecondes (ms). Il est possible de simuler directement dans la boite de dialogue, le r\u00e9sultat de l&#8217;effet choisi. En cliquant sur le bouton <code>S\u00e9lectionner<\/code>, vous affectez cette effet d&#8217;entr\u00e9e \u00e0 la piste.<\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/011_effect_article_3_960.jpg\" title=\"3WDOC - Aide - Management des effets - Ajouter un effet d'entr\u00e9e et un effet de sortie\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/011_effect_article_3_960.jpg\" alt=\"3WDOC - Aide - Management des effets - Ajouter un effet d'entr\u00e9e et un effet de sortie\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>Une fois, la boite de dialogue ferm\u00e9e. Les caract\u00e9ristiques de l&#8217;effet d&#8217;entr\u00e9e vous sont rappel\u00e9es dans l&#8217;encart <code>EFFET D'ENTR\u00c9E<\/code>. Lorsque il n&#8217;y pas d&#8217;effet, l&#8217;encart le pr\u00e9cise par la mention <code>none<\/code><\/b><br \/>\n<a href=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/011_effect_article_4_960.jpg\" title=\"3WDOC - Aide - Management des effets - Ajouter un effet d'entr\u00e9e et un effet de sortie\" rel=\"gallery\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter\" src=\"https:\/\/flaven.fr\/wp-content\/uploads\/2012\/05\/011_effect_article_4_960.jpg\" alt=\"3WDOC - Aide - Management des effets - Ajouter un effet d'entr\u00e9e et un effet de sortie\" width=\"960\" height=\"600\" \/><\/a><\/p>\n<p><b>L&#8217;ajout d&#8217;un effet de sortie se fait de la m\u00eame mani\u00e8re, il faut juste \u00e9diter l&#8217;encart <code>EFFET DE SORTIE<\/code><\/b><\/p>\n<p>Le choix des effets et les param\u00e8tres de ces effets vous sont rappel\u00e9s dans les deux encarts au dessus de la <code>timeline<\/code>, l&#8217;un pour l&#8217;effet d&#8217;entr\u00e9e, l&#8217;autre pour l&#8217;effet de sortie. <b>En passant du mode \u00e9diteur au mode player et en jouant votre s\u00e9quence, vous pourrez voir les effets s\u00e9lectionn\u00e9s.<\/b><\/p>\n<h4>Qu&#8217;est-ce que 3WDOC<\/h4>\n<p>En savoir plus sur 3WDOC<\/p>\n<blockquote><p>3WDOC, un outil de montage universel, dont tout le monde peut d\u00e9sormais se servir pour raconter des histoires interactives pour les diffuser partout sur le web, sur tout type de plate-forme mobile ou prochainement sur la TV connect\u00e9e.<\/p>\n<p>3WDOC est une approche r\u00e9volutionnaire pour la communication digitale. Con\u00e7u pour faciliter la cr\u00e9ation de sites et de webdocs d&#8217;excellence, 3WDOC est la meilleure exp\u00e9rience rich-media et interactive possible, pr\u00e9vue pour toutes les audiences : web, mobile et t\u00e9l\u00e9.<\/p><\/blockquote>\n<h2>Plus d&#8217;informations<\/h2>\n<ul>\n<li>INSCRIPCION (Spanish)<br \/>\n<a href=\"http:\/\/app.3wdoc.com\/account\/signup\/es\" target=\"_blank\">http:\/\/app.3wdoc.com\/account\/signup\/es<\/a><\/li>\n<li>INSCRIPTION (French)<br \/>\n<a href=\"http:\/\/app.3wdoc.com\/account\/signup\/fr\" target=\"_blank\">http:\/\/app.3wdoc.com\/account\/signup\/fr<\/a><\/li>\n<li>SIGNUP (English)<br \/>\n<a href=\"http:\/\/app.3wdoc.com\/account\/signup\/en\" target=\"_blank\">http:\/\/app.3wdoc.com\/account\/signup\/en<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Un des \u00e9l\u00e9ments essentiels du webdesign et de l&#8217;exp\u00e9rience utilisateur con\u00e7us avec 3WDOC est la possibilit\u00e9 d&#8217;ajouter des effets sur les nombreux m\u00e9dias qui composent votre cr\u00e9ation.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"bf_ai_meta_description":"Ajouter des effets d'entr\u00e9e et de sortie am\u00e9liore l'exp\u00e9rience utilisateur dans 3WDOC. Ma\u00eetrisez les outils pour des animations fluides.","bf_ai_og_title":"","footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"jetpack_post_was_ever_published":false},"categories":[3433,3451],"tags":[578,502,1651,325,2200,670,1111,209,2245,1142,112,1657,1658,1143,450,2266,2185,2267,799,2190,1645,338,324,1646,154,398,44,1110,1652,606,1130,1660,2263],"class_list":["post-7318","post","type-post","status-publish","format-standard","hentry","category-3wdoc-tutorials","category-web-design-front-end","tag-3wdoc","tag-action","tag-apparition","tag-audio","tag-cloud","tag-codec","tag-compte","tag-css","tag-css3","tag-diaporama","tag-domaine","tag-effet-dentree","tag-effet-de-sortie","tag-effets","tag-evenement","tag-experiences","tag-html5","tag-interactif","tag-interactives","tag-jquery","tag-larticle","tag-medias","tag-mp4","tag-nuage","tag-photos","tag-rich-media","tag-seo","tag-sequence","tag-show","tag-storytelling","tag-style","tag-timeline","tag-webdoc"],"jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p3Vuhl-1U2","jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/posts\/7318","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/comments?post=7318"}],"version-history":[{"count":0,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/posts\/7318\/revisions"}],"wp:attachment":[{"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/media?parent=7318"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/categories?post=7318"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/flaven.fr\/happy-api\/wp\/v2\/tags?post=7318"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}