배너

포토샵

  • home
  • 포토샵
조회 수 169 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄

TopIntroduction

If you've already read my other tutorial you should be familiar with my workspace. You may want to work with your own flag, but just in case you can't find your way in google for a high-res flag, or too lazy to prepare one in eps format that opens up at any resolution (which I had to do in this case), you can grab the Turkish flag we'll be using for this tutorial here. Result of the tutorial:

Flag final

TopThe technique, revealed

TopStarting up

Here we go:

We'll start right away by opening our flat flag image first and then convert it to a layer from a background layer by double clicking.

Convert to layer

We'll then open up some free space by increasing canvas size. After sizing the canvas, as you see in image blow, we'll add a new layer beneath, we'll call it "waver" or anything that passes by our mind. We'll then reduce the opacity of the flag layer so that we can draw the "waves" better.

Size canvas

TopPainting the displacement waves

Now, we'll select waver and start painting black on it with such a soft and big brush that makes you want to put your head and sleep on. Try to imrovise, always feel free to try anything. You can also try using clouds here for the waver, I know of some people who can make a Mona Lisa painting with a few clouds and levels combinations. I am not one of them so I have to paint that layer, which is easy anyway.

Waver layer

To avoid islands of extreme whites and blacks, we'll apply a very heavy menu -> filter -> blur -> gaussian, until we see white and blacks merge to form gradients of gray tones. The numbers you see in the example images are not obligatory and varies heavily according to the resolution of the image we are working, you are not advised to apply a 30 radius gaussian on a 100x100 image!

Gaussian blur

After we're content with what we have, we'll copy this "waver" layer entirely (control+a , and then control+c) and then paste it in a completely new document (menu -> file -> new , and then control+v). We can name the new document as "Flag Displacer".

New document

In this new document, we'll first menu -> layer -> flatten image , and then menu -> image -> mode -> grayscale . This grayscale image will act as our displacement map. . Here you see the image flattened and on its way to being an "officially" grayscale image.

Convert to grayscale

We'll save it somewhere as "Flag Displacer.psd". You can close this document now, we do not need it open.

Tip: To make the flag wave more on one side, you can apply a horizontal black to white gradient in multiply mode to the distorter image we used, before the layers are displaced. The darker parts will wave less.

TopEmboss for lighting the waves

Now, here is where the magic is coming from: Emboss. Duplicate your waver layer just in case we may have to go back to it, and then apply a strong menu -> filter -> stylize -> emboss.

Emboss

We'll cast "light" on this duplicated waver layer with emboss. Just experience with the emboss settings, try to keep the lighting smooth, but at any time later, we can blur it if need to, it's not a bad thing to try crazy things.

Tip: You can gaussian blur the artefacts introduced by emboss.

Now we'll go back to the flag layer, and apply the displacement map: menu -> filter -> distort -> displace.

Displace layer

You can see the settings I used in this example, just try different settings according to your personal taste. When we press ok, there'll be file requester asking us for a displacement map. We'll find and select the "Flag Displacer.psd", and voila, the displacement is done. You can undo and reapply a few times to test settings. Here is the displaced layer on its own:

Displaced flag

TopDisplacing the base image

Now, if you overlay the embossed lighting layer on top, you'll see what we're going for. But you'll also notice that the embossed layer is not aligned well with the waves of the flag, esp. if you have done quite a lot of displacement, this will be more evident. We'll easily fix that by displacing the embossed lighting layer with the exact same settings as the flag. If you have not used any other filters after last time we did in this tutorial, you'll find our beloved displace filter right under menu -> filter. Place out embossed lighting layer on top, and then apply the displace filter. Once is enough to align the lighting layers pixels perfectly with the creases of our flag. But we can displace it twice, which will condense the lighting a bit and give a stronger result. Don't worry, displacing twice does not pull our pixels all in the wrong places, as we are applying the same displacement, we are making it stronger. (It is not the same thing as doubling the displacement values!)

Displace lighting layer

TopPlaying with the levels of the lighting layers

