웹디자인 무드보드 - webdijain mudeubodeu

우리 제품의 방향성과 성격, 이미지에 맞는 디자인 컨셉 잡기!

제품 기획 초기단계에서 디자이너들이 하는 중요한 작업이 있죠?

그것은 바로 무드보드 만들기! 🧑🏻‍🎨

제품 방향성과 성격, 이미지에 맞는 디자인 컨셉을 보여주기 위한 과정입니다. 물론 이미 잡혀있는 컨셉이 있고, 정해진 컨셉을 따라간다면 안하고 넘어갈 수도 있어요. 주로 초기단계에 무드보드 작업을 하지만, 제품과 디자인을 발전시켜가는 과정 중에도 무드보드는 업데이트 해 나갑니다.

무드보드는 과정 자체로도 의미가 있지만, 보통은 그 결과물인 디자인 컨셉을 프로젝트 멤버나 고객들과 공유하는 것을 목표로 합니다. 그래서 자료 수집, 디자인 컨셉 도출, 디자인 과정을 파악하기 쉽도록 관련 내용들을 무드보드 한 곳에 모아두는 것을 추천합니다. 🙂 (e.g. Positioning Map, Brainstorming 등 다양한 아이디어 도출 과정 / 시장 분석, 디자인 트렌드 리서치, 사용자 분석 등의 자료 / 아이디어 스케치 / 최종 디자인 결과물 등…)

무드보드 만드는 과정

수집

• 영감을 줄 수 있는 모든 아이디어(이미지, 텍스트, 사진, 음악 등) 수집
• 경쟁사를 비롯한 사용자군에 대한 정보와 디자인 트렌드 관련 정보 모음

분석

• 자유롭게 발산한 아이디어와 분석 자료를 동료들과 같이 정리(Positioning Map, Brainstorming 등)하며 구체적인 방향성 잡기
• 컨셉과 어울리는 색상, 폰트, 이미지, 일러스트에 대한 방향을 함께 이야기하며 정리하고 아이디어 스케치

정리 및 컨셉도출

• 아이디어 스케치를 보며 동료들과 협의하여 디자인 시안(혹은 컨셉 이미지) 진행
• 레이아웃을 잡고 위에서 정리된 자료와 아이디어 스케치, 디자인 결과물을 이용하여 무드보드 구성
• 완성된 무드보드를 가지고 PM(혹은 고객)과 디자인 컨셉을 공유 및 수정 사항 반영

아무래도 많은 자료와 내용이 있다보니 복잡해 보이기 쉽겠죠?

그래서 방출하는 무드보드 만드는 꿀팁!!

무드보드 보드 작성법

• 기승전결 논리적으로 구성
• 중요한 요소를 강조해서 표현
• 전체적인 흐름과 디자인 톤앤매너가 맞도록 구성
• 글은 간결하고 심플하게 한 문장으로 표현

👉마림바의 무드보드는? 

수집
1. 마림바 보드에 무드보드를 새로 만들고, 사전에 리서치한 이미지나 웹 리서치, 평소 영감을 받기 위해 모아둔 자료들을 보드에 붙여넣습니다.
2. 원하는 자료가 충분히 모였다면 특성에 맞게 분류하여 대략적인 느낌을 만들어 봅니다. (분류한 자료들을 패드 별로 정리해보세요.)

분석, 정리 및 컨셉도출
1. 동료 디자이너들과 보드에 모여 비디오콜을 시작해요. 수집한 자료들과 방향성을 설명하고, 함께 아이디어를 확산 및 발전 시킵니다. (스티키 노트로 손쉽게 아이디어를 발산해보세요)
2. 아이디어 스케치를 하거나 관련 샘플 이미지를 추가로 수집한 뒤, 다시 모여 1~3개 정도의 컨셉을 도출합니다. (타이머를 설정해 효과적으로 회의 시간을 관리하면 좋겠죠?)
3. 컨셉안을 디자인안으로 발전 시키도록 하고 목표 일정을 정합니다. 각자 컨셉을 담당해 진행하거나, 각 컨셉 별로 시안을 하나씩 준비해도 됩니다.
4. 컨셉이 준비되면 디자이너들이 모여 최종 디자인안을 정하고, 결과물을 중심으로 무드보드를 업데이트합니다. 레이아웃을 정하고 앞서 나온 아이디어, 리서치 자료들을 흐름에 맞게 정리합니다.

공유 및 피드백
1. 무드보드를 PM(혹은 고객), 개발자들과 공유하는 리뷰회의를 진행합니다. 보드에 정리된 흐름대로 최종 디자인 결과물(혹은 컨셉 이미지)까지 설명합니다.
2. 스티키 노트, 애니모지, 펜 등을 활용하여 피드백을 받고, 피드백에 대해 디자이너가 설명하고 수정이 필요한 경우 수정 후 다시 리뷰회의를 진행합니다.
3. 프로젝트 진행 중에 작업된 디자인 결과물들도 필요한 경우 무드보드에 업데이트 합니다. (이해관계자, 신규 팀원, 고객 등에게 디자인 컨셉과 발전과정을 공유하는데 효과적인 자료로 활용해보세요)