87.00-9.1?

Introduction?

本章簡介

• 如何有效的用形狀圖層 剪切蒙版 如何從草稿定制圖層 網(wǎng)站的按鈕。in the upcoming lectures, i'll teach you how to work with shape layers effectively. how you can create and modify them, what's their main purpose it. in this section, i'll show you a thing or two about clipping masks. you'll also learn how to create custom shapes from scratch with help of pen tool. together we'll design buttons for a website design as well as generate automatic guides that will help us position our layers precisely.?

88.07-9.2?

Create Shapes?

創(chuàng)建形狀

1. ?探討圖層形狀在項目中如何應(yīng)用，目前在圖層面板創(chuàng)建的形狀，矢量的，意味著調(diào)節(jié)大小的時候不失去質(zhì)量?？梢杂肅trl+T熱鍵，可以調(diào)節(jié)點，看左縱列創(chuàng)建圖形的工具，let's discuss shape layers in photoshop and see how they can help you in your projects. we're established that shape by this symbol in the layers panel. there're also vectors. and this means they can be resized to your heart's content without losing quality. this means one of your go to hotkeys is going to be Ctrl+T. through it. you can modify them on the spot. we'll focus on these tools from the left panel, because these create shapes.?

2. 兩個主要的選擇，第一點擊拖拽，最好的選擇。拖拽的時候看到大小是非常有幫助的。第二個方法是用特殊測量方案的時候，打開對話窗口輸入500像素??200像素。you have two main options. one, we can click and drag, and that's my preferred method. as i'm dragging, i also get its size, which is very helpful because it keeps me focused on my work. the second method is great when you want specific measurements. you click and you get this window. let's put it somthing like 500 pixels by 200 pixels.?

3. 看上面的選項欄，確保設(shè)置正確，第一下拉菜單選擇形狀；填充決定矩形顏色。從前景樣本中獲得，選擇新顏色，比如我們選擇紅色用于前景，按X幾次交換前景背景顏色，注意預(yù)覽框的變化。let's move on focus up top for a bit. in the options bar, make sure you have these settings. first, we need to have shapes selected in dropdown. the fill will determine the rectangle color and this is taken from your foreground swatch. let me choose two new colors. so you can see how this works. we have a nice red shade and for the background.?但是我建議越過該步驟，用任意顏色，如果想改變顏色，直接雙擊形狀縮略圖。顏色的變化實時展示出來。這就是為什么我喜歡這樣工作。i can also click on it, and i'll have several swatches. my advice is you skip the step, use any color, then if you want to change it, just double click the shapes thumbnail. the change is immediately shown on the canvas. and this is how i prefer to work.?

4. 筆畫是另外一回事，另外一個方式設(shè)置2像素，但是白色矩形上紅線斜過，意味筆畫不能用。不管如何寫入?yún)^(qū)域，寫入的筆畫就是展示不出來。the stroke is another one, i believe as is, as you can see, its way to set 2 pixels, but we also have this white rectangle that has a diagonal red line going through it. that means the stroke is diabled. so no matter what i have written in the field. no stroke is going to show upon canvas, that's totally fine by me.?選項欄的右側(cè)“模糊邊界”，早在2017版本的時候幾乎不可能得到模糊的圖層。然而，這就是“對齊邊界”特征功能。確保形狀邊緣清楚的。back to the right side, we have another setting back in days of ps cs5. when you add shape layers to your canvas, you sometimes get blurry edges. long gone are those days. and in CC 2017. it's nearly impossible to get fuzzy shape layers by mistake. nevertheless, this is what this align edges feather does. it ensure your shapes will be crisp.?

