7 AI Tools EVERY Web Designer NEEDS To Know About!

that was web designers and designers we should always be on the lookout for tools that streamline the whole process and ultimately makes us faster more efficient and more profitable I recently released a video on using AI as a design assistant but the tools that I used in that were relevant at the time have come an awful long way and a lot of other tools have come out alongside it so today I want to revisit that topic and take a look at some of the tools that I think you should check out and see what they offer let's just call this our AI design assistant 2.0 foreign whether you love or hate Adobe you can't deny that they have a massive Suite of tools and one of the new ones that you'll be releasing relatively soon is called Firefly now Firefly is a creative generative AI tool and that sounds really Grand but what it does is pretty cool the first thing to note though before we even dive into what this does is that this is being trained on images that you don't have to worry about copyright so images that are part of the Adobe stock library and other sources and anybody that actually submits their images to be used as part of this will get compensated now this is Adobe so we have no idea what kind of level of compensation but at least this removes our batteries as designers for the copyright problems that we have at the moment worrying about using these in any conversional capacity now what I think is exciting about something like Firefly is its ability to not just create images but also allow you to use it as an art tool with AI as the backing side of things so if you wanted it to generate something you could do that however you could also use it to customize images to remove backgrounds to introduce other art Parts into it to use it to create custom brushes and so much more this is something that I think is incredibly exciting I'm not an adobe user anymore but this is something that I really do think would be great to bring to more platforms and open up what you could do with a tool like Firefly if more tools like affinity for example started to use this kind of Technology pretty cool now I've signed up for the beta of this so I want to take a look at what this looks like and as soon as I get access to Firefly then I'm going to show you exactly where it all works like ultimately we should all be able to sign up for this as long as you've got an Adobe ID you don't have to have a paid account I don't believe you should be able to get access to the beta now the final version that's a different ballgame but at least it would allow you to try it test it see what kinds of things you could do with Adobe Firefly now I'll put links to everything I'm talking about in the description below so if you want to take a look at these things in more detail by all means check those links out and take a look now sticking with the big hit is out there if you are a Microsoft user you may have heard of Microsoft designer now forget this to do with publishing all those kinds of bloody awful things with word art and clip art and all that kind of junk designer is an AI based version of a simplified kind of version of canber it's a design tool that allows you to use AI to create and generate various different types of media this connects up to Dali to create the images if you don't want to use your own so you get the AI side of things there personally in my brief testing I found the dolly side of things just to be a little bit poor I think there are better platforms out there like mid-journey like Leonardo and those types of tools Dali still has a long way to go I think to come in line with any of those kinds of tools like using stable diffusion and those types of things so what you basically have is we're using the designer co-pilot which is another AI based kind of platform that Microsoft are pushing forward co-pilot side of things and you can kind of use this to create your own images upload and so on so you kind of give it information or you start from blank and then you can kind of go to the iterative process of Designing things now my very brief testing of designer from Microsoft I haven't found it to be that inspiring I haven't found the AI to be that powerful or that good but it is still early days it is still a beta product this isn't a final release so it is interesting to see where this is going and it's nice if you want to use this as a source of inspiration you can do that I would recommend signing up for it it took a couple of weeks before I got access to it sign up it test it out and see what you think cool things are you can have brand kits inside just if you come from something like canva where you've used that you could use it inside here and then like I said the integration to AI is interesting and we'll have to see how this develops considering that they're using you've got Bing chat and that's going to start bringing image creation as part of that that's currently I think in beta version Microsoft are really going all in on what can be done use using AI as part of their platform for searching for asking questions for image creation for design those types of things it's interesting to see where this is going now the third of our big hitters is well let's be honest about it we know Google's going to get in on the game and Google are soon to be releasing Bard now you can sign up for this at bard.google.com again links in the description I'm still on the waiting list and apparently this is only for the US and the UK currently for the beta testing it's a bit interesting to see how this is going to work so this is again using that kind of large language model I get the feeling this is going to be very similar to what they're doing with Bing chat from Microsoft and let's be honest about it Google we're never going to stay behind and let's hope this actually is a good platform for using AI for those searches and changing the way in which we search and look for content and ultimately create content as soon as I get access to this I'll create a video on this to demonstrate what can be done with Bob from Google now let's be honest most of the attention when it comes to creating AI images has come from things like Dali and from mid-journey two platforms that have kind of got huge amount to press but I've been testing out leonardo.ai which again I'm using the free version of this so you can sign up for the feature of this you can get access to it there's a paid plan or a couple of different paid plans I'm not using those this gives you I think it's 150 credits per day to be able to create images in various different styles and this is to me the next generation of what we're going to see with the tools like Firefly from Adobe with Leonardo where we don't need to understand the complexities of the prompt we get a much more straightforward interface where we can just put our basic prompt in and we can tweak and refine just by using check boxes using Styles and so on to get started let me quickly show what I'm talking about this is the interface that you get now what we're seeing at the moment is the kind of home page where we've got recent Creations but you'll notice if we take a look across the top these are the featured models and these are the styles of images you can create so again this removes that kind of prompt recognition and understanding if you want something to be a vintage style photograph or you want it to be in a paper art style or any of the other options that are available here you can simply choose use those from the list and then you can use those as a starting point so for example we might want to use this deliberate 1.1 we can generate with this model you can see I've already created some different recent generations and you can see we've got prompt generation so we can come in and we can start typing in the prompt you can see we can type what we want we've got the model that we're using in this case deliberate 1.1 but we can change this to any of the other options inside here you can see we can choose different styles we can use negative prompts prompt magic the number of images you want to generate and then on the left hand side we can choose the image dimensions and different things will cost different kind of credits you can see at the moment I've got 150 credits if I want to upgrade I can jump in and you can see we've got up to a maestro kind of option where you could pay monthly or annually depending upon what you want to do for me I'm quite happy with the whole free tier it gives me more than enough to get started and play around with it once you're ready you can go ahead and start typing in and like I say you can fine tune and refine this set your aspect ratio all those types of things can be done inside this without needing to manually do this like you would with mid-journey and then once you're happy with the prompt you want to print you simply hit generate it tells you a number of tokens that are going to be used this will then go ahead and start creating based upon the prompt that I've put in the one thing I really like about Leonardo is the upscaling it gives incredible results you can see this is what we start off with we click to open it up it already looks pretty good it's using that style model that we've already selected but now what I can do is I can go ahead and you can see I've got icons at the bottom so I don't need to type anything in or mess around I can just say I want to upscale this I've got a couple of different types of upscaling I'll choose the first one that's going to go ahead now in the background do the up skating for me and we should then be able to see the difference between the original image and the upscaled version which is generally depend upon the type of art that you're creating can be considerable and I'll show you some examples once this one is finished so this is our original image and we can just switch between the various different versions at the bottom we'll change this now to the upscaled version as you can see it's sharper it's more detailed and it already looks considerably better now there are still some limitations we're going to see with tools like Leonardo or anything and they are getting better hands it doesn't really do hands very well as you can see my cyberpunk girl has five fingers and a thumb only one hand however if you're not looking that closely you can kind of get away with it but you can see it's pretty cool and if you find that you don't like the upscaling on that version you've got a different upscaler which is the alternative so they say if you find you lose detail you can choose the option to upscale using this alternative upscaler to get different versions and variations so it's pretty cool what you can do and if we take a look at some examples that I've been working on previously you can see if we open this one up this is the upscaled image this is the original image there's quite a considerable difference between the two if we open this one up this is the upscaled there's the original and this is the alternative upskilled image so you can see it's kind of like a halfway house between the two of them now jumping over into mid Journey mid Journey has recently gone up to version five and this again removes a lot of the limitations and the issues we have we get higher resolution we now have 16x9 as a default aspect ratio there's a lot of different things inside you you'll find when you create something like for example I've created these kind of desolate sort of cityscapes when you then move over to upscaling it's incredibly fast because it seems to be that it's creating a higher resolution images in the background the same time it generates them originally and then when you go ahead and you say you want to upscale it it pretty much takes a second or two and that upscaled version is already there so that's pretty cool but again I've been using mid Journey now for quite some time and the results are getting so much better like this for example you know as you can probably tell I've kind of been inspired by The Last of Us at the moment at the end scene if you haven't seen it I'll give you no more but there's giraffes in it but you can see the image itself comes out looking really really good you want to open in the browser to get a higher resolution version you can do that and then once I'm happy with the image I'll use a tool like pixel motor Pro 2 super resolution this and that does an incredibly good job depending upon the type of image but you can take these images you can load them into something like that like pixelmator Pro like Photoshop any of those tools upscale them edit them to get the colors exactly as you want and you can get some amazing end results perfect for different types of websites now again speaking of websites if you want to you can easily use this as inspiration so for example I've gone ahead and done a couple of Inspirations for different types of websites you can see there's some examples that I've got you can see this gives us a really nice looking clean design and we can then take that as inspiration and start to create it using a tool like figma or lunacy or any of those kinds of tools we've got an abundance of options available to us to kind of get creative with these types of tools and then for me I've been using which is a Mac only tool but there are various different sort of versions of tools like this you can use I've been using freeform Now to create kind of mood boards for projects that I'm working on or for fictitious projects for tutorials so for example creating a coffee shop you can see these are some of the branding ideas that I've got I can use these as a starting points now the text is still way off what we need but it gives you a great way of creating mock-ups that you could then hand off to a client to get feedback on your initial ideas without investing a huge amount of time creating all of these yourself from scratch you can see if we come down I've got some mock-ups inside you again giving me a good starting point to inspire me in how I want to move things forward so creating mood boards with tools like freeform is a great way of being able to get together and have ai create some starting point ideas for you now I've been using chat GPT for a very long time well relatively long time in Ai and I recently upgraded to the paid version to give me access to GPT version 4 which is the latest language model for working with chat GPT so this improves what we have with the previous and the free version which is chat GPT 3.5 so once you get access to that you can see you are limited to the number of kind of messages you can do and this keeps on dropping when I signed up for this probably about two weeks ago it was a hundred messages every three hours now it's down to 25 because the servers are probably getting hammered at this point in time but that should still be enough to get your conversation started to kind of get an idea of what it's like working with it now for me I use this to do things like I'll take content that I've written for email marketing or for website ideas or for landing pages and I'm not the best when it comes to marketing language so what I'll do is I'll write out what I want to cover and then I'll use chat GPT to refine that and change the tone of voice to give it a certain feel and to give consistency across whatever it is I'm creating I found this is a really solid way and you don't have to worry then about copyright because it's literally taking what you've written and changing the tone of voice changing the word and changing the structure but still ultimately your words that it uses now sticking with chat GPT and large language models and so on you've probably tried using this to write code and maybe being a little bit disappointed with the end results why primarily because it's not trained on tools like WordPress it's not trained specifically to write code however you may want to take a look at code WP this is using chat GPT I believe as the kind of core but this has been trained on WordPress now I created a video on this very recently which I'll link in the description below I would recommend taking a look at that it's going to cover it in a little bit more detail but the free version allows you to kind of create PHP code but if you want to pay a for this you can actually jump up and have it work with Elementor you can have it work with woocommerce PHP and all manner of different platforms pretty exciting to see where this is going again you do still need to have a basic understanding of the code to make sure that what's being smart out actually makes sense it's secure it's safe and all those kinds of things but if you're looking for a way of having code generated for you using Wordpress and some of the tools that go with it check out code WP I think you might be excited to see where this is going now before I wrap things up I want to go back to chat GPT not specifically for that but for something I came across recently now I watched a video a little while back about prompt generation in chat GPT now you may be thinking what the hell is that well prompt generation or prompt generator allows you to take chat GPT put in some instructions and then get it to ask you a series of questions that you can keep on answering for as long as you want and each time you answer more of those questions it will refine The Prompt that it actually generates and then you can use that to tailor make the response you want from a new chat in chat GPT now this might sound complicated but let me just show you what I'm talking about and I'll link to the original article to give credit to Brett Littlefield the guy that actually wrote this out check it out for yourself and give it a try so all you need to do is simply go ahead and copy this little block of text that I'm gonna Link in the description below I'm gonna copy that from there we're going to head over to chat GPT we're going to drop this into the first part it's gonna be our first prompt so you can see now what would you like the prompt to be about so it's asking us a question to give it information to start asking us more questions so let's just say we want this on affiliate marketing I will leave it at that so now it comes back first of all with a prompt a revised prompt this is the starting point for the whole conversation it will then give us suggestions and then finally start asking us a couple of questions now you don't need to answer all the questions you can ask them yes or no you can give as much detail as you want you can answer them in any way and you can ignore them completely if you want to but you can see it starts asking us questions are you looking for general information or specific strategies so we're gonna say we hit sort of returns we go to the next line do you want to focus on any particular platform or industry let's just say cosmetics because as you can tell I wear lovely lady makeup and then you say are you interested in learning about specific tools or resources for affiliate marketing for that we'll just say no so now we've answered those three questions so hit enter it will now go back and come back with a revised prompt so you can see now the The Prompt is kind of being generated and expanded based upon the suggestions it comes back with and also the way in which we answer the questions and then once we're happy we can simply grab that revised prompt start a new chat inside chat GPT use that problem we should end up with a much better answer or series of answers or whatever it was actually asking it to output for US based upon this conversation with these questions with these answers we are submitting pretty cool and it does work really really well so I would highly recommend if your chat GPT user give this a try and see how it shapes the actual prompt you create and ultimately should give you better responses based upon that prompt using this answer sort of question and answer kind of process and that's what I wanted to cover this that are out there right now and the things that are kind of growing AI is moving at an incredible pace and like I said at the beginning of video as designers we need to keep on top of the tools that speed up our process create good starting points and inspiration that we can use to get better at our job and ultimately become more profitable more productive and faster at what we do as always though I would love to get your feedback have you tested any of these tools do you have any tips or tricks that you want to share with everybody drop those in the comments section below as always all the links to everything I've covered are in the description my name is Paul C this is WP tetson till next time take care [Music] thank you [Music]

Channel: WPTuts

Views: 15,061

Keywords: WPTuts, Web Design with AI, artificial intelligence, AI design, AI design assistant, ai inspired web design tutorial, ai inspired web design, ai web design, ai web design design, chat gpt, web design, web design trends, Leonardo.ai, adobe firefly

Id: S5J5iZ_wmJc

Length: 18min 38sec (1118 seconds)

Published: Wed Mar 22 2023