"Like Us" and stay connected with Hip Hop Makers on Facebook

How to make a animated banner in Photoshop

March 26, 2008 by Mark V - 57 Comments

Here is a quick tutorial on how to create a animated banner in Photoshop. The banner can be used to promote your music, website, myspace page, or what ever you want.

HipHopMaker Banner

How to Make a Animated Banner

Here is the link to the image: CLICK HERE!

This is just one example of a banner, you can do this in a million different ways. Watch the video, and submit your finished banner to the photo section of the site. There you can show your skills and promote yourself.

P.S.
Sorry if I sound a little tired, I did this at 6 in the morning.


Related

Share

57 Comments


Karl on March 27th, 2008

Thank you for the tutorial, very helpful, I learned a lot and found your voice very clear and focused on explaining what you were doing. Please come out with more :)

jehova on March 31st, 2008

yeh!!!! thank you very much.

that was an excellent tutorial!!!!!

take care and hit us up with more knowledge

Eren on April 13th, 2008

thx brother

Brenda on April 17th, 2008

You just got me threw a very frustrating day!!!! Wish I would have found this 12 hours ago. Thanks soooo much for making this tut.
I knew it couldn´t be as hard to make a bloody banner as it was turning out to be.

Rajita - Logo Design on May 27th, 2008

This is really good sample of musical banner.

ani on June 7th, 2008

woah. this was awesome. yu taught me so much in so little time =D great job!

L.E. Patterson on August 3rd, 2008

Thanx Your Tutorial For The Animated Banner Was Wonderful

TMAQ on September 7th, 2008

I really got a lot out of your tutorial on the banner. Thanks so much. But can you tell me one more thing? How do i post the gif to mayspace? Not in the profile pic/album section, but on the main page? I appreciate your help.

-TMAQ
of The PreZidents

Tara P. on September 10th, 2008

Hey, I just have to say FINALLY, an easy to understand banner making tutorial! I have been looking everywhere for one, and finally found one I can understand. Now, I make banners all the time!

conartist on September 15th, 2008

Great Tutorial. UR right Little Brother is Awesome.

MIchelle on October 26th, 2008

Excellent Tutorial. Really easy to follow, and at the end of it I have a great banner that I had absolutely no idea how to make before watching this tutorial.

Jehnylene on November 1st, 2008

Thank You so much for this very helpful video! Its so cool! THANK YOU so so much!

Alex Ross on November 8th, 2008

Hi,

I am designing a catalogue however the photos have a background, for
example the pictures are of shoes but i can see the table the shoe is
sitting on and the background behind the shoe, is there a way to cut
the shoes out in Photoshop so the background is removed?

Thanks

modrama on December 10th, 2008

a 1 all i can say

A.Z on January 9th, 2009

Awesome! This is what I’m looking for. Before this I used to think that designers are using a special software to create the animated banner. Really surprise how easy to make it using photoshop.

Thanks again!

sunny on February 9th, 2009

It was my first time trying photoshop and on top of that i was using different version that the one used in video so you can tell how frustrating it was for me. Anyway what I want to know is what version of photoshop did he use in the video? I would appreciate your help. Please email me the answer at desisunny786@aim.com. Thanks in advance.

bee on February 10th, 2009

thx man, i watched it at 5 am my time….so i feel ya…but great job on explaining. reading the helpfiles did take 10x so long, and was 2 hrs lost effort. very appreciated

pemzlike on March 13th, 2009

thx bro its excellent you are the king ;)

Jennifer on March 22nd, 2009

I can’t find the animation button in photoshop elements. Help :)

hiphopmakers on March 22nd, 2009

Sorry, You cant animate images in photoshop elements. You have to have one of the regular photoshop programs

D on March 24th, 2009

Great tutorial. thanks!

Persis on April 3rd, 2009

Thx, it was very informative.

Helped me in stepping my gfx game up

Rachel on July 12th, 2009

This was awesome! Thank you so much. I have been looking for so long how to make an animated banner and you made this soooo simple. Thanks!

Craig on August 20th, 2009

Alex Ross Just Use The Special Magic Wand Tool To Cut Out The Shoes. It Will Just Jump Around The Shape Of The Shoes. Happy I Could Help :D

Elina on September 2nd, 2009

Thanks! It was great! :)

PredyY on December 5th, 2009