5. 移動到工具欄，兩個矩形工具的不同，從選項欄設(shè)定半徑。決定矩形邊緣的圓角。如果輸入20像素，就是畫布圓角的矩形。moving to the toolbox, the only difference between these 2 rectangle tools is this radius setting from the options bar. this will determine roundness of rectangles edges. so if i put in value of 20 pixels, this is what i'm going to end up with on canvas.?但問題是如果每次添加新形狀，屬性面板會彈出來。這是我第一個選擇，當(dāng)涉及到調(diào)節(jié)矩形的時候，這是在第一個CC版本最重要的特征，通過此設(shè)置，可以改變拐角半徑。but here's the ting, you've probably noticed these properties panel pops up everytime i add a new shape. this is my number one choice when it comes down to adjusting my rectangles. the most important feature introduced in the first CC version was this area here. you can change the corner radius on fly.?比如設(shè)置到20像素，可以從選項欄鍵入，可以鍵入0敲回車。圖層轉(zhuǎn)化到常規(guī)矩形。兩個工具都在一個面板里，調(diào)節(jié)拐角半徑，可以調(diào)整不同角的半徑。i have it set at 20 pixels because that's what i typed in that field from option bar. but i can change it to 0 and press enter. now our layer is just transformed into a regular rectangle. so this separation is no longer relevant in CC versions of ps. not only can you adjust the corner radius. you can do that for each individual corner.?

6. 維持橫寬比的激活，依據(jù)任何變化都可以調(diào)節(jié)。如果鍵入10按回車，所有的都更新。但是如果按徽標(biāo)，從底部鍵入25，給很多調(diào)節(jié)的靈活性。四角可以替換成0，因為面板從設(shè)置好第一個矩形可以彈跳出來。this chain icon is enabled, which means all 4 will adjust based on any change, i make in any field. so if i write 10 and hit enter, all of them are going to update. but i can hit this icon, and non i'll write 25 for the bottom ones, this gives me a lot ot flexibility. i can also square them off by replacing these value with 0. and it's easy to get started with it. because this panel pops up immediately after you've placed your first rectangle.?

7. 接下來了解寬度高度XY軸。W寬度H高度。或者Ctrl+T調(diào)節(jié)大小。從頂部左上角，X決定水平位置，距離左側(cè)的水平位置。Y數(shù)值決定距離頂部的垂直距離和位置。moving up we have our width and height values here. this means you don't have to use Ctrl T to resize it. that still a valid option. but this is a good alternative, we also have this shape position on the canvas starting from the top left corner. X determines the shape position horizontally, starting from left side, if i change to 0, my rectangle is going to touch the left edge of canvas. change that to 100 and it's going to move 100 pixels to right.?

8. 移動面板，建議關(guān)閉筆畫，因為圖層風(fēng)格做了非常好的功課。按住Shift拖拽完美的比例。不按shift圖形隨意一些?？梢杂糜跈E圓形，按住Shift拖拽完美的圓弧，橢圓形沒有很多設(shè)置屬性面板。moving down in this panel. we also have controls for its stroke. but again, i suggest you don't enable it because we have a layer style that does a much better job. when you create a new shape by dragging on canvas, hold Shift. and this will constrain your proportions. this means if you're a rectangle tool, you'll get a perfect square. shift prevents me from reshaping it as i drag. of course, i can always let go and this will give me full control over it.?因為橢圓沒有四角需要控制。此外多邊形工具，可以創(chuàng)建星星和多邊形狀，可以看到從選項欄的設(shè)置。this applies to ellipse tool as well. hold shift while you drag and you'll get a circle. ellipses don't have as many settings in this life shaped properties panel. because they don't have any corners to control. other than that, everything we've talked about is exactly the same, the polygon tool is great, when you want to create triangle, stars and all sorts of other shapes that have lots of sides, to control that amount, you can use this field from options bar.?

9. 我的建議是點擊畫布任意地方，可以得到新窗口，問到大小和邊界和平滑度，比如100像素大小3邊，得到期待的三角形。my advice is to click anywhere on the canvas, you'll get a new window. that asks you the size, how many sides. but more importantly if you want to have smooth corners, if i set it at 100 by 100 pixels with 3 sides and leave this unchecked, i'll get a triangle as you'd expect.?當(dāng)再點擊，如你意料的，我的大小是100像素??100像素。不是因為那是輸入最后的數(shù)值，是我上一個形狀設(shè)定的數(shù)據(jù)。when i click again there's something i want you to be aware of, my size is 100 by 100. and that's not because that was the last value that i wrote in. this is taken from the last shape i clicked on.?如果選擇該圖層，一旦選擇創(chuàng)建新圖層，不限于多邊形工具?；氐教岬降拈_啟平滑拐角，用100像素??100像素的設(shè)置，可以創(chuàng)建各種形狀，自行探索。?so if i select this layer, as long as its shape, once i click to create, a new one, i'll get its measurements in these fields this isn't limited to polygon tool. all these other tools work in same way. anyway, back to what i was saying if i enable smooth corners with the same 100 by 100 settings, i'll get all sorts of stars with various looks.

