배너 디자인 유형과 좋은 배너 디자인 하는 방법

배너 디자인은 온라인 웹, 이메일, 소셜 미디어부터 야외 광고 등 다양한 매체에서 광고와 홍보를 목적으로 사용하는 그래픽 디자인을 의미합니다. 특히 온라인에서는 배너에 클릭 가능한 링크를 사용해 다른 웹이나 앱으로 사용자를 안내하는 역할을 합니다. 아래에서는 이러한 배너 디자인의 기본 요소와 유형, 형식을 알아보고 배너 디자인하는 방법을 단계별로 살펴보도록 하겠습니다.

Part1:배너 디자인 알아보기

1. 배너 기본 요소

배너 디자인은 사용되는 목적과 매체의 특성에 따라 달라지지만 일반적으로 아래와 같은 요소를 기본으로 합니다.

1) 메시지

배너에 사용되는 메시지는 제목, 부제목, 본문으로 구분됩니다. 제목은 주목을 끄는 문구로, 부제목은 추가적인 정보를 제공합니다. 본문은 필요한 경우에만 제품이나 서비스 등에 대한 설명, 특별한 혜택 등의 내용을 나타냅니다.

2) 시각적 요소

이미지와 아이콘, 색상 등 시각적인 요소도 배너를 구성하는 중요한 요소입니다. 배너 메시지를 잘 표현할 수 있도록 매력적이 이미지와 컬러 조합을 선택하는 것이 중요합니다.

3) 레이아웃

배너의 레이아웃은 전달하는 정보를 고려하여 설계 되어야 합니다. 중요한 내용일수록 시선을 집중시킬 수 있는 위치에 배치하는 것이 좋습니다.

4) CTA(Call-To-Action)

콜투액션은 사용자들에게 원하는 동작을 유도하기 위해 반드시 필요한 요소입니다. 텍스트를 포함한 버튼 또는 화살표나 기호 등으로 어디를 클릭해야 하는지를 알려주어야 합니다.

5) 브랜딩

사용자에게 해당 브랜드를 인식시키기 위해 로고를 적절한 위치에 배치합니다. 또한 일관된 브랜딩을 위해 해당 브랜드의 색상과 폰트를 활용하는 것이 좋습니다. 만약 개인이 블로그 배너 디자인이나 SNS 배너 디자인을 만들고자 한다면 자신의 컨텐츠를 잘 브랜딩할 수 있도록 제작해야 합니다.

2. 다양한 배너 유형&사이즈/형식

배너의 유형에 따라 권장하는 사이즈나 형식이 달라지게 됩니다. 때문에 각 광고 네트워크, 웹사이트 등 플랫폼의 가이드라인에 따라 적절하게 제작해야 합니다. 그리고 매체에 따라 사이즈나 형식이 변경되기도 하기 때문에 관련한 최신 정보를 확인해야 합니다.

Part2: 배너 디자인 예시&주의점

1.성공하는 배너 예시

성공하는 좋은 배너 디자인을 기획하기 위해서는 콘텐츠의 가독성을 확보하는 것이 가장 중요합니다. 가독성이 좋은 배너는 사용자의 시선을 끌어 서비스 전환율을 높일 수 있습니다. 특히 모바일 환경에서는 배너 사이즈가 크지 않기 때문에 전달하고자 하는 콘텐츠와 메시지 간의 우선순위를 결정해야 합니다. 그리고 제일 강조해야 하는 내용을 명확하게 전달해야 합니다.

1) 배달의민족

아래 이미지는 배달의민족 앱 상단에 표시되는 배너로, 전달하고자 하는 핵심 이벤트 내용을 중심으로 만들어졌습니다. 아래 배민 배너는 장보기 쿠폰을 홍보하는 배너이기 때문에 이벤트를 강조하기 위해 이미지나 그래픽 사용은 최소화하였습니다.

아래 배너 이미지처럼 문구를 강조하는 경우에는 글자 폰트를 고딕 계열이나 기본 폰트를 사용합니다. 그리고 가장 중요한 문구인 ‘1만원 장보기 쿠폰’ 부분을 볼드 처리해 한번 더 강조합니다.

