[{"data":1,"prerenderedAt":490},["ShallowReactive",2],{"navigation_docs_en":3,"-en-touchify-studio-animations-customize":314,"-en-touchify-studio-animations-customize-surround":485},[4,40,116,124,225,253,266],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":6},"Getting Started",false,"/en/getting-started","en/1.getting-started",[10,15,20,25,30,35],{"title":11,"path":12,"stem":13,"icon":14},"Introduction","/en/getting-started/introduction","en/1.getting-started/1.introduction","i-lucide-house",{"title":16,"path":17,"stem":18,"icon":19},"Create a Project","/en/getting-started/create-project","en/1.getting-started/2.create-project","i-lucide-file-plus-2",{"title":21,"path":22,"stem":23,"icon":24},"Studio Interface","/en/getting-started/studio-ui","en/1.getting-started/3.studio-ui","i-lucide-layout-panel-left",{"title":26,"path":27,"stem":28,"icon":29},"Interactive Content","/en/getting-started/create-interactive-content","en/1.getting-started/4.create-interactive-content","i-lucide-fingerprint",{"title":31,"path":32,"stem":33,"icon":34},"Digital Signage","/en/getting-started/create-signage-content","en/1.getting-started/5.create-signage-content","i-lucide-images",{"title":36,"path":37,"stem":38,"icon":39},"Publish and Broadcast","/en/getting-started/publish","en/1.getting-started/6.publish","i-lucide-rss",{"title":41,"path":42,"stem":43,"children":44,"page":6},"Touchify Studio","/en/touchify-studio","en/2.touchify-studio",[45,49,74,97],{"title":11,"path":46,"stem":47,"icon":48},"/en/touchify-studio/introduction","en/2.touchify-studio/1.introduction","i-lucide-home",{"title":50,"path":51,"stem":52,"children":53,"page":6},"Elements","/en/touchify-studio/elements","en/2.touchify-studio/2.elements",[54,59,64,69],{"title":55,"path":56,"stem":57,"icon":58},"Texts","/en/touchify-studio/elements/texts","en/2.touchify-studio/2.elements/1.texts","i-lucide-case-sensitive",{"title":60,"path":61,"stem":62,"icon":63},"Media","/en/touchify-studio/elements/media","en/2.touchify-studio/2.elements/2.media","i-lucide-image-play",{"title":65,"path":66,"stem":67,"icon":68},"Background and Borders","/en/touchify-studio/elements/background-and-borders","en/2.touchify-studio/2.elements/3.background-and-borders","i-lucide-square-dashed-top-solid",{"title":70,"path":71,"stem":72,"icon":73},"Shapes","/en/touchify-studio/elements/drawing","en/2.touchify-studio/2.elements/4.drawing","i-lucide-sparkle",{"title":75,"path":76,"stem":77,"children":78,"page":6},"Interactions","/en/touchify-studio/interactions","en/2.touchify-studio/3.interactions",[79,82,87,92],{"title":11,"path":80,"stem":81,"icon":29},"/en/touchify-studio/interactions/introduction","en/2.touchify-studio/3.interactions/1.introduction",{"title":83,"path":84,"stem":85,"icon":86},"Navigation","/en/touchify-studio/interactions/navigation","en/2.touchify-studio/3.interactions/2.navigation","i-lucide-navigation",{"title":88,"path":89,"stem":90,"icon":91},"Manipulation","/en/touchify-studio/interactions/manipulation","en/2.touchify-studio/3.interactions/3.manipulation","i-lucide-fullscreen",{"title":93,"path":94,"stem":95,"icon":96},"Windows","/en/touchify-studio/interactions/dialogs","en/2.touchify-studio/3.interactions/4.dialogs","i-lucide-message-square-text",{"title":98,"path":99,"stem":100,"children":101,"page":6},"Animations","/en/touchify-studio/animations","en/2.touchify-studio/4.animations",[102,106,111],{"title":11,"path":103,"stem":104,"icon":105},"/en/touchify-studio/animations/introduction","en/2.touchify-studio/4.animations/1.introduction","i-lucide-bring-to-front",{"title":107,"path":108,"stem":109,"icon":110},"Customization","/en/touchify-studio/animations/customize","en/2.touchify-studio/4.animations/2.customize","i-lucide-columns-3-cog",{"title":112,"path":113,"stem":114,"icon":115},"Storyboards","/en/touchify-studio/animations/storyboards","en/2.touchify-studio/4.animations/3.storyboards","i-lucide-clipboard-clock",{"title":117,"path":118,"stem":119,"children":120,"page":6},"Touchify Publisher","/en/touchify-publisher","en/3.touchify-publisher",[121],{"title":11,"path":122,"stem":123,"icon":14},"/en/touchify-publisher/introduction","en/3.touchify-publisher/1.introduction",{"title":125,"path":126,"stem":127,"children":128,"page":6},"Touchify Player","/en/touchify-player","en/4.touchify-player",[129,132,156,215],{"title":11,"path":130,"stem":131,"icon":14},"/en/touchify-player/introduction","en/4.touchify-player/1.introduction",{"title":5,"path":133,"stem":134,"children":135,"page":6},"/en/touchify-player/getting-started","en/4.touchify-player/2.getting-started",[136,141,146,151],{"title":137,"path":138,"stem":139,"icon":140},"The Application","/en/touchify-player/getting-started/application","en/4.touchify-player/2.getting-started/1.application","i-lucide-app-window-mac",{"title":142,"path":143,"stem":144,"icon":145},"Connect","/en/touchify-player/getting-started/connection","en/4.touchify-player/2.getting-started/2.connection","i-lucide-key-round",{"title":147,"path":148,"stem":149,"icon":150},"Home Screen","/en/touchify-player/getting-started/home-screen","en/4.touchify-player/2.getting-started/3.home-screen","i-lucide-grid-2x2",{"title":152,"path":153,"stem":154,"icon":155},"Options","/en/touchify-player/getting-started/settings","en/4.touchify-player/2.getting-started/4.settings","i-lucide-settings",{"title":157,"path":158,"stem":159,"children":160,"page":6},"Installation","/en/touchify-player/installation","en/4.touchify-player/3.installation",[161,166,170,175,180,185,190,195,200,205,210],{"title":162,"path":163,"stem":164,"icon":165},"The Guides","/en/touchify-player/installation/introduction","en/4.touchify-player/3.installation/01.introduction","i-lucide-badge-question-mark",{"title":93,"path":167,"stem":168,"icon":169},"/en/touchify-player/installation/windows","en/4.touchify-player/3.installation/02.windows","i-cib-windows",{"title":171,"path":172,"stem":173,"icon":174},"Android","/en/touchify-player/installation/android","en/4.touchify-player/3.installation/03.android","i-cib-android",{"title":176,"path":177,"stem":178,"icon":179},"ChromeOS","/en/touchify-player/installation/chromeos","en/4.touchify-player/3.installation/04.chromeos","i-cib-google-chrome",{"title":181,"path":182,"stem":183,"icon":184},"Tizen","/en/touchify-player/installation/tizen","en/4.touchify-player/3.installation/05.tizen","i-cib-samsung",{"title":186,"path":187,"stem":188,"icon":189},"BrightSign","/en/touchify-player/installation/brightsign","en/4.touchify-player/3.installation/06.brightsign","i-lucide-cpu",{"title":191,"path":192,"stem":193,"icon":194},"Linux","/en/touchify-player/installation/linux","en/4.touchify-player/3.installation/07.linux","i-cib-linux",{"title":196,"path":197,"stem":198,"icon":199},"macOS","/en/touchify-player/installation/macos","en/4.touchify-player/3.installation/08.macos","i-cib-apple",{"title":201,"path":202,"stem":203,"icon":204},"iOS","/en/touchify-player/installation/ios","en/4.touchify-player/3.installation/09.ios","i-cib-app-store-ios",{"title":206,"path":207,"stem":208,"icon":209},"Android TV","/en/touchify-player/installation/android-tv","en/4.touchify-player/3.installation/10.android-tv","i-lucide-tv",{"title":211,"path":212,"stem":213,"icon":214},"LG webOS","/en/touchify-player/installation/webos","en/4.touchify-player/3.installation/11.webos","i-cbi-lg",{"title":216,"path":217,"stem":218,"children":219,"page":6},"Troubleshooting","/en/touchify-player/troubleshooting","en/4.touchify-player/4.troubleshooting",[220],{"title":221,"path":222,"stem":223,"icon":224},"Kiosk mode unlocking","/en/touchify-player/troubleshooting/kiosk","en/4.touchify-player/4.troubleshooting/1.kiosk","i-lucide-bug",{"title":226,"path":227,"stem":228,"children":229,"page":6},"Tips & Tricks","/en/tips-tricks","en/5.tips-tricks",[230,233,238,243,248],{"title":11,"path":231,"stem":232,"icon":14},"/en/tips-tricks/introduction","en/5.tips-tricks/1.introduction",{"title":234,"path":235,"stem":236,"icon":237},"Keyboard Shortcuts","/en/tips-tricks/shortcuts","en/5.tips-tricks/2.shortcuts","i-lucide-keyboard",{"title":239,"path":240,"stem":241,"icon":242},"Optimize a Video","/en/tips-tricks/optimize-video","en/5.tips-tricks/3.optimize-video","i-lucide-file-play",{"title":244,"path":245,"stem":246,"icon":247},"Interactive Image","/en/tips-tricks/interactive-image","en/5.tips-tricks/4.interactive-image","i-lucide-image-plus",{"title":249,"path":250,"stem":251,"icon":252},"Scrollable area","/en/tips-tricks/scrollable-content","en/5.tips-tricks/5.scrollable-content","i-lucide-gallery-vertical",{"title":254,"path":255,"stem":256,"children":257,"page":6},"Guides and Advice","/en/guides","en/6.guides",[258,261],{"title":11,"path":259,"stem":260,"icon":14},"/en/guides/introduction","en/6.guides/1.introduction",{"title":262,"path":263,"stem":264,"icon":265},"Stripe Terminal","/en/guides/stripe-terminal","en/6.guides/2.stripe-terminal","i-lucide-credit-card",{"title":267,"path":268,"stem":269,"children":270,"page":6},"Applications","/en/applications","en/7.applications",[271,274],{"title":11,"path":272,"stem":273,"icon":14},"/en/applications/introduction","en/7.applications/1.introduction",{"title":275,"path":276,"stem":277,"children":278,"page":6},"Rooms Manager","/en/applications/rooms-manager","en/7.applications/2.rooms-manager",[279,284,289,294,299,304,309],{"title":280,"path":281,"stem":282,"icon":283},"Login","/en/applications/rooms-manager/login","en/7.applications/2.rooms-manager/1.login","i-lucide-rectangle-ellipsis",{"title":285,"path":286,"stem":287,"icon":288},"Sites","/en/applications/rooms-manager/sites","en/7.applications/2.rooms-manager/2.sites","i-lucide-hotel",{"title":290,"path":291,"stem":292,"icon":293},"Meeting rooms","/en/applications/rooms-manager/meeting-rooms","en/7.applications/2.rooms-manager/3.meeting-rooms","i-lucide-ratio",{"title":295,"path":296,"stem":297,"icon":298},"Users","/en/applications/rooms-manager/users","en/7.applications/2.rooms-manager/4.users","i-lucide-users",{"title":300,"path":301,"stem":302,"icon":303},"Booking","/en/applications/rooms-manager/booking","en/7.applications/2.rooms-manager/5.booking","i-lucide-ticket-check",{"title":305,"path":306,"stem":307,"icon":308},"Tablet Booking","/en/applications/rooms-manager/tablet-booking","en/7.applications/2.rooms-manager/6.tablet-booking","i-lucide-tablet",{"title":310,"path":311,"stem":312,"icon":313},"Mobile Booking","/en/applications/rooms-manager/mobile-booking","en/7.applications/2.rooms-manager/7.mobile-booking","i-lucide-smartphone",{"id":315,"title":316,"body":317,"description":476,"extension":477,"links":478,"meta":479,"navigation":480,"path":108,"seo":481,"stem":109,"__hash__":484},"docs_en/en/2.touchify-studio/4.animations/2.customize.md","Customize an animation",{"type":318,"value":319,"toc":464},"minimark",[320,333,338,362,383,391,404,408,413,418,421,426,430,433,437,441,444,450,454,457],[321,322,323,327,328],"note",{},[324,325,326],"strong",{},"Prerequisites:"," apply an animation to your element or page. To learn more, see ",[329,330,332],"a",{"href":331},"introduction","introduction to animations",[334,335,337],"h2",{"id":336},"timing","Timing",[339,340,341,342,345,346,350,351,345,354,357,358,361],"p",{},"Define the ",[324,343,344],{},"appearance time"," ",[347,348,349],"em",{},"(clock icon)"," and the ",[324,352,353],{},"duration of your animation",[347,355,356],{},"(stopwatch icon)",". Modify the ",[324,359,360],{},"speed curve"," to adjust your element's movement.",[363,364,371,372,371,377],"div",{"className":365},[366,367,368,369,370],"my-4","grid","sm:grid-cols-3","gap-4","max-w-full","\n  ",[373,374],"img",{"src":375,"alt":376},"/2-touchify-studio/4-animations/2-customize/fr-studio-anim-temps.webp","Setting animation timing",[373,378],{"src":379,"alt":380,"className":381},"/2-touchify-studio/4-animations/2-customize/fr-studio-anim-courbe.webp","Setting animation speed curve",[382],"sm:col-span-2",[384,385],"nuxt-img",{"alt":386,"src":387,"className":388,"provider":390},"Animation speed curve demonstration","/2-touchify-studio/4-animations/2-customize/fr-studio-anim-courbe-demo.webp",[389],"w-full","none",[392,393,394,397,398,345,401,403],"caution",{},[324,395,396],{},"Warning:"," you can apply multiple animations to the same element, but conflicts may appear if animations trigger at the same time.\n",[324,399,400],{},"Offset their timer",[347,402,349],{}," to avoid display bugs.",[334,405,407],{"id":406},"effects","Effects",[384,409],{"alt":410,"src":411,"width":412},"Animation effects options","/2-touchify-studio/4-animations/2-customize/fr-studio-anim-effets.webp",350,[414,415,417],"h3",{"id":416},"zoom-and-fade","Zoom and fade",[339,419,420],{},"Refine your animation appearance by activating zoom and/or fade effects: they will complement the animation style without modifying other parameters.",[384,422],{"alt":423,"src":424,"className":425,"provider":390},"Demonstration of zoom and fade effects in animation","/2-touchify-studio/4-animations/2-customize/fr-studio-anim-effets-zoom-demo.webp",[389],[414,427,429],{"id":428},"repeat-animation","Repeat animation",[339,431,432],{},"Apply a repetition effect: control the number of repeats and the duration between each repetition.",[384,434],{"alt":435,"src":436,"width":412},"Animation repetition options","/2-touchify-studio/4-animations/2-customize/fr-studio-anim-repetition.webp",[414,438,440],{"id":439},"special-options","Special options",[339,442,443],{},"Some options are specific to an animation. The parameters are then specified in the window. Modify them according to your needs.",[384,445],{"alt":446,"src":447,"className":448},"Special animation options","/2-touchify-studio/4-animations/2-customize/fr-studio-anim-speciales.webp",[389,449],"bg-[white]",[414,451,453],{"id":452},"initialization","Initialization",[339,455,456],{},"By default, an element is invisible before its appearance animation is triggered.",[339,458,459,460,463],{},"To cancel this behavior, click the ",[324,461,462],{},"\"Do not hide on initialization\""," option switch.",{"title":465,"searchDepth":466,"depth":466,"links":467},"",2,[468,469],{"id":336,"depth":466,"text":337},{"id":406,"depth":466,"text":407,"children":470},[471,473,474,475],{"id":416,"depth":472,"text":417},3,{"id":428,"depth":472,"text":429},{"id":439,"depth":472,"text":440},{"id":452,"depth":472,"text":453},"Learn how to adjust your animation settings.","md",null,{},{"title":107,"icon":110},{"title":482,"description":483},"Customize an animation in Touchify Studio","Discover how Touchify Studio can help you create ultra-customized animated content.","oaViBHRH3H15ziWAXwd8YY3NLJ30slmv8btbGOFz8wI",[486,488],{"title":11,"path":103,"stem":104,"description":487,"icon":105,"children":-1},"Learn how to easily animate your content using Studio tools.",{"title":112,"path":113,"stem":114,"description":489,"icon":115,"children":-1},"Learn how to use storyboards to optimize your animations.",1761669905848]