10. 看線條工具，經(jīng)常被忽略價值，不能點擊直接看大小，比如選項欄設(shè)置的1像素，可以用 shift完美平直。不用也可以得到矩形工具。切換到，輸入1像素高度，另外可以用Ctrl+T調(diào)整厚度。let's move over to line tool, which is seriously underused. you can't click on canvas to input any measurements. instead, you have to click and drag you set its thickness from up top. but i suggest you keep it 1 pixels. besides using shift to make it perfectly straight. there's little to say about it.?總結(jié)下，線條無用的。最后回到工具欄，選擇定制形狀，開始，面板有很多工具，但是需要用的就一兩個。to sump it up, the line tool is pretty much worthless. finally going back to tool box, we have custom shapes, but there's topic for another lecture. but in everyday projects, you'll most likely use any one or two.?

89.04-9.3?

Modify Shapes?

調(diào)節(jié)圖形

1. 調(diào)節(jié)圖形面板和框選工具面板類似之處，對比兩個看到類似的。操作功能類似的。開始拖拽后Shift，開始縮短橫寬比。若是拖拽前選Shift，在形狀圖層選中的情況下，鼠標(biāo)變成加號了。how you can modify the shape layers, when you add a rectangle or an ellipse to canvas, you'll get the panel. you have recognized these icons from marquee tools. you can compare the two, these icons look almost the same. and if we try to use our modifier keys. you'll see these tools behave the same way. if i hold shift after i start dragging, i'll constrain my aspect ratio. that's will end up with a perfect square.?如果加入存在的圖形，圖形變了，但是還是一個圖層。說明這是圖層疊加。按住Alt拖拽減去部分選區(qū)，另外拖拽后按Alt對稱拓展圖形。this means i'll add to my existing shape, check the layers panel to confirm this is case as you can see, no new layers shown up. instead, it got merged with the initial one that was selected. hold Alt and you can remove parts of shape minus symbol. but if you click and drag, then you hold Alt, it will expand layer on both sides as an equal right.?按住Alt+Shift給到交叉圖形。接下來看橢圓形框選工具，基于原點創(chuàng)建和拓展。按住 Shift完美的圓形，Alt從原點開始拓展。what Shift and Alt together, they give us the intersection between the selections, here's the same effect, and it targets the old shape and the new one. we could create and expand the selection based on the point of origin, here with ellipse, we have the same thing. i'll click and drag from this top left corner of canvas. if i hold Shift, i'll get a perfect circle. but if i hold Alt, this will expand shape from where i initially clicked.?

2. 兩個圖層融合Ctrl+E熱鍵。合二為一成為新圖層，比如紅色矩形，上面綠色矩形。選擇二者融合新圖層，你發(fā)現(xiàn)新圖層顏色隨上面的圖層。比如紅的矩形在上面，新圖層紅色的，綠矩形在上面，新圖層綠色的。the merge command Ctrl E does rasterize shape layer. you'll get one layer, but it'll still retain its shape properties. i'll add a rectangle on canvas, i'll make it red, above it. i have another one, this tunnel those a green color, i'll now use Ctrl E. and they'll combine into a new layer. the new shape is green. if we undo and swap their positions in layers' panel. you'll find out how this works. merged them again, the one that's higher in the layers panel will determine the new shapes color.

3. 路徑選擇工具黑箭頭，圓角半徑被激活了，輸入數(shù)值，按回車。目前是單一圖層，鎖定單個拐角的半徑，按Shift點擊第二個，會發(fā)現(xiàn)兩個都被選中了。there still live shapes, i'll get the path selection tool, meaning the black arrow and i'll click this one, we can see the corner radius is activated. input any values and hit enter. if you hold Shift, and click on the second one, now you have both selected. go to the options bar, and click this icon.?到選項欄點擊徽標(biāo)，覆蓋所有徽標(biāo)，shift結(jié)合，Alt裁剪，Shift+Alt創(chuàng)建交叉，點擊圖層融合，提示錯誤對話框，選擇確定，不再對待活生生的形狀。now we have all the commands we've covered. as we covered, shift combined shapes, Alt subtracts, Shift and Alt create the intersection. we'll click on this merge shaped components, and we'll act the error, by hitting okay. we're saying we no longer want them to be treated as live shapes.?

