Mobile Ringtone Animated Banner

Start by creating a new file of the banner size. Create ellipse using elliptical shape tool.

Create a rounded rectangle using rounded rectangle shape tool.

Create another rounded rectangle using rounded rectangle shape tool. Place as shown.

Create some horizontal lines using line tool.

Press Ctrl+Alt+G to create a clipping mask.

Create an ellipse using elliptical shape tool.

Double click the layer to open layer style window. Apply layer style with the settings shown.

Reduce the fill value to 0%.

Duplicate the layer. Press Ctrl+T. Right click the layer and scale down. Reduce the opacity to 50%.

Insert a cutout of a mobile phone.

Type the text in different layers.

Select the text layer. Click add vector mask button from the layer window.

Create a rectangular selection using rectangular marquee tool. Fill it with black color to hide the text behind the mask. Similarly create mask for the second text layer. Also create some musical notes using custom shape tool.

Open animation window. For the first frame let the both text layers be hidden behind their masks. Reduce the opacity of radial waves to 50%.

Duplicate frame. Unlink the mask and content thumbnail for the text layer. Move the mask to the right side so that the text is completely visible.

Press tween button from the animation window. Apply settings as shown.

Select 2nd and 6th frame. Change the opacity of inner most radial wave layer to 100%.

Select 3rd and 7th frame. Change the opacity of middle radial wave layer to 100%.

Select 4th and 8th frame. Change the opacity of inner most radial wave layer to 100%.

Select 5th frame. Change the opacity of all radial wave layers to 50%.

Repeat the above mentioned steps for the next text layer. Also animate the opacity of radial waves as mentioned above.

Press Ctrl+Alt+Shift+S to save an optimized animated GIF.