Hy… could you help me out please… I need a banner like 140 x140 or 160×60 …. animated … and cool for my site…
contact me on ID: szasz_adorjan
if u can do it ….

I need a cool banner soo much.. I’ll post u’re banner too on my site… :)

Thx for HELP…
Best Regards,
PredyY.

Confused on January 2nd, 2010

Which version of photoshop do you use? I do not have an animation tool….

Mark Valenzuela on January 4th, 2010

I think i was using CS3.

If you don’t have the animation tool. You might have a older version of photoshop when i came with 2 versions of image editing software. That means if you have image ready with photoshop. you should be able to do the animated in image ready.

aimraj on February 2nd, 2010

Really nice tutorial…….. Thanks……………….

nitGreen on March 2nd, 2010

Thank you for posting such a detailed tutorial, very helpful..

farida on March 8th, 2010

wow this is great tutorial for Ad banner .. thank u so much

Bhawna on March 14th, 2010

i’m doing a animation in arena pitmpura. and this is normal animation i’m also done it. so next time create a good animation

benno on April 23rd, 2010

thx man….

LoS on April 30th, 2010

great tutorial completely improved my marketing plan

vikram on May 15th, 2010

hi,
Good tutorial. One thing I unable to understand. How you fill color by selecting ellipse tool. When I tried it make whole background black.

BLUETOOTH on May 20th, 2010

Thanks man, excellent tutorial.

sherry on August 10th, 2010

THANKS FOR THE TUTORIAL YOU DID A GREAT JOB

Chris on August 19th, 2010

Thank you so much, this really helps. I also looked at this video
youtube.com/watch?v=vusI-sDEXhE

pyes on November 16th, 2010

How did you get that same banner to link? Can I do that with photoshop also? You did not explain how to hyper link, but the one above hyper links….that is what I need to know for animated banners. please email me with any help you may be able to provide.

Mark Valenzuela on November 17th, 2010

Hi,

I did a follow up video to this. http://hiphopmakers.com/how-to-upload-a-banner-to-put-on-myspace-or-other-web-sites

Hope that helps.

StyleBySonja on November 24th, 2010

Hey! Thanks so much for the help, I just finished my animated Fashion banner. You can check it out at stylebysonja.com!

S.

farid on November 24th, 2010

Eye catching looks

Mark Valenzuela on November 24th, 2010

Cool banner. Good Job

hebegubele on February 17th, 2011

I posted one more comment to your blog, but you didnt approve that. I still keep check your blog anyways..

Mark Valenzuela on February 17th, 2011

Hi.

I’m not sure what comment you posted. Sometimes comments get thrown in the spam folder.

Sorry about that.

raven on March 23rd, 2011

sweet.
this helped me alot

Daniel on April 4th, 2011

you’ve got some skills bro. Make it look so easy. thanks!

Jane on April 15th, 2011

i’m a print designer – was just asked to do a simple animated banner for a client. found your tutorial – WOW – doable. THANKS.

Tim on June 28th, 2011

Amazing Tutorial Bro!

Quame (London U.K) on July 18th, 2011

Whoa!! Best banner tutorial ever!!!

Mariane on August 26th, 2011

Excellent tutorial. Thanks!

Raj Mehta on October 18th, 2011

Nice banner design

:)

Morgan on October 18th, 2011

Thank you so much for making such a great tutorial. This is my very first time even using photoshop and I needed to make an ad for my job. I totally impressed everyone. And btw…your voice sounds super sexy ;)

beat making programs on December 9th, 2011

Thanks , I have just been searching for information about this subject for ages and yours is the best I’ve came upon so far. However, what in regards to the conclusion? Are you certain in regards to the source?|What i do not understood is in reality how you’re not actually much more neatly-appreciated than you might be now. You’re very intelligent.

Theo'... on March 9th, 2012

Hi this is a great tutorial…
I would really like to learn more of the similar animations using Photoshop or similar softwares…Please feel free to email me.
I’m still learning to be a webdesigner. Thanks alot for that tip…
Theo’…

Krissie on April 23rd, 2012

Wow thank you. This was the most helpful thing i have found on the internet. Thank you for sharing. I am grateful.

David on May 8th, 2012

Man! this is great!, I do GCSE ICT and this has really helped! thanks man!

Leave a Comment

Twitter Updates