제안 시스템

디자인킷 · 레이아웃

전략: 미디어믹스 배분(100% 띠와 매체별 역할·지표 표)

D-레이아웃-완성-전략-미디어믹스

전략: 미디어믹스 배분(100% 띠와 매체별 역할·지표 표)

언제 쓰는가

승(承)의 핵심 장. 예산이 어디로 가는지 한 줄 띠로 먼저 보여주고 아래 표에서 매체별 역할·지표·운영 방식을 설명. 매체 4~6개. 바꿔야 할 값: 매체명, 비중(합 100), 역할, 목표 지표, 운영 방식, 기존 대비 증감, 주력 매체 1개(class hot). 금액은 적지 않음. 값 바꾸는 법: .band 의 span flex 값 = 비중 숫자, 안의 글자도 같은 값. 표 행의 매체명·역할·지표·운영 방식·증감·비중 교체. 주력 매체는 띠 span 과 표 tr 양쪽에 class="hot". 띠 색 단계는 b1~b4(진한 순).

참고

Smartsheet 미디어 플랜 양식(https://www.smartsheet.com/content/media-plan-templates)의 채널·역할·KPI 열 구성, Financial Times Visual Vocabulary 의 part-to-whole 단일 누적 막대, AMPM 미디어믹스 글(https://inside.ampm.co.kr/insight/8664)의 목표별 매체 조합 설명을 참고. 직접 제작.

조각

<section class="slide lo-st-mix">
  <div class="run"><b>모루리빙 2027 상반기 통합 디지털 마케팅 제안</b><span>PART 02 · 전략 방향</span></div>
  <div class="hd"><p class="lb">미디어믹스</p><h1>매체비의 40%는 검색 광고, 재구매 알림에 15% 신규 배정</h1><p class="lede">2027년 1~6월 월 매체비 100 기준 배분과 매체별 역할</p></div>
  <div class="body">
<div class="band"><span class="hot" style="flex:40">검색 광고 40%</span><span class="b1" style="flex:20">쇼핑 검색 20%</span><span class="b2" style="flex:15">재구매 알림 15%</span><span class="b3" style="flex:15">블로그 후기 15%</span><span class="b4" style="flex:10">숏폼 10%</span></div>
    <div class="cd t">
      <table>
        <thead><tr><th>매체</th><th>역할</th><th>목표 지표</th><th>운영 방식</th><th>기존 대비</th><th class="r">비중</th></tr></thead>
        <tbody>
          <tr class="hot"><td class="k">검색 광고</td><td>찾는 사람을 구매로 연결</td><td>전환당 비용 지수</td><td>검색어 그룹 5개, 주 1회 입찰 조정</td><td class="num">-31%p</td><td class="r num">40%</td></tr>
          <tr><td class="k">쇼핑 검색</td><td>상품 비교 단계 대응</td><td>첫 화면 상품 수</td><td>대표 상품 12개 집중, 리뷰 확보 병행</td><td class="num">+6%p</td><td class="r num">20%</td></tr>
          <tr><td class="k">재구매 알림</td><td>기존 고객 재방문</td><td>90일 재구매율</td><td>구매 후 60일·85일 2회 발송</td><td class="num">신규</td><td class="r num">15%</td></tr>
          <tr><td class="k">블로그 후기</td><td>후기 구역 첫 화면 확보</td><td>첫 화면 글 수</td><td>월 12건, 검색어 그룹과 같은 주제</td><td class="num">+7%p</td><td class="r num">15%</td></tr>
          <tr><td class="k">숏폼 영상</td><td>모르는 사람에게 첫 노출</td><td>끝까지 본 비율</td><td>월 4편, 후기 영상 재편집</td><td class="num">+3%p</td><td class="r num">10%</td></tr>
        </tbody>
      </table>
    </div>
  </div>
  <div class="pg">15</div>
  <div class="src">비중은 월 매체비 기준. 월간 성과에 따라 20% 범위에서 조정</div>
</section>

스타일

.slide.lo-st-mix .hd .lb{color:var(--mu)}
.slide.lo-st-mix :where(.body p,.body ul,.body ol,.body dl,.body dd,.body dt){margin:0;padding:0;list-style:none}
.slide.lo-st-mix .k{font-size:var(--f-cap);font-weight:600;color:var(--mu)}
.slide.lo-st-mix .cd{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow)}
.slide.lo-st-mix .say{font-size:var(--f-body);color:var(--ink2)}
.slide.lo-st-mix .say::before{content:"→";color:var(--mu);font-weight:600;margin-right:10px}
.slide.lo-st-mix table{width:100%;border-collapse:collapse}
.slide.lo-st-mix th{font-size:var(--f-cap);font-weight:600;color:var(--mu);text-align:left;padding:0 14px 10px;border-bottom:1px solid var(--line2)}
.slide.lo-st-mix td{font-size:var(--f-sm);color:var(--ink2);padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.slide.lo-st-mix tr:last-child td{border-bottom:0}
.slide.lo-st-mix td.k{font-size:var(--f-body);font-weight:700;color:var(--ink)}
.slide.lo-st-mix .body{gap:14px}
.slide.lo-st-mix .band{display:flex;gap:3px;height:40px}
.slide.lo-st-mix .band span{display:flex;align-items:center;padding:0 14px;font-size:var(--f-cap);font-weight:700;border-radius:var(--r-sm);white-space:nowrap;min-width:0}
.slide.lo-st-mix .band .hot{background:var(--ac);color:var(--card)}
.slide.lo-st-mix .band .b1{background:var(--g4);color:var(--card)}
.slide.lo-st-mix .band .b2{background:var(--g3);color:var(--card)}
.slide.lo-st-mix .band .b3{background:var(--g2);color:var(--ink)}
.slide.lo-st-mix .band .b4{background:var(--g1);color:var(--ink)}
.slide.lo-st-mix .t{padding:20px 22px 10px}
.slide.lo-st-mix th.r,.slide.lo-st-mix td.r{text-align:right}
.slide.lo-st-mix td.r{font-size:var(--f-lg);font-weight:700;color:var(--ink)}
.slide.lo-st-mix td.num{white-space:nowrap}
.slide.lo-st-mix tr.hot td.k,.slide.lo-st-mix tr.hot td.r{color:var(--ac)}