How to Design for the New YouTube Channels

How to Design for the New YouTube Channels


– Hey guys! So last night, YouTube just launched the new channel designs, which
everyone can now opt into. So, I thought that I
would make a quick video explaining how to design
for the new banner sizes. Just, before I start, can we all agree to skip
the whining and moaning about how awful every
change on YouTube is. I actually quite like the new channels, but if you don’t, please at least keep your
feedback constructive. Okay, so the first thing to note is that iframes are gone. Those banners you would see where you can click on parts of them and be taken to a twitter
page or a merch shop, those are no more. It’s just a flat image now, so try to stay away from designs like the current Vlog Brothers banner, which is gorgeous, I love it, but, if you can’t click on
all the different links, it doesn’t really make much sense. Also gone are custom backgrounds. You’re really only working
within this one rectangle. Well, sort of. The way the new channel banners work is that you upload one big image and then it’s cropped differently depending on if you’re
looking at it on the computer, on your phone, on a tablet, or on a TV. There’s an article in
the YouTube Help Center that goes through it
in pretty good detail. I’ll link that down below, but I’ll also just give
a quick overview here. So let’s say that this is the photo that you want to turn
into your channel banner. You have to make sure all the most important information fits within these proportions,
which is the smallest that the internet browser
window will stretch it to, and then also the graphic
that’ll show up on mobile phones. Then you have to add a little to each side for what will show up on a tablet, and then add even a little
bit more on each side for people whose monitors are huge, and so this is the widest that
they’ll be able to extend it. And then you have to add a
bit to the top and bottom for people with smart TVs. To be honest, I don’t really know what the TV UI layout looks like, so I can’t really give any tips on designing for the TV screen, but it just has to fill these proportions. I hope that wasn’t too confusing. It might make more sense if you just look at this
template that I designed with layers and guides so you
can just drop in your image, and you don’t have to worry about fiddling around
with pixel dimensions. So the link, if you want to download that, is down below. It’s a PSD and then I
also just put a JPEG. If you have Photoshop, you’re all set. If you don’t, I think GIMP can open PSDs, it’s a free image editing program. I’ve never actually used it,
but I’ve heard good things, but if you don’t want to
fiddle around with any of that, you can also just upload a big image. It has to be bigger than 2120 x 1192 pixels. And then you can crop right
within the upload process, so it might not be quite as exact as if you put it all together
yourself in Photoshop, but if you’re not that worried about it, and it’s only a single
photo, that works just fine. But for most people who
have pretty complex channels who upload videos regularly and
are trying to build a brand, you might not have just one single photo that represents your entire channel. It’ll be really interesting to see what kind of banners
everyone comes up with within all the new limitations, but I wanted to share a
few of my favorites so far. I really like MysteryGuitarMan’s banner because it’s this cool
texture that represents what his channel is about. It’s only three colors so
it doesn’t feel too busy under the profile photo, and since it’s an illustrated texture, it never feels weirdly
cut off on either side no matter where the
browser is cropping it. I really Vice’s as well, since they went with a grid of photos, so none of the individual pictures had to be particularly high quality, and since their profile photo is a square, it fits seamlessly right
on top of the grid. Say what you want about
the Annoying Orange, I know I’m not quite in
their target demographic, but I do like how their
profile photo and their banner have the same background, so it feels like one cohesive image, and Ashley, PaperPastels
did the same thing, where the background continues on the profile photo seamlessly. I just think her whole
designs are so cute. Just like when Facebook first
launched their cover photos and everyone came up with really fun ways to have it interact
with the profile photo, I can’t wait to see how people do that with this new YouTube layout. It is a little bit trickier though because the profile photo
moves back and forth across the banner depending
on how wide your browser is, and I’m pretty sure it doesn’t show up on top of the banner on
the mobile app either, but I’m not quite sure about that so don’t quote me on that, but be aware that the
pixels won’t always line up in the exact same way so your design has to be flexible enough
to account for that. I’ll be honest, even as a designer, the new channel layouts are
really tricky to design for. It’s tough to find an image that works in such a wide rectangle that doesn’t get cut off weirdly
at the top and the bottom, and it’s tough knowing
where to place things knowing that they won’t always
be centered in the same way, and they might get cut off differently on different people’s browsers, or covered up by profile photos and links, and since they’re scaling
for retina display, you have to upload a higher quality photo than just a screenshot from a video, and not everyone has those. I know my channel still isn’t perfect. It’s pretty busy, and
I couldn’t really get a photo of my face to work
right in these dimensions, but I’m going to keep working on it, and I can’t wait to see what
you guys come up with too. So, I hope this gave you guys some ideas about how to design your banner, and maybe unraveled some of the
mystery of how it all works. Again, the Photoshop template that I made with all the different areas mapped out will be linked down in the description, and if you like my graphic design videos, I just posted one yesterday about how to design a business card. You can check that out right here, and the video before that was all about the amazing names that they give to color swatches. You can check that one out right here. Make sure to subscribe for new videos every Tuesday and Thursday, and occasionally, bonus Friday videos. So, thank you all so much for watching. I will see you all next time. (background music)

