Learn Web Design In Photoshop By Practical Projects | Soheil Faal | Skillshare

Learn Web Design In Photoshop By Practical Projects

Soheil Faal, Graphic Adventurer

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
38 Lessons (7h 49m)
    • 1. Introduction

      0:52
    • 2. Working with groups

      1:28
    • 3. Layer style

      6:46
    • 4. Working with shapes

      6:02
    • 5. Align and distribute elements

      2:57
    • 6. Slider

      17:02
    • 7. Features

      20:45
    • 8. Intro

      24:15
    • 9. Featured works

      9:44
    • 10. Testimonial

      8:37
    • 11. Counter

      18:02
    • 12. Big blog

      8:29
    • 13. Intro box

      14:19
    • 14. Options

      12:54
    • 15. Breaking news

      5:49
    • 16. Team

      9:35
    • 17. Contact

      11:59
    • 18. Twitter

      8:57
    • 19. Footer

      6:14
    • 20. Project 2 menu

      9:19
    • 21. Project 2 slider part

      14:48
    • 22. Project 2 intro part

      8:50
    • 23. Project 2 work part

      10:42
    • 24. project 2 featured part

      20:03
    • 25. project 2 download part

      15:34
    • 26. Project 2 team part

      14:27
    • 27. Project 2 skill part

      7:49
    • 28. Project 2 services part

      8:37
    • 29. Project 2 features part

      11:26
    • 30. Project 2 blog part

      21:50
    • 31. Project 2 slider 2 part

      11:16
    • 32. Project 2 pricing part

      18:04
    • 33. Project 2 online store part

      36:18
    • 34. Project 2 contact part

      16:05
    • 35. Project 2 featured box part

      13:18
    • 36. Project 2 footer part 1

      12:54
    • 37. Project 2 footer part 2

      19:35
    • 38. Project 2 menu 2 part

      3:25

About This Class

Hello everybody.

This course is called "Learn Web Design In Photoshop By Practical Projects".

In this course you will learn the latest tips and tricks to create modern and awesome web templates in Photoshop.

By taking this course you will be able to learn web design in Photoshop based on Bootstrap grids.

After this course you will be able to create a complete website in Photoshop and you can sell your design or work as a freelancer.

Take this course If you have basic knowledge about Photoshop and you know the tools and you want to create web templates in Photoshop.

Thanks

What are the requirements?

  • Basic knowledge about Photoshop and working with tools.
  • Photoshop cc is recommended.

What am I going to get from this course?

  • Students will able to create a complete modern website in Photoshop .
  • Students will learn the latest tips and tricks to create a website in Photoshop.
  • Students can earn money by creating modern websites in Photoshop and sell in digital marketplaces.

What is the target audience?

  • Students who want to improve their UI design in Photoshop.
  • Students who want create modern bootstrap based templates in Photoshop and sell it.
  • Freelancers that need to improve their web design in Photoshop to get better projects.
  • Web develop teams that need to create their works in Photoshop first.

Transcripts

