‫Hey, there.
‫Welcome back on the site.
‫Now let us start our journey with a new project.
‫Now this project is important.
‫As usual, I'm going to analyze this important word, but they are.
‫Definitely this is important because we are going to now revise everything that we have learned in now
‫and implement them on a single project.
‫That means we'll be covering about animations, transition, transform, maybe background hamburger,
‫manual assuages seasons, libraries, channel responsiveness, flex bogs, great display position,
‫every single concept that we have written now.
‫Not only this, we will also understand about a few new concepts like maybe understand about scrolling
‫on, maybe understand something related to before and after.
‫So we are going to work with multiple things throughout the whole project.
‫Now, if you observe this whole project looks like something related to education that is edtech.
‫So we are going to build a landing page or I should say, a complete website related to high school.
‫I have given up project name as high school and one more important thing throughout this whole project.
‫You will also understand about freelancing, how I started freelancing, how I build my projects as
‫a beginner.
‫So this will help you a lot.
‫You will also understand about folder structure and a few other concept.
‫So these information will help you to understand some basic concepts of freelancing as a beginner in
‫terms of HDMI conciousness.
‫So the first thing is, if you observe this whole Web application, you will see I have a quick menu
‫with some how what effect, then I have two buttons on my logo, some information on this side, as
‫well as images on this side.
‫You will see these objects.
‫I'm moving because of infinite animation, then how you will see some background.
‫This is because of before then you will also see some other objects floating here and there.
‫And if I refresh, you will see this button is moving.
‫So this is related to animation.
‫Also, you will see these these are moving from side.
‫So these are part of some animation, some related to transform something like a good transition.
‫If I scroll down, I bet you will see the section that contains several information, have some power
‫effect and few other things.
‫So this section guess is designed by CIUSSS Flexbox, and maybe this section is designed with the help
‫of CSIS, correct?
‫And if I scroll down a bit, you will see and get knowledge about this with some background and again,
‫see Flexbox.
‫Now, remember, this whole website is responsive, so by right click click on Inspect.
‫And if I go here, you will see a complete website design responsive.
‫And at this point of time, my menu is fixed.
‫I also had a little bit of JavaScript, so I can have this type of menu.
‫OK, now this is some additional content that will help you to understand how to do this as a beginner.
‫Cool, this looks fine, I hope you got the idea.
‫Now the aim of this project is to just realize we will try to be faster than our usual speed.
‫OK, I hope you got the idea.
‫You can also check out this demo.
‫This will help you to understand what we are going to be.
‫It's an educational website landing page.
‫OK, that's done for the project.
‫But I was saying something related to freelancing, right?
‫So, yep.
‫Let me explain things whenever I get a project I'm talking about as a big not now, as a beginner right
‫now, what I used to get a project that's starting off any type of freelancing project for HDMI as he
‫is not the direct website.
‫You folks create a wire frame or I should say we draw something and get approval from a client.
‫OK, this website looks good or not if this structure looks good or not.
‫Or you can utilize Figma, you can design your website on.
‫Figma might take you one hour to work and you create your best design about how your website should
‫look.
‫Once that was done, you create some elements, maybe this image, or maybe this image.
‫All of these images are designed by yourself when you are working as a freelancer.
‫So if you have some designer, you can do that or you can utilize easy tools like Canva or maybe Grillo.
‫If you have no knowledge about Photoshop, you can utilize them.
‫So as a beginner, I used to utilize this scan module.
‫As a beginner, I strongly recommend to utilize this tool even for self projects.
‫If you have knowledge about Photoshop or you can utilize the school as Photoshop, yeah, it's a great
‫tool and can help you to design or do all the tasks related to Photoshop.
‫If you observe, I have designed everything on Canva for this whole project, so maybe you are working
‫on yourself project.
‫Maybe you are working on some school projects on college project.
‫You can do that yourself.
‫And that's the image.
‫I'm showing you everything.
‫If I just jump onto this whole subject thing, I have designed every single thing.
‫Maybe there's a banner you can see every single element is designed on Canada, and I'm not using Canada
‫Pro cannot give a lot of other feature.
‫I'm just using the basic camera version and I'm just demonstrating this so you can create your own ideas,
‫your own images for free on a software as a beginner.
‫You don't have to pay.
‫You can either use this Columbia or you can use these tools like an marcano.
‫If I jump on to another image, every single element is designed by me on this whole thing, this whole
‫app, and it's for free, and I strongly recommend to build at least one project by yourself where you
‫have your own image, your own imagination.
‫So if you see every image here is designed by myself, if you see background colours or any type of
‫everything is a part of imagination, so you need to spend some time.
‫It's a good habit.
‫As a friend, then developer, as a designer, as someone who is currently interested to jump on to
‫you or you as a PR mcnab, this habit will help you.
‫Now, one other thing one other tool.
‫I hope you remember this about rebel.
‫Now, this tool is pretty important to get design ideas, so maybe you are creating a tech startup,
‫maybe you are creating something related to YouTube or anything else.
‫You can search on dribble and get some idea.
‫Maybe I'm working on form so I can just ride from here.
‫Search and you will see different ideas, what type of form you can create or what type of color combination
‫that will work for you.
‫So you get the idea if you observe this, OK, you can utilize this light background and then there
‫will be a darker border.
‫I can use something like this on.
‫Maybe if I scroll up, I will have different ideas.
‫This looks good.
‫Dark blue, as well as black as well as white.
‫So you get ideas of different types of forms, different types of phones, as well as design with this.
‫But OK, that said, I hope you got the idea how to design your own content as a big no.
‫Now, this whole section or section of the designing thing was not required, but I think a big section
‫of you are going to work as a freelancer on its end done or maybe you are going to create your own projects.
‫You need this type of information.
‫And I hope this lecture give you some, some basic idea.
‫OK, now as you grow as a freelancer, as Einstein or as a developer in real life, you hired, maybe
‫you have your own designer, maybe in your team, you have designers, so you don't do this yourself.
‫Every time you will use professional tools as you move towards industry, maybe you are working as a
‫freelancer now you have some experience of basic project.
‫You are going to work with Photoshop because you need profiles.
‫You are going to work with Figma because you need beams to work together.
‫So Canva is good for a beginner, but then you move towards professionals.
‫OK.
‫I hope you got the idea.
‫Now let me jump back from the next lecture.
‫Let us start his journey with this new project and understand everything.
‫Or I should say the why is everything implement and build this website quickly?
‫Thank you for joining.
‫I hope you got the basic idea about how designing work for art freelancing project and I see you guys
‫in the next one.