4. 轉(zhuǎn)化到常規(guī)形狀圖層，意味仍舊有矢量屬性，屬性面板選項受限制的。創(chuàng)建另一個矩形，比如白色箭頭直接選擇工具，拖拽錨定點，得到警告對話框，轉(zhuǎn)化到常規(guī)路徑。問，如果你失去所有的設(shè)置，為什么這樣做呢，當(dāng)你創(chuàng)建所有不規(guī)則形狀的時候可以用。instead, they'll be converted to regular shape layers, that means they'll still have vector properties. but you won't have nearly as many options in properties panel. as you can see, this is much more restrictive. let me create another rectangle on the canvas, i'll show you another thing. if you get the white arrow, so the direct selection tool. and you drag anchor point, you'll get the same warning. you'll transform it into a regular path, meaning you'll lose all those great settings. this is useful when you want to create all sorts of irregular shapes that ps doesn't offer by default.?

90.11-9.4?

Activity Design Web Buttons?

創(chuàng)建網(wǎng)站按鈕

1. 第一按鈕讓用戶執(zhí)行特定的任務(wù)，比如填寫名字，每個網(wǎng)站有自己特定目標(biāo)，下載文件，建立成員名單，命名為“CTA”，看看如何創(chuàng)作按鈕。Call To Action buttons are the most important, ask user to perform a certain action, like hence their names. let's how to make CTA button.?

1. 第一，用醒目的顏色。每瀏覽兩秒博人眼球的顏色，需要在各種圖表中具備吸引力，醒目突出。我們不能依賴大小，因為太多的搖擺空間，需要選擇吸引力的顏色，拾色器。頻率高飽和度高的顏色。we can't rely on its size, since there's only so much wiggle room, so we focus on choosing a striking color. you should rely on these area of color picker.?

2. 用圓角矩形，半徑5像素，大小設(shè)定200像素??60像素。比如用醒目紅色，沒有固定的規(guī)矩，給你看看效果，字體是Novas半粗體，選擇后居中。目前設(shè)計簡單主流風(fēng)格。通過用顏色，吸引用戶的注意。with a radius set a 5 pixels, regarding size will go with 200 by 60 pixels. for the color, i'll go with a powerful red. i'll write check out in proximal Novus a semibold for the size. i'll go with 15 pixels, select them both and center them. i appreciate this significant simplicity.?

2. 第二圓角矩形，大小199像素??60像素，用25像素的圓角，輸入文本“開始吧”。對于字體家族用Railway半粗體，顏色暗綠色。該流行按鈕不依賴于梯度，投射陰影，樣式，額外的裝飾。該風(fēng)格近期出現(xiàn)的，網(wǎng)站設(shè)計流行元素隨處可見。并不是說方角不好。針對圓角，推薦25，而不是中角15，或小角4-10像素。let's duplicate this conner button, we'll go with a corner radius of 25 pixels and also resize it 199 by 60. i'll go with railway semibold. again this is a popular buttons, that doesn't rely on gredient, drop shadows, patterns, any other additional decoration. that's not to say square corners aren't good. in general, i recommend you stick with rounded corner. you go with something significant like 25 pixels, going in the middle of round with 15 or so.?

3. 第三用炫酷字體。收藏幾種喜歡的字體，記住從谷歌字庫中探索喜歡的選項。use gorgeous fonts, you'll soon enough have a mental database of 5-10 fonts that are your personal favorites. remember touch Google fonts to browse quickly and see what's in at the moment.?

1. 我們創(chuàng)建另一按鈕，用10像素圓角，輸入200像素??600像素，字體Montscrat常規(guī)大小15像素，純白色，可以用最大對比度。let's create another button, this time with a few layers style, start with a rounded rectangle with 10 pixel, corner raidus, let's click and input the numbers manually 200 pixels by 600. let's add text. i'll go with start trail in Montscrat regular size 15 pixels pure white. it goes without saying you should aim for maximum contrast.?

