[기획]/화면설계 심화

SB 제작 표준 절차

완벽한 장면 2026. 1. 15. 21:52

 

스피커스(Speakers.kr) 강의를 듣고, 개조식으로 정리한 글입니다.

1. 스토리보드 작업의 기본 구조 이해

1-1. 스토리보드는 “환경 세팅”이 절반이다

스토리보드는 그리기 전에 구조를 만들어 두는 작업이 핵심이다.

  • 슬라이드 마스터
  • 마스터 템플릿
  • 아이콘 템플릿
  • 기본 도형 / 기본 텍스트 설정

이 4가지를 먼저 만들지 않으면
→ 매 장표마다 반복 작업 + 정렬 붕괴 + 품질 편차 발생

 

2. 슬라이드 마스터 & 마스터 템플릿 제작 절차

2-1. 슬라이드 마스터 진입

  • 보기 > 슬라이드 마스터

2-2. 마스터 구성 원칙

첫 번째 마스터

  • 아무것도 넣지 않음 (완전 빈 마스터)

두 번째 이후 마스터

  • 스토리보드 전용 마스터 구성

2-3. 스토리보드 마스터에 포함될 레이아웃들

  • 표준(기본 화면)
  • 이전 페이지 이동
  • 다음 페이지 이동
  • 이전/다음 페이지 이동

👉 즉, 화면 이동 케이스별 마스터를 미리 정의

 

3. 마스터를 “디자인 테마”로 저장하기 (핵심)

3-1. 현재 테마 저장

  • 디자인 > 우측 삼각형(더보기) > 현재 테마 저장
  • 파일명 예시
    • 스토리보드_마스터
    • 스토리보드_코어_마스터

3-2. 효과

  • 새 PPT를 열어도
    → 디자인에서 스토리보드 마스터 테마 선택 가능
  • 레이아웃 클릭 시
    → 스토리보드용 레이아웃이 자동 노출

📌 결론

스토리보드는 “슬라이드 마스터 + 디자인 테마”로 관리해야 한다.

 

 

4. 아이콘 템플릿 운용 방식

4-1. 아이콘 템플릿이란?

  • 자주 쓰는 아이콘 / UI 오브젝트를 모아둔 전용 PPT 파일
  • 스토리보드 작업 시 듀얼 모니터로 병행 사용

4-2. 운용 방식

  • 모니터 1: 스토리보드 작업 파일
  • 모니터 2: 아이콘 템플릿 파일
  • 필요한 아이콘 → Ctrl + C / Ctrl + V

4-3. 핵심 규칙

  • 아이콘 위치, 크기 절대 자주 바꾸지 말 것
  • 항상 같은 위치/사이즈로 유지
    → 다음 장표 작업 속도 급상승

 

5. 공통 오브젝트는 “이미지화”해서 관리

5-1. 언제 이미지로 저장하나?

  • 팝업
  • 공통 레이어
  • 반복 UI 덩어리

5-2. 방법

  1. 오브젝트 드래그 선택
  2. 우클릭 → 그림으로 저장
  3. 다시 불러와 사용

📌 이유

  • 오브젝트 중첩 시 수정 난이도 폭증 방지
  • SB 안정성 확보

 

6. 스토리보드 기본 스타일 세팅(필수)

6-1. 기본 텍스트 설정

  • 기본 폰트 크기: 9pt / 8pt
  • 글꼴: 맑은 고딕
  • 설정 방법:
    • 텍스트 박스 선택 → 우클릭 → 기본 텍스트 상자 설정

👉 이후 새 텍스트는 자동으로 9pt 적용

 

6-2. 자동 고침(카피 단축키) 활용

  • 파일 > 옵션 > 언어 교정 > 자동 고침 옵션
  • 예시
    • 카피 → 긴 카피 문장
    • 푸터 → 회사 푸터 문구

👉 반복 입력 시간 대폭 절약

 

6-3. 기본 도형 설정 

  • 도형 채우기: 없음
  • 도형 윤곽선: 0.5
  • 우클릭 → 기본 도형 설정

📌 이후 모든 박스는 자동으로 SB 스타일 유지

 

7. 오브젝트 조작 핵심 단축키

동작키
부드러운 이동 Alt
복사 이동 Ctrl
수직/수평 이동 Shift
복사 + 수직/수평 이동 Ctrl + Shift

👉 관리자 / 리스트 / 반복 UI 설계 시 필수

 

8. 눈금 & 안내선 활용 규칙

  • 우클릭 → 눈금/안내선 표시
  • 마스터 템플릿의 좌우 기준선에 맞춰 배치
  • 붙는 느낌(스냅)으로 정렬 → 정교한 SB 완성

📌 스토리보드의 완성도 = 정렬 정교함

 

9. “표(Table)” 사용 원칙

9-1. 언제 표를 쓰는가?

  • 클릭 시 하단이 바뀌는 메뉴
  • 탭 전환 구조
  • 리스트 / 카드 / 메뉴 / 정보 영역

👉 90% 이상은 표로 만든다

9-2. 언제 박스를 쓰는가?

  • 새 창 이동 (하이퍼링크)
  • 화면 전환 없음

9-3. 표 사용 절대 규칙

  • 모든 테이블 라인 굵기: 0.5
  • 이 기준을 벗어나면 → 촌스러움 발생
  • 표 추가: 마지막 셀에서 Tab

 

10. 정렬의 정석 공식

10-1. 균등 배치 공식

  1. 오브젝트 끝과 끝 위치 배치
  2. 전체 선택
  3. 맞춤 > 가로 간격 동일

👉 눈대중 정렬 금지

 

11. 스토리보드 스타일 가이드의 필요성

11-1. 혼자 작업해도 필요

11-2. 같이 작업하면 필수

버튼 기준 예시

  • 높이: 0.4
  • 넓이: 2~5
  • 색상: 2 / 4 / 6번째 컬러만 사용

👉 숫자로 기억해야 통일성 유지 가능

 

12. 스토리보드 vs 와이어프레임 차이

와이어프레임

  • 덩어리 중심
  • 구조 정의용
  • 비율 파악

스토리보드

  • 실제 화면 단위
  • 테이블 기반
  • 디테일 설계

13. 레이아웃 & 비율 

  • 기본 비율 감각
    • 1 : 3 : 6
  • 여백은 항상 동일하지 않다
  • 넓어졌다 → 좁아졌다 → 다시 넓어지는 리듬감
  • 이 변화가 화면의 “미적 완성도”를 만든다
728x90