1. Introduction: Hi. I'm sorry. Fault. In this course, you will air Web designing for the shot by practical projects he scores requires basic for the shop knowledge and after completing the scores, you were able to create modern web templates in 40 shop based on put the strap breeds, you will able to create a conflict website in for the shop and sell it in marketplaces or work as a freelancer. He scores is completely practical, and you will have access to project files. So if you already to create all some web templates in for the shop and improve your s skills, join this course tanks for watching thes introduction. 2. Working with groups: Let's take a look at groups on working with them in for the shop. First of all, I'm going to create to shames in these documents, and I can set a different color for them. Daniel Layers panel. Select both shapes by holding shift key. Go to this part and select group icon to create a new group, and you can rename it as you can see Just Wan Khaliq. You need to rename it right click on this group and like this, you can on group it and you have another option. You can press control or command G two. Make it group for some elements in for the shop. By holding control or command J, you can duplicate it and a gang you can write Khaliq, and from this panel, you can duplicate your group. When you move a group and you see a solid horizontal line, it means that you have moved a group upper than the other one. And when you see a rectangle around the group, it means you have moved the group into another 3. Layer style: in this video, I'm going to talk about layers science, which is really important in any design. First of all, I create a new document, and then I'll come over the rectangle tool and create in your rectangle because I would like to explain layers times for thes shape. First, I am go to rectangle of Marquee tool and select this part. Then I go to move Tool and from the Options bar I select allowing vertical and horizontal centers. Then I double click on the layer to upon layers tiles. So here you can find many options, such as a stroke. Struck has some options like size, position, blinding moods, capacity. You can adjust the position to outside insight and center for DS rook, and you can change the size from thes slider like this and even you can adjust a new blending mode. Some of this blending modes are not useful here on they are not effective in this case, as you can see. Then I set it back to normal from a positive e. You can change the opacity and from this option, you 10 change the stroke to, for example, gradient. If you want to have a gradient around the shape so you can see the difference. When you select gradient, you have new options that you can see on their names. The gradient born Let's go ahead and test something in graduations so you can see that's how I changed the color. Or you can change the angle to something that you need or that you want. We have some options, such as diamond and linear, and you can work with this scale for the gradient like this, and there is another option that can be useful, and it is patter around the shape as a stroke from this panel, you can change this stroke, do something that you need, and from this tool icon you can upload or load and new patter. Then you can change the scale off this pattern. You can read the use it or increase it as you need. Let's go back to collar mode in this case, as you can see, I have added a new a stroke boy dip loss icon next to this truck. So from this option, we can have two different strokes around the shape. Let's see on other options such as drop shadow because It's really important for this course, so you can set this values on. Change it, you can see the result and even you can change it. Straightly boy. Moving it like this on you can set a new rapacity as you could do in a stroke option. And from this part, you chan sit and new moat for this drop shadow option. You can play with all of these options if you need. I said it back to a linear. Also, you can have it costs them effect for thes drop shadow. Let's play with this values Life teas. I can hold this arrows. And from this collar picture, you can change the color off this drop shadow. Let's test another perimeter here, like in her shadow. You can test any parameter here, and you can see the preview in your document. Let's go ahead and change the blinding modes to multi play, or you can change it to another one. Then take a look at color overlay option. Let's go to pattern overlay in this case, and if you apply it, you can see the result here and you have some patterns in your shape. Let's go ahead. I really activate bevel and MBAs in this case, some off. This options are not useful in this course bought. They can be useful in Are there parts off 40 shop? 4. Working with shapes: in this video, I'm going to show you how to work with shapes. So our income over the rectangle, too and select it. And like this, I can create in your rectangle and from the options bar. I can set a new collar and a stroke for that. So let's go ahead and create a new rectangular market. You'll then, from the Options bar, you can align vertical and horizontal centers, as you can see, then go to feel. And from these part, you can set any color that you need. And from thes icon, you can use a different gradient if you don't need to a sonic color. And here, from this collar P care. I can change the color off this gradient, and from this slider we can change the value. Let's go ahead and explore more about this panel, and I'm going to use pattern for the ship, and I can use do your friends patterns and change this game like these. And from this icon, I can't load new patterns, go back to Gradient and select new garage Ian's. You can load a new gradient on like this, You, Chen, remove any sign that you need and let's go back to call a picture. I want to use a solid color in this case, and I can select this option toe. Fill this rectangle with no collar. I can't have a stroke from a stroke option. I can change the thickness. Let's go to these options bore. I can organize it on. Show this rook inside outside or center off my shea. I can customize it more like this. You can adjust the edges, so select this part and go back to no. A stroke option, because I'm going to show you other options. Let's go back to rectangle Tool and fill it with a solid color like this. Create a rectangle, then create another rectangle. Go to the options bar and select. Subtract front shapes. It is how I can subtract DC's Intersect option. And on all their one, you can have Mawr Options year. You can select combined shapes and let's go back to subtract front shapes. This is a result. I would like to show you other shapes like rounded rectangle, so I selected and it start to create a new round the rectangle like this, and from the Options bar I can change the radius. Let's go ahead and see the results. And I created this is the result. I have different ages again. I do it and I have another different around the rectangle. Select these layers and delayed them. Go to Ellipse Tool and create a sujal. How? By homeland shift key. Let's go ahead and set a s truck and I'm going to create on on their shape. I can use these options such as subtract, intersect or combine as I need in my projects. This is a lips tool and go ahead. I'm going to show you how to create polygon shapes like this. You can change this science from the options bar. Do everything you want. You can create exonerees shapes or worked on old shapes. Just change this side's from the options bar. You should put a different numeric value into that barks. We have another option that is called line tool. You can create a different line and from the options bar when you change the weight so you can't set a new thickness for the shape you can use on Lee A s truck for this lying or you can feel it with a solid color. Let's check. Cost them shape stool. And from these option, you can create a cost them shape, and even you can load more shapes from the's icon. Just you need to select low shapes and go ahead. I remove it and I go back to great tangling tool. You can create a new rectangle by tapping on the screen and feel wits and height. Reach your numerous value and you have these options. You can increase the size by holding shift key and using transform tool. 5. Align and distribute elements: This is a common question that how we can position new elements in a document. Let's check the answer, create new rectangles and set a new collar for one off these shapes from feel you can do it , then go to move to and from layers panel. Select both shapes and from the Options bar. Select align vertical centers or a line top edges or align bottom edges and a lying horizontal centers. You can see just one shape. Let's move this shape to the top and again do it. Align horizontal centers. Align, laughed, edges and align right Ege is, and you can see the result. If I select a long vertical and horizontal centers, I have positioned the smaller shape through the center. Off the bigger shape. Let's check another option, so I go to rectangle tool and create a rectangle. Then I make some copies by holding all key. Then I select these three shapes and select distribute horizontal centers. That's means I have created three elements that have equal this dance. It's being each other. Let's go ahead and create some vertical shapes, and I used distribute vertical centers icon. In this case, it means that I have you call these stands beats being my elements Vertical e. So you can use distribute stoppages, bought images or other options such as distribute laughter, jizz and right. Just like this, I'm going to show you another option. Let's remove the shapes and layers panel and create a new rectangle here. Let's do it together and create an uric tang. Yell like this, then go to rectangular marquee tool option and create a new rectangular marquee tool like this. Feel the document and select align vertical and horizontal centers, so you have positioned this shape to the center off your document. 6. Slider: in this section, I'm going to create on agency website with this numeric values. Rename it to agency press create toe. Have a new document Zo mean, then a screw up 30 view Select new guy layout in order to have a Buddhist struck template. Inter 12 for numbers 70. Big sells for wits and started pick sells for gutter press. OK, zoom in a gang Seletto rectangle tool top on the screen to create a rectangle and put this numeric value of four wits and to any eight centimeters for height and apply that select move tool. Position it here. In this document, go back to Rectangle Tool and from the Options Bar Select Feel. Go to call our PKR. Change the color to this one. Press enter to apply it. Zoom in the game, go to the left side, select textile and use later for the fount tap to activate the taxslayer and start to time . For example, Company logo radios the phone size and customize it by changing logo text color to green and press a Kate Select mortal. Drag it to the left. All right, go ahead and start to create a menu here by changing the phone size to 14. Change the color to white. To see this text layer visible. Use a regular phone size press 10 space bars on your keyboard, then type another award, for example, Page. Then copy the space bars. Paste them by holding control or command V and type on other words. Here portfolio features. Next through portfolio blanc, shop and contact. The menu is finished. Tap to return or applied at. Got to move tool. Drag it to the right Selectric Slayers by holding shift Key Ally in vertical centers From the Options bar, Go to menu double click on the text layers icon. Select features go to call our pkr. Change the color to green. Select textile tapped to activate takes layer time home here said the color to white select move tool. Position it on their home in menu. Go to rectangle Tool creates a rectangle here from the options bar. Go to feel and fitted with no color just used struck. Then you can adjust it from thesis slider. Expand the height by holding all key, and you can expand it equality. Then go to her selected by holding control key and go to rectangle align vertical sinners and hard dental centers. Then remove the second home text. Got to the right side. I'm going to create a custom. I come here so I select lying tool. Go ahead and create a line here said the color to white. Zo me in. Make a copy of it by holding onto Key again. Do it. Select these three lines. Distribute vertical and horizontal centers from the options bar, as you can see. Then drag them to the top. All right. I would like to add a search icon on the right side. So up in a phone. Awesome! On your browser. Look for a search icon. We can find different search icons here, but I will like Teoh, choose a free icon. So I select this one. Scroll down, then copy. Believe icon, Select textile. Change the phone to phone our some free solid. Then paste the belief icon by holding control or command V here, you can customize it. Then I'm going to a line. These two I can't. So I create a new group for lines. Select these so icons and weekend align vertical and horizontal centers. We can do it again. Four All of the elements. It's off to you. Select on the layers and from the options bore the lie. Vertical and hard isn't all sinners. This part is complete. I'm going to add a title and a slogan for these slider, so I'll select textile tap to activate that takes layer. Then I go to foment on the options bore and Chen's. That's back to later. You can increase the phone size here. Then it start to type a sentence. For example, the company title and slow again goes here. It is too much compressed, so I double click on the text icon and go to text options. I can change the vertical distance between the lines. I select 48 points for this purpose. I'm going to customize this sentence and I'm going to emphasize on title this log in by changing the color and it's done so I can drag it to the down like this again. Select textile toe. Add another text layer zooming type something here, so it's not reasonable because we should change the collar. So I said it to white. This is the second sentence we are going to add. We have everything you want Come on Where? Move Tool. Drank the's text layers to the left. Go back to text tool. Create a text box Here, go to Laurie um epson dot io The website that you can generate random paragraphs or sentences so generate, then copied at. Go back to your document, then pasted by holding control or command V said the color toe white. Reduce the phone size double click on the text icon Dan. Go to tax options by holding control or command t Here you can customize the tax layer so you can expand the text box like this and we're going to remove two lines from this paragraph again selected. Go to tax options. Change the vertical This stance between lines like this selected and after dat pillows Tax options Go to rectangle here I want to at a call to action Bottom So I curie eight a rectangle here Then I use tax tool to type per chase. Now select the rectangle by holding control or command key. Go to text and align vertical and horizontal centers. Here is the call to action Bottom Go to this fire. It is available in your exercise file. I'm going to add a desktop as on image for they're right side. I put it here Then I can zoom in to have more A cure a c I can position it like this and I can get help from smart guides off for the shop. In this case, select rectangle a gay. I want to add left and right arrows to this slider. So I create a rectangle here and I can ally needs. Then go back to phone tossem and search four angle Here is some Icahn's So I select I'm Gil left Copy DATs go to text tool Change the phone too. Photo Assam free Solid pace that I need. Teoh, increase the phone size so I change it. Align it to the center. Make a copy off Dat by holding all key and drag it to the right Like this again You can aligning it Vertical e to the center, Off your background. Open up phone calls Some again Search for an angle, right? This is what you want. So copy that. Do the same as you did before. Select textile press enter to release the shape tool because if you don't want to use it paced death belief icon. Do the same. Teoh. Position it in the center. Off this rectangle, you can set a different color for Theis Wreck Tango, as you can see and it is done here is this slider we have made for the website. Finally, you can select on the layers by holding shift G and create a near group four then. 7. Features: on their knees. This liner I'm going to at features part so I select shapes and create a new rectangle with this wits and to any one centimeter for height set a new collar from color picker changes to green position needs. Here it's good. Zuman. Go to the left again. Go back to rectangle tool. Create in a rectangle exactly like this. Set a new collar and set it to white. Go back and select rectangle Juan by holding control key. Then go to the second rectangle to align vertical sinners. It is dawn DoubleClick on the second rectangle goto layer style and at a new a stroke to this shape, here is the shape that we need for these features part. Make a copy off this shape. Drag it a little bit to the top again. Do dance, Duplicate these shape, drag it to the top like this and it is done. Now I am going to feel inside to shape. So I select cost them shaped tool and from this icon open eat select ah exact journal shape and it start to creates it here. Then we can set a new color for DATs. I'm going to use a gray color press enter to apply it. Then I can easily use alignments in this case. Make a copy off this eggs agonal, then expanded using shift key press. Enter toe, apply it. Go back to the 1st 1 drag it to the top and select the bigger one. Set a new collar for dat from collar. P care seems that we have created a stroke around the shape, then select both eggs are gunnels and create a group for them. Select Mostel and now you can use alignments. Two. Position damn in the best situation on their knees, the shape I'm going to add. It's high toe. So I tapped to activate text layer and I type make a pack. Change the caller as you want, so use move. Tool to position. It's You can drag it to the top or to the down select line tool from shapes on. Draw this line here and again. Set a caller for dat so you can drag it to the top to create an equal. The stance. It's feeling elements underneath the line. Create a text box like this and open up your browser and go to Lauren Epsom that I, uh generate some progress here. Copy that. Then go back to your documents. Use a regular later funt with this size and paste it double click on I context. Go to text options. Change the vertical distance between lines like this. You can use 18 points or 24 points in this case, expand the text box to remove extra lines like this. We have some other extras here. I'm going to remove them because it is too much for a description. Drag this text box to a top and clothes takes options. Here you can change its collar to gray. So we have one feature in this case. We need to add some new details to this box. I'm going to add a call to action so I select rectangle and creates a new shape here. Just go to feel from collar. Pick your set This gray color you can select this great color using I drop her. Let's go back to layers panel and do the same task as we did before it is alignments. So select the second white rectangle and activate this smaller rectangle that has great collar use. A line hard isn't all centres Icon like this. This is on empty rectangle, so we need to add the text into it. So I'm going to at a text layer here and I type lair more. For example, you can't align it easily. Using options bar, I want to reduce the rectangles size so I selected by control or command T Then I use shift key to Radio City, Kali from the bottom and the top. Here is the first feature box Dan. Go to the right a little bit. Select all of these elements except the first rectangle that has great color before DATs. Let's do some changes for this description. We can at Mawr vertical the's stands between lines, so it is complete. Now a gang. Select these elements by holding shift key created group Rename me to Box one duplicate this group by control or command J drag it to the rights use shift key to have more secure a C. Then you are dragging it to the right. Zoom out, Teoh. See, Theis Box says again, Do you replicate it? Drag it to the right using shift key. So here is the third features box. You can get help from guidelines like this again. Go to the right and make another copy off this group and position it here. Right on the edge. So we have four different boxes I want to do Is something especial for the third box. And I'm going to set a new collar for call to action and exact journal island. Cheers. This collar in this case and I'm going to chance collar off this shape a gang underneath this exact journal. We have another one that seems like a s truck. So I select it and go to feel and set a new color for that. You can These appear guidelines using control or command edge to see this document better go to the second box, change the Tyto to something that you want. I'm going to type save money here, Dan. I'm going to aligning its again. After that, I really chance the third box title too fast. Delay Vitti Let me type it and alignments again. Go to the last one type and new title 48 for example. Full support and it is complete. It's now, but we have on unfinished task here. Exact journals are empty and we should I feel. Damn, I want to put some icons into these eggs are gunnels, so I opened up flat. I cannot come on my browser type, mega select thes icon, go to PNG and select free download option. Then I drank the's icon into my project. Position it here where the first box is placed. It is necessary to reduce the icons size. I goto layers slide and change the color toe white. I can easily align it to the center of the exact journal, and I really collapse the first group. Then go back to the website type. Roll it. You can select each one deal like I select this icon and again download it in part. It into my project reviews the elements size, so we should Where the US more again, go to layer styles by double click on the layer. Change the caller toe white, aligning its Let's read us to Sizemore again. Do that, and the second box is complete. Now collapse this group. Go to the website type. For example, Deli. Very. In this collection, I select Theis icon or this one is better. Change it to PNG. Download it again, drag it to your project. Read us the size using transform, tool and shift key to reduce the size he Cauley for horizontal and vertical aspects. Double click on the layer. Set a wide collar for that again aligning it and go for the last one type support. We have some good icons for support. These can be good. I select it and dalati. It's imported into my project again. We need Teoh reduce the size, but it is in the third box, so we don't want to place it there. All right, go back and drag it into the last group so it is visible. Now set a new collar. Four. The support icon here is that just a little reduction is remaining here. We can make sure that it is aligned in the middle using options bar. So we have four different features. Box here at the end. Select the biggest rectangle in this part. Chance the collar to white or a gray color, then put all of them into a group. Rename me too features and use and red collar 8. Intro: in this video, I'm going to add an introduction to the website. So I select rectangle tap to create and new rectangle with this size and press. OK, go to feel so the color for that you can use our dropper in this case. Position it here. Use a guideline and position it at the bottom off the rectangle. Then go to tax tool. Select the color for you. It's start to type here. I'm going to type. What's our Misha? Did I drag it to the top a little. And I come over to rectangle tool. Create another rectangle with five centimeter and height again. Five centimeter. I'm going to change the color in this case and position it year left on the edge. Then I'm going to create a text box next to the shape Exactly like these. Aunt, Copy that paragraph from Laurie Medicine Thought I, uh, and change something here by using text options. Good to color picker. And choose a color from thes part. Copy that again. Go to these text layer, double click on it. Go to caller and paste the collar using control or command V. So we have a better phones here all right, go ahead and beginning to create a new element here. So I go to foment and increase the phone size. So I'm going to type. Our survey says here, Try to what we? Its guidelines carefully because they are exactly the Buddha strapped template you photoshopped. So you should pay attention to them on their knees, our services. I really ad a guideline to have more accu racy. Then I draw a rectangle like this. It should feel exactly these its pace and beat Wien These guidelines so noticed Adi's point Zo mean and move r seven set and it'll be too the laughed. Go back to the rectangle select text tool and type it text here on the rectangle, So change the color too. See it You can ready use the phone size from the options bar and were able to align vertical centers for Web design and a rectangle. Go back to tax stool, create a text box like this. It is not good in my idea. So I will try again. I'm going to create another text box and from Lauren Ipsa you can generate another paragraph on pasted here so I will get help from other elements here, too. Select a good color. This one is good. I double click. I need to go to collar and copy that color. Then I go back to this part selected and from color picker. You can paste the caller we're going to ready. Use the phone size even you can read. Use the text mark size. We have three lines, year as a description and khaliq on the rectangle. Then draw a Syria kill. Here, fill it with no collar. Before that, let's create that bets are serial here. Then we can fill it with no collar and have some struck for it. Get help from this. A slider to adjust a good struck for the shape. Go to the move tool and drag this shape. Select rectangle Boy Control key and go to search ill and align vertical centers. Go to phone out some dot com and open it in your browser. Look for angle and I'm going to use on guild down, so I append this page and copied belief icon. Then I select text tool and I go to phones on the options bar and look for phones are some free solid so I increased the phone size and after that paste it using control or command V . So I put it here. I can a line. It's as I need. Something here is wrong and you can see that it's not in a good position and it is not for the shops problem. Maybe there front icon has some problems, so you can change the position by dragging so like these layers and drag them to the right after DATs. So leg these tree layers and make it group for them. Rename it as you want. Then I will go two layers panel and created duplicate from this group. Select it, Andi. Drag it to the down like this so you can hold shift key to have more accu racy Here you can zoom in to see the whole part that you're working on. I'm going to change collar off the second box to gray. This color is good for this purpose again, Zo mean because we're working on these special area, go to the top layer and create a new text layer. Choose later for the phones and type for the graph e here, so you can again linings and you can get help from the options bar. We need another box like we have created before, so I duplicate this second barks for good, using control or command J then drag it to the down Khaliq on Photograph E and Change the Tyto 2 40 shop, for example. Year is the box that we have created. Just go to the sentence, make a copy off DAT by holding Ault Key, then drag it to the left. After that, select the third box and drag it to the down. Do this, saying for the 2nd 1 press eater to apply any changes. So we have done two parts of the's section ready for another part. Just I'm going to organize my layers by creating and new group. It is really important to organize layers in the layers panel. Then you want to create a website in 40 shop because you're working with lots of layers and if you don't do that, you will face lots of problems in future. So let's have a pause and goto layers panel and group related layers together, for example, for our services, we can group these four layers by holding control key or command key plus G. Then you can Ray name needs as you want. Complete this part by organizing layers in layers panel, and you can't renaming it as you want. Go to a bank loan layer select text tool and gets ready for the third part. Tap toe. Activate a new text layer year. Set a new color for that and type a tight ill here, for example, our capabilities so you can apply or return by tapping on the text layer. After that, I need to hurry. Position these layer so I get help from Move, tool and do. It's I can make some changes for and other titles. I can use alignments and distributions from the options bar collapse. The groups go to this text layer and come over the rectangle tool and select around it rectangle tool. Feel this. Banks and the radios with this number, then creates. They're surrounded. Wreck tango here, Press center to apply that or re terror, for example, if you want to apply it. But before that, so linked the's great color duplicated, resize it and read. Use the's shapes size to this one. You can work more for having more accuracy in this case, Go back to this layer, selected and again select the 2nd 1 and use alignments, then a school up to find a good color for this second around the rectangle. So I'm going to use Theis green collar scroll down again so you can see that the caller is changed. You're going to create some progress bars here as capabilities elements. I can't work more on these progress bar because I want to have some other copies off the's shape. So let's focus on it and make some changes for these rounded rectangle. For example, you can set a new collar for the fares. Rounded rectangle go to the 2nd 1 resize it. It's optional, and you can do whatever you want. Go back to the 1st 1 selected by holding control or command key. Go to the 2nd 1 and a line needs. They're selected and read. Use this size horizontally. Now you can see a good progress bar here underneath this Progress bar, come over tax tool and tied, for example for the shop 70% then resize it so you can zoom out to see any changes. Let's do it again and re size these Tyto so drag it to the top a little bit. Use move Tool for these purpose again. So mean, select all these three layers Rename eats to, for example, a cap. Juan. Make it duplication off this group by holding control or command J then selected group. Drag it to the down, as you can see again. Do it renaming to cap Cherie and do it for the last time Renay me to chop for So we have tree progress bars here. Let's position damn in the right place. I have place that said one. I don't go for the last one and movie. It's on their knees. The 3rd 1 We have some issues year and we shoot change. Uh, Capri position. This is time to get her from distributions from the options bar. And absolutely, I'm going to use distribution. Verity Cali to the center. Go to cap Juan, and you can see the details here. So go to Camp two and chance the Progress bar selected by Holy and Control or command t and expand it horizontally. Select these text and change it. Type a tie until here. As you want. I'm type ward press here. WordPress 80% go for the 3rd 1 and apply some changes here. Time Jake Worry Space Bar, 50% Go to this green rounded shape and resize it. This is time to apply some new changes for last Progress Bar. Select the text and change it to photograph E 90%. And this part is a K change. Sighs off each title to 14 point. Do the same for the last ty tell So it is done. Now you can collapse the groups to organize layers Pano and see the complete project here. Then select all these layers manky group for them. Rename me to camp and we have done this part. Then select a background layer. It is almost done. Just a few details Our remaining. So come over the rectangle tool creates a new rectangle with this sizes, then selected and position it here so you can get from arrow keys on your keyboard to have more a cure a C for this purpose, so lack Theis rectangle by holy in control or command key. Then go to this groups, making new group for them, renaming to intro, then select thestreet tango. Go to alignments and a line. The group vertically to the center then removed the background layer that you have creates it before 9. Featured works: on their knees. The intra part I'm going toe ad featured works as portfolio, so I go to rectangle and create a new rectangle with this numeric values and press OK, so go to feel and select a sharper color. For this shape, place it here at the bottom off the heart is and tall guideline that you can see again. Go back to rectangle and select a new caller for the shape. I'm going to use a gray one, then select textile and use later. Phone for your text tap to activate a text layer in your document and type featured works, then go to phone size and increase the phone size. Drag it to the left so you can align thes text layer hard Santoni to the center underneath . The featured works Create a text box here that's good. A school lot got to the previous part and select the's prag graph. Copy. That's boy holding control or command. See a game, go to the current layer and paste it so we have a paragraph here. Increase the phone size so we have tree organized layers, then align it to the center. We can increase the phone size more and we have a description underneath the feature works , you can drag it to the top or any extra changes that you need. After that, I'm going to create another rectangle with this sizes. Wits 10 point three centimeter and height. 7.41 centimeter and it is creates at here. Select rectangle tool and set a good color for that. For example, these great color is good in this case. Then drag it to their left after that's by holding all key. Make a copy of dance. Be careful about the edges. Then, from this part, you can change collar off the second rectangle, go to rectangle to and Soleil color P care, and from I drop her, Change the collar again. Select thes two rectangles and hold all key. Drag them to the right. Place them here and we have four different rectangles. For the next part, select all the four rectangles, boy holding shifty and drag them to the down, holding all key. Then select them and select fleet hard cental. So we have the second row again. Select these four rectangles, drag them to the down, holding all key to have the third pro place them here again. Use fleet hard, cental. So we have treat different rose year for feature works. Select this rectangle because I want to customize it and show a hover on eat. First of all, I go to feel and change the color, as you can see here. Then go to the previous part and select and Jill down and the circle around it. Make a copy off that by holding all key and move it to the down. And really, is it from the previous group? Put it here. So we have two new elements here. Just drag them to the top after Dad's here dragged them to the down, zooming because they are really small. So leg rotate 90 degrees counterclockwise to have a different icon, then make a group for them. Renay me to icon so we have a new group in layers panel. Then you can align the icon group to the center off rectangle horizontally, using the options bore as you can see in the video. Then on their knees, the icon group we need to a title. So I select textile and it start to time something here. For example, your war title here. The color is white, but I'm going to change it. So I get to the top from this part, set a new collar for that and use this green color, then got to the current lay year. After that, you can align the text to this center off rectangle horizontally. After that, we need to cost demise thes sparks. So I double click on the layer and use struck in layer this time panel so you can set a new color for a strike and press OK. Another option that you can use is drop shadow. From this panel, you can apply a different drop shadow for the bunks. You can play with measures for example, capacity size or other options. After that press OK to apply, Do you drop shadow and struck so you can see the difference here After applying these layers tiles underneath your war title Here, we need to a description, so I create the text box. Then I go to here and copy thes progress. After that, go to the down here a game. Select the new layer and paste the pride graph. Here you can read use the phone size and I'm going to organize it. Using takes options. Here you can change the vertical distance between lines. We have some extra lines. I'm going to remove them from my text layer. After that, you can use alignments again. So this is the bunt we have created in this case. All right? Almost we have done and finished. Just go to layers panel because we should organize these layers. So select all of them by holding shift key and create a new group. You can't rename it as you want. For example, featured works and use a color for the group. This far is complete now. 10. Testimonial: In the last video we discussed about how to create featured works in these documents. I go ahead and come over the rectangle tool and create a new rectangle in this project. Then I go to move, tool and drag the's rectangle and place it here. Then I can place a horizontal guideline at the bottom off the rectangle, and I select a new collar. For that, I prefer to set it to white collar. Then I come over to attack stool. Before that, I go to view and create a new guy line 50% where to call. After that, I tap to activate text layer. It's thought to time something here, for example, what others say about us. Then you can get help from alignments. Teoh aligning in the best position after death, go to the previous part and copy this description. Move it from the group to this part, as you can see, then collapse the previous group so we can continue the game. Here. Alignments is my favorite tool and treek in the 40 shop. So I repaired. It's many times. Go back to rectangle tool and create these box here. It should be exactly this one and be careful about the edges and double click on each to upon layers. Time. Go to struck. Apply in use roach for district tangle. So we have applied this and you can see this better by hiding guidelines another time. Go to shape tool. Select a clips here, create circle using Eclipse Tool and for the color we can use this gray seem for this one again. We can use a different struck, and we have applied a outside scrunch for this rectangle applied at by clicking on OK, and here we have these elements. Com Aware Move tool. Reposition the souk Ill as you can see, then we need some titles and description beside the serial, so choose textile tap on the screen to activate and new text layer. It's start to type. For example, John Doe radius the phone size, Reposition it, drag it to the right on their knees, the name we need to another text. It is job Tyto, and I'm going to type who had designer, for example, and for the next text layer I create. It takes box. Then I go to the top select thes paragraph, for we can select a different paragraph thesis one East better four. Us. I screwed down activates the last text layer. Paste the paragraph So we have a good description here. You can reposition it by dragging it to the left, and we're going to change something here, and I'm going to play with Web Designer. There is a simple way to drag all the elements, select them from layers panel by holding shifty, then dragged them to the right or the left. It's up to you. This is time to organize our layers. We should place them in a group because if we don't do that, we real have some problems in future. So let's find lay years. Dad's their day are placed in the project. Just drag some of them to the top or to the down, Then create a group four. They're related layers. I'm going to do this year and creates a new group, then duplicate this group and drag it to the down. So we have and all their box here. This is another testimonial that we have positioned here this time Select both off them and boy holding off key. Drag them to the right. This is where we have created for different to stay Magnon boxes rename down to for example , 123 or four. We want to make some differences here. For example, go to the 2nd 1 and change the job title too. Graphic designer position Here you can drag it using move tool, Go to the fair Guan, do this same that you did before my type here for the graph for and for the last one We don't nothing. Just zoom out to see the whole project. You can collapse that groups and create a new group for these elements. I'm going to type testi mony ALS and place a new caller for this group. 11. Counter: in this tutorial, I'm going to introduce the customers who have trusted to the company or the website. So I go to this fire and select on the layers, drag it into my project. Then I need to drag damn to the left. Let's all be. It's after that. I scrolled down to see these parts better. I activate background layer. Then I come over to rectangle tool, and it start to create a rectangle around the Legos. As you can see in the video. After you have done, apply it by pressing each ER on your keyboard, then double click on the layer to upon layers. Stein. Apply some struck for dance. Set a caller 48 Change the opacity and make some changes again. So we have it here. Go to move Tool Select on the logo's holding shift. G. Make it group for them. Rain Amytal logo and boy ideas work. You can a line this group horizontally and vertically to the center off rectangle. Go back to Le Groupe, select these logos and create a new group. For them. It's means you should separate one logo from the others. Goto this Lego. After that, go to adjustments at the bottom off layers panel. Choose you and situation. Move you as saturation. All paradigm the new group for logo and create clipping mask, then de saturate it completely. So we have this nice effect year close Tap group from the's icon and collapse this group. Scroll down a little bit. Go to a rectangle tool, create a new rectangle here, put this numeric values into boxes, then drag the's rectangle. Here. Applied ads by pressing Peter so we have Theis shape. Go to feel and change the color. Just remember to place a hard, cental guideline here. Dan set it to white collar. Zoom in to see this project and this part better. I'm going to create some book says or rectangles. Four. This part. This part is called Counter. I want to add some counters for customers I tens or ratings for the website. After creating a rectangle, I come over to a collapse stool and create a suitable here. I set a new collar for that double. Click on the layer. Go to stroke from layer style. Apply a struck using Theis numeric values. Let's expand it a little bit by holding control or command T and using shift key. Then you can align the circle horizontally to the center. So we have this box created. Then we need some title on their knees. This usual. So I come over to textile, start to type something. I tied works here and enquiries the phone size I get help from Move tool to reposition my elements. This is good in my idea so we can work on the rectangle again. Go to attack stool top on the screen to activate it and type a number. It's option on and it's up to you. So I'm looking for a good color in this case, and I'm going to a peak, this green color and we have it year. This part. We can make wards text larger and again. For the number we have a fear steps to complete this item, so drank each element to the top or to the down to reach a good position for them, work on the rectangle or on the text layer. Then you can get help from alignments on the options bar to align each element horizontally to the center off the rectangle, as you can see here, really it some changes here in the layers panel. But before DATs, we should organize layers panel, select related layers and place them in a group. Before that, you should recognize each layers position so turn on or off each layer to see it visible. After all these works, select these layers by holding shift key. Make a group for them. Why holy and control or a command G Rename it as you want, then make a copy off piece item. It seems we have some problems. Layers panel. So we should go back to this group because we have an extra item into this group. Right click on the group and select on group layers. Then select these four elements and again create a new group for them. Chapter a ploy or return. Then you can get him from all key to drag it to the left or to the right. Or you can duplicate this group by holding control or command J Do and drag it to the right to create the second I turn. We have some unfinished works again duplicate the second layer. Drag it to the right using move tool. Do the same for the last one position it here, right on the edge and press enter to apply dance. We have four same boxes. So we should change something here, for example, got to the second group and change that takes the ratings. And for the number, you can add a new number open death, their group type, and you ward here. I type items and change the number. And for the last one, I'm going to type something new. Just wait a minute to type it here, and I'm going to type ball years in this case, a gang DoubleClick on the text icon for this number. So it is edible in this case and create a new number. Go to the second group. So lech this box by holding control key if you want to employ any alignments collapsed all the groups renamed down to have an organized deck. Humans tap to apply that again. Select Theis rectangle by holy and control or command key and use alignments. You can do this Same for the fair rectangle that has placed here And for the last one that has placed right on the edge do this saying and collapsed the group here we have four do you friend items make it grew for all of them renaming its then by this work, you can align the group vertically to the sensor off the bigger rectangle. Get a flat icon dot com on your brother and such for these words, Bank, select a bag icon in this case, then sewage to PNG. Go to this option and select free downloads imported into your project. Let's do it again. I want to position it to this center. All Theis cereal like this read. Use the shape size, select a suitable and align the bag horizontally and vertically to the center off. Theus Sujal, Select Sergio and do these task here again. Go back to the website and search for another war. I mean star pick a good star icon again. Switch to PNG on throng This bottom select free download. Go to the second box and expand the group importantes a star to a project. Increase the icon size so you can drag it to this place. After all, activate these shared blogger and aligning it to the center again. Open this website and such for her Chase Icahn. So here is lots off icons. I'm going to select the best one that suits to my project. So I choose this one. I go to PNG and select free download expand their third droop. Important this one to your project again. Do this saying and read. Use the icon size and play seed into the suit. Kill and again use alignments on the options bar using control, key or command key. So we have done city elements or items collapse the third group. Go to the last one. Activate the group and such for man, for example. In this case, find a good icon for this purpose. Go to PNG and again download it, important it into the project again. Resize it, drag it to the right and put it here. After that, activate the suit jewel and by using control or command key selected, go to the icon and align it horizontally and vertically to the center off the shape, and after that, drag the group to the down a little beads, then make a new group and her rename it as you want, said Caller for Layer Andi. Do the same for this one tap toe. Apply or return, and a few steps are remaining to complete this section so you can't change. The scholar Dragons offer down this group so you can zoom out to see this part better, and this part is done. 12. Big blog: In order to showcase a blanc in this landing page, I'm going to design something creative. Socom Order rectangle tool and create a new rectangle with this numeric values press to catch. Apply. It's go to move tool dragged rectangle to this position. After that, I need to set a new collar for the rectangle. So I get health from previous colors that I have used in these projects. Activated rectangle to and goes of feel and select color picker and pick a color from previous collars and the color is changed again. School up. Go to collar p care and pick this collar that is a dark blue. Then go to adjustments. Select gray audience. Select again gradients. Go to Penn and select Caller and Peak these dark blue collar press. OK, then right. Click on it and select Create clipping mask DoubleClick on this icon to ADM. Or details to these graduations. I'm going to create a shadow for thesis rectangle, as you can see, so play with scale, then press OK to apply it so we can see the difference. You can reduce the feel, then go to Eclipse Tool and create a serial year from feel you need to change its color to the grey, then double click on the leg chair to open layers sline and apply some struck. Drag you to double inter bits, then makes some copy off that by holding all key. After that, use distribution on the options bore to create equal the stances. Beat Wien These shapes. Make a copy off the second cereal, then expand it by holding shift year. Double click on layer slide and turn off struck. Go back to a collapse stool and from this part, fill it with no color. Just use some struck for these pair prez. You can use caller PKR to set a new collar, and from this a slider. You can increase the stroke size so you can see the result. India's stock humans All right, I need to customize the second structural from that's hop, and I'm going to set a new color for that. So I'm looking for a good color in these projects. Let's go and select Move tool Dan, go to rectangle tool, select feel and select these caller that we have created before. So there caller is changed. Come over the text tool. Have to activate a new text layer, then go to the options more. Increase the phone signs, too. 72. Also, you can set a new caller for that. Then type A plus sign. Dad is on your keyboard. Then use alignments to put it in the center. Off the Sergio go to the top layer. Select textile again. Time to apply on although text layer. Reduce the phone size toe 30 points and then it's sort of type. An article here first, the one I'm going to type a tie Joe. Then I'm going to increase the phone size and changes to a bold font. Come word the move tool and drank the title to the top a little bit again. Go back to textile and activate a new text layer. Created text marks. Got to the top and select this paragraph. Copy that. Collapse the group again. Scroll down and activate this layer. Paste the paragraph, then set a new color for dance. Also, increase the phone size. Select takes options by holding control or command T increased the vertical Descents between lines and apply that again. Select thes paragraph and remove extra lines. Align it to the center from the options bar and drag it to the down a little bit. Using move tool, Kyllo's takes options. Go back to rectangle tool underneath the paragraph. Create a rectangle, as you can see, expand their work angle from the right. Do this saying for the height, then go to feel select color picker and set a new color for the rectangle. Go to layer styles. Select, struck and set a new size, then applied at select textile and start to time here and type. Read more, then increase the phone size from the options. More go to rectangle and use alignments. Activates guidelines again. Here we need to allowing the elements horizontally to the center. So select the big rectangle by holding control or command key. Then go to the elements and use align. Vertical centers Icon from the options bar. Do the same for these elements. Four text layers, even the bottom. Then you jen, zoom out to see this part, Then select all of them. Create a group for then rain, a means to big block. For example, 13. Intro box: in this system. I'm going to explain more about the company, so I need more elements and shapes. Come. Or the rectangle tool creates a new rectangle using this numeric values and drag it down. Author Dan Background Layer That's select move tool position. Direct time Gil Here. After that, I need to drag it to the top, and that's it. Go to feel. Set a new collar for the rectangle. Teoh. See, it's visible on that can be OK, Eve. We can drag it to left a little bit again. Go back to feel and set a white color for that. Before that, police these horizontal guideline and again said white for the rectangle again, go back to rectangle tool, create a new one, then go to Layer Stein's select Stretch years thesis. Work with this color, then drag it to the left using move tool. So select this wreck tango and drag it here left on the edge. Then expand it from the right to this position. Zoom in to see this rectangle better double click on it and activate drop shadow and change the opacity. And are there values to have a good drop shadow here, get to a strike a game. Make some changes after that press OK to apply it. So we have these spots in these positions common where the eclipse tool create a circle dango to feel set a green color. In this case, we have two new elements but we need more so Jews textile Go to call our pkr set a black color then type something here. For example all customers pleased with us. You can tie whatever you want. Then select the tanks and reduce the phone size. Position it here, screw up on double create on texts Icon, go to color picture and set a dark blue collar for the text and we have a new collar for that Reduce the phone size from the options bar and change the phones Too bold. Drag it to the left using Mostel. Then go to this paragraph, Select it and copy it then collapsed the group Go back to this text layer. Curie ate a text box underneath the title and paste the paragraph here. Then, by changing the color, you can make it reasonable. So we have it bought. We need some changes. So change the vertical Descents. Pittman lines to utter. Expand the text box to remove extra online's Again. You can work. We it where to call these stands here. Drag it to the left, and here is a good position for this text. If you're sure about the positions, let's go ahead and continue. Teoh Design. Really five other boxes, and we should duplicate the's part. So select all the related elements. Dan Renaming Teoh Box One and Scroll Down Lehto. Then make it copy off it by holding control or command J. Then drag it to the down using shift key to have more accuracy here again, do the same and duplicated. Select history groups. Quicken. Distribute medical centers. I can't have any called distance between the groups again duplicate on these tree groups. Drag them to the right and position them here. Apply it by pressing in turkey. So we have six boxes here. Before any action. Go to layers panel and Chance their name, for example, Box to box three, four, five and six so we can organize the's document better by this work. Go to box to select the title and change it. For example, I'm going to tie great online support in this case. Drag it here so you can see smart guides are for the shop. Got to Box three. Do this saying and change the title here. I'm going to type the magic who had designed service here. So let's complete it and wait a moment. Applying dads by tapping on this screen. Its position it here after dance. Peek a guideline here to make sure that they are in the same position. Scroll up and select caller. Pick your select these caller school down, so I'm going to cost demise. Parts five. You can see the search ALS color is different from the others. Go to flat. I conduct calm search people in this case, then peak on icon. For example. This one is good. Switch to PNG, then download it, import it into the project, then move it to here. Reduce the size holding shift key. So like the circle by holy and control or command key and use alignments to align the icon vertically and horizontally to the center from layers. Stein's Change the color toe white and read. You see it a little more again. Do alignments after that, make a copy off it, then drag it to box to group selected and move it here again, you can use alignments. In this case. We need more copies off this icon, so duplicated again and drag you to Box three and by using alignments easily. Position the icon here. Search for a new icon, for example, in tied marketing to find a good icon. Disliked Ball is good for this purpose. Siege to PNG. So, like free download. Go back to the document Select box for and expand the group. Import the icon to the project. Ready, Use the size. After that, select the Sergio by holding control or command key. Go to the icon and use. Align vertically and horizontally to the center for thes icon. Double click. I need Open Layer Stein's and set a new color for dance. After that, I'm going to duplicate thes icon and drag it to Box five. Select Theus, Sergio and Police the Saigon. Here you can see that it's really easy. Do it for the last month. Make a copy off the icon and position it here. So we have six boxes here. Select all of these elements except the big a rectangle and make a group for them. Rename it as you want after you have entered and name for this group. Tap to apply or return. Select the bigger rectangle by holy in Control or command key. And make sure that this group is in the middle of rectangle by using alignments on group layers. Then select all these elements by holding shift, key and rain a means to, for example, intra box. So we have finished the's section. 14. Options: Here we go. I'm going to create especial part that is called options. So come over through a tangle tool and creates a new on. With this new make values apply. Dads come over the move tool before that's a screw lump pig, a good color for their rectangle and God to the current layer. Drag it to the down and author Dan the background layer, so activate rectangle tool and picked this collar. This is a soft gray color for these shave, so let's fitted with it. The stock humans, and I'm going to work on this rectangle. Now I'm ready for the next step, so I go to this fire, drag this image to my document, then. So, like the rectangle and a line, the image vertical e to the center. After that's I'm going, Teoh feel around this image with text layers. First of all, I go to tax tool and try to add a title for this part, so I picked a good color. Then I start to type, for example. Here is the options, then do the same for the text layer toe, aligning it after Dad's. We can go to text tool and creates it takes parts on their needs. The Tyto. So select these paragraph copy dads and go to the current layer paste the paragraph year. Expand the text parts a little and increase the phone size, then allying the text layer to center. So we have a new layer here. Double click on text Icon to open takes options, and you can do some changes here. And also you can get home from alignments. In this case, I'm going to use text tool a gang, but which a larger phone size. So I'll add an article here first are you. Type a title for the article and let's reduce the phone size and put it here. You can see that it's too much. First of all, go to call our picture, change the caller, then go back to the options, bore a gang, employ some changes for the color, then go to this paragraph, duplicates the paragraph using on key and drag it to the down on their knees. The title Goto Layers panel and drag it here and release it from the group. So we have this tax year. Zo mean to see the's part better and position these two text layers exactly to this place, and you should be careful about the guidelines. Text layers shouldn't be out off thes guidelines. So we did this part. Just select these two text layers and make a copy off them by holding old key and dragging damn to down. So so, like the 2nd 1 and drag a two down little bits. So we have it here. I'm going to distribute vertical centers for these tanks, but before dance, I need to clear. Yet I grew up for Dan So create groups and he's Don then select district groups and distribute recalled centers using the icon from the Options bar, Go to the second title and change the timeto. So I'm going to time and new title here I'm I typed mother design. So select the history titles and a line them Harz and hauling to the left. So this is the result change the last ones Tyto, for example, Small, responsive. You can do the same and select the history titles by holding shift you and topping on this screen and do it so they are aligned hard until a to this sensor, we have three groups here select all these three groups duplicate them by holy in control or command J zoom out, then dragged them to the left by holding shift G to have more accuracy. Then select move, tool. You can make sure that these groups are aligned and you can use alignments on the options bar so I can go ahead. Zo mean, then I can see these parts better. I'm going to select each title and move it to the right. So select the 2nd 1 through this saying for dance. Then I'm going to complete this part boy dragging the 3rd 1 to the right. So select these articles using shift G and align them hard mentally to the right. Then so lank. Each paragraph use takes alignments to position it like this. Do the same for this one and top on these icon in the options bar and go for the last one. A gang double click on takes icon. So drag it a little bit. So the last we've added text layers, but we need more details. First the wall collapsed. The groups then go to this layer, scroll down and zoom in, get a rectangle tool and create a rectangle here After that expanded vertical e go to top a little and select feel and peak this color now they rectangle is green Then go to tax tool and type something here. For example, Live demo said the collar toe white, Increase the phone size. Do the alignments for these called to action Make a copy off this rectangle boy holding all key and drag it to the right. Go to feel and picked these dark blue color so the color is changed again Go to text tool and type her chase Now Here, make a selection for the rectangle. Then use alignments. Zoom out to see thes fourth better Then go back. Select these four layers dragged, um two down. Then select all these layers by holding shift key and create a new group Bring a me two options So we have it here. This is the part Dad we were working on and it is almost finished just so mean Here is a problem. We should align these two boxes very to Cali. Then select district tango to a line, detects horizontally and vertically to the center and do this saying for this one then collapsed the group 15. Breaking news: in each rep template. We have some elements that are necessary and some others are optional. Here. I want to add breaking news. I mean the latest news from the block in the landing page. So I create this shape on position it here so you can use rectangular market tool for this part. But I prefer to use shaves, So a position these horizontal guideline at the bottom off the rate tango, then zoom in and it start to work on this part. So, like text tool on, set a new collar for that and type an article here. Increase the phone size drag IDs to the center horizontally. You can use alignments in this case and drag it to the down using arrow key on your keyboard again. So me in. Then select the's paragraph on. Make a copy off that by holding all key and drag it to this part. Got to the rectangle, select it, then activate the stakes layer and aligning it horizontal A to the center off the strict tango. Come over the rectangle tool. You can create a square by holding shift key, then go to fear from the options bar and set a new collar for the shape. Go to tech stool and start to tie at Tyco next to Dais Square, for example. Creative and innovative. No, by app design. So I have created these time Joe in two lines and I'm going Teoh reposition its again Go back to text tool and at is callin there. So I'm going to pick this color on. Copy that again. Go back to this text on paste it. So we have this new caller all rights. Go ahead. We need more copies off this part, so I will choose these layers and layers panel. Then I make it grew for them so I can organize my layers and layers panel by dragging down to down or to top. Then rename this Group two news and get ready for the next move. Drag it to down like this by Holy Control or command T Dan, Move it to down and then make a copy of this group. Drag it to the right. Exactly. Theis position between these guidelines. So you can see Do this saying and you can drag it straight me to the right by holding shifty position is year. Then press inter to apply it. This is the first row off our muse. Let's make a copy off these three groups, and I will like to drag down to a down on their knees the first row. And I'm going to create this second row off this part and president er to apply it so you can see breaking news part. Let's make some changes here, so I will like to go two layers panel and so, like all of the related layers and use, align vertical and horizontal centers and Dan Group all these layers renay me to of breaking news and set a corner for these groups so you can use these options. Let's do two gay and these parts is finished. 16. Team: underneath breaking news. I'm going to introduce the team. I need four different boxes for this purpose. First of all, I'm going to create a rectangle with this numeric values here. Then I'm going to set a color for that and employ. That's why pressing on. Okay, So go to move toe, select it and drag it here and position at year after. That's we need a horizontal guideline. So drag a guard line and position it at the bottom off the rectangle on. Go ahead and I type a title here. First. I set a new collar for that. Then I type I'm going to type, meet our team, then increase the phone size on drag it here. Using move tool, Go back to rectangle use alignments to align text layer. So, ladies, thanks to make a copy of it by holding all key. Then release it from breaking years. Group like this collapse this group Dan, go to the current layer and do some alignments in this case. All right, go ahead and select ik ellipse tool Dan Screw laugh to find a good color for the suit. Tell that we are creating here First of all, create this circle. After that, press enter. To apply, it activates it could live stool and pique and new caller. For that double, click on the layer, go to layer style and apply. These effects struck, for example, changed its size. Then you can appliance go to move tool drag aids a little bit to the top. You can expand it like holding shift key again so mean you can't disappear. Guidelines to see this project better by holding control or command edge, and you can activate it again. So we have the first Syria kill on the left side. Just some details are remaining. We should drag it two down a little bit or plaids. Then on their knees the Sujal Wien into a title. So type a title and peek a collar. We have a name here, but it's not in a good position. So make a selection for the shape, then go to this text and a line. It's horizontally to the center, off this shape on their knees. The nay and the job posed for this person do the same for this text, and it is aligned like the all there text. So, like this three layers put them in a group, rename it to member, then make a duplication off this group. You can do it by holding all key. Or you can make a duplication by holding control or command J. So I'm going to test the second way, duplicated by holding control or command J. Then by whole link shifty. Drag it to the right, position it exactly in here, then make some changes. After that, you already to create another duplication, do the same as you did before and place this group here so you can get help from smart guys off for the shop that has red collar and it is visible and it's clear. Make another copy off the group position is right on the edge where the guideline is. Try to place it east side. The guidelines. Then I am going to customize the fair group that has place here, so double click on layer and up in layers time. Then I'm going to change the collar off this rectangle. Before that, scroll up and peak this green color. Go back a gang of cleats on the layer, two upon layer. It's time. Go to stroke and add this second struck. Why, plus icon Change the size and press OK to apply that so you can see a green struck around the shape collapse these groups to organize this part, select all these layers and make it group renaming to team Set a color for the group for example Blue, let's drag this group upper down team group So here we have this grew up done, but we're going to add another item on their knees the team group So I come over the rectangle tool. Then I create this shape. I got to the top and picked this color. Then I go to the current active layer, Then position it in the right place. This Jake goes for Parallax Effect that has a job script and Jake Worry coat But we should consider it in photo shop. So I renaming toe Parallax Dan drag the team group upper than per Lex and set a color for this group. Andi, it is done 17. Contact: This is time to add a contact for two the s website. So I'm go to rectangle tool and create a new one. With this sizes, I apply it. Then I get help from move tool to position this rectangle Theis shape has a wide color. So it's not Visa Bill and it takes time. Two position. They're rectangle, but you can change the caller. Then you change its back to the white place. Thes horizontal guideline here at the bottom off rectangle. And go ahead. Select tax tool with this collar and this phone size type, contact us, drag it to top a little bit. Then I'm going to use these social media icons. I have prepared this fine before because I don't want to race my time on organizing thes social media icons. So I drag them here and position them then on their needs. These icons, I'm going to add a description. So I a scroll up and select these paragraph. Then I copied and go back to this text layer and activated by double clicking on takes icon . Then I paste these paragraph here so I can drag it to the left or to the right or position it as I want, then Khaliq, on this social media icons. I'm going toe. Add contact information on their knees, The paragraph. So my tap on the screen to activate and you text layer and type some titles here, for example, Address line one Dan address line to It's not important to position them on the left because we can use alignments in this case. So just type some articles here, or some contact informations such as country phone number, fax or email. And I'm going to do that here. So we have these elements select on these elements by holding shift G and aligned them. Hardison Solly to the left. So we have this elements aligned. Go to these text layer in layers panel. I'm going to add another elements and parts on the right side, So start from here. Create this rectangle. I'm going to add a contact four here on the right side, so I need to a rectangle and a good color for that. You can use layers tiles, for example, a stroke in this case, and you can set a new collar for D a stroke. You can't chance the blending mode here or size or any. Are there parameters here? You can at inner shadow in this part and lets me change the color for stroke. And we have these elements make a copy of it by holding all key and drag it to the down. So we have the second box here. You can use guidelines to have more accuracy here. So after you've done again, make a copy off the second rectangle. Hold all key and drag it to the down. You can use distributes and alignments, of course, Distribute vertical E history rectangles, then go to text layer and select text tool type some articles and titles inside these boxes . I talked for the 1st 1 for example Name stand for the 2nd 1 You can type email on the last one Here I type something just I need Teoh Drag it through the talk in layers panna. And the last one is phone on Select the history takes layers and a line damn horizontally to the left. We can work more with alignments. In this case hand, it is clear you can see the video and follow these steps as I do here. So scroll down a little bit. Select the last rectangle again. Make a copy off it, drag it to the down and put it in the right position like this. They're selected and expand the height like this. I mean, expand it. Vertical e. Make another copy off the third rectangle and position it underneath the big air rectangle . Select a different color for dance time something and this call to action, for example, submit now set a new collar for that, resize it, then select the right tango using control or command key. Go to submits now layer and align it to the center, horizontally and vertically by the options bar. It is time to organize our layers, so let's find each layers position, then select all of them and place them in a group. First of all, drank all these layers to the top, then do this same for this one. So drag it to the top to set it with the left side and go for social media icons so selected group and move them to here. Do the same for the paragraph. Also for contacting formations such as address lines, phones, e mails, position eight here and get help from smart guys off for the shop to have more accu racy. Do it again for the paragraph. Select So she all media icons drag dam to the down and do the same for contact us. It's optional. So put it here, and it is done so you can zoom out to see this part. You can see that direct angle is not fit to the document selected. Drag it to the left. You can use ara keys on your keyboard. It's good now select these layers and as I told you, organized them. Place them in a group renay me to contact, do it for the right side and rename eat. Then select all these tree layers and place them in a group again. Rename eats, do whatever you want, so this part is finished. 18. Twitter: the's part goes for Twitter comments. I'm going toe ad. Syria kills icons and takes layers in this case, first of all, create a rectangle and sets a great color for that. Then drag. It's Teoh this position. You can't get help from arrow keys on your keyboard to drag it to the right or to the left . Then come over the EC ellipse tool. Create a circle by using shift key. Such a great color for that duplicates the layer, then resize it and expand it. Go to feel and fill it with no color. Just use a stroke and use thesis slider. Select both circles. Dan Select the Big A Rectangle by Control Key. Go to this group and align it horizontally to the center, then on group layers. Got to the previous part and copy the tutor icon using all key and really is it from the group? Then resize it and expand it and use alignments. Teoh. Place it in the middle off the seer Joe. Then select tank stool on their knees. Data rectangle start to type. For example. Latest tweets on. Then select a gang, the big a rectangle. And here you get a line elements such as the text layer or the icon so you can't drug it to the top later bits. So create a text box on their knees, the latest to its text layer and resize it. Then go to move toe. And from this part, copy this paragraph by using control or command. See and again go to the current layer and paste these paragraph. So from color picker changed the color and align it to this center. And from the Options bar, you can adjust a new vertical this stance between the lines so you can customize it by changing these parts. Caller. It seems not good, so I'm going to change it on. I'm going to use their stock blue color. After that, I close text options. Andi, are you? Go back to the rectangle Andi selected and go to the active layer and aligning its horizontally to the sensor off rectangle. Start to type something on their knees. The paragraph. It's a name for these comments or the Steam o Neill. Then go toe line tool and creates a line underneath the name so it can separate the name and all the elements. Then tap on the screen to activate and new text layer, then at a date to this position so you can do this same and a line needs presents all way to the sensor using the options bar. So this part is done. I'm going to add a new element in this case. First of all, creates a group for all these elements and aligned vertically to the center. Then, on groove layers, go to there. Last layer, come over the rectangle tool and create a rectangle here, right on the edge off the stock. Humans her to feel and take this collar so zooming in to have more accuracy. Then you can make sure that it is fit with the bigger Rick tango by expanding or reducing the size. So here is the retainer. We need another action, so go to phone. Awesome but calm and type angle. So here is lots of options for us. Select and Jill rights. Then scroll down and copy goalies. Go back to the dock Humans and so mean come over the text tool and tap toe activates and such for phoned, awesome free, solid set a wide color and re size the phones, then paste these elements here so you can resize it And wrong the options bar you can a line eat very to Cali, the center off rectangle. So here we have thes part. You can't zoom out to see the whole part that we are working on. Go to this rectangle. I'm going to add a drop shadow for these rectangle so you can adjusted here by changing some values such as capacity, size or other elements, Or you can change the angle to whatever you want. Year. I want to show a shadow beside the rectangle, and I did it select on the layers by holding shift G manky group for them by holding control or command G. You can't renaming Teoh to eat and set a new color for that, and you can zoom out to see this project. 19. Footer: We've arrived to the last part and I'm going to design a footer for these template creates a rectangle here and feel the white area. Then come over the tax tool. Select the phones like later resize it, then start to type and I'm going to type something here. First of all, I should change the collar and set it to white. I typed your logo so you can use a Nikon or you can use ah text here, get the phone out song, search for copyrights and I choose this phone. Then copy the believe. After that I activate and new text layer and select phone Assam free Sollied then pays Thetis believe icon here go back to text Tool then type the year. First of all, we should change the phones back to later and you can drag it to the right next to the copyrights icon. Then you can add another takes year. So I need Teoh. Change the size and resize it and use the options bar. Then I go back to tax stool. So I did it. This starts more again. Go back. Teoh the belief icon. Resize it. Move these text to here. You can get help from alignments. Four. He is text and move the copyright icon beside the text again. You can use alignments. Go to this text layer in layers panel, then come over to rectangle tool and create a rectangle. Here you can get help from smart guys off for the shop and set a new color for that from color picker. You can do it. Screw log elite so more then from this part, I mean the slider group duplicate the menu, then go to the last part and really is Theis duplication here and drag it to the top. Then select the rectangle by control or command key and use alignments. The position thes menu exactly a year. I'm going to set a wide color for the menu, and this part he is almost gone. Just select these two elements and drag them a little bit to the down and also do it for your lager. Mac. It grew for them. Then use alignments. It's a non option, so you can do that or not. For example, if you do it here, this is the result, and you can on do that if you want. By holding control or command Z or any extraction that you need. So I'm going to apply some legal changes here to make sure that my elements or in a good position and it is done. This is our agency website that we have created so creating your group for the last group and set a color for the group you can zoom in to see this project. 20. Project 2 menu: in this section, I'm going to create an APP website with this numeric values. So I set a new name for that impressed create. Then I have this new document. First of all, I should create with the strong guidelines. So I go to new guard layout and 12 for number 70. Big sells for wits and start IPIC sells for gutter There, I'm press OK to apply it so you can zoom in to see these guidelines. After that, come over the rectangle tool and create a new rectangle with this sizes and then press a care to apply it. Get your move tool before that, select a new color from color picker and chains. They're rectangles collar. Then use move Tool to position it here so we can do this rectangle on the top of these Document Zo me and more. Then select textile cap to activate a new text layer start to type. I'm going to time your logo because I want to position a logo left on the edge who were The guideline is so I can customize thes text and I go for another action. So I go to this foil and drag this social media icons to my project and position it here left on the edge. So double click on the layer and go to layers time. Select a new color for that, then Sarette the rectangle so you can use alignments to align these elements. Vertical Ali to the center of rectangle, as I do here. So, like this icon from the options bar and it's done, you can zoom out every time you need it. Go for another step. Create a new rectangle with this numeric values, then go to feel and from color picker. Set a new collar for that. Apply. That's by pressing on. Okay, then position it here underneath the first rectangle, then go to tax tool and create a new text with 14 points for phone size. All right, go ahead, create a new menu. Inter 15 airspace bars between each board as the stance. Then copy Dese Space bar by holding control or command See pasted by holding control or command V then continued to type. In other words. Here, for example, portfolio blanc or another awards like features and shop, for example, and contact. This is our manual, reassured A line needs. So let's go to this rectangle selected and go to the menu and use a line. Vesicles centers icon on the options bar. Go back to rectangle tool, then select line tool and set a new wait for this line. Then create a line above the home ward. Set a new collar for that press. OK, to apply it, read this line. We can show that the home is active in our menu and we are killing king on it. Select the menu chance Home text caller to green Go to the right side. I'm going to at some new elements here come over the rectangle tool and create a rectangle in the A s position. So we have it here, go to feel set a new collar. Then I'm going to select textile So I tap to activate a new text layer and I'm going to tie some wards here. For example, search now in this rectangle set the white color for that and at a few dots here, select Theis rectangle. Then use a line Vertical centers icon after dance. I'm going to add some icons here, so I look for a search icon. Here is lots off Icahn's so select a free one. I go to this page and copy the believe icon. Then I go back and change the phones too. Phones are some free. Solid. Then paste the belief icon on here We have these icon change the phone signs. After that, we can use alignments in this case as we did before. This is a search box that I have creator. Then next to the search box, create a new shave. Go to the left side, go to feel and from color picker. Pick this green collar, then go back to the right side. I'm going toe ad a Nikon inside the green Great tango, so I can use guidelines. If I need more accuracy, go back to the website and such for per chase icon, Type this word and from these icons, use a free one. Then copy this cliff. Go back to the documents. A gangs. Oh mean go to text tool, then paste these icon here. Then I am going to use alignments to place these icon here. So this part is almost done. You can zoom out to see these parts better Then go to layers panel to organize thes layers and make it group for them. You can bring a me too many. You 21. Project 2 slider part: in this part. I'm going to add a slider toe, my template. So I come over the rectangle tool and create a new one with this numeric values. Then I go to feel set a new collar for that. Then go to move tool and position it here underneath the menu. I have an empty slider. I should feel it with elements. So I go to this fire and drag this mock up to my project year press. Yes, it is large because the resolution off this muck up is different from my project. So I should resize it by using auld and shift key. So zoom in to see this my car better Then go to view new guide and create a new vertical guide with 50% for value. Then I need Teoh Rotate thesis markup. So I select this group and rotated like this. I can resize it and expand it if I need here. I need more rotation here. I'm going to a place it left on the edge. As you can see. After that press inter toe a ploy or return collapsed the group go to the rectangle and come over the eclipse Tool Create a circle here by holding shift key. Make sure that you are creating this shape in a new layer. So I have created and new Sergio just I need to feel it with a solid color, for example, white. Then I am going to make a copy off it and resize it and expand it. Fill it with no color. Just use stroke. Use this slider to it, just the's shape struck. So here we have two shapes. After that, go to line tool. Set a new weight and after that, create a line exactly like this by holding shift key so you can create a straight line. Here, select the Sergio. Then you can a line. He's lying vertically to the center. Off the serial. We have this design here. After that, go to text tool. Set the fund to later increase the phone size. Then it start to type a title. Here. I'm going to type best apus slider. I go to move Tool. Then I go back to the text and reduce the phone size again. I come over move tool. After that, I'm going to use alignments in this case, so I should select the line by holding control or command key. Then I go to the text layer and use align vertical sinners icon In this case again, I should go back to text tool to its hide. Another part here. I'm going to type. You can customize everything in this case. Tap toe, apply or return, then resize it to 18 points. It is a small so I changed it back to 24 points. Double click on text layers icon, then press control or command T to activate, takes options and applied these changes here and placing here. Then go to textile again. Create a text box underneath the second tyto or takes layer. I will add this creeps in here using Lauren Epsom that I owe. So I selectees sentences and paste them here. I need to resize it to 14 points on again. I activates takes options to set a new vertical distance within lines. So I have it here. I can't reposition needs again. I scroll down and go to Rectangle tool here. I want to add a call to action like this. So I curie eight a new rectangle Then I am going to make a copy off its by holding all turkey. So I have to call to actions. I'm going to set a new collar for that. You can't see the difference. Go to feel and from feel you can set a new collar for this shapes. I want to pick a new collar from the menu so I select Call our picture and take this collar again. I scroll down two year I go to rectangle and select Call R P care. And here the collar is changed to green guards. Attack Stool tapped will activate a new text layer and type by now here, then resize it to 18 points. Go to the rectangle, select it and use Align vertical and horizontal sinners Icon on the options bar. Go to the second call to action and type live demo. Do the same for these tanks and align int to the center. You can zoom out to see this part better and again. I have done the basic part. Bought some few detains are remaining to add more attraction two days a slider. So I should change something here, for example, the line that I have created before I select all of my text layers dragged them to the left . Again, I go to the line, select it. I can use alignments in this case. After that, I go to the top layer and select Eclipse tool. I have a slider. It's man's. I have more pages here, so I'm going to create thes sir chills. That's means I have another slides to see. Select is four. See gels here use Distribute vertical and horizontal centers. Icon on the options bar, then make it grew for them. Renaming two dots. Select the big A rectangle, then use horizontal alignments. In these case, select one off the circles. Go to feel fitted with no color and use A s rook. For that. It's man's. The third slide is active and we are looking at it. I have done this part. I need another action again. I come over the eclipse stool. I create a suitable by holding shift key fitted with no collar. Just use a stroke, then select the rectangle that has gray color. Activate deka leaves to align vertical centers. Then you can resize it and position it. Here. You can use right arrow key in this case, open up. Phoned awesome dot com on your browser and such for an angle. Icahn. I'm going to type angle here, so I need and angle right icon I selected and copied belief. Go to textile, tapped to activate and your text layer. Change the phones, too. Phoned Awesome. Solid free Resize it as you want them paste that belief icon. So we need to increase the phone size to see it. Visa bill. He was alignments here. As you can see in the video, I'm not for kissing on its too much. Duplicate these two layers and select sleep horizontal from transform options, then dragged them to the left to position it here. If you want a position it in the right place, you shoot youth. Smart guys off for the shop, as you can see, just select the layer, then hold control key to activate smart guys off for the shop. The numbers that you can see that shows the distance BaFin each elements. I'm going to customize one of my angles, and I would like to use a stroke in this case, and I really customize Theis truck from Layers panel like this so I can change the color or this size. And after I did it. I pressed Decatur a pliant, and I can go back to layers panel and select all the layers and groups. And then I make it grew for them and rename it to Slider. Then I can't set a color for the group, and these parties finished now. 22. Project 2 intro part: underneath this liner, I'm going toe ad an introduction about the website. I come over rectangle tool and creates a new rectangle who ate this numeric values. After that, I need to change the collar and positioning it here on their knees. This liner You can get help from arrow keys in order to play seat in a good position, then fill it with no color and position the horizontal guideline at the bottom. Off the rectangle. Go back to shaped tool, select rounded rectangle tool. Create Theis Shape here and said a new collar for that. Change the phones to later on Dine. Need to resize eat because I want to type something here. I should tense the collar, too. Manc this type. Who? Easy bell. So I did it after that's I come over. Move tool and drag. Theis title A little bit to the left. I go back to textile because I want to create a text box on their knees. The title. Be careful about the guidelines and position this text box exactly like I do. Then school up Selectees paragraph. Copy that, and pay State here in this new text layer said, Ah, you call her to make it too easy, Bill. After that, I need to change the phone to a regular. I double click on text Layers icon to activate these texts and ring off some lines off my text and I can read use the tax box size. After that, I can apply a few changes here. I'm going to create a group for these three elements. Then I make a copy off that. Drag it to the right exactly as you can see forecasts on how to position days elements and look at guidelines and the stances between each group. We have three different groups here as an introduction for the website. Then I can use both distribution and alignments. In this case, in orderto have three defense intra boxes, I'm going to make some changes here. For example, I changed the second around the rectangles color here and the Tyto. Then I'm going to chance to Tyto to another one, for example, free to any four online south floor, and I do the same for the third title here. I can write Mega pack here as a sample open off flat icon that's come search for user icon . We have lots of icons here, so so length the best one that you need. Search the PNG. Download it. After that, go to the first rounded rectangle and import this Icahn here. Position it there. Read. Use the size double click on the layer to change the color toe white. Then you can use align, vertical and horizontal centers. Icon from the options bar. The position is in the middle off, around at rectangle. Go back to the website and search for and other icon, and I'm going to find a support icon. It can be good in my idea. Sewage to PNG and select free download. Then select the second rounded rectangle again imported into your project. Resize it as you did before. For the 1st 1 Select, he is surrounded rectangle and use alignments. As I do here, you can resize it again. Double click to activate layers style and said the caller toe white, That's it again. You can select it to make it a little bit smaller. In this case on, you can make sure that it is in the center. Boy alignments on the options bar collapsed the groups you can rename each group, for example, Group one or group to and get two Group three and try to find another Icahn and a gift icon . Here we have these icons available, so I select this one and select free download. Then I import this icon to my project again. I resize it because I want to position it's into my rounded rectangle year. Supposition it inside the rounded rectangle again. Set a white collar for that. Resize it as you did before you can use again. Align vertical and horizontal centers, renamed the Group two Group three. After that, select all the history groups and make a new group for them. Then you can a line vertical centers for the group change the group's name too Instru box, Then make another group and renaming to intro so you can't set a collar for the group to recognize it later. 23. Project 2 work part: This is where I want to add an explanation about the work. So I come over the right time going to and create it with decides it. I'm going to position it. I should be careful about the position. It's really important in this case. Danso mean go back to rectangle, go to feel and select a dark color to see that everything is okay or not. Then you can set a new color for this shape. Use Ah, horizontal guideline and positioning at the bottom of the rectangle. Go to this. Fine. I would like to use these markups. So I select both big and a small and I drag it into my project. They are large. I should resize them. Then I am going to drag them to the right. My gang. I should resize now I'm going to divide my shape and rectangle into two parts. The left side on the right side. The left side goes for these mark ups and after that I'm going to create a groove for the Ma. Cops come over the text tool because I would like to I feel the right side with elements. Set the collar for the text Dan, you can type more here. For example, what is our work? Resize it and increase the phone size. Change their phones too bold. This is the title that I need for this part. I can add a question sign here. So very some problems. I shoot solve it and I can drag it to the top a little bit. I'm going to get help from other parts, For example, here or here, this paragraph is better. So I selected and copy it. And I go back to this layer underneath the title. I'm going to create a text box. After that, I paste the paragraph that I have copied before. Then I select both text layers before I want to dragged into the right or to the left. Go to phone our some that calm and search for a plus. Icahn. This is where I can find lots off icons here. So wait a moment and search more to find the best one. Then go to the page and copy that's select text tool and change the phones to phone our some free solid. All right, go ahead, then paste the belief icon. Increase the phone size from the options bar and set a green collar for that. After all these works select, he is paragraph, copy it, then pasted here next to the loss I call. Remove some words from the line because we need Onley one line in this case. After that, select the belief icon by holding control or command key. Go to the text layer and select Align vertical centers from the options board. After debt. Make some copies from the first line by holding all key. After that Goto Layers panel to recognize each layers position. For example, these two layers are related, so make a group again. Do it for I know there one and a gang chair off or on. So here we have problem because we have not placed layers in true group. And again I do it. Police. It's too related elements, you know, I grew up on. Each group contains a gleeful icon, and it tanks layer here. So here we have four different groups that we can use. Distribute where to call centers from the options bar, as you can see. So make some changes in each group and remove some wars or elements from each one and you can customize it yourself, for example, here to remove this part, then collapsed the groups and we have four difference lines for the explanation. Go to Ray Tango tool and create a rectangle on their knees, the last explanation or lying. This is a kind of call to actions. I will like to add to this part. And then I open layers thawing and employ some struck for these shape. I can set a new caller for the shape from collar P. Care as you can see. Then I can change the opacity and press OK, then I can applauding guidelines again. Then I go to text tool and Tamp to activate a new text layer and type via more. Then I should go to phone us on that com. So from the search bar I am looking for and I'm Gil icon. So here I can find and select this one from this panel I can copy Theis Kalief icon. Then I got to text and said the phone to phone our some free solid. And then I paste the belief icon here by Holy In Control or Command V. Then I can use font size to increase the phones. And I use alignments in this case to align vertical and hearts and told centers for these elements inside the rectangle on. Then I can't select this. Markoff and I will like to resize it. I can use transform tool by holing control command T. And then I used shift key to resize it. Then I collapsed the group I am good two layers panel select all the elements except the rectangle because I want to use a line Vertical centers option and then I can on group layers because I want to select all of the elements. Then I create a new group and rename it to work and set a new color for the group to recognize it better in future tanks were watching this video. 24. project 2 featured part: here. I want to work on portfolio part on. I'm going to create something that you need. JavaScript and Jake worry when you want to converted from 40 Shop to put a strap. First of all, creates a new shape. Position it here on their knees Divorce group and position this horizontal guideline at the bottom off the rectangle. Then go to textile and said the phones to a later, as I do here re sizing Teoh 30 points and type an article or Tyto Here, for example, feature works so you can use these alignments here. After that, on their knees featured works, create a text box and expanded a little bit. Then a school of so like move tool and select these paragraph. Then copy it. Collapse the group from layers panel. Go to the Krantz layer that you're working on, then paste this paragraph or description After that, aligning to the center and read us the text box size Go ahead and us blind ments in this case to align that description horizontally to the center. After that scroll down and Zo mean to have more. I cure racy here, get to rectangle tool and here I want to create rectangles, for example, I create these rectangle here and place a text inside the rectangle. First of all, I need to position the text, and I do it from the options bar. After that, select a rectangle and make a copy off the it by holding Danske, then go to textile and type. For example, phones do this same and three. Position these text from text layers again duplicate Theis rectangle. You can change the size as you can see here. After that, press enter to apply it, then come over the text tool type and other ward. Here. I type business card in this case. All right, go ahead and let's expand thesis rectangle and reposition the text layer. Select the first rectangle and apply. Struck. You know layer is time, then go for the 2nd 1 Double click on layer, then go to layers. Start on again. Apply this same a stroke. Do it, it's saying for the 3rd 1 here, I do it on. Go ahead. You can select it's rectangle and make sure that text are position in the center off these rectangles. After that, make another copy off thesis rectangle. Go back to text tool, tap to activate and new text layer and type marketing online. We should increase the rectangles size, and we do it like these. Then I select the rectangle by holding control or command key and a reposition marketing online text. You can hide guidelines to see the project. After that, you can appear it's by holdings control or command H. After that, create another rectangle next to the marketing online I to and reduce the shape size again . Go back to text tool press enter to have another text layer in layers panel and do the same and align vertical and horizontal centers off the text so you can see this item here just customized the 1st 1 that included is, um, as text and set a white color for that. Do this saying for marketing online. That's it. Go ahead. I'm going to add some items on their knees this manual, so I'm going to create some rectangles here. As you can see, this is a dynamic portfolio in bootstrap. When you khaliq on business car, just you see business card items. When you khaliq on marketing online, you see just marketing online items. Dads are related to this title on If you khaliq on all you will see all items off portfolio . Here we go. I am going to at some shapes here. I need to change the color off each item and you can resize all of them. We have some good plug ins, but this rap that allows you to create this part But we are not mentioning it here. Just go ahead, create these items here. You can resize them as you want. After that, make another copy by holding all ski and expand it horizontally like this. So you can see there is at this dance between these rectangles that you can get hope from left arrow key to solve this problem. This is the first row that's I am working on. Just let's change the last shake collar and you can see the difference here. After applying a few changes here. I need another row underneath the 1st 1 before dance. I at more details to this part. For example, you can expand the third shape horizontally and read use size off the last one, Then select all these shapes and expand them very typically like this and you can get help from transform tool by holy in control or command T again. Select all these layers and make a copy off them by holding on key Dragged em two down life thes and select fleet horizontal from transform tool. So we have this part here, but a few details and changes are remaining, so let's zoom in to focus more on this part. Select that, said one from the left and resize it like this. Go to the last one a game and put the edge as here. Go to the left side. Do this same and make some changes here, as you can see in the video so we can zoom out by holding control or command minus or zooming by holy and control or command plus on your keyboard. Go to this part and school up a little, then go to feel and select this dark blue collar. Then scroll down and you can see these rectangle has a different color. And what was the reason that I changed the color? It is because I want to show the harbor on this item. It's man's. When you keep your mouse on this item, you will see something different, such as summary title or a different color, and I am working on it here. So I have added your war title here as Tyto and another text on their knees off the Tyto. I need to a description, so I screw lop and I can find it's and copy that. Then goto Theis rectangle that has a different color. And 38 the text box, then paste the paragraph or description here. So we need Teoh Radio is the phone size two event points here. After that, radios the text box size because we need Onley. Three lines here go to move toe and select these layers and a line dem horizontally to the left. Underneath the description, I'm going to add elements that a low users to open the full blood or full story. So I come over the eclipse stool and create cereals. Then I go to front are some that's come and search for a nine Gil and an angle right here. I opened the webpage. Andi, I rate too loud. These webpage it can take some time. After that Copy Theis khalifi con Go to tax tool and tap to activate and you takes layer, then go to phones and set the phone to phoned. Awesome free. Solid here after that, said the caller to this swan, Then paste the belief icon by holding control or command V. After that, select this cereal and change the color. Then go to the belief icon and set a wide color for that. Then apply a stroke for the suit. Joel, As you can see, Josse need to go to layer style and you have lots of options here, for example, size, position or capacity, and you can follow my steps exactly so you can see the difference. All right, apply dance. Go ahead So length. Theis, Sergio and a Line Vertical and horizontal centers off the icon. Go back to Phone Town song and such for a new icon. And I'm going to type expand. Here we have these icons available. I'm going to use the Swan, Then I copy. It's as you can see. Then go to this part. Andi, the white circle. Create a new text layer. Andi paste the icon by holy in control or command V. Just we need to reposition is on. I do this saying, and I use the options bar, select the UAE Sujal double click on it to go to layer is time absolutely a stroke for this one and said this route color to green on here is they're designed So go to the top in layers panel select all these layers and make it grew for them. You can't rename me to feature after that tap to return or apply just we need to solve the problem here. Select the second rectangle from the left in row two and resize it. Do the same for the 3rd 1 And this part is done. You can collapse that group and set different color for the groove here. 25. project 2 download part: in this video, I'm going to create testimonials for the website, so come over there were tangling tool and activate it top on the screen to create a new rectangle. With this wits on height, press OK to a pliant position it here on their knees. The future part. Drag it to the top after dance. Press enter to apply it, zoom in again and position the horizontal guideline at the bottom of the rectangle. Then feel the rectangle with no color. After dance, go to the eclipse tool and trying to create as Syria Jill. Here, just make sure that you're creating the Sujal in a new layer. So let's do it again. Go to the Eclipse tool and create and new Surge ill here, then feel it with a great color. Zoom in and screw off, then make a copy event. After that, expand the copy, then fear it with no color. Just use a great struck for dance, so we have these shapes here. Select both off the shapes and try Teoh. Move them. All right. I'm going to position these two shapes to the sensor off the rectangle, so I'm going to use options. Bar Icahn's especially a line horizontal centers. In this case, we have another choice. Make it group for the circles on then use options, bar to lying thes shapes. After that, you can on group layers and go to flat icon. That's call and search for a man icon, so there is not soft. Icahn's Let's find a good one. These can be good for our project. So I selected and sewage to PNG and select free Download in this case. Then drag these Icahn to the project and resize it. After that, select the eclipse one by holding control or command key. Then go to the icon and use alignments. Align vertical and horizontal centers in this case, then double click on the icon and select collar of L. A. To set. It's too white. After that, select the Eclipse Juan and changed the color on man kids dark hair. Then calm over the tank stool and create a text box on their needs. The icon. Then go to Laurie MEPs in that I owe to copy a random tanks, then said the fund toe, Lehto resize it to 18 points. After that double click on takes layers Icon align it to the center, Dan set a new caller for dance. After that, I'm going to reposition it, and I'm going to drag it to the down. Then select the rectangle and use a line. Horizontal centers for the text. Double click on text layers, icon and press control or commodity and used takes options, as you can see in the video. Then come over the line tool selected and create a line here underneath the takes box here from the Options bar, we can customize it and change the thickness off the line. Using this slider again, I would like to use alignments. We have some elements year. Let's make sure that they are in a good position. You can zooming to have more accuracy in this part. Then zoom out by holding control or command minus. Come over the text tool tap to activate a new text layer and type and name. For example, John Doe year in this case, then set a collar for dance. I set it to a dark blue collar, so I would like to hurry. Position eats. As you can see, you can do that. Why? Selecting the rectangle and activating the text layer and using alignments. After that, we need another text. So I added to my project. It is a job post, for example, who have designer do the same and reposition needs as you want. Then select these layers and make it grew up for them, so you can align all the group as you can see. Then, on group light years, go to the top layer, and after that, go to tools panel. Select rectangle Tool and here, above this part, create tiny a squares. Make a copy off the first square by holding on key and dragging it to the rights. Then use. Distribute horizontal and vertical sinners. Select the stared one from the Rights Select Rectangle tool and set the caller to green. Now you can see it is changed. Then select all these rectangles and aligned them horizontally to the center off the rate tango that has no collar. And it's the first rectangle that we have created in these project. After making some changes, for example, adding more details to these paragraph, such as italic effect, I would like to add another part on their knees. Do you testimonial part? First, the war make a group for is elements and rename me to testimonial. I would like to show that the website is a responsive. So come over the rectangle on tool and three yet a new rectangle with this numeric values. Not this one. Let's do it again. Go back to a Tangail and create and you rectangle. Then press OK, position in here on their knees The testimonial after dance I'm going Teoh, So lack text tool and add a Tyto here. So I choose a bold fund here on die type amazing full responsive design here Then go to takes options on turn off the italic option Set a dark blue collar for this pair Pass Then I can use alignments if I need it. I would like to add some other elements such as a description on their knees, the title So I copied that by holding off key and drag it to the down And I'm going to add another item here I have if flying that included is is Marco. So our import this mark up to my project and I resize it because it's too large for my dark humans. I can resize it by holding old shift key again, we need more. I'm going to position this Michael out off my rectangle. Alito, As you can see at the bottom, go to the rectangle tool, then go to Eclipse Stool and create as circle in this position, said the collar to blue and reposition it again. Drag it to the right, Alito. Then I am going to add elements inside the Sergio. So open up flat icon dot com on your browser and such for download icon. Here is some icons, so I select this one. Then I can switch to PNG and select free download option here, Drag it to the project, resize it by holding old and shift. You select the serial by holy in control or command key, then activate the icon on from the options bar, aligning it horizontally and vertically into the center. Dan got to the icon. Double click on each go to layer style and change the color two white, then drag it to the top. Alito bits on their knees, the icon type full pack here, then read. Use the phone size to 24 point after that, set the collar to white, then reposition it so we can place in here. And also we can use a line Hard isn't all centers in this case. Let's go back to the icon and resize it and do the alignments again for Theis icon. So you can't see that we show our responsive design by in my cop, then make it grew for these elements in layers panel by holding control or command G rename me to download, for example, and set a caller for the group, and this part is done. 26. Project 2 team part: in this part. I would like to introduce the team in the website. So as I did before I come over Rectangle tool on creates a new one here. Just be careful about the position you can zoom mean if you want to see this part better by holding control or command the last on your keyboard, there are two rectangle tool set a darker color for that. Come over the move tool on the gang. Go back to rectangle tool and feel it with a color off course. I did it for the ah pair Ray Tango because we had some problems on. I shoot, reposition it and drag. It's to the right. This is that problem that is for the previous part and be noticed. So I solved the problem and I go back. Teoh this rectangle and drag it to the left, at least so to fit we. It's my documents so you can see that everything is okay. Collapse the previous part group and a start to type a title here, for example, meet our team again, go to alignments and select a line Hard dental centers, then feel the rectangle with no color and position a horizontal guideline at the bottom of the rectangle. You can't do the same for the top. God did that move tool. Make a copy off this paragraph by holding on ski, then release it from the group. Position it here. Go to tax options so you can make some changes as you want. Then use a line hards. Untold centers for the text Got to the Eclipse tool. Create a surge. Oh, by using shift key. Set a great color for it. Go to layer style. Apply a stroke For these shave. You can play read size, position, blending mode or capacity. In this case, we have this part don, but I'm going to Atmore details to the shape. So I select rectangle tool and create a rectangle around the serial because I want to use alignments in this case, So feel the rectangle with no color selected Dan. Activate the eclipse layer so we can use a long, hard dental centers for thes purpose. After that, go to the eclipse layer and drag it to the town by holding shift key. And then we can at a title on their knees. These circle, for example, and name can be place here. I tied John Doe for this one. We can reduce the phone size or increase it. It depends on you and your project. I decided to set it to 18 points. You can see that I use alignments very much because it is really needed in any project that you need. I Q racy. So I'm going to at another text. Just tap to activate a new layer. I type Web designer here so you can do a line. Men's as you can see the vertical. The stands with me in elements is off to you. You can drag them to the top or two down. I'm going to make some copies off this part, so I prefer to be careful about the 1st 1 and do it as well as I can. Select these elements and put them in a group rename its two member. After that, duplicate this layer. Um, position it here. So we have a problem, and we included a title in the group that is extra and unnecessary. So I should go back and on group layers. Dan, I grew up these layers a game that's I need Dan rename into member then duplicated. Rename me to Member, too. Drag it to the rights and look at the position. I put this group because it's really important. Do this same. Make another copy, drag it to the right and place it here. Look at the guidelines carefully. You can get help from smart guys off for the show that you can see they have a red color on day will appear. When you want to position elements, select all these four layers. Drag him to the top. It takes time for the's progress. After that, duplicate these four layers by holding control or Come on Jay, drag them to the down because I want to have another row off team member Andi. Place it here. So let's go to Costa Minds this part as well as we can at a rectangle on their knees, the second throw off team members and apply a stroke for district tango. It is a call to action, so I type load more. Then I reposition it and position it to this sensor off the rectangle. Then God Teoh the second Soochow from the right in a row. Juan and add a Poulos Icahn here, set a collar for its to water where you want. I'm going to change it to white, then select the circle, go to feel and from this part said the collar, too. A dark blue, a screw up and select This green collar after that screwed down. So, like this year, Joe, and change the stroke to this green collar. Increase the throat size and apply it against. Select this circle. We can at line that, plus icon to the sensor off the serial. And here we go. We have these elements and I'm going Teoh. Position them in a group and I rename it to team. Then select rectangle tool and set a color for the previous rectangle. Because I would like to change it on. I make a new decision for this part. I do the same for the title to set a new collar for that. Go to phone our some that calm and such for and angle icon. As you can see here we have some icons. Select and Gil, right? Copy the belief icon, go to text tool, set the front too, phoned, awesome free solid, then paste. The icon resize it and increased the phone size reposition it and drag it to the right. Then you can use a line. Vertical centers duplicate the goal if icon select, sleep horizontal from transform options. Then I need Teoh. Drag it to the left side. So I select a rectangle and I go to the belief icon and from the Options bar, align it to the left. Here, I want to get help from smart guys off further shop. Hold control key to see the exact distance between each elements so you can't see numbers are appearing. Do it again for the right side. 27. Project 2 skill part: All right, let's go to create beautiful progress bars in this part, so creates a new shape here. Apply. It's then got to reposition its on their knees that team part so you can use arrow keys to drag it to the right or to the left. In this case, after that's positioned is horizontal guideline, as you can see. Then got to ray tangle tool and create this rectangle on the last sign. Set a gray color for this J Go to feel, and you can find a good color from that's go to a stroke and select a caller for that resize it. You can use a different color and change the position to outside and play with capacity so we have this rectangle here. Just make sure Dad's rectangles position is good, then zooming because we want more accuracy in this part. Go to round it rectangle and select it. Dan set a new radius for it from the Options bar and create around it. Rectangle in signed the first rectangle and got to feel set a new collar and set it to green and drag it a little bit too right. Then expand the height after that go to move, tool and select the first rectangle, go to the rounded rectangle and use alignments. I'm going to add four different progress bars on the left side. The 1st 1 is almost gone. Just I need to add It's high until for these Progress Bar and I'm going to type first, said the Front to later resize it to 24 points and said A dark blue collar for it is found , Then a start to type. I'm going to use capital letters, so I re type it and I type our skills. Then I drag it to the left. There the first guideline s. Then I'm going to add a cost, um, title for the Progress Bar. Our skills is a general title, and this one, I mean work press is for the Progress bar. Resize it and reduce the phone size, then drag it to the left after that's at another Tex here and type 80% in this case. Then you can use align vertical centers for these text layers. Go ahead and zoom in tow, have more accuracy, then again use alignments. It's really useful in any project. Select deals four elements in layers panel created group for them. Rename it to, for example, Skeel Dan duplicate this group. Drag it to the down, and here we have the second Progress bar again. Do it and create the 3rd 1 Andi, repeat this process and do it for the last one. Select these four groups and distribute vertical centers from the Options bar, and we have, and he called distance between each group. Then it started to make some changes in any progress bar go through the 2nd 1 and change the size off. Rounded rectangle changed the title to, for example, for the show go to the 3rd 1 type a title, for example, J. Corey Do the same for the last one type illustrator. For this one, go to 80% change it to 90% and four Dysart rounded rectangle make some changes because we want four different progress bars. So I'm going to do that. Make some changes for the last rounded rectangle and type another percent age for DATs, for example, 85% then collapse the groups, select all of them and put them in a group your account renaming to skills. Rename each group to, for example, skills skills to tree four, then collapse. The scales Group 28. Project 2 services part: Let's go to the right side. I'm working on services for this website, So I khaliq on text room and then tap to activate and you take Slayer and I type our services in these parts so you can customize this title by changing the thickness to boned . And then you can a line your titles by using align vertical centers for these titles, I mean our skills and our services underneath our services create a rectangle like this and matching with the bottom off the left parte elements. Then said the Colin Toe white and zooming by Holy and Control or Command Plus and then select combined shapes from the options bar. Then go back to rectangle tool again. Select combines shapes. After that, create this shape here. It's not finished. I will like to add on. Are there other man's bought before that? Select textile and type a subject or time time here radios the phone size too 14 points and place in here. Then, for align these text on, you need to create another shape, same as the same Juan, and then I use a long vertical and horizontal centers. You can see that I have created this box. I would like to add another boxes next to the white collar rectangle, so I position it here. You can hide guidelines to see this part clearly. Then got to this shape that we have combined. Go to layer Stein and apply a district for that again. Go back to layer Stein so you can change the corner. Select this great collar rectangle and go to layer star. Apply the same. A struck for that. Be careful about the position. Look at this one. We should expand the height. Teoh have unequal height for both shapes. I mean the white collar rectangle and the gray one at a text into this gray color rectangle and tied design. Then select rectangle Garrity design and use alignments. Then apply the selection by Holy in Control or command V. Make a copy off this rectangle by holding on ski, drag it to the right and place in here, then expanded horizontally. You can use transform tool in this case and type a tiny town here, for example, online support. Then go to move toe Celinda rectangle by holding control or command key and use alignment tools from the options bar. Let's do another part. Make another copy off the straight Tangail and match it with the white collar rectangle. And after that pressing, ter got to tax tool type and on their title As you want, I will like to type development in this case. Select the rectangle from layers panel and position it to the center off this shape. So zoom out by holding control or command minus. This is what I need it you have designed when you want to court. When you click on design, you will have a different description and for development or other bottoms is like this. So here I would like to add a description to each bottom. I resize it to 16 points. This is the result, but ah, you shoot. Make some changes like vertical distance between each line. Now it's looks better. Got to call her p care. Change the collar for there's text. It is something that I don't like, so I go back to call her p care and set a darker color for it. Let's do it again because we have some problems and changes are not a plight. Double click on text layers icon go to call R P care and apply. And you, Connor, for this text. As I told you, when you click on marketing, you will see this description. If you want to collect on design, you can see another. The screenshot. This is a Java script, Kurt, when you want to design a website. But we need to I can see that all of these options when we design a template in 40 show after on these works Mackett group for all these elements rename me too, for example, skill services for something like this. And this part yes, completes. 29. Project 2 features part: this part goes for some features. I will like to mention about the website and the company so I can create a new shape by using rectangle tool and said this corner for the shave. Then we can change it first. So long position in here, then position horizontal guard line at the bottom of this page and go to feel, then select. Feel with no collar Icahn. Then zoom in by holding control or command plus on your keyboard and go to equalise stool, create a pseudo by holding shift G, set a green collar and you can use I drop her to peak a green collar from the previous part . And then next to this Sir Joe type a title, for example, friendly user interface. Then I can reposition it like this, and I can apply a line. Vertical centers for the text and after that, create the text box on their knees. The CIA, Joe Go to move, tool and select these paragraph from this group. Then go back to this layer and double click on text layers icon and paste the paragraph by holding control or command V so you can employ a different vertical distance. between each line from text options and then radios. The tech sparks size like this. Select the cereal and the paragraph to align them Verity Kali to the left, where the first guideline. Have this. Put a strap template before the shop is. Then open off flat icon dot com and search for this icon. And then you can switch the PNG and go to 500 12 quality Dan. Download it and import it into the's project. Resize it like this and then select the Sutra Boy, Holy in control or command key and US alignments on the options bar for thes icon to position it to the center off this shape, then the McLean on the layer goto layer a sign end, turn on color overlay and change the color to white. And that's it. Here we go. This is the first feature I have added, and next I'm going to rename me to Box One. Then I make a copy of it, drag it to the right exactly where these guidelines are and you can see the second feature . All right, Jim, make some changes here, boy, dragging it to the rights and you can use right arrow key on your keyboard. Zoom in. Then you can have more accuracy. Select this title and you can change it to Easy to said um, as a sample. Then go to this icon and open our flat. Our conduct calm. Such for tools icon. We have lots of icons here, so I can choose the best one that suits to my project. And this is good in my idea. So I Jews free download option an important to my dark humans. I need to resize it like this. And then I'm John, select the Soochow and apply allowing vertical and horizontal centers for the icon. And then I can resize it. After that, I can't remove the initial like on, said the icons collar to white, and then zoom out, collapsed this group, rename it to box tour and then duplicate this Two groups dragged them to the right because we need four boxes in the first row and then apply it by pressing on inter. So we have three D friends featured parts here go to layers, PanAm and Renay, each group to a box three and box for go to tired tell. So, like the title by double clicking on Takes Layers Icon, then changed the title to after data back home. Here is time to changed the icon, So Time Data and Satch Box Here is some icons I would like to use this one. I cease to PNG and I used three download option and wait to download. Then I can import to this project. Resize it by holding shift key. It can help you. Teoh resized this shape you quali from its Did I mention, then do the same and aligning it to the center and that's it. Expand the size, then go to layer style and U. S collar overlay, said the collar to white and go for the last box. Select the Tyco Chance, the time telling too best design all time. Go to this icon and activate the layer in layers panel and a pen off flat icon that's come again. Search for a design icon, Do you see is where I want to find good Icahn for my project, and I would like to use this on. You can see a preview off this icon after downloading, drag it to the project, resize it by holding shift key on after dad's. Select this eclipse layer in layers panel by holy in Control or command key. Activate the icon and use align vertical and horizontal centers from the options bar and then remove the previous icon in these Sirico. And that's it. Applying this selection by holy and Control or command E, then collapse. These four groups select all of them by holding shift key and duplicate them. Because I need another row off these features. I select them by holy and Control or command T, and then dragged them to the down underneath the first row. Like this price Inter and wait a moment for the's progress and the transformed progress should be finished here and then go to the second central from throw one and customize it. Select a dark color for this circle and then select all off these groups. Then I want to align vertical centers for this group, as you can see in the video, then right click on the group and select on group layers. After that, select all the elements Mackey grew for them and rename it to features, and this part is done 30. Project 2 blog part: in this video, I would like to add recent news my project. So I'm come over through a tangle tool and create a new rectangle with this wits and height . After that, I apply it and reposition it to here on their knees, the features part. And then I can press enter to apply it. Come over text tool and tap to create and you text layer type recent use. So use align horizontal sinners for the text after that, zooming by holy in control or command plus, then go to meet our team part. Copy this paragraph and really is it from the group? Then go back to this rectangle and select the paragraph and use align vertical centers. In this case again, select this text layer. Drag it to the top by holding shift key to drag straight, then press OK to apply. It's screwing down. Go to rectangle tool first along, position this horizontal guard line at the bottom off through a tango and create a new shape here left on the edge where the first guideline is. After that, go to feel and feel this rectangle re It's a gray color. Then make a copy of it resize it like this and go to feel and change the color to a white double Click on the layer Goto layers. Stein apply s truck. For this shape, you can chance any parameter here so you can see the difference just in it To hide guidelines. To see this part better go back to a stroke and change the position to inside and go to caller and set a different color for yes. Struck again activates guidelines. Go to tax tool and press. Enter toe, activate text layer and adjust phone size and set a new collar for that and type something here. So I would like to time a date here and next through this date. I all right. The author's name again. I use slash. After that, I type number of comments in this block or news. This part is not visible, so I go to color, pick your and set a darker color for that and I can position in here on. Then I'm going to radio. Is the phone size like this? Select this rectangle by holding control or command key. Go to this text and select a line. Hardison, tall senators and align vertical centers. Go to this layers and select them. Make it group for damn and rename it to block one then guarded this group and make a copy of its by holding control or command J drag it to the right where this guideline is. So be careful for this group because it's really important to place it here on the gang. We need to make some changes doing the same. Duplicate this group. I'm going Teoh position on under box or blunk right on the edge. So I select it and drag it to the right like this. You can see that we have free their friends boxes here. Just make sure that's you are placing it in the good position. Zo me in. You can see more details here, and you can check the accuracy by using horizontal guideline in this case, then a scroll down. Go to this layer and remove it because it waas unnecessary and extra. Let's check layers panel and remove extra layers, and groups rename these groups to like to on block three. Then select all these groups. Do you replicate down and dragged them to down like this? You can hold shift key to drag them straightly. This is where I have created six news or blog's for this part. I'm going to customize one off these blocks, so I so like the media rectangle from row one. And then I come over these layers. I mean the white rectangle and the text inside it, then dragged them to top, as you can see, then press enter to apply it, make a copy off this big rectangle, then resize it and position it on their knees, the white great tango, then a school of and such for a great color like this and go back. This is the result. We have changed the caller off this rectangle. So, like this wreck tango that has placed on their knees the white ray tango change the color you want and I fly. Some struck. For this shape. Go to text tools, create a text box inside this rectangle, then go to this paragraph and copy that by holding control or command, see and go back to the current layer that is, attacks layer double click on text layers icon. To make some changes, you can change the phone size and the vertical distance between each line and read. Use the text box size like this and so lack the white rectangle and use a line vertical and horizontal centers. There is a problem that we can't position peace text layer. Very good. So let's check it. Double click, and you can see the problem. We should resize the text box like this again. I do it and use alignments from the options bar. I need to do it again because something went wrong. I use align vertical and horizontal sinners like this. Go back to shape school and so, like eclipse. Then create a circle here by hauling shift. He fill it with no color, use a stroke and adjusted with the slider that you can see from the Options bar. Select this Sir Joe and move it as you want. Then select this rectangle and resize it like this. Position it above the white rectangle. When the date and comments are, you can use alignments for these purpose. Care to front, are some that calm, said for tango and select this angle rights icon. Go to here and select copy belief Icahn. Then go to tax tool, said the phone to phone our some free, solid haste, the belief icon by holy in control or command V. Increase the phone size Teoh 36 points, said the caller toe white. Then select the circle by holding control or command key. Go to the angle and use alignments. Come over the rectangle tool and then go to lying to change the weight and create a line on their knees. These parts set a gray color for that. This is where I want to position something especial for this item. I shows we are hovering on these parts. How our means. Then you put your mouth on something so it can has a special effect. I'm going to zoom in because this part is important for me. I apply its throat for the gray call a rectangle, activate guidelines. This is a recent news, but we are not finish the job collapse. The groups in layers panel select. I love these layers on Zoom out, then dragged down to the top like this and wait moment because it takes time to complete this progress and that's it. So, like, all these groups do the same and dragged him to Tom like this press enter to apply it and rates for the progress too complete. I would like to add a call to action on their knees. This block items so I create a rectangle and picked this color for that. I use textile, said the phone to Lehto. I will live to use later regular notice that we are going to use capital letters. So turn on caps, lock and type load more year, said the phone size to 24 points. Select a rectangle. Andi shoes, a long vertical and horizontal centers for the text. Then select both layers. Drag him to the top. Here is recent news. Let's check layers Panin and organize it. Select all the layers. Make it grow for them. Hurry. Name me to like If you see this part, you can understand that something is missing and it is really important. I have not added black title in this part. So I'm going to added to all the items. Just I need to go into each group and type a text here. School up Got to call her p care and set a good color for that. Resize it Teoh 14 points in this case on. Then place it here again. I can resize the text because it was really a small and I'm going to make some changes here . The first item is dawn and we have added more details to it. You can make it grew for, takes layers, then use alignments to have more accuracy. Rename this group as you want. It depends on you. Duplicate this layer and rename me to text to drag it to the top where blanc to is and drag it into like to do the same. Make a copy off this text. Rene. Me too. Text three. Drag it into blood tree, then select this rectangle. After that, go to text to and use Align vertical and horizontal centers Go to block tree. Remove this one. Select this rectangle by holding control Command key. Go to text three group and choose alignments. Here we have done for three blocks bought, three others are remaining. So I'm going to do it. That's just do the same and make a copy off these text and place them. I mean, other groups I mean the items that's are in a row to So go to this part, select the rectangle, choose alignments like this collapsed this group. Go for another item. Remove the first takes layer or initial takes layer and the last one do the same. Select it. And by using alignments, you can position text groups in the right position. 31. Project 2 slider 2 part: in this video, I'm going to create a slider, but it's really different. So let's go to create this awesome part. First of all, create a rectangle like this and position it here underneath the black part and scroll up. Go to feel and so like this color for direct tangle and go back so we can set this rectangle better and you can use arrow keys in this case. Next, zoom in because we need more accuracy in this part and position this horizontal guideline at the bottom of the rectangle. Then come over the rectangle tool and create a rectangle here inside the first rectangle. I need to set a new collar for this one. Then I can press enter to apply its and I go to move tool so I can move it if I want. Then come over text tool and create a title here on top off this part. So let's reduce or increase the phone size. It depends on you. I would like to increase it and time, but I don't hear. For example, are you ready to explore one there fool things and the question mark at the end so I can use alignments in this case again, a scroll up and select Theis paragraph or description and to make a copy of its then release it from the group again, a school down and here I can easily align it horizontal and vertical lead to the center, but I don't need a line vertical centers, but I need a lying horizontal centers in this case. So I'm going to dilate some parts off this paragraph or description. After DATs, I can move. It's to the top, just I need to select it from Layers panel and move it to the top by holding shift key so I can drag it to the top straightly. So I they're late. Some parts a game on here is the sick end text layer that I have added to these part and again. I would like to use a line hard dental centers for the Slayer. I'm going to make some changes here for the rectangle and read. Use the height After DATs, I'm going to create a duplicate off this layer and expand it horizontal like this. So be careful about the edge as I mean where the guidelines are and you can use transform tool for Theis Pair Press, then selected and reduced the height again by using transform tool So you can see this design here gets a rectangle tool and from feel change the collar after that drag de slayer to top. Now you can understand why I told you that I am creating and the friends slider years a drop shadow for this rectangle, and you can change angle and everything. He is changeable. For example, you can chance capacity of landing moment size or Danny Parameter that you need to change a plight by pressing on. Okay, this is where I want to showcase some slides or pictures here, and I need some bottoms. That's when I click on them. It goes to next, or the previous a slight or image. So I would like to create this by them above the rectangles so zoo mean or you can zoom out , then come to tax tool and tap to create a new text layer. Double click on text layers icon and go to call our pick your set a new color for the text . Then select theist rectangle and use a line horizontal and vertical centers for the text. Then select Theis rectangle and manky copy of it and recited like this. Position it here, then select rectangle tool go to feel and from color picker. Set a wide color for that, and I'm going to position an angle insight thes rectangle. So I screw up and select this anger right icon and duplicated. Then release it from the group and drag it to top. And I can use alignments. Two. Position this I can easily inside the rectangle. Also, I need to change the color like thes to a dark color. And after that I'm going to read. Use the phone size. As you can see again. I need to that line this icon. All right, here we go. I make a copy off this gray rectangle by holding on ski and dragging next to the first rectangle so I can pick a new caller. Four. This one. You can hide guidelines to see this sport mawr clear and type and all their title here. Just go to front from the options bar and set it to later and type previous here. Just remember, you're working with capital letters, so turn on caps, lock and type Previous here, let's check the phone size for next and do the same for previous as it takes layer here. After Dad, he was alignments, so you can see the difference. I'm going to read. Use the phone size for next text layer and do the same for previous like this. So we have done this part and I'm going to add more details. So I make a copy off this white rectangle and drag it to the right who, where previous text layer is and I duplicate and you'll right, and I use fleet horizontal from transform tool. You can go to transform to a boy holding control or command T and then use a line hard dental centers. In this case, that's what we bonds for thesis part. So if you click on next, this slider will be changed and another a slight. We'll be up here, creates a group for these elements. You can't renaming to Slider to and said the caller for DATs then collapsed the group and zoom in on this part is stone 32. Project 2 pricing part: in this part, I would like to create pricing options, so I'm going to create pricing tables, come over to rectangle tool and create a new rectangle with this numeric values. Press OK, go to feel and select a dark color to see this rectangle better. Then position it here on their names, the slider to part and drag it to the top by holding arrow key on your keyboard and do it again. You can disappear guidelines to see this project, then go to feel and feel the rectangle with no color. Use a horizontal guideline for this wreck tango, then zooming by, holding control or command loss. After that, come over rectangle tool and creates a new rectangle. He was exactly this wits and height for this part. Apply it. Go to feel, and there's a long go to search, and from this part, set a new a stroke for this shape so you can customize it as you want. Then select it and move it here exactly. Left on the edge off the guidelines. Then go to a clips tool, make sure that you're creating and Neil Layer and create a sujal, then set a green collar for that, then you can use alignments. After that, drag it to the top, so make a copy off this circle and set new collar for that. Just use some a stroke for the shape. We have two different circles here, the 1st 1 we have field with collar and the 2nd 1 we field with no collar. Zoom in because I want to type something in this sou chio set the phone size and tie, for example. $99 here. Then you can use a line hards and call centers for this text. After that, go to the line tool and create a line on their knees. The text. As you can see again, go back to text, tool and type. Pair Mom's Year. Go to the options bar and read. Use the phone size to 14 points. Do this same that's you did before four. All the elements and align it horizontally to the center. You can get help from a smart guys off for the shop to have an equal distance between each element. As you can see, just press control key to see numeric values as where to call this stance. All right, here we go find it's elements Position in Layers panel. There. Select is tree layers and make group for them. Then you can use alignments for this group after that younger players, because this group is unnecessary here, come over the tax stool and tap to activate a new text layer. Set a dark blue collar for these layer and type. Basic. Here. Change the phone size. Go back to the rectangle because I want to use a line. Hard dental centers for the text then creates a copy off this rectangle that's you can see . Select it and drag. It's to the down. You can use shift key to drag it a straight to the down like this. Placing here underneath the first rectangle you need Teoh. Move it to the top by holding arrow key, then read. Use the rectangles size where to Cali by using transform tool again. Go back to take stool. I'm going to type a title inside these shape, so I set the phone size to something that I need, and after that, I change the color to a gray one so I can use a line man's. After that, I need to duplicate these two layers so I can select these two layers and drag them to the down by holding all and shift key. I can do it just there is a difference that you should select, Toolbox says, and do it for another time. Place in here. You can't see all the D stances by holding control Key. Do it for the last one because I want to have four different block says here. So we did it. Just Something is remaining. I should go back to each layer and make some changes. For example, for the first Ray tango, I can chance the collar to gray. As you can see again, I I can go to feel and sit a softer collar for this one. All right, I'm going to do it for the 3rd 1 I go toe feel and pig this great color by using. I drop there. I'm going for the fifth break Tango and seventh grade tango. I do it on. You can see the difference. Go to move, tool. And after that, select this rectangle. Copy that on position it on their knees. The seventh wreck. Tango Go to feel and feel it with no color selected by holy in control or command t and expand the height off this shape, Go back to rectangle tool and create a new rectangle inside the last rectangle. It is a call to action, so double click on this layer and goto layers time and apply s rook for the S J so you can use both align vertical and horizontal centers for the shape type something inside thesis rectangle that is a call to action and tie by Now, for example, this is a bunch that you have created I would like to change the time towns because all of them are same and they are one hosting I go to the second box, change it to to a main marketing and I go to the 3rd 1 I type five databases for the 4th 1 I type to a design pack on next tree website layouts. My gain. Do it here five header styles got to the last one and change it to online his tour. This is what we have made. Just some few details are remaining. I should check alignments. After I did it, I go to layers panel and I select on these layers that are related to this box and make a group for it. Rename its a pricing table one. After that, select this rectangle and use align. Vertical centers for these groups duplicate this group, then drag it to the right by holding shift key and press enter toe. Apply that so you can make any changes that you need just selected again by holding control or command T and very position this group. Go to the right and first the wall green Andy's group to pricing Table two and create another copy off this group. Drag it to the right and position it next through the 2nd 1 I mean the sick end pricing table. Do it again and creates another pricing table position in here right on the edge off guidelines. So rename the groups to a pricing chairman tree and pricing table, for I'm going to change some text here. I change the price, too. $199 for the second prize seeing table and for the 3rd 1 $299 on the last one $399. Change this second box title to stand there and make sure that's you're aligning it's to the center horizontally. Do this, saying for the third title. Before that collapse, these groups select this title going Khaliq on takes layers icon, Then change into ultimate a gang do alignments in this case and go for the last title. Select it! Change it, Teoh Diamont. After that's I'm going to cost demise the third banks. So I select the circle and change the collar. Teoh. A dark blue collar, as you can see. Do it for both, sir, Chills here. Select this shape on again. Do it and use this collar so you can see the difference for the third pricing table from the left. Do this same four. Call to action and set a new collar for that. Just you need to chance the text collar as I did it here. After that collapse, the groups like this. You can zoom out by holding control command minus to see this part on your chan. These appear guidelines by holding control or command etch after that's so lack all these layers and make a new group for them and rename it surprising and set a collar for this grew up and it is done 33. Project 2 online store part: all right, we have arrived to the lung guest part where I would like to add and online a store to this landing page, as it did before, creates a rectangle. It's the sizes that you see. Then position it here on their knees. The pricing part. Be careful about the position, then drag this horizontal guideline. After that, come over the tax tool and tap on the screen to activate a new text layer. Sets a new collar for it and type feature paradox here. Then select a line Horizontal centers for these text. After that screw love, I would like to find a text like this. Select it and copy it by holding control or command. See, you can't duplicate this layer, then go back to the rectangle and use alignments. Then you can see these text here, then drag it to the top and you can't drag it straight by holding shift key. After that, I need to use a line hard dental centers icon on the options bar, and I go ahead, select these texts and I activate, takes options and turn off italic effect here. After that's you can make any changes you want so select this type and read the use the text box size horizontally again. I'm going to use alignments. It's my favorite to when I want to. Design websites in 40 shop creates another rectangle where this wits and height just feel this box with this numeric value and press OK to apply it. Then set a new color for that. It has a white collar. So you should so me to see this collar because we have a soft gray color for background. Andi, it's not Weezy. Well, I remove the shape. Then I go to create a new shape. I go to create rounded rectangle and select a wide collar for that and position it here left on the edge so you can see the position. Then double click on the layer. Go to layer Stein and apply s truck so he can disappear. Guidelines to see the difference. After that's duplicate this layer and the radios the size. As you can see and place it here for more accuracy, you can disappear guidelines. After that, you can activate it. Set a red color for dis rectangle breasts. Okay to apply it, then go to text tool and tap to activate a new text layer and start to type. It's high till here. I would like to type feature products here, so I top it and then I'm going to read. Use the phone size. After that, I select a line. We're tickled centers for these elements, and I can make any changes I need. Go to flat icon dot com and search for a diamond icon. I select this one and switch to PNG. Select Free download option. Import it into the project. Resize it like this by holding shifty and using transform tool. Select the rectangle by holding control or command key. After that, activate the icon and select Align vertical and horizontal senators. Apply a new collar for the icon, then position it here right on the edge off the rectangle. As you can see, drag it to the left by using left arrow key on your keyboard and get help from the Options bar to align thes icon. Very takagi to the center. Go to rectangular marquee tool. Select these parts like this, and I can ready use the size, then dragged these hard cental guideline here. After that, hold control or command D to disappear rectangular market tool, then create a line here where the horizontal guideline is set. A collar for that hide guidelines. To see the line after DATs, go to rectangular marquee to again and select this part and follow these steps, position and other horizontal guideline. Go to this line and make a copy of it by holding all key and drag it to a down where the's guideline is so we can hide guidelines to see the's lying better. After that, go to text tool and tap on the screen to activate and you text layer. Set a new collar for the's text. After that, type a Tyto here I will like Teoh. It's hype a product name here, for example. I watch seven s so set the front toe bold and resize it as you can see Dan, drag it to the right where the bigger rectangle is, and after that, go to phone our some that calm and open it in your browser and search for a star icon. So type it here and find Hey, it's hard like this and go here. Select copy of belief. Go back to the documents after Dad's come over the text tool and first creates and new text layer. After that, said the front to phone Awesome, free, solid and paste that belief. I can hear by holding control or command V Select these belief icon Andi Set a collar for that double Greek and use a struck from layer panel so you can use a great collar for the stroke. On it is done. Got to the left side and zooming by, holing control or command, plus make and other copies off the's star by holding all ski and create five stars here, Select all off them and reposition them, dragged them to the left and wait a moment for the process and place it here. I gain rate after that. So liked this a star and then select the first. A star after that's like the last one and use distributes where to call and horizontal centers for these stars got to the first the star and after that's come over the text tool . Change the caller to yellow in this case. So let's find a good yellow color for he spar press, and I'm going to change the extra color to another because the previous collar waas really dark. That's it. Press locates, comply. It's go to the Second Star and do the same. You need to just copy the yellow collar numbers or values and pay stem here. So we did it for four stars here. I would like to change another element here, so I said the phones to later and on their knees this tars I'm going to tie so I can type dollar or, better, say, $589. Here. It's just a number for price. You can type any number or value here, so let's have an equal vertical distance between our elements, just unit to press control. Key to see the numeric values like this. After that, you can't drag each element to the down or to the top to place it in the best position. After that's come over the rectangle tool and 38 thesis rectangle here and just let's find each elements position because I want to organize layers panel and create a groove for Then I create a group for stars. After that, you can turn off or on each elements, so let's on group layers because all right should make some changes here on again. All right, make it grew for these stars again. I make another group, and after that are you can align vertical centers for the screw again on group layers because we need that too. It's for alignments. And after that, you can on grew a bit scroll down a little bit and I'm going to add another element here. So I would like to add to call the actions at the bottom off my direct time. Guilt. So I select rounded rectangle and create and new on here. So after your have created, make another copy off this around the rectangle by holding on ski and position it on the right side off this rectangle so we can reposition it as you want. It depends on you. After that, come over the rectangle tool and creates a new rectangle here. Then I'm going to height guidelines to see mine project better. He sees what we have done till now. So select this great tango these two rectangles and make a group for them. Dan select theist rectangle by holding control key to align horizontal and vertical centers for these groups. Right. Click on this layer and select on group layers come over the tax stool. And so, like Theus surrounded rectangular, start to tie. Ah, time till here, for example. I'm going to type at two cart in this case, so I need to change this call to action Caller on on changing, too the dark blue collar. And after that I need to set a wide color for these texts and read. Use the phone size. Then I'm going to use alignments in this case, and you can see the difference. Go to this rounded rectangle again. Come over the rounded rectangle tool and sets a new collar for DATs. Go back to text tool on tap to create a new text layer and type view more here so I can use alignments again from the Options bar. I would like to add a Nikon beside each call to Action's text, so I go to flat Icon that's come and search per chase here. Now I can't find many icons bots. I so like this one, and I switched to PNG and I choose free download. Deny import this icon to the project. I need to resize it, and then I select this rectangle by holding control or command key and position this icon on the left side off this round a rectangle. After that, I need to resize the tax layer and I can use a line. Vertical centers for these types again, so got to via more and chanted to view detail. Then go back to flat. I conduct calm and search for another icon Here I searched for a detailed icon and D. C is the result. I select this icon because it looks good for my project and I drag it to the's stock humans again. I need Teoh resize it and I do the same and position it here on the left side, off this second rounded rectangle. After that, reduce the phone size for view detail and drag it to the right like this. So Height guidelines to see this part. We have done the first pro docked and I did new elements on details for it. Just I need to create a Group four Days elements. So I created group here by holy In Control or Command G, and you can't rename into, for example, productive one. Also, I can zoom out to see this part better. As you can see We have an extra element here, so I should remove it from the group and a game I'm going to man could grew up here, so rename it to gain to product and screw lob, then duplicate this group. Drag it to the right. Exactly, Very you can't see. It is really important. It takes time because the process should be finished here. So we have the second group. I'm going to change some elements and I remove the top elements off this part. After that, I create a line over the price like this, and I can select a line by holing control or command key and a line Vertical centers for the text. I mean pricing here, So let's go to add a discounted price next to the origin on price hands, I need Teoh resize the phones, the new text. It's not visible and we should following the reason. So I need Teoh change the color to a dark blue collar. After that, I'm going to type a numeric value here, for example, $389 in this case on a I need to change this title. You can change it to I watch six s doesn't matter. Collapse This group rename me too productive. Go back to the first box and manc Copy OVI. It's drag it to the right Exactly here. Way to moments, Andi. After the's progress, we can go ahead to complete this project. Select featured product text on Change It to another one. I'm going to type bestseller here, and I will like to set a new color for this great tango. And I select a blue collar for this purpose. After that's I'm going to change another element and it is Theis time on icon. So I open up flat icon dot com and type champion here. Here is lots off Icahn's. So I said, like this one and just free downloads half their DATs I imported into these project. Then I resize it, and I'm not worried about the position because I can select district tango by holding control or command key. Then I select this icon, and by using alignments, I can position it here. Dan, I would like Teoh resize it again. After that, remove the first or previous icon 40 shop Smart guys allow you to have Maura cure a C Justin into press control key to find any of these stunts beats being each element after that's you can drag any element to their right or to the left to have more a cure acey, and we can do this same four. This title. I mean bestseller, Then collapse these groups and organize them. Rename its and drag this group to the top. Just you need to see a solid horizontal line on top of layers panel. After that, you can release it. Go for this pricing option and you can change it and go to the right side a little bit. Collapse productive three and go to product to group. Make a copy of its and drag it to the right side after that's press enter to apply it and make sure that it is in a good position. And for this purpose, you shoot. Focus on guidelines, go to rectangle tool and create a rectangle here. Four. The fair blocks from the right and go to feel change its collar because I want to customize these parts. So I need Teoh Change something here before any action. I need to change text layers color to white because my background we'll be dark So I turn on this rectangle Oh, from layers panel and you can see that they France here for more accuracy. I can zoom in by holding control or command. Plus, in this case, and after that I can play with this rectangle and resize it to make sure that it is soon a good position. You can't see that for this line. We have some problems and we have found it by zooming in. And for this one, we have the same problem and I'm going to resize it. It is out off my rectangle and for the salon, I need to do it. And again for the last lying just selected and used transform tool by whole lane Control Command T Dan resize it easily collapse this groups so you can zoom out to see this part on off course I can hide guidelines by holding controller command edge. So this is and online this store in this lining page, just a few details and changes are remaining. I need Teoh change the price for the last Rick tango. After that's I select all these layers, Then I select district tango and I go to the group and select Align vertical centers for the group Then I on group play years and I select all these layers by holding shift Key creates a near group so I can rename me too online in store and set a collar for thes group Here we are almost gone. Just I need to change ich through dr name and make its difference. So I do it here on and again I can collapsed this group so you can see the final result here. 34. Project 2 contact part: Let's go to design contact part. Come over two rectangle tool and set and new writs and height for this shape and go to move tool. Position it on their knees. The online is sore part again. Screw up, then go to caller picture and set a great color for this rectangle. After that Gertie collapse tool and creates and make leaps or Cyrk, you'll hear you. Chen create sujal by holding shift key after data will click on the layer ghetto layers time and apply some drop shadow for these shape. You can't see the de France when you chance huge para meter. Here. When I change capacity size or the S stands, it will be appeared around the circle. So let's make sure that the drop shadow is good for this shape. And after that appliance, by pressing on okay, create another suit. You'll hear. It should be a smaller down the 1st 1 Then scroll up and go to feel and pick this green collar. Go back so the collar is changed. Then select the circle. Go to this smaller one and position it horizontally and vertically to the center off the bigger circle, then select both vehicles, create a group and rename me too location one, for example, and duplicated by holy in control or command J rene me to a location to and position it here, drag it to the top like this do the same, creates another duplication rene me to a location three. Then drag it to here that you can't see, and I need more off this location signs, so I duplicate this one again and position it here. Then I press enter to apply it and do the same for the last one. Renaming to Location five. Position needs here. Drag its to the down, then zooming by, holing control or command minus go to feel. Four. Theis Shape and change this smaller suit jewel's color to white. After that, come over the rectangle tool and create a rectangle above the circle that you can't see so you can resize it as you want. After that's Goto color picker and sit. It's to a gray color like this. Then double click on the layer to open layer. Aslahn go to stroke and set a stroke. For this shape, you can change any perimeter here. Then I press okay and apply it Dan. I come over rectangle tool again and create a tiny rectangle on their knees. The bigger rectangle like this. For these purposes, I should zoom in more because it's Nance more at your racing here. Then I am going to position its on their knees. Direct tangle. Just I rotated like this and position it here. Then I'm going to rotated more to make sure that I have rotated it to 90 degrees. Then I drag it to the top like this and combine it. We had direct tangle so I can drag it to the left or to the right. This is a design that I needed for this part. I'm going to select both off the shapes and creates a group for them. I can't rename eat, so it's up to you. If you want to organize your layers panel, you need to rename all the layers to remember damn in future. Let's work on this group and drag it to position it and the best place in this part. After that, come over, take stool and tap to create, and you text layer. Set a gray color for the text and type a title here inside the sports. I tight your office location, then go to textile and tap to activate another text layer type street address and create another taste. For example, type city. On this one, I'm going to type a phone number so you can type any phone number that you need. Then select these four layers and go to options bore and align it horizontally to the left . So I need Teoh. Make some changes here, and I would like to work on this box and read the use the size. Go to this group and collapse it before that. Change the rectangles collar. So if you zoom in, you can see some problems here. Drag the big a rectangle to the top. After that, go to the tiny rate Tangail and set this collar same as the bigger rectangle. So we did it. Now, if you press enter, you think that these two shapes are combined. I select these layers from layers panel and rename eats, too. Not this is the first part off. Contact the formation. Let's go for the second part on create another rectangle on their knees. The map. I renamed it to map because you can police any maps by using JavaScript or Jake or plug ins inside the sparks. So I have placed this part. Then let's go for completing the second part. Create a new shape here. Go to feel before that's go to a stroke by double clicking on the layer and chance the position outside play with the size. So this is what we need. Then make a copy obvious by holding all key year and at two other rectangles here they have unequal size. After that go today. First rectangle from the left Type something inside it. I typed name in this case. Then select a rectangle and use a long vertical centers for the text. Go for the 2nd 1 and feel this box type e mail here. So this is what we need and go for alignments from the options bar. Go ahead, Do the same for the last one. Press enter to activate. It takes layer on type subject here so you can reposition it if you want. Let's go to align it and I select align vertical centers for Theis text and on their knees , these three rectangles. I'm going to create a big rectangle like these. I freely with no collar. I'm go to struck and apply his struck for theis shape so I can select these layers and drag them to the top Because I have faced with a lack off a space here. So I changed the heart. Isn't all guidelines position to solve this problem after that? On their knees, the big rectangle I'm going to create another rectangle. I make a copy from other shapes and place it here. This is the contact for that. I need I go to feel and set a dark blue collar four this shape and I need to type something inside this shape. So I select text tool and type attacks here. Set the color toe white. I typed. Submit now select the rectangle by holding control or command key. Then activate that takes layer and select a line. Vertical and horizontal centers go to layers and make it group for damn. Rename me to contact for again create a new group for both Contact Form and Matt Group set a collar for the group. Use green in this case. So zoom out. This is what we asked on in these parts 35. Project 2 featured box part: Here we go. I would like to add featured boxes. So our income over rectangle tool and put this numeric values here, apply it. Then I can go to feel and set a new collar for the shape and position it here. Be careful about the position you can use the small guys off for the shot. Let's go to rectangle Tool and make sure that you're creating a shape in a neo layer like this. Look at guidelines carefully and create this shape between these guidelines. Then set a white color for that double. Click on the layer, go to a layer style select struck and change the capacity for the stroke. Got to drop shadow and activated. Change the D stands and size for this shadow. You can't walk, reads caller here. So go to call her p Care on set and you call her for DATs and then select this rectangle boy holding control or command t resize it. I would like to add some other elements to this box, so I select Eclipse tool and create as circle here. I should hold shift key for these purpose. Select direct tango by holding control or command key got two of the suit, Joe and choose a line Horizontal centers in this case, double comic. On this layer employees a stroke and drop shadow. You can add another color to this struck effect. So let's turn off both layer styles and take a look at this. Sir Joe, I will live. Teoh creates a duplication off this circle and change the position in layers Panel set a green collar for the big air Seiko. Then we need Teoh. Line the white suit Joe to the center, off the green. Sergio, like this, make a group for them by holding shift key because I want to align them Heart is installing to the center off this rectangular right click on the group and on group players go to this layer and again Go to layer is times and activates Drop shadow here So changed the stance and I was so the size activates a stroke to see how it works. So it's not good and I turn it off. Apply it by pressing on. Okay, Got to the top layer in layers panel Come over. A tank stool activates and you taxslayer set a dark color for yes text and type a title here. I type easy to customize in these box. Then I can Draghi. It's here. I select this rectangle and I got to the text and I choose a lying horizontal centers on their needs. The title. Create a text box, then school up to find a good paragraph like this. Double click on text layers icon, then copy it by holding control or command. See scroll down. Got to the Krantz layer. Double click on text layers. Icon and paste this paragraph or description here. Do the same for there's text box and align horizontal centers for the text. Go back to text tool and on their knees. The paragraph at another takes layer and type. Read more, said the caller to green. As you have used for the bigger circle in this part and repeat the task. Use alignments. This is the first featured bonds that I have created, so I create a group for thes elements and layers I carry. Name me to box if you want. It's a cost them name. Dad's, I typed. Let's go ahead and make a copy off this box. Drag it to the right. I mean next to the first future advice. Position it exactly here. You should be careful on again. Do it and dragons to the rights Little cats Put a strap guidelines carefully, so we have tree featured bark says here, rename the groups to organize Layers Panel to Box F E two and box F. U. Three Got to the second bunks changed its high until to make some difference in these items and on type great design ideas, take a look at a line horizontal centers and that's it. Select. Read more. Change the color Too dark blue. Go to the title and set a green color for dance guards and move tool and select the suitable. Then go to feel a gang. Use a dark blue collar for the sequel Collapse Box F E two group, Go to the Fair Group, Select the title and Chance It's to best for Responsive. After all these works, I need to feel the Syria kills. We hit some icons, so how can I? Dude, that's first of all, let's collapsed this group on. Then I'm going to open up. Phones are some that's calm in my brother. Go to this part and select copy Kalief icon. Go to the second box, activate a new text layer, said the phone to phone. Awesome free, solid, then pasted. Just see me, too. Set the color too white to see it visible here, and increase the phone size to 30 points. Then select the Sergio and choose a line. Horizontal and vertical centers go to this part and such for a new icon on type desktop. Let's find some good icons. I picked this one, and from this part you can copy Kalief Icon, so tap to copy its collapsed. The second group got to Box FD three Top to create a new text layer, then paste the belief icon by holding control or command V. Do the same as you did before to position it to the sensor off the Ciccio and go to the first box from the left sedge for a toolbox icon. We have these three icons. Select the free one, and from this panel, copy this belief icon Andi. It's copy it. Come over the text tool Paste the's icon again. Select the Suit Joe and position the icon to the sensor off Theus Sergio, make it grew of for featured boxes renaming to box f e, Select the Blue rectangle, drop fly alignment and off course vertical alignment, then select both group and the rectangle. Make a group for them. Renaming to feature box. 36. Project 2 footer part 1: in this video, I would like to add a footer to my website. I do want it it into two parts, and I'm going to do the first part in this video. So let's go to create a rectangle and picked this color for the shape, then reposition its and make sure that's you are placing it in the right position and come over to take stool tap to creates a new text layer and said the front toe later and increase the phone size. Set a wide collar for the front and type your logo. I would like the position mind logo here, left on the edge so I can resize it again and drag it to the laughed school of Select. There's text Copy it. Dan got to the Top Lightyear in Layers panel and create a tanks. Pont's exactly like this, and it's wien these guidelines and paste the text here. Then select these text box to resize it Dragons to the laugh and and a few of the tends to it again. Go back to text tool and creates and other takes box on their knees the 1st 1 and paste this saying description or paragraph here just I noticed that you shoot resize it and reduce the height off. This takes tool because I want tohave to different descriptions here. Select, move, tool. Then go to phones are some that come and search for angle. Look at this icons. Then go back to her rectangle tool and select. It commits tool here and creates a tiny Sirico, said the caller to green. And you can resize it again and make it smaller. Then go back to photo some and select the's icon or belief icon. Then from the top year salon Kulik Toe Copy Unique Card. Really go to Texas and said the front to force us on free solid. Then paste the belief icon like this, so zooming by holing control or command. Plus, select the circle by holding control or command key. Then go to alignments and use a long vertical and horizontal centers for the believe icon. Then create a text next to this icon and said the phones to you later. Tied rate more radios. The phone size go to call r p care and set the color to green. So here you can reposition the text. Just you need to select the circle and go to read more text layer and choose align vertical centers in this case and then press enter to apply it. Scroll down a little bit. Go to this fine and drag these social media icons. I have a ready file, and I'm not going to create this part because it's time wasting and either position it's and position it here. Wait a moment for the Progress and DC's social media icons. Then go to the right. Select on these layers and layers panel, then select the back drone or the vigor rectangle. We have some options here. You can use rectangular marquee tool for aligning these elements, or you can do the same as you did before you select thesis rectangle and go to this group and select Move, Tool and Jews along vertical centers. And it's done. Go back to take stool before that. Rename this group as you want. I am renaming it to intro F. Go back to take stool. Be careful about the guidelines, so I'm going to create another part that is called latest news. The color is green bots. I would like to change it to White, reposition its and Majid with your logo text. You can't get help from smart guys up for the shop in this case gets a rectangle tool and create a thumbnail for the news you want to create. And you can position hearts until guideline to have more like your A C, then hide it or remove it by dragging it to the top. Come over the tax tool and type a time till next to this som nail. I would like to time You're blind title here, then press on text layers icon to apply it and reposition it like this. Got to take still again, and on their knees, the timeto creates a text box. Then select Move tool and go to this paragraph. Copy it collapsed this group and go to the top layer, then pasted and resize the text box. Go to call R P care and changed the collar to a gray one and make it a little bit softer and at another elements underneath this paragraph at a date here and you can make some changes and at a space here and drag it to the top. Then you can hide guidelines to see this part after that find each layers position in layers panel then creates a group for related layers and rename me to News one. Then make a copy of its by holding control or command G, renaming Teoh nearest to and drag it to down underneath the 1st 1 and then press enter to apply it. This is the second news. Do it again. Make another copy, rename it 10 years three and drag it through the down. You can said it with the bottom off social media icons there. Select destry groups and then select. Distribute vertical sinners. Icon on the options bar tohave, and you call distance between each group got in years to and customize it. Select the farm. They'll go to feel and said the caller to green. So Lange, text tool. And at that, plus Icahn or sign here, resize it and increase the phone size. Select the thumbnail and use align vertical and horizontal centers. Four. Peace text. Collapse this group and select these elements. Make it grew for them. Andre Name into late test news. This is the first part off. Oh, food. There 37. Project 2 footer part 2: Let's go to design the second part off our footer and also complete this footer and go to text tool type tax widgets and position it here where these guidelines is goods around it rectangle three eights and you want then go to feel and set it to this green color. After that, select textile and type, for example graphic In these parts it's to launch so selected by double clicking on takes layers icon and resize it. Then go to the rounded rectangle and select alignments to align it to the center off this rounded rectangle. Make a copy off this shape, resize it and expand it horizontally tied and all their text here. And you can type ward price for these purpose. Do the same and align it to the center so you can add more space. Four. These shape and again I need to select it and the reposition it. We need more of this design, so I make another copy off this shape about holding onto key and place it here. Oh, so I can drag AIDS to the right or two left, and I can resize it. It depends on the word or the text that's I want to put it inside this shape. All right, go ahead and type. Oh, some as a tag here and reposition it. Select these layers and make a group for them, renaming Teoh tags and then make a copy off this group. Drag it's to it down on their knees, the first grow or the first line and then chan some elements in the second row. For example, for here, change the tax too, are us and place it here like this. Then change the second shapes Position on change the tax to flat design. Select a shape by holing control or command key. They're select align vertical and horizontal centers. In this case, go for the last tag, widget and type foot dish up. You can't see that we have not enough the space for for the shop text. So I shoot. Expand the shape horizontally and I do it. Live this I expand it from the left. In this part. Hi guidelines. This is our tags region. Then select this one again and expand it from the left Radios. The 2nd 1 sighs and choose a line vertical on hards until centers for 40 shop text customize one off these shapes, and it means you're hovering on. Eat with your mouth and this sport is complete. Let's go to collapse this group and then school down to add on other items and elements in this part. So come over the text tool and from here is start to type and type useful links here, said the corner toe white and change the phone too bold for the thickness off this phones Zoom out to see this part, and I'm going to make another decision for this title, and I read Use the phone size again. School down and on their knees. Useful links create a tiny a square by holding shift key. This is where I want to add lanes, so I come over the text tool and I said the phone size to 14 points. Then I type Web design resource. Then select this rectangle and choose a lying vertical centers for the text layer, and you can drag it to the left like this again through the alignment to make sure that the text is in the good position. After that, go to line tool and set the weight from the options were toe one pixel, then create a line here on their knees. This a link where Web design resource is select. These three elements make it grew for them. Rain a me to a link one. Then make a copy of its Drag it down after Dad's school down, and I need more duplication off these groups, So I select both groups and duplicate them. Why, holy in control or command? J? Then I dragged them to the down here. I have four useful links, but I need another one. So I select the last group and duplicate it. Drag it to the down underneath the fourth useful Link collapse. The group's then select, all of them on Choose distribute vertical centers from the options bar. This is because I want tohave an equal distance between these groups. Change the tight tells for the 2nd 1 Genji to down less center and for the 3rd 1 user account and for the next one, support for him. The last one short code pages for short court page. Let's make some difference in here where user account is and change the corner for both the shape and takes layer, then collapse the groups and layers panel zoom out to see this part by holding control or command minus on. Then I'm going to organize this part, so I select tax copy and drag it to down a little bit. Then I can select these elements in layers panel and make it grew for them and I renaming two links. Let's go to do the last part off this footer. Go back to textile, said the color toe white type. Contact us. You can set it with tax widgets, text layer and then go back to textile and be ready toe. Add another tax year type obvious one. I'm going to add address here, so I type office one, then on their knees. This title I will like to add the address. For example, I type you're a street address in another line. Press enter and type C, T and country, Then go to text options and set a different vertical distance. Bit vain each line. Remember that you can go to text options by holding control or command T. Before that, you should double click on text layers. Icon, Let's go ahead. I made a group of four office one on then I duplicated this group. There's select this title by double clicking on text layers Icon and change it to office to then on their knees office to group at another item like full number. So type it then on the needs full number and a number on A at a second number. For these items, you can select yes, three layers and go to distribute vertical centers. Select a line very to call into the laughed icon. Then we have made this layers in office one copy. So I release them from the group and create a new group for them. And I'm going to renaming to full number on their knees. Full number. Part I Aunt e Mail, for example. First email address support and sign gmail dot com and the 2nd 1 Hello and sign gmail dot com. Don't worry about the position. Just do it. So like these three layers goods or move toe and select distributes vertical centers and a line verity calling to the left icon like this. Select these elements in layers panel rename me too e mail. So zoom out. I need to feel contact part and fit it with the bottom off. Are there parts such as tags, region or latest news Scroll down. You can see the empty air space that's I need to feel. So I select the last group. Death is called email and drag it through it down where the bottom off are there. Parts is placed. I can't select each element and make more distance. B. It's mean each text and this stock humans again. I need to use distribute Verity call centers and I match it. Wit the last short code page line like this I can't get help from. The smart guys are for the shop for this purpose. Let's go ahead. Select full number drag. It's two down because I want to feel this part. It takes time. Wait for the progress, then go to office to make some changes here. Selected by holding control or command t dragging it. Two. Down. Do this same four Office one. You should use smart guys and especially the numbers that smart guys show you in some red boxes. After that apply Distribute where to call centers. So we have you called the Stance B. It's Van. It's group in contact part on. Then select on the elements here make it grew for them renaming to contact and after that, select all the groups that you have created for this part, Renee, me two footer said. The collar off this group, too read then collapsed this group. 38. Project 2 menu 2 part: we have arrived to the last part. Just I want to add another menu to this part and copyrights and all rights reserved text. Before that, I need to create a new rectangle here. Let's do it and use rectangle tool. In this case, let's stroller and first of all, apply this shape and I go to feel and set a new color for the shape. Like thes. I can use eye dropper in this case. Then press inter drop light and expand it from the right, as you can see, then you can make sure that it is in a good position, then school to top and from this part, select the menu and make a copy of its by whole lane Control or command J. Then release it from the group and drag it to the top in layers panel, then a school down and go to this part. Select a rectangle boy Holy in control, command key. Then go to the menu text and use align vertical and horizontal centers, then zooming by Holy and control or command plus and move this menu right on. Yet who? Where this put a strap guideline yes, and then use a lying vertical centers again. Get to the left side, and I want to add some text year select textile and tapped to create a new text layer and type. For example, copyright in these part, then double click on text layers icon and change the color toe white, then tap to apply thes text layer type Copyright 2018. You can increase the phone size to 18 for example, and next to the copyright type, all rights reserved year. Go to direct angle selected, then use a line where it's called Centers for these text and it is done. Let's go ahead and select Copyright 2018. Then select copyright and change the caller to green, as you can see. Then remove the menu collar in Layers panel and then select all the elements. Make it grew for them. Rename me too menu, too, then tap to apply it. You can zoom out to see the results by holing control or command minus on your keyboard and just wanna step is remaining. Change the color off this group