2. 圖層風(fēng)格窗口，從梯度開始設(shè)置，角度90度，這是標(biāo)準(zhǔn)，左側(cè)是預(yù)設(shè)定的，這就是我在左側(cè)尋找給底部按鈕找顏色，用暗藍色，可以隨時調(diào)整的。let's open the layer style window, and start with a gradient, we'll leave our angle at 90 degrees, because that's the standard approach, click on this area, and let's customize it. i'll start with the basic gradient from one color to another, if you click on any of these preinstalled ones, you'll get some funcky options. that's why i'm constantly resorting to first few options. the left side is for the bottom of botton. it's not written in stone, we can always go back and adjust it.?

3. 右側(cè)是頂部按鈕顏色，如果從頂部選區(qū)樣本，不能奏效，那是沒有按確定，目前預(yù)覽也是按照梯度顏色走的。按確定后，可以改為純藍色。now fot the right part, which controls the top of button notice something interesting here. if you try to sample a color from the button, you'd expect that if i clicked, we get blue, that's not what happens. instead, i'm getting green. that's because our gradient hasn't been applied yet. if you really want to sample from that color, you must first commit to this gradient.?

4. 設(shè)置投射陰影，設(shè)置不透明度100%，混合模式正常，顏色從底部按鈕取樣。保持角度90度，用4像素距離組合，0像素大小，實體陰影，按鈕是3D立體度有深度的。從距離滑塊控制的。let's add drop shadow, but it won't be what you expect, i'll change the blend mode to normal with an opacity of 100%. for the color, i'll sample this from the bottom region and go down a little more. i'll keep the angle at 90 degrees, but i'll use a distance of 4 pixels in combination with a size of 0 pixels. that's going to make our shadow solid, now you can see its looking like the button is 3D. like it has depth. this is controlled from the distance slider.?

5. 設(shè)置內(nèi)部陰影，不是標(biāo)準(zhǔn)的，用純白，不飽和度100%，混合模式正常，剩下參數(shù)設(shè)置為0，注意到底部高亮。i'll add an inner shadow, which again won't be standard, i'll use pure white with opacity set at 100% on normal, next i'll go with 1 pixels for its size, and that's it. the rest will be set at 0. notice how we have a highlight of sorts at the bottom.

6. 需要幾個技術(shù)，確實不如前兩個流行。依據(jù)個人喜好。沒有獨特衡量標(biāo)準(zhǔn)。如果專注梯度，顏色影響微乎其微了。that requires several techniques, i woundn't say its as mordern as the first two, it's a question of personal taste, but also a matter of circumstance, you should focus on semi flat gradient, so the difference between your colors should be minimal.?

4. 第四個規(guī)則，如果多個按鈕設(shè)計，同樣設(shè)計重復(fù)多次，還是如何做出區(qū)別？don't clash with other buttons, you might need several buttons in your design, watch the approach there. should we use the same design multiple times.

1. 圓角矩形半徑5像素，大小275像素??60像素。針對顏色范圍。打開亮色15像素大小，字體opensans，按鈕內(nèi)文本居中，如果不確定字體，形狀工具選擇T，從左側(cè)改為居中調(diào)節(jié)文本排列。let's start with a rounded rectangle with a corner radius of 5 pixels, size 275 by 60. for the color range, go with something fairly decent rated, take course as my text. let's open sands light 15 pixels for its OpenSans size. center it, inside the button. if you're unsure about the font do this, select T for type tool and change your text alignment from left to center.?

2. 用對齊工具，如果調(diào)整字體家族，一個按鈕居中，甚至如果調(diào)節(jié)大小，有字體居中時候調(diào)節(jié)設(shè)置。now use alignment tools. to put it back in the middle of button. now if we quickly adjust the font family. you'll see our button will remain centered even if we adjust its size, this will allow you to make swift decisions while having the text in the correct position.

3. ?如果第一個按鈕完成了。復(fù)制后，選擇填充，可以看到內(nèi)部筆畫，2像素大小，同樣陰影的顏色，改變字體。so our first button is done, but say you need another one, here's what we'll do. we'll duplicated and take down the fill. now we add stroke on?inside,?2 pixels for the size. for the color, will use the exact same shade, change font as well.?

4. 普通的問題簡單的解決方案。建議考慮用戶的行為，最好的場景，哪種設(shè)計更有信服力，哪種設(shè)計預(yù)覽可以說服客戶購買。a simple solution to fairly common problem. so i suggest you think about the priority of users' actions. what's the best case scenario. here it would be to buy the course, but if he isn't convinced, he can watch a preview first then come back and purchase it.?

