brunch

21.망고보드 기초강의 4강: 디자인 응용

by 잔상

Media

Media

오랜만이다. 이사와 여러 집안일들이 있다보니 늦게 되었다.

본 글을 기다려준 독자분들께는 우선 사죄의 말씀을 올린다.


1. 숙제검사

지난 시간, 숙제를 내주면서 끝냈는데 기억이 나는가?

1) 바깥쪽 큰 원의 윤곽선 ▶ 검은색으로 변경

2) 안쪽 점선 테두리 원 ▶ 검은색으로 변경

3) 바깥쪽 큰 원 흰 바탕 ▶ 주변 노란색상과 맞추기

4) 글자색 ▶ 검은색으로 변경 (망고 샌드위치로 텍스트 수정 후)


이 대로 한다면 아래와 같은 이미지가 나온다면 맞게 하였다.

주변 색상과 톤앤매너를 맞추고, 우리만의 색깔을 갖는 형태로 바꾸게 되었다. 이렇게 우리는 기본적인 템플릿 선정부터 사이즈 조정, 텍스트 수정, 관련 요소 가져오기, 주변 색상에 맞춰 변형하기 등을 살펴 보았다.

그렇다면 이게 끝인가? 필요에 따라 이정도만 해도 필요한 것들은 해낼 수 있을 것이다.


하지만 우리의 본 수업은 무엇인가? 마케팅이다. 그렇다면 이렇게 엑스배너만 만들고 끝낼 수 없다.

로컬 마케팅은 이런 길 앞의 엑스배너만으로도 어느정도 효율성이 있겠지만 요즘 처럼 SNS, 홈페이지 등 온드 미디어 을 갖고 있다면 홍보를 해줄 필요가 있다.


온드 미디어? 온라인 마케팅을 할 때 알아두어야 할 필수 용어다. 광고 위치에 따른 용어로 크게 3가지이다. 쉽게 풀어 쓰면 우리 가게 건물에서 포스터를 붙이고 엑스배너 놓는 건 온드 미디어, 네이버 영수증 리뷰와 같이 고객이 후기를 남기거나 본인의 블로그를 올리는 것은 언드 미디어(영수증 리뷰, 파워 블로거 등), 다른 건물 가판대에 가게 홍보를 하는 것은 비용을 지불해야 하므로 페이드 미디어라고 한다. (물론, 언드 미디어도 파워블로거 등에 비용을 지불하고 진행할 수 있다.)

■ 온드 미디어 (Owned Media)
기업이 직접 소유하고 운영하는 채널
예: 공식 웹사이트, 블로그, 이메일 뉴스레터, 자체 앱, SNS 계정
장점: 콘텐츠와 메시지를 자유롭게 통제 가능
■ 언드 미디어 (Earned Media)
소비자나 외부에서 자발적으로 생성된 홍보 효과
예: 입소문, 리뷰, 공유, 언론 보도, 바이럴 콘텐츠
장점: 신뢰도 높고 비용이 들지 않음
■ 페이드 미디어 (Paid Media)
비용을 지불하고 광고를 집행하는 채널
예: 검색 광고, 디스플레이 광고, SNS 광고, 인플루언서 협찬
장점: 빠른 노출과 타겟팅 가능



2. OSMU (One Source Multi Using)

오늘따라 용어가 많이 나와 좀 헷갈릴 수 있겠지만 마케팅 학습에 도움이 되는 필수 어휘라고 생각해 두자. OSMU는 하나의 콘텐츠를 다양한 형식과 채널로 재가공해 활용하는 전략으로, 인스타그램, 페이스북, 유튜브 등에 맞게 캠페인의 톤앤매너는 유지하면서도 다양한 리사이징 형태로 뿌리는 것이다.


조금 더 이해를 돕기 위해 설명하자면 온드 미디어에서 우리는 엑스배너를 제작하였다.

그런데 이번에는 우리 가게의 인스타그램(온드 미디어)에서도 본 행사를 홍보하고자 하는데, 인스타그램의 이미지 사이즈는 엑스배너 사이즈와 맞지 않다. 인스타그램은 영상의 경우(릴스) 16:9 세로형이지만 이것은 영상 콘텐츠이니 적당하지 않고, 이미지는 대부분 정방형 사이즈가 많이 사용되기 때문이다.

