본문 바로가기
IT인터넷/컴퓨터 기초지식

포토샵 가이드라인 설정 쉽고 빠르게 guideguide 플러그인

by Rookie Smart 2015. 3. 13.
반응형

포토샵 가이드라인 설정을 쉽고 빠르게 도와주는 guideguide 플러그인이 있는데요. 가이드 라인이 있어야 디자인 레이아웃을 쉽게 하도록 도와주는 그리드 시스템을 적용할 수 있습니다. 그리드 시스템은 보통 화면을 12개의 칼럼(세로줄)으로 나누는 화면 설계 시스템을 말합니다.





포토샵 가이드라인 플러그인을 다운로드 받기 위해 guideguide.me 를 방문합니다. 회원 가입 없이 무료로 다운받을 수 있는데요. 다운받은 파일을 더블클릭하면 어도비 확장 매니저가 설치 된 후 guideguide가 설치됩니다.





설치가 끝난 후 포토샵을 실행하고 창 - 확장 - guideguide 메뉴를 클릭하면 우측에 패널 화면이 나타납니다. 사용법은 간단한데요. ① 좌측선 ② 세로 중심선 ③ 우측선 ④ 가이드 지우기⑤ 상단선 ⑥  가로 중심선 ⑦ 하단 선 그리기 입니다. 





포토샵 가이드라인을 그린 후 [Make grid] 버튼을 클릭하면 실제로 가이드라인이 적용됩니다. 패널 상단 마진은 숫자로 입력하면 되는데요. 좌측, 우측, 상단, 하단 각각 2mm의 마진을 설정해 보았습니다. 아래 이미지를 보면 지금까지 설정한 가이드라인을 볼 수 있습니다.  



 


그 아래 보이는 설정은 열(column) 또는 줄(row) 개수대로 가이드라인을 그려주는 설정입니다. 아래 보이는 이미지는 열 넓이, 줄 높이, 열과 열 사이 간격(gutter), 줄과 줄사이 간격(gutter)입니다. 그 아래 설정은 열, 줄, 거터의 중심선을 그려주는 설정입니다.





열의 넓이 = { 문서 전체 넓이 - (거터 x 개수) } / 열의 개수 인데요. 전체 화면 960px 에 적용하면 좌, 우 여백 각각 10px, 컨텐츠 영역 940px, 12개 열 각 60px, 열 간격 20px 의 그리드 시스템이 적용됩니다. 대형 웹사이트 대부분이 그리드 시스템을 사용합니다.



반응형

'IT인터넷 > 컴퓨터 기초지식' 카테고리의 다른 글

nespdf 사용법  (2) 2015.04.13
vi 명령어 (기초)  (2) 2015.03.29
AI 파일 투명배경 png 파일로 저장하기  (2) 2015.03.11
ftp 프로그램 파일질라 사용법  (4) 2015.02.13
구글 스프레드시트 사용법  (0) 2015.01.15

댓글