Photoshop에서 이중톤 이미지를 만드는 방법

다음 사이트 디자인을 작업할 때 고려할 수 있는 일반적인 유형의 배경이 있습니다. 바로 사진입니다. 이러한 경향이 반드시 고유한 것은 아니지만 장면을 설정하고 사용자를 사이트 환경에 몰입시키는 데는 효과적입니다. “사진을 사용하는 방법을 찾고 있지만 약간 더 활기가 있다면 항상 이중톤 이미지를 시도할 수 있습니다. 보기에 흥미롭고 만들기도 쉽습니다! "

Photoshop에서 이중톤 이미지를 만드는 방법을 배우기 전에 이 디자인 트렌드에 대해 좀 더 자세히 알아보겠습니다.

이중톤 이미지란 무엇입니까?

기본적으로 이중톤은 단순히 두 가지 색상으로 구성된 이미지입니다. Spotify의 2015 Year in Review와 같은 캠페인에서 이미 본 적이 있을 것입니다.

이것은 특히 에이전시와 소규모 브랜드 사이에서 점점 더 인기를 얻고 있습니다. 이중톤 효과는 작업과 웹사이트 전체에서 브랜드와 색상을 통합하고 강화하는 좋은 방법입니다. 작은 영감을 주기 위해, LPK는 이것을 사용하는 방법에 대한 훌륭한 예를 보여줍니다.

이 기술을 시도하는 데 관심이 있다면 조작하기로 선택한 사진에 전략적으로 적용하고 싶을 것입니다. 기술적으로 이중톤 효과를 모든 사진에 적용할 수 있지만 대비가 많은 이미지에서 더 잘 보입니다. 또한 단색 배경의 이미지를 사용하는 것이 좋습니다. 원하는 기본 색상을 쉽게 설정할 수 있도록 흰색을 사용하는 것이 좋습니다.

스튜디오에 액세스할 수 있고 사용자 지정 사진을 찍는 데 관심이 있는 경우 장면을 설정하는 동안 다음 팁을 염두에 두십시오. 기존 콘텐츠로 작업하는 경우 항상 먼저 사진을 조작하여 대비를 높이거나 배경색을 변경할 수 있습니다.

• 과정에 참여하고 무료 Photoshop 리소스를 다운로드하는 데 관심이 있다면 이 섹션으로 이동하십시오!
• 이미 과정에 참여했다면 여기를 클릭하여 템플릿 자습서로 바로 이동하십시오!

튜토리얼의 나머지 부분에서는 Photoshop에서 이중톤 이미지를 수동으로 만드는 데 사용할 수 있는 두 가지 방법을 다룰 것입니다. 첫 번째는 내장된 Photoshop 옵션(잘 작동하지만 내가 가장 좋아하는 것은 아님)이고 두 번째는 그라디언트 맵을 사용합니다(물론 무료 작업을 사용하지 않는 한 내가 선호하는 방법입니다!).

준비가 되면 이미지를 Photoshop에 로드하고 사진의 복제 레이어를 만듭니다. 원본의 맨 아래 레이어 대신 복제본을 편집하면 항상 원본 사진의 편집되지 않은 버전을 사용할 수 있습니다.

Photoshop에서 이중톤 이미지를 만들 준비가 되셨습니까? 시작하자.

기본 Photoshop 이중톤 옵션을 사용하는 방법

1. 이미지를 8비트 회색조로 변환

Photoshop에 내장된 이중톤 옵션을 사용하려면 먼저 이미지를 8비트 회색조로 변환해야 합니다. 사진 사본을 선택하고 이미지 > 모드 > 그레이스케일로 이동합니다. 또한 동일한 모드 메뉴에서 8비트/채널 옵션이 선택되었는지 확인합니다.

이 옵션을 선택하면 몇 가지 알림이 팝업됩니다. 첫 번째는 색상 모드를 변경하기 전에 이미지를 병합할지 아니면 레이어를 병합할지 묻습니다. 레이어가 많은 경우 색상 변경이 표시 방식에 영향을 줄 수 있지만(이 경우 병합은 작업을 보존하는 데 도움이 될 수 있음) 이 경우 이미지 병합에 대해 걱정하지 마십시오. 원본을 원하면 레이어를 병합하지 마십시오.

다음 알림은 색상 정보를 삭제할 것인지 묻습니다. 기본 이중톤 옵션을 사용하려면 이 작업을 수행해야 하므로 "취소"를 클릭합니다.

2. 이미지를 이중톤으로 변환

이미지 모드가 8비트 회색조이면 Photoshop에서 기본 이중톤 옵션을 사용할 수 있습니다. 레이어를 선택한 다음 이미지 > 모드 > 이중톤으로 이동합니다.

3. 색상 선택

이미지가 이중톤 모드에 있으면 색상 선택을 시작할 수 있습니다. 좋은 점은 새 색상을 선택하자마자 이미지가 업데이트되어 어떻게 보이는지 확인할 수 있다는 것입니다(미리보기 확인란이 선택되어 있는 한). 그 외에도 프로세스가 약간 투박해지기 시작합니다. 기술적으로 각 색상의 곡선을 조정할 수 있지만 이미지가 실시간으로 업데이트되지 않아 어떤 일이 일어나고 있는지 확인하기가 약간 어려워 앞뒤가 많이 바뀌었습니다. 원하는 효과를 찾을 때까지 색상과 설정을 사용하십시오.