Now we have all the necessary pixels in our hands to simulate the 3d look, we can use them for any color and level combination. The rest of the tutorial is based on personal tastes, the technique is already revealed.

Tip for the power user: For the ultimate fabric look, you can have a separate layer containing the flat fabric texture, and then you can apply the same distortion. You can later overlay this layer, or use it as a mask to the layer that does the highlites, therefore using it effectively as a specularity map.

We'll duplicate the lighting layer, I renamed them, as they will do exactly what their names suggest.

Result lighting layer

You see our lighting layer already looks really cool :=) If you like it, you can leave it that way, but our flag needs some lighting, so we'll go back to work. We'll group (control+g) the shades to the flag layer and select multiply. We can play with the opacity of the multiply layer. Voila! It already is a nice looking flag, at least to me ;), so you can just leave it as it is, maybe apply brightness or adust gamma to the whole image to get highlights and brightness. But we don't stop there, I'll try to show you how to add some highlights using the the duplicated layer we named "hilites". Multiply does not make parts brighter, and we want total control over the highlights, so we'll simply go on!

Multiply layer

We'll make the "hilites" layer visible, and change its layer type to screen. Do not group it to the flag just yet. Oh no, all our shades washed out! We'll get that right ASAP with a levels layer grouped to the "hilites" layer. A levels adjustment layer can be opened by pressing levels on the create new fill or adjustment layer menu at the bottom of the layers window. Adjust the input levels so our shades take a sigh of relief, and only highlights are revealed. You can also adjust how strong the highlights are by adjusting output values or the opacity of the "hilites" layer.

Screen layer
Alternative Lighting MethodTip from Chris Murray: You can use render->lighting effects to light the flag, with different controls, using the displacement layer as alpha.
Lighting Effects

Ok, you see above that we managed to do what we promised for. As the layers are not grouped, the image looks like a flag painted on a bigger piece of wavy substance, which maybe even cooler than a flag waving on its own :) Here, in the ungrouped view, we can also check if our lighting layer matches with the waves of our flag. But to conclude the tutorial, we'll merge down the levels adjustment layer to the "hilites" layer so we can group it to the flag layer. Note: First merge the levels layer down and then group, or else the adjustment layer will simply adjust the wrong layers! We'll also throw in a black and dull background. In the image below, you see the "hilites" layer is merged with the asjustment layer, this explaing why it is no longer there :=)

Group all

Here is the result:

Tutorial end

TopVariations

Below is a variation I made in mere minutes using single displace (twice is for the satin look, I must say), and a single multiply layer for shading (no screen layer), the light direction is different. The multiply layer had to be adjusted with a levels layer. This looks more like an ordinary flag, without the satin look. Keep in mind, I displaced once instead of twice, so the the gradient is smoother. This is also to show you the importance of experimenting with the tutorial instead of doing everything verbatim :)

