안녕하세요 여러분 무견입니다. 이번에는 두 페이지를 넘어 여러 페이지에 걸쳐 있는 디자인을 시도해 보려고 합니다. 사실 이 예시는 2페이지 디자인과 별반 차이가 없으니 큰 기대는 하지 마세요. 주제는 인터뷰 형식의 기사입니다. 주요 내용은 2013년 스튜디오 지브리에서 진행한 인터뷰와 텔레비전 프로그램 ‘지브리의 책장'(2010년 8월 BS Nippon Television에서 방영)에서 방송된 아가와 사와코와의 대화에서 발췌한 것입니다. 이 기사에 대한 더 자세한 내용이 궁금하시다면 2023년 10월 출간 예정인 다우출판사의 『책으로의 문 – 미야자키 하야오가 말하는 이와나미 소년문고』를 기다려주세요. 1. 내용 분석 본문을 정리하기 전에 먼저 먼저 정보를 분석해 보세요. 이때 맹목적으로 모든 텍스트를 InDesign으로 긁어서는 안 됩니다.
조판 프로그램에서는 특히 한국어의 경우 긴 텍스트의 순서나 내용을 적절하게 정리하기 어렵고, PDF에서 가져올 때 아래로 눌러진 텍스트가 모두 Enter 키를 누른 채로 전송됩니다. 그래서… 본문의 내용을 정확하게 이해하고 오류를 방지하기 위해서는 위 이미지와 같은 워드프로세서나 한컴오피스 등의 텍스트 편집기에 본문을 옮겨서 꼼꼼히 확인하시는 것이 좋습니다. 또한, 불필요한 게시물을 점진적으로 제거하여 기반을 다져나갈 예정입니다. 이제 그리드를 나누어볼까요? 그리드 생성
먼저 종이를 만드세요. 저는 일반적인 잡지 크기인 A4를 선택했습니다.
그런 다음 여백과 열을 설정합니다. 여백은 상단 15mm, 하단 25mm, 내부 25mm, 외부 15mm이며, 열은 3mm 간격으로 9열로 나누어져 있다. 마지막으로 가이드라인으로 3mm 간격으로 6줄을 만듭니다. 지난번에는 일반 페이지에서 잠글 필요가 없는 안내선 사용법을 알려드렸고, 마스터 페이지에서도 만들 수 있다고 말씀드렸습니다. 자세한 내용은 다음을 참조하세요. <17 Editing Design – Page Design – Two Page Design> 동일 카테고리 https://blog.naver.com/mj94920 /223192495690를 참고해주세요. 2. 정보의 종류에 따른 그룹의 분리 먼저, 유사한 정보에 따라 그룹으로 묶을 수 있는 그룹은 다음과 같습니다. A. 작성일자: 2013년 8월B. 작사 : 아가와 사와코C. 인터뷰 제목, 프로필, 이미지 : 미야자키 하야오D. 명언이전 이미지다음 이미지 일단 정리했다면 잡지 인터뷰처럼 다단계로 나눠보자. 각 페이지에 3개의 열이 적절할 것이라고 생각합니다. 우선, 그룹화된 텍스트가 각 열에 적절하게 배열됩니다. 날짜와 작성자가 누락되었지만. 나중에는 괜찮게 나올 겁니다. 여기서 해야 할 일은 각 그룹의 글꼴, 크기, 두께 등 정보의 중요도에 따라 계층을 설정하는 것입니다. ※ 구두점이 있는 경우 탭, 문단 컨트롤 등을 이용하여 구두점만 내어쓰는 것이 좋습니다. 유용한 팁입니다. 제목이나 인용문에서 ‘이 사람이 한 말’이나 ‘특히 중요한 단어’를 강조하고 싶지만 그 규모도 강조하고 싶다. 문단을 늘리면 균형이 깨질 것 같은 느낌이 들 때가 있습니다. 문장 부호와 같은 축에 선이 있기 때문에 선이 어긋나는 경우가 있습니다. 이 경우 탭 조정을 사용하여 선을 조정할 수 있습니다. 구두점만 표기됩니다. 이전 이미지다음 이미지 두 개의 이미지가 슬라이드 형태로 배치되었습니다. 옆으로 밀어서 비교해보세요. 두 제목의 차이점을 아시나요? 글자가 너무 작아서 안보이나요? 사진의 원래 너비를 다음 페이지로 확장하는 데 한계가 있어서 가로 형식으로 변경했지만 어쨌든 전체 페이지의 기반은 설정되었습니다. 3. 제목 및 본문 편집 어떤 텍스트에서든 글자 간격과 줄 간격은 가독성에 큰 영향을 미칩니다. 본문과 제목을 명확하게 구분하려면 두 요소 사이에 많은 공간을 두어야 합니다. 위 이미지에서 볼 수 있듯이 거의 모든 타이포그래피가 완성되었으므로 여기서는 크게 변경할 것이 없습니다… 참고로 날짜와 작성자를 두 개의 상자로 분리하는 것이 가장 좋습니다. 미리보기 형태이기 때문에 지금은 두 개의 상자가 있습니다. 그렇지 않으면 편집할 때마다 줄 아래의 텍스트가 나타나게 되어 성가실 수 있습니다. 4. 프로필 편집 개인의 이력을 나타내는 프로필은 본문과 완전히 별개로 보아야 합니다. 글의 주제와 내용을 암시하는 제목과도 다르다. 따라서 독자가 명확하게 알아볼 수 있도록 글꼴, 크기, 컬럼 모양을 대폭 변경해야 합니다. 그러니까 프로필 디자인을 거의 따로 편집했다고 볼 수 있죠. 그럼 순서대로 만들어 볼까요? 1) 프로필 단락 프레임워크를 만들기 전에 프로필의 내용을 별도로 분리하여 InDesign에 배치하여 단락의 계층 구조를 조정했습니다. 위의 탭 창을 사용하여 모양을 독특한 것으로 변경하겠습니다. 참고로 탭창은 Shift, Ctrl, T를 동시에 누르면 쉽게 꺼낼 수 있습니다. 먼저 ‘profile’이라는 단어를 제외한 단락을 box에 넣은 후 탭 창의 화살표를 14~15mm 정도 밀어냅니다. 그러다가 위쪽 화살표를 원래 상태로 다시 당기면 흥미롭게도 단락이 삭제된 부분만 제자리에 유지됩니다. 이 상태에서 키보드의 탭키를 이용해 선을 정렬하면 이런 모습이 됩니다. 탭 창이 아니라 키보드 탭이라는 점을 기억하세요. 이런 식으로 위의 ‘프로필’을 정렬할 수도 있습니다. 다음으로 같은 방법으로 탭창을 통해 ‘Profile’이라는 단어를 다시 밀어 넣으면 이런 모습이 됩니다. 이렇게 해서 프로필창의 틀이 만들어졌습니다. 이 뼈대에 살점을 하나씩 추가해 보겠습니다. 2) 상세 디자인 프로필에는 보시다시피 여러 항목이 있습니다. 이름, 출생지, 출생지, 지역 등.. 따라서 항목별로 차별화를 둬야겠죠? 각 항목의 문자 아래에 밑줄을 긋는 것도 항목 구분에 매우 효과적입니다. 먼저 탭 길이만큼 선을 그린 후 각 항목 아래에 복사합니다. 이와 같이. 하지만 이렇게 하면 왠지 언밸런스해 보입니다. 이는 일부 문자가 밑줄에 너무 가깝고 일부 문자가 너무 멀리 떨어져 있기 때문입니다. 이 경우 단락의 기준선을 조정해야 합니다. Shift와 Alt를 누른 상태에서 위쪽 및 아래쪽 화살표를 사용하여 조금씩 균형을 유지하세요. 이렇게 하면 적절한 모양을 얻게 됩니다. 이제 프로필 문단이 완성되었습니다. 5. 마이크로 타이포그래피와 페이지 완성 마지막으로 인터뷰 본문을 세부적으로 다듬는 시간이다. 나는 아직 마이크로 타이포그래피를 다루지 않았습니다. 여기서는 텍스트의 줄 간격, 글꼴, 글꼴 크기 및 두께를 조정합니다. 1) 본문의 글꼴 및 크기/굵기 조정 우선, 기존에 HY 신명조로 설정되어 있던 본문의 글꼴을 나눔명조로 변경하기로 했습니다. 나는 또한 각 부제목을 조금 더 두껍게 만들기로 결정했습니다. 하지만 이 글꼴의 특이한 점은 볼드체를 사용한다는 것만으로도 일반 글꼴과 거의 다르지 않다는 점입니다. 글자 획의 굵기를 직접 변경하는 방법도 있지만 너무 번거로워서 그냥 굵게 쓰기로 했습니다. 그래도 별 차이가 없다고 말씀드릴 수는 없습니다. 2) 소제목과 본문의 구분 : 후행 공백의 활용 다음으로 본문의 줄 간격을 살짝 조정해 보겠습니다. 물론 일반 줄 간격 기능을 사용하여 각 줄을 개별적으로 간격을 두는 방법도 있습니다. Enter 키를 눌러 아래로 스크롤하는 방법도 있습니다. 하지만 더 좋은 팁이 있습니다. 인디자인의 단락(Paragraph) 탭을 보면 ‘言’ 모양을 닮은 아이콘과 거꾸로 뒤집힌 듯한 아이콘이 또 있습니다. 이를 After 공간, Before 공간이라고 합니다. 이는 문자 그대로 작성되는 단락의 전후(상단 및 하단)에 지정된 너비의 공백을 남깁니다. 참고로 인디자인에서는 엔터를 치는 행위를 문단 분할로 인식하기 때문에 한 문장이든 두 문장이든 문단이 됩니다. 이를 방지하려면 Shift 키를 누른 채 줄을 아래로 이동하세요. 이 이미지에는 부제목 뒤에 적용된 후행 공백만 표시됩니다. 부제목과 본문 사이에 폭 2~3mm 정도의 간격이 있는 것을 볼 수 있습니다. 3) 인용 이 본문에서 인용문을 선택하여 강조 표시하겠습니다. 이번 인터뷰의 핵심 문구 중 하나입니다. 독서는 어떤 효과를 기대하는 것이 아닙니다. 오히려 어렸을 때는 ‘이건 나도 되겠구나’라고 생각했어요. 정말 소중한 책을 만나는 것이 더 중요한 것 같아요. 미야자키 하야오 《책으로의 문》 먼저 전후 공간을 모두 활용하여 앞뒤로 3mm 정도의 공간을 만들었습니다. 이보다 더 넓게 펼치면 줄이 다음 상자로 이동됩니다. 그것은 계속되었습니다. 좀 더 떠다니게 만들고 싶었어요. 참고로 글꼴을 변경할 때 명조더미에서 너무 눈에 띄지 않으면서도 동일하지 않은 글꼴을 선택하려고 하다가 결국 마루부리를 사용하게 되었습니다. 가장 쉬운 선택.. .. 굵게 표시하고 본문과 구별되도록 크기를 2pt 늘려서 차이를 두었습니다. 4) 기타 마무리 작업 텍스트 편집이 끝나면 마지막으로 책 같은 느낌을 주는 작업이겠죠? 페이지 번호를 입력해야 하므로 마스터 페이지로 이동해보겠습니다. 위에서 안내선을 그렸던 마스터 페이지입니다. 페이지 번호와 여백 사용법은 이전에 설명한 것 같은데 여기서는 그냥 넘어가도록 하겠으니 구체적인 과정을 보고 싶으시면 <17 Editorial Design – Page Design – Two Page Design> 같은 카테고리에 있습니다. https://blog.naver. com/mj94920/223192495690을 참조하세요. 이런 방법으로 마스터 페이지에 페이지 마커를 입력하고 일반 페이지로 이동하게 됩니다. 그러면 모든 작업이 완료됩니다. 이게 완성본인데, 영어로 되어 있었다면 더 믿음직스러워 보였을 것 같아요. 영어로 되어 있었다면 사용할 수 있는 글꼴이 훨씬 더 많았을 것입니다. 그런 점에서 한글 글꼴은 디자인하기 어려운 것 같아요. 종류가 많지 않다는 사실을 보면. 물론, Adobe Stock에서 해당 글꼴을 찾지 못해 사용하지 않았기 때문일 수도 있습니다. 결론적으로… 이번에는 인터뷰의 일부를 여러 페이지로 디자인했습니다. 다음으로 목차를 함께 만들어 보겠습니다. 그럼 다음에 또 만나요.