이러한 설정을 잠시 사용하여 감을 잡을 수 있도록 제안하고 싶지만 준비가 되면 Photoshop에서 이중톤을 만드는 두 번째 방법으로 이동하겠습니다.

그라디언트 맵을 사용하여 이중톤을 만드는 방법

1. 그라디언트 맵 적용

이 방법을 사용하면 이미지를 변경하거나 특정 색상 모드를 선택하는 것에 대해 걱정할 필요가 없습니다. 물론 편집하고 싶은 것이 있다면 계속 진행하십시오. 하지만 사진은 있는 그대로 잘 작동합니다. 준비가 되면 이미지 사본을 선택하고 이미지 > 조정 > 그라디언트 맵으로 이동합니다.

기본 설정에 따라 이 설정은 회색조 매핑을 위해 그라디언트로 이미지를 오버레이합니다. 기본값이 흑백이 아닌 경우 드롭다운을 클릭하고 해당 옵션을 선택합니다. 첫 번째 방법을 따랐다면 이미 이중톤을 만드는 데 절반이 왔다는 것을 알 수 있습니다.

전문가 팁: 반전 옆에 있는 확인란이 보이시나요? 그것을 클릭하면 사진의 색상이 반전됩니다. 이 자습서에서는 선택하지 않은 상태로 두지만 배경을 피사체보다 어둡게 하고 싶다면 해당 옵션을 사용하면 전환할 수 있습니다.

2. 색상 선택

그라디언트 막대를 클릭하면 새 창에서 그라디언트 편집기가 열립니다. 여기에서 색상을 선택하고 이미지 위에 색상이 표시되는 방식을 조정할 수 있습니다.

보시다시피 최종 이미지는 서로 상당히 다르게 보이지만 둘 다 멋진 이중톤을 생성합니다. 색상의 강도와 어둡고 밝은 톤이 어디로 가는지 제어하기가 조금 더 쉽기 때문에 그라디언트 맵을 사용하는 것을 선호하지만 두 가지 방법 모두 사용하기 쉽습니다.

무료 이중톤 Photoshop 작업에 대한 2019 웹 디자인 트렌드 과정에 참여하십시오!

이 트렌드를 시도할 빠르고 쉬운 리소스를 찾고 있다면 미리 만들어진 그라디언트 맵 옵션이 있는 작업을 포함하여 이 튜토리얼에서 파일을 얻을 수 있습니다! 아래 양식에 가입하여 파일을 다운로드하거나 여기를 클릭하여 과정에 대한 자세한 내용을 확인하십시오.

[optin-monster-shortcode id = "dktout15rz4zcbcifnsl"]

디자인 트렌드 과정에 참여해주셔서 감사합니다!

먼저 여기에서 Photoshop 액션을 다운로드합니다.

듀오토너 사용법

작업 설치

작업을 다운로드했으면 파일을 두 번 클릭하여 설치합니다. Photoshop에서 사용하려는 이미지를 연 다음 작업 창을 엽니다.

작업 창으로 이동하려면 창 > 작업 을 선택하거나 Shift + F9 를 누르고 있습니다.

작업 창을 연 후 이중톤 효과를 적용할 이미지 레이어를 선택합니다.

작업 선택 및 재생

"Flywheel – Glitch-a-tron" 폴더의 드롭다운을 클릭합니다. 이제 "Glitch-a-tron - Select and hit play"를 선택하고 창 하단의 삼각형 재생 버튼을 누릅니다.

재생을 누르면 각각 다른 이중톤 색상 구성표를 가진 전체 레이어를 볼 수 있습니다! 전환하려면 원하는 레이어를 표시하기만 하면 됩니다.

참고: 이중톤 레이어가 두 개 이상 표시되면 색상이 혼합되어 사진의 일부 세부 사항이 손실될 수 있습니다. 선명하게 유지하려면 한 번에 하나의 레이어만 표시해야 합니다(또는 완전히 다른 효과를 위해 이중톤을 레이어링하여 자유롭게 실험해 보세요!).

보너스: 스냅샷으로 이미지 재설정

역추적하려는 경우에 대비하여 작업이 적용되기 전의 이미지로 돌아갈 수 있는 스크린샷을 자동으로 생성합니다.

창 > 기록 을 선택하여 기록 창으로 이동합니다. 위로 스크롤하여 "스냅샷"을 클릭합니다. 이렇게 하면 모든 것이 재설정되므로 계속 진행할 수 있습니다.

이중톤에 대해 어떻게 생각하세요? 그것이 강력한 디자인 트렌드라고 생각합니까, 아니면 풀 컬러 이미지를 선호합니까? 아래에서 생각을 공유하세요!

이 무료 Photoshop 파일을 다운로드하십시오.

아래에서 무료로 템플릿을 다운로드하세요!

다음에 읽을 내용이 확실하지 않습니까? 이 목록을 확인하십시오:

• 2020년 웹 디자인 트렌드 13가지
• 웹용 이미지 최적화 방법: 사이트 성능 향상을 위한 단계별 가이드
• CSS 및 SVG 클리핑 및 마스킹 기술을 사용하는 방법
• 웹 사이트에 고정 뒤로 가기 버튼을 추가하는 방법