2) 라이나생명

아래 배너는 CTA버튼을 활용한 디자인입니다. 보험 사용자가 가장 궁금해할 보험료 계산하기를 버튼 문구로 활용해 잠재 고객들을 랜딩페이지로 유도하고 있습니다. 또한 심리학 원칙을 반영한 배너 디자인이기도 합니다. 일반적으로 사람의 시선이 왼쪽에서 오른쪽으로 이동합니다. 때문에 강조하고자 하는 내용은 배너 왼쪽에 배치해 고객이 자연스럽게 시선을 이동하면서 전달하고자 하는 핵심 내용을 집중하게 합니다.

2. 배너 디자인 주의점

배너 디자인에서도 가장 중요한 것은 명확한 목적과 대상 고객을 이해하고 간결하고 가동성 있는 메시지를 만들어야 합니다. 그리고 일관된 브랜드 이미지를 매력적으로 어필할 수 있도록 이미지와 그래픽 등 시각적 요소를 적절히 활용해야 합니다.

특히, 최근에는 사용자들이 다양한 기기를 사용하고 있습니다. PC 뿐만 아니라 핸드폰, 태블릿, 스마트워치 등 다양한 화면 크기에 대응할 수 있도록 반응형 디자인 원칙을 고려해야 합니다.

Part3: 배너 디자인 해볼까?

화이트보드 기반 협업툴인 보드믹스는 다이어그램 만들기부터 프로젝트 관리까지 다양한 기능을 제공하는 유용한 도구입니다. 보드믹스를 활용하면 무료 배너 디자인을 쉽고 빠르게 만들 수 있습니다. 아래에서는 이러한 보드믹스로 모바일 배너 디자인을 만들어 보도록 하겠습니다.

1. 사이즈 정하기

배너 디자인을 활용하는 화면 사이즈에 맞춰 디자인 되는 것이 중요합니다. 모바일 화면을 기준으로 제작될 때는 일반적으로 320 ×50 픽셀을 주로 사용합니다. 보드믹스 작업 캔버스에 프레임을 만들어 사이즈를 수정하고 배경 컬러를 선택합니다.

2. 이미지 만들기

보드믹스는 생성형 AI 기능을 업데이트 해서 더욱 강력한 도구입니다. AI 도우미 > 이미지 생성 기능을 선택해 제작하고자 하는 배너와 어울리는 고퀄리티의 이미지를 만들 수 있습니다.

구체적인 키워드를 입력할수록 사용자가 원하는 이미지를 생성할 수 있으며 사진, 인물 초상화, 이차원 2.5D 랜더링, 산업 디자인 등 여러 종류의 이미지를 만들 수 있습니다. 생성된 이미지는 저장할 수 있고 보드믹스 캔버스에 옮겨 원하는 대로 편집해 활용할 수 있습니다.

앞에 만들어둔 프레임에 보드믹스 AI도우미로 생성한 이미지를 배치하고 이미지와 어울리는 컬러로 배경색도 변경합니다.

3. 문구 입력하기

마지막으로 알리고 싶은 내용을 텍스트로 입력합니다. 모바일 배너는 특히 화면 공간이 한정적이기 때문에 핵심적인 내용을 간결하게 전달하는 것이 중요합니다. 그리고 가장 중요한 내용이나 키워드를 볼드 처리해 강조해 주면 배너 만들기가 완성됩니다.

마무리

배너 디자인을 잘 작성하기 위해서 가장 중요한 것은 배너를 제작하는 목적과 용도, 전달되는 매체가 무엇인지를 파악해야 합니다. 특히 모바일 사용자가 많기 때문에 모바일 환경에서 친화적인 디자인을 제작하는 것이 좋습니다. 그 외에 부가적으로 사용한 이미지나 폰트의 저작권과 배너 디자인 관련 법률 가이드, 문법과 철자 등을 꼼꼼하게 체크해야 하기 때문에 보드믹스와 같은 툴을 사용하는 것도 추천합니다.

무료 이용