5. 第五個規(guī)則，需要時候加入文本，從圓角矩形開始的。用275像素??17像素大小，10像素的圓角半徑，顏色選擇紫色石頭。用博人眼球文本“不需要信用卡”。add more context when needed, start with a rounded rectangle as per usual. 275 pixels by 17 pixels. 10 pixel corner radius. for the color will go with a purpletone.?so still something striking. for the text we use to get started and no credit card required.?

1. 頂部線條，寫入優(yōu)選的Nova粗體23像素，用所有大小轉(zhuǎn)化，創(chuàng)建路徑AKA，字體空隙10像素，居中水平。底部一行，首選Nova常規(guī)14像素，沒有軌跡，沒有大寫，單純更換顏色黃色，再次居中。the top line will be written in proximal. nova bold 23 pixels, use all the caps transformation and increase tracking AKA the letter spacing to 10 center horizontally. from the bottom row. go with proximal Nova regular 11 pixels. no tracking, no caps, just change its color to a nice yellow, center this one again.?

2. 如你所看的，同樣的寬度，如果不能做到寬度相同，第二條線垂直線，兩個毗鄰的點，其中一個建議幫助調(diào)節(jié)字體間距。兩組可以融合成一組。as you can see, they all occupy the same width, which is the ideal situation. if you can't do that, make sure your second line is a lot wider you don't want a little bit outside, these two imaginary vertical lines. you want a lot besides that point. one piece of advice that can help you is this, adjust the vertical space between the two lines until you're happy then to center them inside the button market them group first.?

3. 現(xiàn)在選擇底部和對齊頂部，右鍵確定兩條線居中。最好匹配字體，不僅僅是粗細，優(yōu)選Nova字體，手寫的或者帶襯心的字體，空間受限的。now select the group and button and use alignment tools. up top, when you're done. right click and ungroup. this is how you make sure these two lines are perfectly centered.?

4. 給用戶信息按該按鈕會發(fā)生什么，不需要付費確實吸引人。it's also a great ideal to mix and match fonts, not only weights, here we used proxima Nova in both cases. but you could go with a handwritten font or a serif font.?

6. 第六最后的建議。如果按鈕是混合的，首先按鈕大小200像素??60像素，超級圓角28像素，用同樣的綠色陰影，第二選擇節(jié)省時間，文本下載文件，用Oswald粗體16像素大小，全大寫，從平面按鈕選擇的設(shè)計資源選擇的下載徽標(biāo)。my last advice icon in the mix, whenever you feel they add value first the button 200 by 60. super rounded 28 pixels. i'll use the same shade of green as in my second button to save time, the text download file. i'll go with Oswald Bold 16 pixels, make it all Caps, i already have an icon prepared in another tab. this is taken from a flat icon dot com, a great source for these types of icons, let me drag it in.?

1. 和字體之間距離10像素，把下載按鈕和下載文本歸組。最后，解除歸組，確保持續(xù)性調(diào)節(jié)設(shè)置，目標(biāo)幫助用戶視覺化線索，不是裝飾目標(biāo)，而是服務(wù)目標(biāo)導(dǎo)航的。leave 10 pixels i usually like to leave 10 pixels between my icons and my text. looking good so far, here will repeat the process from previous button. we'll group the icon and text. we'll select button and align them. the idea is to help the user with a visual cue, the downwards arrow, hence this is a download button. this is the place where icon come in handy, don't use them for decorative purpose.?

2. 最后建議文本不需要很大，不用調(diào)大字號，短小精悍是好的，用戶不是半盲人。never to make your text too big for your button, for example, in the first couple of options, smaller is always better, your user aren't half blind.?

91.04-9.5?

Use Custom Shapes?

定制形狀

1. 激活工具，按U選擇工具，還可以用Shift+U循環(huán)的顯示工具，取而代之，專注選項，關(guān)鍵性的一步，看下拉菜單選擇你要創(chuàng)建什么，默認(rèn)的需要用右下角箭頭展開。custom shapes, which are probably going to be your favorite shape layers in photoshop, that's because they're so easy to use. you can hit U to select this category tools, then Shift U to cycle through them, as you can see, the active tool changes as i constantly tap that hotkey, when you want to add a new layer. by default, this list isn't going to be that big, but let's use this arrow.?

