Making an Animated Badge Cosmetic in AnimateDiff! // Tyler // 4.4.24
TLDRIn this engaging video, Tyler, a video guy from the civi tha.com community, collaborates with Feya, a talented graphic designer, to create an animated badge for their website. They discuss upgrading their Twitch content and introducing new ways to provide value to their audience. The process involves designing a badge in Photoshop, using Stable Diffusion for initial design, and then animating it using After Effects and AnimateDiff. They experiment with different tools and techniques, including creating a clean alpha mask and using a double masking LCM workflow. The video also features a guest appearance by Sir Spence from RunwayML, who shares insights on perfect renders. The final product is an animated Forge badge that incorporates fire and a hammer, showcasing the potential for AI-generated and animated cosmetics on their platform.
Takeaways
- ๐จ The speaker, Tyler, and his team have upgraded their Twitch streaming content and are focusing on providing more value to their audience through live content and AI advancements.
- ๐ Tyler introduces a new animated badge cosmetic created for their website, showcasing the collaborative process between him and his community team member, Feya.
- ๐ Feya designs badges using stable diffusion and Photoshop, while Tyler animates them using After Effects and other tools for the website's elevated membership tiers and contest prizes.
- ๐ฅ Tyler demonstrates the process of animating a badge with fire and a hammer using AnimateDiff, a tool for generating animations from still images.
- ๐ก The community is engaged by asking for their opinions on whether the fire and hammer should be animated separately or together for a cohesive look.
- ๐ Tyler discusses the importance of refining the workflow to create better badges and the potential of using AI for this process.
- ๐น The video includes a tutorial on how to render animations with clean alpha masks, which is useful for compositing in video editing software.
- ๐ค Tyler highlights the capabilities of AnimateDiff and how it can be used to create animations for badges, emphasizing the potential for premium cosmetics on their website.
- ๐ The speaker expresses excitement about the creative possibilities that AI tools offer in combination with traditional design and animation techniques.
- ๐ Tyler encourages viewers to watch the recorded streams on YouTube for a deeper understanding of the processes and techniques used during the live session.
- โฐ The stream ends with a reminder to save work frequently and a tease for the next day's guest creator stream featuring an image upscaler in Comfy UI.
Q & A
What is the main topic of the video?
-The main topic of the video is about creating an animated badge cosmetic using AnimateDiff and Photoshop, with a focus on integrating AI-generated animations into the badge design.
Who is the host of the video?
-The host of the video is Tyler, who is a part of the civi tha.com community team.
What is the role of Feya in the video?
-Feya is a community team member and a graphic designer who collaborates with Tyler to design badges for the website using stable diffusion and Photoshop.
What is the purpose of using AnimateDiff in the badge creation process?
-AnimateDiff is used to animate specific elements of the badge, such as the fire and the hammer, to create a more dynamic and visually appealing badge for the website.
How does Tyler plan to refine his workflow through the process shown in the video?
-Tyler plans to refine his workflow by experimenting with different AI-generated animations, masks, and blending modes in real-time during the stream, which will help him create better badges in the future.
What is the significance of the 'Forge badge' in the video?
-The 'Forge badge' is the specific badge that Tyler and Feya are working on animating. It is significant because it represents the application of their design and animation process.
Why is the 'Pony Hammer' mentioned in the video?
-The 'Pony Hammer' is mentioned as a humorous suggestion sent by a community member for the type of hammer image to use in the badge animation, showcasing the interactive and creative nature of the community.
What is the importance of the alpha mask in the animation process?
-The alpha mask is crucial as it defines the area that the AI will animate. It ensures that only the desired parts of the badge, such as the fire and hammer, are animated while the rest of the image remains static.
What is the role of the 'soft edge' setting in the animation?
-The 'soft edge' setting is used to blur the edges of the alpha mask, creating a smoother transition between the animated and non-animated parts of the badge, which can enhance the overall visual appeal.
How does Tyler ensure the final animation loops well?
-Tyler ensures the final animation loops well by prepping the footage to loop perfectly before integrating it into the AnimateDiff process, which is essential for continuous playback on the website.
What is the future plan for the community regarding the animation competition?
-The future plan for the community is to make animating with Comfy UI more accessible to a broader audience, ensuring that the upcoming animation competition is inclusive and does not exclude participants due to hardware limitations.
Outlines
๐ Introduction to Twitch Stream Upgrades
The streamer, Tyler, greets the audience and discusses recent upgrades to their Twitch setup. They express excitement about the direction of their Twitch stream and the increasing level of official recognition. Tyler also mentions plans for live content and value addition in various areas of AI, hinting at collaborations with Ally and thanking the community for their support.
๐จ Collaborative Design Process for Website Badges
Feya, a valued member of the community and colleague, is highlighted for her talent in designing badges for the website using stable diffusion and Photoshop. Tyler, not being a graphic designer himself, is amazed by Feya's ability to translate ideas into badges. They work together to decide on motion and visual effects for the badges, which are then animated by Tyler using After Effects for the website's elevated membership tiers and contest prizes.
๐จ Animating the Forge Badge with AI
The process of animating the 'Forge' badge is described, where Feya's design is enhanced with motion by Tyler. Instead of hand animating, they decide to use AI tools like 'Animate Diff' to animate parts of the badge, specifically the fire and hammer elements. The goal is to create an engaging badge that indicates motion even when viewed small on the website.
๐น Using Video Footage and Masks for Animation
Tyler discusses using video footage for the fire element in the badge to save time instead of hand animating it. The process involves creating alpha masks for the hammer and fire, ensuring a looping animation, and deciding whether to animate the fire and hammer separately or together for a cohesive look. The community is asked for their opinion on this matter.
๐ค Collaboration with Sir Spence from RunwayML
Tyler shares his excitement about an upcoming collaboration with Sir Spence, a technical researcher and artist from RunwayML, who will join the stream to showcase some impressive AI capabilities. Spence had previously helped Tyler with rendering techniques to achieve a clean subject mask without a background.
๐ผ๏ธ Photoshop and After Effects Workflow
The process of changing the badge background to black in Photoshop is detailed, followed by exporting and importing the badge into the workflow for animation. Tyler emphasizes the importance of the workflow, which is available on his Civettai account, for video-to-video generation tasks.
๐ Fine-Tuning the Animation with Masks and Controls
The focus is on fine-tuning the animation using masks and control nodes within the animation software. The use of a latent noise mask to apply the same mask over the latent noise map is explained. This ensures that only pixels inside the mask are affected during the animation process.
๐ฅ Adding Fire and Motion to the Badge
The streamer discusses the process of adding fire to the badge and the importance of the fire animation looping perfectly. They mention the use of different nodes and settings in the animation software to achieve the desired effect, emphasizing the new control options available with updated software nodes.
๐ Exploring Creative Options with Hammer and Fire Images
Tyler and the community collaborate on finding the right images for the hammer and fire elements of the badge. They experiment with various images, including a humorous 'Pony Hammer,' and discuss the creative process behind selecting and integrating these elements into the badge design.
๐ Finalizing the Animated Badge and Future Plans
The stream concludes with the finalization of the animated badge, which combines AI creation with manual editing in Photoshop and After Effects. Tyler expresses excitement about the potential for creating premium cosmetics for the website and the upcoming guest creator stream featuring an image upscaler workflow.
๐ Upcoming Streams and Community Engagement
Tyler informs the audience about the next day's guest creator stream with Mid Journeyman and Super Beast AI, where they will showcase an image upscaler workflow. He also mentions the ongoing work to make an animation competition more accessible to a broader audience and thanks the community for their engagement.
๐ Conclusion and Sign Off
The stream ends with a reminder for the audience to save their work regularly to avoid data loss. Tyler signs off, reiterating the value he places on creating an appealing online presence and expressing enthusiasm for the future of live content and community involvement.
Mindmap
Keywords
๐กAnimated Badge
๐กStable Diffusion
๐กPhotoshop
๐กAfter Effects
๐กAnimateDiff
๐กCosmetics
๐กContest Prizes
๐กIP Adapter
๐กWorkflow
๐กDiscord
๐กTwitch
Highlights
Tyler and his team have upgraded their Twitch stream with official AI-related content.
The community is excited about the direction of the Twitch stream and the value it provides in different areas of AI.
Feya, a talented graphic designer, creates badges for the website using stable diffusion and Photoshop.
The process involves animating the badges for the website using After Effects and offering upgraded cosmetics for members.
Tyler demonstrates hand animating a badge in After Effects and discusses the process of adding motion to the design.
The use of AnimateDiff to animate parts of the badge, such as fire and a hammer, is explored.
A new method of rendering animations with no background is showcased, which is useful for compositing.
The importance of using the right images and prompts in AnimateDiff for the desired outcome is emphasized.
Tyler discusses the workflow of using Photoshop, AnimateDiff, and After Effects to create animated badges.
The community is engaged in providing feedback and suggesting images for the animated badge creation process.
A new approach to animating badges using AI is tested, with the goal of refining the workflow for future projects.
The potential for creating premium cosmetics for the website using AI-generated animations is highlighted.
The stream features a guest appearance by Sir Spence, a technical researcher artist from RunwayML, who shares insights on rendering.
The use of control nets and weight types in AnimateDiff is discussed for achieving better motion in animations.
The final badge animation is tested for compatibility with the website's display size and user experience.
The concept of offering animated badges as contest prizes and membership rewards is introduced.
Tyler emphasizes the importance of saving work frequently during the creative process to avoid loss of progress.