AnimatedGif using Sportsbet Assets
date
Mar 27, 2023
slug
animatedgif
status
Published
tags
Design
type
Post
source
summary
Today I am having a practice to make animated web banner that optimised for web app and mobile view. This is something to do in 1 hour. I am going to share my simple process below:
Preparing the assets
I am using an A3 poster file from Sportsbet, open it with Adobe Illustrator and separate all components that I am planning to use for the banner.
Design the assets
Each art board will become each frames in the animation, Here I am creating 6 frames as a quick simple animation.
I start to place each assets according to my idea and save it as multiple PNG’s.
Creating the animated GIF
Using Adobe Photoshop, all images opened and put into adobe photoshop layers, and with Timeline tabs to manipulate the timing and animate (tween) the frames. Once done it can be save as GIF.