2. 建議是，按住Shift你并不知道原始比率，所以不建議選擇手動輸入。但是大部分的時間，不知道需要輸入數(shù)據(jù)是什么。開始探索面板可以定義大小，到任意角落，看到信號，拖拽出來，因為你目前不需要空間。my advice is you click and drag. and as you do that, always hold Shift, and that's because you never know their original aspect ratio, instead of guessing, your best bet is to ust shift, because you have no idea what sort of values you need to write in.?

3. 到右上方，點擊齒輪徽標(biāo)，展示了選項列表。類似于圖層面板，可以定制縮略圖大小。如果你足夠勇敢，可以選擇文本，但是我建議你用縮略圖可以直觀的看不用猜測。建議你選擇小或大的縮略圖。大縮略圖非常有幫助，允許你看到細節(jié)。尤其是不能設(shè)置難懂的形狀。go to the top right and click on this tiny gear icon. this will reveal a long list of options. similar to layers' panel. you can customize your thumbnail size, if you are brave, you can use the text only setting. if you do that, you'll have to rely on description, which doesn't always tell you the whole story. my advice to you is stick to large thumbnail. because they allow you to see all sorts of tiny details.?

4. 接下來可以下載各種圖形包，點擊箭頭，展示出來的要不要替代當(dāng)前設(shè)置，看似困惑，但是意思是要不要新圖形加入當(dāng)前圖形，當(dāng)你下載打包圖的時候，大部分案例，這是你想做的。我建議再次點擊從列表中，選擇替換存在的圖書館，否則得到的僅僅是復(fù)制。現(xiàn)在你下載定制的形狀，從中選擇，加入到畫布，還可以從網(wǎng)站下載有趣的形狀。比如喜歡的打包下載，文件夾CSH格式，這是PS識別的格式，雙擊后PS自動的添加到圖庫里。而且可以添加到畫布，好事情是定制你想要的大小，如果下載是個問題，可以直接拖拽到畫布。沒有錯誤或者成功的提示，需要到圖書館看有沒有添加成功。如果選擇失敗的，到齒輪按鈕，點擊下載形狀。underneath is where you can load up additional packs. i'll click on arrows on this pop up is going to show up, asking me if i want to replace the current set or append. from this list, choose the first one, which is all this time, i'll choose to replace my existing library, otherwise i'll end up with duplicates. so let's get some better looking ones, my go to site is shapes for free dot com. this has a fairly large collection of custom shapes that are much more interesting to look.inside it you will find a file with a dot CSH extension. it won't let you what happened. if you click on that dropdown, you'll see that the new set has been added. check the library because you won't get a notice either an error or a success message.?

5. 用Ctrl J復(fù)制，從路徑中選擇單獨的錨定點，還可以創(chuàng)建新圖形。這是下節(jié)課的內(nèi)容。in any other position. or better yet, i can duplicate it with Ctrl J, now i'm free to select any individual anchor point, from the path and create a new shape from it.?

92.07-9.6?

Activity Design Shapes With Pen Tool?

用鋼筆工具設(shè)計形狀

1. 畫布上繪制長方形，按Shift拖拽，大小不重要，Ctrl J，旋轉(zhuǎn)45度，按住Shift旋轉(zhuǎn)三次。用Ctrl T縮小大小，兩個分開圖層，用Ctrl E融合到一個，白箭頭選擇，看到兩條分開路徑，用原始形狀的錨定點，否則很難直接選擇點本身。用路徑選擇工具，目前這就是活生生的形狀屬性面板。增加拐角的半徑變得更圓。這就是邊界按鈕，下滑到菜單中部，找到定制的形狀，雙擊，命名?！e have a square on our canvas, grab rectangle tool, hold Shift and drag one out, the size doesn't really matter, how i duplicated with Ctrl J, and i want to rotate it 45 degrees, so well and up with a new shape. use Ctrl T for that, as you rotate, hold Shift to constrain this moment to 15 degree increments. this means you'll have to there through 3 stages. it's on a 2 separate layers, so let's merge them together with Ctrl E. if you switch to white arrow, you'll see your 2 separate paths, use it to grab the original shapes anchor points, click and drag is my go to option. an alternative is to use the path selection tool which gets the job done in one action. now this live shape properties panel should be lit up. increase the corner radius to something really rounded. top menu, you have to scroll down somewhere around the middle, here you can find define custom shape click it, and you'll be asked for a name.?

