Photoshop에서 BG가 타일을 올바르게 반복하는지 테스트합니까?

웹에서 사용할 Photoshop에서 배경 질감을 만들기 위해 자주 노력하고 있습니다. 불행히도 나는 보통 다른 웹 사이트의 공짜를 추측하거나 사용해야합니다.

Photoshop에서 직접 텍스처를 만들고 이미지 를 내보내기 전에 타일이 제대로 타일링되어 있는지 확인하고 싶습니다 . 이것을 빨리 할 수있는 방법이 있습니까? 오프셋을 사용하는 방법을 기억하지만 도구에 익숙하지 않습니다.

아래는 몇 가지 배경 타일 예제이므로 내가 말하는 것을 볼 수 있습니다.

• 이미지를 만드십시오. 예를 들어 200px 정사각형이라고 가정 해 봅시다.
• 필터> 기타> 오프셋으로 이동하여 이미지 크기의 절반 인 x 및 y 숫자를 입력하십시오 (이 경우 100px).
• 이렇게하면 이미지가 많은 픽셀 위로 이동하고 캔버스에서 이동 된 픽셀이 다른쪽에 놓입니다. 이제 패턴 중간에 패턴이 완전히 반복되지 않는 이음새가 이미지 가운데로 내려가는 것을 볼 수 있습니다.
• 이 솔기를 손질하여 원하는 도구를 사용하여 부드럽게 혼합하십시오 (복제 도구는 일반적인 옵션입니다).
• 새 이미지를 저장하십시오.

더 복잡한 이미지의 경우, 캔버스 가장자리 근처에서 처음 놓친 가장자리를 만지기 위해 픽셀 크기의 1/4과 같은 최종 오프셋을 수행해야 할 수도 있습니다.

DA01은 그것을 만드는 방법에 대한 답변이지만 귀하의 질문은 그것을 테스트하는 방법입니다. 그 질문에 대한 답은 다음과 같습니다.

1. 패턴 레이어를 선택하십시오
2. 편집> 패턴 정의
3. 새 레이어 만들기
4. 모두 선택
5. 편집> 채우기> 패턴> 패턴 선택
6. 괜찮아 보이는지 확인 해봐

전통적으로 이미지를 jpg 또는 png로 저장 한 다음 기본 HTML을 사용하여 타일링을 테스트합니다.

<html>
<head></head>
<body style="background: url(image.jpg) repeat 0 0;">
</body>
</html>

브라우저에서 해당 파일을 열고 타일링을보고 "image.jpg"를 다시 저장 한 후 웹 페이지를 새로 고쳐서 개정을 확인할 수 있습니다.

이 작업을 수행하는 또 다른 방법이 있지만 한계는 다른 모든 패턴의 크기가 이유와 동일해야한다는 것입니다.

단계 :

• 200 x 200 픽셀의 상자를 만드십시오.
• 스마트 오브젝트로 변환하십시오.
• 수평으로 3 개의 상자가 있도록 복제하고 정렬하십시오. 사이에 겹치거나 공백이 없는지 확인하십시오.
• 선택한 세 개의 상자를 3 개의 세로 열로 복제하십시오.
• 아직 활성화되지 않은 경우 기본 설정에서 플로팅 창을 활성화하십시오.
• 스마트 객체를 두 번 클릭하고 엽니 다.
• 두 파일을 모두 볼 수 있도록 두 창을 정렬하십시오.
• 스마트 패턴을 원하는 패턴으로 채우고 다른 창에서 동시에 작동하는 것을보십시오.

AMP Tile Viewer 라는 훌륭한 (개인용 프리웨어) 도구 가있어 이미지를 타일링 할 수 있는지 여부와 타일 모양을 신속하게 확인할 수 있습니다. 나는 항상 그것을 사용하고 그것은 잘 작동합니다. Photoshop에서 패턴을 만들 필요가 없으므로 나중에 사용하거나 삭제하지 않아도됩니다.

타일 ​​뷰 라는 Chrome 확장 프로그램을 작성 하여 이미지를 마우스 오른쪽 버튼으로 클릭하고 타일 방식을 확인할 수 있습니다.

내가하는 방법은 타일을 jpg로 저장하고 바탕 화면에 타일로 설정하는 것입니다. 매우 빠르고 쉽습니다.