Tutorial end
?

  1. Camera raw 업데이트 방법

    Camera raw 업데이트 방법포토샵에서 RAW 파일을 열어서 보정을 할려고 할적에 가혹 최신기종에 카메라에서는 열리지 않는 경우가 있습니다. 이것은 포토샵에서 최신 기종을 지원하지 않기 때문이므로 최신파일로 업데이트를 해줘야 합니다. ▲ 포토샵을 실행한...
    Date2017.06.15 By이하늘 Views1682
    Read More
  2. 포토샵 에러

    윈도우7 사용할때는 이런 경우가 없었는데 윈도우10으로 CS6을 설치한 이후 아래와 같이 could not open a scratch file because the file is locked 오류가 팝업되며 실행이 안되는 문제가 발생되었다. 구글을 검색해보니 윈도우7과 윈도우10에서 발생되는 현...
    Date2017.04.18 By이하늘 Views43
    Read More
  3. 외교통상부에서 요구히는 여권사진 규정안내

    여권사진규격 가로 3.5cm, 세로 4.5cm인 6개월 이내 촬영한 천연색 상반신 정면 탈모사진으로 머리의 길이(정수리부터 턱까지)가 3.2~3.6cm이어야 합니다. 바탕색은 흰색이어야 합니다. 사진 품질 복사한 사진, 포토샵 등으로 대폭 수정된 사진은 사용할 수 ...
    Date2017.02.18 By이하늘 Views143
    Read More
  4. 외교통상부에서 요구히는 여권사진 규격

    아래는 외교통상부에서 요구하는 사진 규격입니다.
    Date2017.02.18 By이하늘 Views101
    Read More
  5. No Image

    포토샵cs5 누끼따기

    .
    Date2017.02.17 By이하늘 Views133
    Read More
  6. 포토샵 증명사진 정장사진으로 만들기

    먼저 수정할 증명사진을 가져옵니다! 사진을 가져와서 가로세로 100픽셀씩 추가 추가합니다. 퀵셀렉션툴을 선택해서 사진의 인물을 선택합니다 퀵셀렉션툴로 선택을 했으면 .Refine Edge.. 크릭하여 마무리 수정을 합니다. 마무리 수저을 완료후 아웃풋 설정...
    Date2017.02.17 By이하늘 Views351
    Read More
  7. No Image

    2015 포토샵 CC 단축키 입니다.

    2015 Adobe Photoshop Keyboard Shortcuts Cheat Sheet 출처 : http://www.setupablogtoday.com/adobe-photoshop-keyboard-shortcuts/
    Date2015.08.02 By이하늘 Views2721
    Read More
  8. 3d Looking flag Using Photoshop

    TopIntroduction If you've already read my other tutorial you should be familiar with my workspace. You may want to work with your own flag, but just in case you can't find your way in google for a high-res flag, or too lazy to prepare one in...
    Date2011.06.23 By이하늘 Views169
    Read More
  9. 깔끔한 버튼 만들기

    Date2010.10.24 By이하늘 Views377
    Read More
  10. 포스트잇 만들기

    Date2010.10.20 By이하늘 Views562
    Read More
  11. 스프링 노트 만들기

    시작전에 아래 이미지를 저장하시고, 포토샵에서 열어 주세요. Edit-Define Brush를 클릭하여 브러쉬로 만들어 줍니다. (동그란 무늬와 스프링 각각 다른 이미지입니다. 총 4개 저장.)
    Date2010.10.20 By이하늘 Views972
    Read More
  12. 화살표 이미지

    Date2010.10.16 By이하늘 Views1470
    Read More
  13. 버튼 이미지 만들기 pds 파일

    Date2010.10.16 By이하늘 Views539
    Read More
  14. 펜 툴로 자유롭게 패스를 작성하자

    Date2010.10.11 By이하늘 Views349
    Read More
  15. 포토샵으로 곡선 그리기

    보통이라면 펜툴로 하지만.. 다른 방법을 알려드립니다. .
    Date2010.10.11 By이하늘 Views782
    Read More
  16. 움직이는 나비 만들기

    Date2010.08.17 By이하늘 Views448
    Read More
  17. 30가지 음표 패턴 입니다.

    30가지 음표 패턴 입니다.
    Date2010.08.16 By이하늘 Views481
    Read More
  18. 음표 브러쉬

    Date2010.08.16 By관리자 Views1029
    Read More
  19. 포토샵 실행시 MSVCRT10.dll 파일 오류

    포토샵 실행시 MSVCRT10.dll 을 찾을 수 없으므로 응용 프로그램을 시작하지 못했습니다. 이 문제를 해결하려면 응용 프로그램을 다시 설치 하십시오. 에러 메세지 그래서 포토샵 실행시키면 다 켜지기 전에 엔터한번 쳐줘야됨 -_- 짜증@@ msvcrt10.zip를 다운...
    Date2010.08.03 By이하늘 Views522
    Read More
  20. 버튼 이미지 모음

    Date2010.08.03 By이하늘 Views1845
    Read More
Board Pagination Prev 1 2 3 4 5 Next
/ 5
포토샵
nextep banner

COPYRIGHT ⓒ ALL RIGHT RESERVED.

로그인

로그인폼

로그인 유지