오늘은 실무에서 디자이너가 Design Process 시작 단계에서 하게 되는 일과 'Kick Off'와 'Handoff'에 대한 개념을 알아보고 이전에 배웠던 내용으로 최종 WEB 구성과 Clone Design을 하는 시간은 가졌다.
시장조사(Reference Research)→Concept 기획 및 제안→Design 기획 및 시안→Design 시안 확정→ Design 수정 및 검토
※ Concept 기획 및 제안, Design 기획 및 시안이 Kickoff / Design 시안 확정, Design 수정 및 검토가 Handoff로 구분
> 1️⃣ 시장조사
- 기업 및 관련 시장 사전 자료조사
Kickoff Meeting 일정을 잡고 Meeting 전 기업과 기업의 관련 비즈니스 시장에 대해 기초적인 내용들을 이해한다면 Meeting이 보다 원활하고 효과적으로 진행
∙ 매체에 따라 노출된 기업의 디자인 현황
∙ 경쟁사의 디자인 현황
∙ 관련 시장의 주목할만한 흐름이나 디자인 트렌드- Reference Research
디자인을 시작하기 전 가장 먼저 해야 할 일이 시장조사, 디자인의 목적과 기능을 정확하게 파악하고 그 방향성에 맞춰 이미 잘 된 디자인들을 Benchmarking하는 단계로 자료(Data, Image, Design 등)을 수집
디자이너가 하게 될 일들 중에 가장 중요한 단계라고 말할 수 있음
> 2️⃣ Concept 기획 및 제안
Concept 기획 단계에서 Concept가 모호하거나 불확실하게 정해진다면 향후 모든 게 원점으로 돌아오는 일이 생길 수 있으며 앞으로 작업할 디자인의 지표가 되는 일인 만큼 Client, 기획자와 디자이너, Director 모두가 참여하여 함께 협의하고 설계해 나가는 것이 중요
- Concept 기획
Reference Research를 통해 찾은 자료들을 유사한 Image끼리 분류, 이 유사한 Image들이 한 데 모인 것을 Mood board라고 하며 이에 더해 앞으로 어떻게 디자인 할 지 Design Keyword와 방향성을 제시하는 것- Concept 제안
여러가지 Concept을 기획한 뒤 Client와 협의하여 Concept를 확정
> 3️⃣ Design 기획 및 시안
- Design 기획
전 단계의 방향성을 잡는 것 외에도 Layout 배열, 기존 문구의 강약 조절 등 다양한 업무가 포함되며, 이미 완성된 기획안을 시각적으로 좋아보일 수 있도록 디자이너의 관점에서 기획하는 단계- Design 시안
협의된 Concept 아래 시안을 제작하는 단계, 전체 시안을 작업하기 전 디자인 초안(Sketch 시안을 보며 어떤 것을 디자인할 지 담담자들과 논의)을 거쳐 그대로 진행해도 되겠다는 Feedback을 받으면 본격적인 시안 작업을 진행, Sketch로 구상했던 작업을 Image로 시각화하고, 일부 Page만 작업했던 디자인을 전체 Page까지 진행
> 4️⃣ Design 시안 확정
같은 Concept 아래 두 가지로 제시하거나 다른 Concept로 한 가지씩 제시할 수도 있으며 수동적으로 결정을 기다리다가 작업이 처음으로 돌아갈 확률이 높기 때문에 Client가 생각을 확실하게 정리할 수 있도록 구체적인 근거를 제시하면서 그저 눈에 예쁘고 멋진 디자인이 아닌, 올바르게 잘 된 디자인으로 선택할 수 있도록 leading하는 것이 중요
> 5️⃣ Design 수정 및 검수
- Design 수정
여러 개의 시안을 보고 최종적으로 디자인을 확정했다면, 디자인 수정 단걔를 거치며 협의된 Concept 아래 에서만 수정(Detail 한 요소 수정)해야 하며, 여기서 말하는 Detail 요소란 Font, Color, 요소들의 크기 및 배열, 명도와 채도, 자간과 행간 등의 수정을 말함- Design 검수
Design을 실제 적용하기 전, 혹은 인쇄하기 전 꼼꼼히 검수하는 단계로 잘못된 내용이나 오탈자가 나오지 않게 검수 과정을 거쳐야 함. 이때는 Designer, 기획자, Client가 여러번 Double Check를 하며 교정 해야함
> Kickoff
Kickoff Meeting은 새로운 Project를 시작하기 위해 Project Team과 고객이 처음으로 모이는 회의로 Project의 목표와 계획을 수립하고, 모든 사람이 같은 생각을 공유하여 Project를 원활하게 진행하기 위해 열림
- Kickoff Meeting의 목적
Project의 목표와 계획 수립
모든 사람이 같은 생각을 공유하여 Project를 원활하게 진행
고객에게 열정을 불러일으키는 것
지금까지의 Project에 대한 전체 요약을 보여주는 것- Kickoff Meeting의 중요성
Kickoff Meeting 없이 Project를 시작하면 구체적인 계획 없이 여행을 시작하는 것
※ Kickoff 단계에서는 주로 이러한 과정을 거침
> Handoff
'손을 떠나다'라는 뜻으로, 업계 용어에 대입하면 '개발자가 구현할 수 있도록 디자인 작업물을 만들어 떠나보내다'라는 의미로 디자이너가 작업한 디자인을 의도대로 잘 구현하기 위해서는 무엇보다 논리적인 사고와 의사소통이 중요
- Handoff에 필요한 요소
∙ (화면 기준) User Flow 설계
현재 Project에서 디자인 시안 작업이 마무리 된 시점이라면, 어떤 흐름으로 화면이 설계되었는지 보여주어야 함
∙ 각 화면별 Use Case 찾기
User Flow에 따른 각 화면에 대한 상황별 Case를 전달할 수 있어야 하며 미리 다양한 Use Case를 화면별로 만들어두어야 함
∙ 반응형 Layout 대응하기
Product에서 사용하는 Breakpoint를 개발자와 함께 규정한 뒤, 이를 기준으로 나눈 구간에 따라 변화되는 지점을 디자인하는 과정이며 이때 다양한 화면에서 접근하는 User들을 고려하여, 구간별 Layout, Size, 간격 등에 대한 정의가 필요
∙ 실무적용 단계
디자이너가 실무에서 해야하는 일련의 과정들을 이해하고 이때까지 작업했던 WEB화면을 최종점검, Reasearch를 통해 작업한 Clone Design을 해보는 시간을 가졌다.
▼ 아래는 'Figma'를 통해 작업한 WEB, APP Clone Deisgn과 WEB 화면 구성이다.
<'Meow' Web 화면구성, Clone Design>
'Kickoff'와 'Handoff'라는 실무 용어와 어떠한 작업을 거치는지를 알아보는 시간을 통해 디자인에 대한 더 깊이 있는 이해를 하게 되었고 Client와 개발자간의 소통이 무엇 때문에 중요한지, Reference Research가 얼마나 중요한지를 알 수 있었던 시간이었다.