1. 切換屬性，創(chuàng)建副本，ps指引找到水平和垂直中點，Ctrl R熱鍵，左側(cè)頂部帶出標(biāo)尺。因為都是設(shè)置像素的，作為偏好設(shè)置面板，拖拽出指引線。隨著選擇形狀，接觸到中點，感覺指引線像是吸附到位置，不用附屬的技能可以找到中間點，如果切換到移動工具，保存光標(biāo)?？梢苿又敢€，鎖定到特殊位置，用Ctrl Alt 分號，鎖定到形狀。如你所見，在上面移動，什么都沒發(fā)生。用Ctrl Alt分號重復(fù)熱鍵，解鎖。但是這不是我們想要的，我們是要固定到位置。從頂部菜單，瀏覽鎖定指引線，切換到直接選擇工具，選擇錨定點。接下來，鋼筆工具告訴我們哪里放置鼠標(biāo)。create a dulicate, so we can have a before and after shot, move it to side. we use PS guides to help us find its horizontal and verticle centers. the hotkey is Ctrl R. and this will bring up your rulers. at the left and top side of PS. i'll click and drag out a guide, this is what we are looking for. we can find its middle point without any additional techniques. if you switch to the move tool, you might save the cursor. we want them fixed to this specific position, to do that, use Ctrl Alt semicolon, this will lock them into space. i use the command from top menu, go to view lock guides. in case you forget its hotkey. you can find it there. switch back to the direct selection tool and select all your anchor points.?

2. 如果看到星號，意味著沒有選擇路徑，抓住黑白箭頭，確保選擇在先存到路徑上。對交叉加入點，確保精準(zhǔn)到1像素?，F(xiàn)在加入4新錨定點到形狀。創(chuàng)建兩個副本，放置在畫布不同位置。對于第一個形狀，選擇4個錨定點還刪除掉為什么，形狀如何變化的。切換到背景圖層，激活移動工具，Ctrl點擊到形狀來選擇。we'll add few more with pen tool and these guys will tell us where to position our mouse cursor. if you see this asterisk, that means you don't have your path selected. i'll switch to the background layer and activate the move tool. i'll control click on the shape to select.

3. 切換到白箭頭，選擇左側(cè)錨定點選擇并刪除，點擊Ctrl看新形狀，選擇所有錨定點，下拉菜單，選擇突出重疊區(qū)域，用轉(zhuǎn)化點工具，用白箭頭抓取錨定點，現(xiàn)在切換到鋼筆工具， 按住Alt，同時按Shift，縮小運動，做完交叉后，選擇突出重疊形狀。i'll switch to the white arrow, i'll click and drag to the select left anchor point and for the other shapes, i'll select all anchor points, so you can see its a perfect replica, next i'll click on this drop down, and i'll choose exclude overlapping shapes, and here is another custom shape. with the final copy, i'll use my convert point tool. first i use the white arrow to grab all these anchor points, now i'll switch to the pen tool and i'll hold Alt, that's what i'm looking for.?

2. 當(dāng)下的形狀，也是鋼筆工具的用武之地，基于輪廓創(chuàng)建定制的形狀，從選擇條設(shè)定形狀，用藍色的，點擊一次，按Shift，雙擊左側(cè)，第一個曲線，形狀開始下移，按Shift拖線條。另一個曲線區(qū)域，用Alt轉(zhuǎn)化重心點，下次點擊時，得到圓線，是因為調(diào)節(jié)柄并沒有匹配形狀。兩個選擇，可以繼續(xù)用Alt，最后關(guān)閉形狀。因為是形狀，可以反復(fù)回去調(diào)節(jié)。grab pen tool and make sure you set it to shape from the options bar, i'll start with this blue one. click once, then hold Shift and click again on the left side, now we have our first curve, now we have another curved area but there's no problem with it, i'm still holding Shift, i want my lines to be perfect, this is where i want to arrive, if i try to continue my shape, notice how it's going to be out of order. to fix this issue, you'll need to convert this point through Alt key, click once and you're good. the next time you click, you might get a rounded line. that's because this handle isn't aligned to your shape.?