100 thoughts on “How to Design for the New YouTube Channels

  1. You mean the new new new new YT design I guess…?
    Why the more they change the site, the less it is easy to have a nice main page ?

  2. According to YouTube Help, they've recently updated their channel art guidelines. The channel art dimensions have been changed from 2120 X 1192 pixels to 2560 X 1440. You might wanna add some annotations with this new info on the video.

  3. Regardless how hard people try THEIR CHANNEL CAN'T LOOK GOOD if they use the Zero Channel! On May 29…(But it will happen on May 30!)all channels will use the zero layout! Which means that all channels will have the eye-hurting white backgrounds 🙁

  4. the banner of the harries twins is also a realy nice one i like that one a lot, you should check it out 🙂

  5. FUCK THIS NEW DESIGN IS SHIT! they say in 5th June we will ALL get the new design. Like the FUCKING SKYPE. I wanted MSN and it suddenly I got skype! FUCK!

  6. Hi I liked your video and yes you are enthusistic . I really havent been able to put things together via photoshop since I dont have it .hence have opted for large images . One really has to stay away from tall images as the cropping is terrible for a laptop .Only huge TV's seem fine .the guidelines….will keep working on mine ,when have recovered from switching

  7. There should be a way to add color to the background. Or wallpaper.
    The new channel just looks so … blah.
    Or, maybe there is a way to add color and I just haven't figured it out yet.

  8. I just wanted to say something to Youtube for years of redesigning peoples accounts for them.

    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU
    FUCK
    YOU

  9. Hi, I enjoyed your video and it was very helpful. I am wondering what is up with the color. When I upload a new version of my old banner, the colors are extremely saturated and seem to change as it moves to the left. Any help would be appreciated. Thanks!

  10. I noticed the exact same thing, but I found uploading a png file much better colour/contrast than a jpg. If you're designing in photoshop, just export as a .png file instead of jpg. Weirdly this seems to work. 🙂

  11. Thank you for your reply. I finally figured that out last night. The .png file is a definite fix.

  12. It's not forcing anyone to have designs, graphics and knowledge; it's just creating more options for those who want to take their videos further.

  13. thank you so much for the template i am a visual artist as well just starting with photoshop and illustrator and they are amazing programs. i need it a template for my banners thank you so much.

  14. The only reason that's happening is because technology is advancing and no one wants to watch crappy videos of a nokia phone.Before, you tube dint have a set standard now people that watch it demand at least 720p.So Google and YouTube are just adjusting to what we are watching.

  15. I'm surprised to hear you like the new layout, I feel it takes away creativity and originality. :/ The other layout was so much more versatile.

  16. I just found your videos through your birdhouse collab with Paper Pastel. I want to let you know that you are one of my new favorite YouTubers! Thank you, love your videos!

  17. It's Gimp, not Jimp. But yes. Gimp's newest version does open Photoshop stuff.

    Really love how Pewdiepie's youtube looks. It's very beautiful… Although, I don't like how he used just white and a bright blue. If he added black, then it would have looked better.

  18. Um she's not shouting, her voice is just loud maybe or she edited her voice in camtasia or other other video editors.so people who is bad in hearing may hear it.

  19. THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!THERE IS A PROBLEM WITH THIS!

  20. I don't Like the New commenting system, and your Voice…

  21. Thank you! I can't believe people are saying bad things. I am planning to start a channel here on YouTube and I am trying to figure everything out. So thanks again.

  22. Very informational video, wish there was a way to design the entire interface of the channel but I am sure that is in development for the future of YouTube.

  23. I am 64, not tech savvy and probably should not be trying to have a YouTube Channel, but I'm trying to keep up with my grandkids. I'm going to get blasted for asking these questions, but after I download the PSD template, how do I put a picture on it and then type my channel name, etc.? I'm at a loss. Thanks

  24. Hey guys We are a young channel that posts gaming videos. We are only 4 subs away from 100 please help us out subscribe and tell your friends to subscribe

  25. could you please help me finding hidden features. mine are hidden and i have been looking for them for over three months. I tried everything, but nothing found yet. @Karen Kavett 

  26. Hello, im i need of help from someone. im looking a good graphics artist to help with a clan logo/clan page i will link clan logo ideas i have been brainstorming that can hopefully be brought to life through a PC, in montages, twitter etc message back if interested ^.^ you will get plenty of positive feedback from us and recommends ^..^

  27. Nice tips, thank you! Also you can use After Effects template to design your YouTube channel. Example: https://videohive.net/item/youtube-broadcast-package/17414780

Leave a Reply

Your email address will not be published. Required fields are marked *