그래서 이를 리사이징 작업을 해야 하는데, 방법은 크게 두가지가 있다.


① 이미지 리사이징

우선 첫번째 방법은 망고보드 기능활용이다.

1. 현재 표기된 이미지 버튼 클릭

2. Autofit 체크: 이미지 변경시 맞게 이미지 사이즈들도 변경된다는 뜻이다.

3. 다른 크기 보기 클릭

4. 소셜미디어 클릭: 인스타그램용을 만들기로 가정하였으니

5. 인스타그램 클릭: 원하는 인스타그램 사이즈로 클릭


그런데 문제는 저렇게 했을 시, 내가 원하는 대로 결과물이 나오지는 않는다. 이미지가 늘어나고, 쓸데없는 여백은 많다.

그래서 두번째 방법인 손품이다. 조금 노력이 들더라도 이 방법이 망고보드 내에서 리사이징 하는 것으로 정석이다.

1) 우선 새로운 망고보드 페이지를 열어 새템플릿으로 인스타그램 사이즈를 세팅한다.

2) 다음으로는 기존 엑스배너 이미지의 배경을 똑같이 만들어준다.

복사할 수 있는 것들은 복사를 한다. 노란색 배경 안에 있는 검은 색은 복사가 가능한 도형이라 복사해서

그대로 붙여넣기를 해주었다.

앗, 그런데 노란색 배경은 어떻게 색깔을 그대로 가져올 수 있을까? (복사가 안된다)

기존 이미지에서 노란색 배경에 마우스를 가져가 왼쪽을 클릭하면 좌측 네비게이션 바에서 배경 색상이 보인다. 이 정확한 노란색 색상 넘버를 보거나 아니면 오른 쪽 스포이트 기능을 활용할 수 있다. 스포이트 기능은 파워포인트에서도 충분히 사용되는 기능이므로 우선 건너뛰기로 하겠다. 저 위의 배경 색상 넘버를 복사하여 인스타그램 이미지 템플릿에서 ① 배경 클릭 ② 배경 색상의 색깔 블럭 클릭 ③ 배경 색상 넘버가 있는 곳에 붙여넣기를 하면 끝!

3) 기존 엑스배너 이미지에서 요소들을 복사해서 인스타그램 템플릿 배경에 붙여넣기를 해준다.

그러면 사이즈가 달라서 위와같이 나오게 된다. 그래서 요소 복사를 해서 붙여넣기를 할 때, 한꺼번에 하지 말고 조금씩 복사해서 붙여 넣고, 조금씩 사이즈 조절을 해주면 된다. 사이즈 조절법은 이제 아니 배치법에 대해 이야기 하겠다.

사이즈를 정사각형 위치에 맞체 조절하면 아래 처럼 '데드 스페이스'와 같은 비효율적인 여백의 공간이 생긴다.

그래서 이 부분을 조금 더 공간에 맞게 재배치를 하면 좋다. 베스트 메뉴를 두줄이 아닌 한줄로 바꾸고, 로고 양 옆으로 배치를 시켜보았다.

쓸데 없는 빈 공간은 사라졌다. 혹은 아래와 같이 해줘도 좋다.

너무 짧은 베스트 메뉴를 한줄로 바꿔주기만 해도 빈 공간이 불편하지 않다.

이렇게 정방형 사이즈에 맞는 배치로 각 요소들을 복사해서 붙여 넣기를 하면 끝!

※망고보드 이미지 편집을 중심으로 설명했기 때문에 작성 내용에 대해 따로 언급은 하지 않았다. 하지만 마케팅적인 접근에서는 할인은 '항상' 보다는 '기간한정'으로 해주는 것이 더욱 이목을 끌 수 있다. 언제든 그 가격에 먹을 수 있는 것이라면 사람들은 관심이 적어진다. 딱 이때만 누릴 수 있는 가격 혜택이라는 각인을 심어줘야 한다.


오늘은 이렇게 이미지를 각 미디어 채널에 맞게 리사이징 하는 방법을 배워보았다.

다음 시간은 망고보드 콘텐츠 제작에 대한 마지막 비법으로 '영상 제작'을 알아보도록 하겠다.


끝.

keyword
일요일 연재