Animated Portfolio | How To Build A Portfolio – A Guide For Animators!

Howard Wimshurst

Subscribe Here





How To Build A Portfolio - A Guide For Animators!

This is a transcript from the video mentioned above: (please support the original creator by liking and subscribing to their channel!)

What I’ve been learning in the past few years. This right here is so so important for creating a successful career in animation, so pay attention. [MUSIC] So in this video, I want to show you how to make a professional portfolio to advance your career as an animator making a website. This is the key to creating a lasting impression, presenting your work in the best possible light and ultimately the key to having work offers. Come to you instead of you having to chase them around on the Internet. Spending all your time doing that when you should be making artwork. This video is sponsored by. Wix Wix. Have the most powerful website editing tools that I’ve ever come across. I’ve used their website builder to create websites for clients and for personal use, so when they offered to sponsor this video. It was a no-brainer for me. So if you guys are interested in making a website to call your own, then you can go to. Wix, calm slash. Go slash Howard. The link to that will be in the description and to demonstrate the Wix website builder. I remade my old portfolio website using their builder and in case you’re wondering whether is worth taking the time to establish your own website. I’m a believer that every viewer watching. This should have a website with very few exceptions. Why because it’s one of the essential tools you can use to build a business from nothing? Your website is like your virtual headquarters. Whatever your goal is, whether it’s growing an organic following getting employed, maintaining job security. Your website is going to be a very powerful tool in your arsenal to helping you achieve that goal. It’s a place on the internet, which is free from distractions, there’s. No sidebar showing other people’s work saying. Hey, look at me, look at this other person’s work. You know, there’s none of that it’s. Just your work on the website, okay. I’m going to quickly race you through how to just get up and running with Wix very quickly. And then from there, I’m going to show you my process of making my website portfolio and also talk a lot more about the theory of branding and brand positioning, Which I think you will really want to hear about so first of all, which will keep all your sites down here, so you can open up as many of these as you like. I’ve got a bunch of them, but I’ll create a new site here, and then it will take you through to what kind of website you want to create. I just go with portfolio CV for this one, but they are a great templates on any of these so portfolio and CV, and we choose this one. Choose a template. This gives you the most customizability the most freedom from there you’ve got loads of different like pages and pages to choose from. I’ll just go and choose this one. You can either just view it. If you want to browse or we’re gonna just click to edit it and from here, you’ll be taken into the where you can basically change everything about the website so first of all up here we’ve got publish preview and save so publish puts it out onto the Internet for people to see preview allows you to just see it as if you were a regular Internet user, and then you can go back to the editor here click. Save to save your progress. Redo undo very useful up here. You’ve got a bunch of different settings to change the site settings. This is where you can switch from desktop view to mobile view, so this simulates what it will look like in a mobile and also gives you the mobile editor. You can just change certain things about the scrolling. Let’s do that, okay, go to mobile editor when you preview like this. It simulates a mobile phone view like this, which is super handy. Basically, it takes everything that you make all the edits and changes that you make on the desktop view and it brings it into the mobile view. And then you’re able to just tweak some things. Move some things about just to get it exactly how you want for mobile viewers desktop view here. We’ve got the navigation bar for all the different pages of your website, so you can just click through to any of these and it will take you there. Also here you can edit the menus and pages on this site menu. You can delete you can hide them. Hiding is really good for. If you want to just make a draft page that no one actually sees and it’s just off of your menu, you can change the order of any of your pages just by dragging and dropping. You can rename any of the pages and it renames them in your title and everything like that, okay, background, this changes the background of the website and you can bring in images video. Kyle, I always keep to my own images when I make a website because I want to be unique. Where the plus button is here. This is where you can add in different elements, and it’s got such a massive list of elements and different options here and beyond that, there’s more ways to customize it and everything images. This is where I upload almost all of my images. I go onto here and when we click my image uploads, it brings you to this library now. From here you can drag and drop all of your different video images. Anything like that, you drag and drop in your files. And then it saves them into this library, so you don’t have to ever import the same image twice. If you were using it on different pages, you can just bring it into here. You can upload multiple images at once and things like that. It’s very useful on top of that. They’ve just got a bunch of different presets like here. I’m on lists and grits and these are just presets that are already designed. And they just give you a bunch of different ideas for what you can do with your website along this side on this right-hand side. This is just for where you can align things. You’re always going to be wanting to align different things. You’re going to want to make sure that your title is in the middle, so you just align to Center? Whenever you click on any element in on your screen, you’ve got this floating menu bar. That kind of follows you around whenever you click, and this is where you you get to fiddle with the settings of whatever it is, you’re making, like here is a gallery like a gallery of images. We can just switch to any of these and it will give us. It will just change it to different options. Give us slideshows and things very, very useful, So I really love there, but yeah, that’s basically a quick summary of how this space works. Its super intuitive and very powerful now with that out of the way. I’m gonna show you some sped up footage as a demonstration for how I made my website start off with the homepage. It had this gallery in there and I liked the minimal design, but obviously it had all these stock images, which I just deleted out I brought in an embedded Vimeo clip of my show real, and I just wanted that to be at the front and center so that it’s basically impossible to miss. I wanted the header at the top with my name and logo and the different pages. At this time. I was also changing some of the defaults like the default font settings and the default colors. I have a lot of features. I want to talk about for Wix, but I’ve boiled it down to three of my favorite features, so a first feature in my process. I want to try a lot of things and see how they look before committing to a decision and in which you can edit a template entirely into your new websites before committing to anything official in my dashboard. I’ve I’ve saved a bunch of Half-made website ideas which Wix. Just lets me keep for later for when I might want to finish it up and launch it, and this feels so liberating. I’m someone who likes to create a lot of different iterations of something a lot of different ideas, and it’s just so liberating to feel like I can make as many versions of this as I want. The second feature is their Built-in mobile editor so much Web traffic these days comes from mobile, which automatically makes a mobile version of your website. And then you can go in there and find tweak it. Adjust things to how you like them to optimize the mobile experience. The third is customizability. Basically, anything you can see you can change. You can upload your favorite typefaces. You can change the default colors. You can embed custom code and much much more. You’ll be able to see in this video that I started with the template. I stripped everything out of that website and changed it to be my own for the film page. This one was kind of tricky. I kind of worked on my previous idea from my old website for this and just kept really simple with the different strips, presenting each of my films in the order that I wanted to show them. I didn’t want any kind of fancy carousel or sliders or anything interactive. I just wanted you to be able to scroll down the page and to see the different films that I’ve made over the years And in this case with encounter the type of awards it brought in for me. I later got the idea to actually create a button, which would go to its own individual page. So like for encounter encounter would have its own page where you could see the making-of featurette of the film. I guess you could call it where you can see how it was made and some behind the scenes, maybe some behind the scenes artwork, some designs and things like that, but I didn’t have time to finish all of them for all of the videos in this video, so it’s going to be a work in progress for that, then after my original films down down at the bottom. I had a few different examples of client. Work that I’d made. So I decided to make some custom buttons for my website and to do this. I actually went back to Adobe Animate because it’s a vector software, and I know how to use it and it’s quite well suited to it, so I used this really cool little color picker tool, which gets you the hex code of any color that you scroll over with your cursor. I’ll try to remember to link that in the description, and so that way I was able to grab the color of my website and make these little gradient buttons that I just had the idea for, and I just wanted to try it. And yeah, exported them each as PNG images from flash from animate sorry and dragon drops them into the wicks builder now. I know that I always say to keep your portfolio website really simple and clean, but when I got the idea for making my own custom background, which would be like these sort of black and white sketched images. I just had to try it out and I just loved the result of this so yeah. I’ll show my process for sketching this out in Photoshop later when I’m talking about branding. But yeah, what you see me do here is just drag in one version of the sketch that was almost ready to show, but I just needed to see how it fitted on the page to get the alignment right under the Commission’s page. I also wanted sub pages so that there would be a dedicated page for each of my case. Studies case studies are past examples of where I’ve worked with clients and helped them on their projects and often containing a testimonial kind of telling a story like a progression of steps to get to the end results. And I think that potential clients like to see that kind of work because they’re wondering what it’s like to work with me so they can see this and get an idea of what it’s like to work with me. Containing testimonials from my clients from my past clients is another way of helping me get this social proof. [MUSIC] For my about page, this is always a tricky one. I feel it’s always hard to write about yourself. I wouldn’t say I’m particularly good at it, but I have over a long period of time. I’ve I’ve got this paragraph of text which I’ve tweaked hundreds of times. I have tweaked this piece of text. And so this is the key information that I want to get across in this little paragraph of text about me. First of all, my films have won awards, so I’m an award-winning filmmaker. I specialize in 2d animation. I have experience making visuals for a variety of clients, clients of all different shapes and sizes and backgrounds. I have a Bachelor of Arts degree in animation. I’m based in London and I have a Youtube channel with a significant following and yeah, with these points, They’re all things that I feel might appeal to potential clients. I also added a photograph of myself to this page, and I think it’s really important for visitors to the site to feel like they’re interacting with a real person and not just a faceless entity. I think people feel more at ease interacting with a real human someone they can see has a face and a name and an identity. Yeah, so this background. I started off with this sketch that I made in Photoshop a while back that I just didn’t have the useful with anything, but I thought it was a pretty cool image of a skater doing a kickflip and I just sort of put that in the corner, and I figured like I want two things kind of coming in on the sides. The idea of it was kind of like, you know, like a picture frame is like you can have a nice decorative picture frame. I just thought it could lend itself quite well to the geometric shapes of the text and things for inspirations for this sketch. I was quite inspired by there. We’re four main big names that I was inspired by James Jean Aubry, Beardsley Alphonse, a Mukha and Michelangelo, so a little bit of Baroque and a lot of Art Nouveau and illustration ideas. Of course, it doesn’t live up to any of those names. There was a great artist, but those are the kind of people. I wanted to channel into this sketch. I mean, it is kind of a big deal because it’s the first impression that someone gets when they come to the website, so it has to have some level of quality to it. I guess, and also it has to kind of reflect my personality in my art style, so it was actually quite a big deal to to think about what to animate for this, but I just wanted to keep it flowing and give it this energy that you get from just spontaneous ideas while this sketch is playing out. I want to talk a little bit about branding and brand positioning. First of all what is branding branding is a person’s gut feeling about your business or about you as a person how you can cultivate that and how you can change it. I know a lot of you are trying to do a similar thing that you’re trying to create a career from animation, though. What I’m about to say is kind of like what I’ve been learning in the past few years and this right here is so so important for creating a successful career in animation so pay attention. I’m gonna first talk about branding from the point of view of the clients, so we imagine there’s a clients their online looking for someone to make their projects. They have an idea for an animation. They don’t have the skill themselves to create the animation. They do have the money to fund an animator to create it. Okay, so they start off. They’re on the Internet. Let’s start at the very low level. The cheapest work you can probably find is on Fiverr. They have very cheap prices. You will be able to find animators and on the whole. They put no research in because it’s so low cost. They have a template and then they just type in your words or they just drag and drop things. Yeah, you don’t pay much, but you also don’t get a very good product. That’s not the kind of image you want, you want something? That’s high-grade a little bit Higher up from that lowest level is maybe a freelancer website like upwork, where you can hire freelancers to do a multitude of things. Now up work is okay. You can pay an animator by the hour to to make your animation. Typically, you will find people who are struggling to get themselves known. Get themselves out there. People aren’t talking about them. People aren’t sharing them that being said you do find some good professionals on there. It can be a bit of an ordeal to try and hire them, but you can do it so higher. Maybe higher up from that. You might go onto Instagram or maybe Twitter. One of these social media sites, maybe Tumblr. Now you’re finding these these really promising, maybe animation students or maybe a little bit up from animation students, and they’re posting little clips like three to five seconds, little animation clips and then some artwork, you know, some portraits and things like that, and they’re growing a following, And you think okay, yeah, maybe. I’ll hire one of them. Now you have this concern because the animation you want produced is maybe a minute to two minutes. Long, there’s no evidence with that animator that they are able to handle a project of that size because all they’ve been posting is like three to five second long little animation tests, and it’s not very reassuring that that’s all they’ve been posting, so you’re taking a risk, You’re rolling the dice, and if you hire a student, let’s say it comes to exam season or something or they have an assignment. What are they going to do? Are they going to prioritize you, or are they going to prioritize their exams? Their hand in deadlines students can be pretty unreliable. Sometimes those are some of the lower levels of this sort of tier list of animators that as a client you can look into. Let’s skip ahead and go right to the top end. So on the high end of the spectrum you have. Studios situated in California, London, France. They make great work. You know, hats off to them. They make excellent work. Can’t fault it. They hire the best talent. It’s super high quality. The rents that they pay in those studios if they’re located in central London or Paris or Burbank, its massive, the rent is enormous, and that’s before they even hire the top talent. Pay those salaries, you know? They’ve got someone working on the desk as a receptionist. They’ve got a lot of overheads. They need to pay and you’re paying for that. You are paying for those overheads and personally. I think their style can be great, but a lot of the time they have corporate clients and so they’re conditioned to make very polite corporate work. Maybe that’s perfect for you but for. I think for a lot of other people. You want something that’s expressive, you know, okay, so I’ve explored the low end quite a lot. I’ve explored the high end. So where do I fit in with this personally? So I think I fit somewhere in between. I want to establish myself as someone who’s above student level, definitely above student level and above the level of oDesk up work. So I’m fitting nicely in that pocket. You can see that there’s a lot of space between someone who’s on up work and a london-based studio. There’s a lot of room there, so I’m fitting quite nicely into there that being said always when you’re in the middle when you’re positioned in the middle, it’s a bit of an awkward place to be in because you know someone who wants cheap work is not going to hire you someone who wants expensive someone with a huge track record. They’re not going to hire you either, so it can be an awkward place, but there’s also a lot of room here in the middle. I’m probably inviting a lot of competition, but I just want to help you guys through this. So what I strive to brand myself as this is gonna sound a little bit pretentious. I know just bear with me. I want to brand myself as a creative force of nature, I want to brand myself as an expert in creating visual experiences and arrival to old animation studios because I pay less overheads and all of that, that’s what I’m striving for, and that needs to be said in my portfolio. What, I’m avoiding branding myself. As is a student or recent graduates, Someone looking for a job, someone who is aimless and can’t think for themselves and wants to be employed. I don’t want to position myself as that. That’s not me. So that has to be said in the visuals and the experience of my portfolio. I focus on experience that audio-visual experience where you can lose yourself in a different world. You see how that’s a step up? That’s a big step up from a student where they’re going to be worried about the technical things. They’re going to be stressing over like, you know, the timing and spacing. I’m a little bit past that I got to say. I’m not trying to toot my own horn, but like this is, this is what I’m trying to do. I’m a little bit past that, and I’m focusing on it as an experience. It’s a big difference, so there are small things you can do. This can be reflected in the wording as well as the visuals. So for the wording on my website. I will avoid using words like portfolio, even though this is a video about portfolio’s. CV resume job employments. These are words that an employee will use and Im. I’m not trying to be that. If you as a client decide to hire me, you your kind of taking on a creative partner, you know, someone who can execute on your ideas. But also someone who has a lot of creativity of their own, so it’s more than just hiring an employee also in the portfolio. I try to create an it experience for you. For example, in the show rule, I have cinematic music behind it, which kind of carries it all and gives it This quite epic feeling. It could even make the hair stand up on the back of your neck in the editing. I try to edit it all the footage so that it flows together, create one seamless experience across different projects. They all have a similar kind of the Howard Wimshurst experience. This is cringy, but I got to explain it somehow. I’m not putting in line tests like so many animators. I know they just end it at pencil tests, and that’s because they’re true. Animators like they are only concerned with the way something moves. They’re not concerned really with the experience. They are just looking to make it move and that’s why they finish at the pencil test. I have very few pencil tests. In my portfolio, it’s all finished work. It’s all rendered out with color and compositing. – look how it’s meant to look at the end. So if you work with me, you are partnering with someone who has experience and someone who has vision a lot of the time. The creative briefs that I get from clients. They have a lot of holes in them. Where it’s like, OK? But what goes there like or you? But you haven’t thought about where this is set or who the other three characters are because I have creative vision I fill in the gaps. I can envision it and and fill in those gaps for myself and create something that is better than what the client could have imagined is better than what the client could have imagined. So that’s kind of what? I’m trying to say with mine. Yours might be different. Maybe you’re aiming to get into a studio in which case you need to design your portfolio to be slightly different. Change the wording a little bit change. How you approach it? Maybe you have less work to show for yourself. In which case you’ve got to do what you can with what you’ve got. [MUSIC] [Applause] [Music]. So if you guys are interested in making a website to call your own your own internet headquarters, then you can go to Wixco’m slash. Go slash Howard. The link to that will be in the description. So that’s wixcom slash. Go slash Howard. And that way they know that. I sent you there. Thanks very much for listening to me. I hope that the advice that I gave was helpful, alright? I’ll see you in the next video. Goodbye [Music] you!