sketchbook

365mc - Zomzie 좀지


Tag
UI/UX, Responsive Web
Client
365mc
Role
Design, Development
Links

OverviewHorror Movie Zomzie

365mc는 대한민국 대표 비만클리닉으로,
지방이라는 캐릭터를 통해 많은 공감과 인기를 얻고 있습니다.
그동안의 독창적인 지방이 광고 시리즈를 이을 새 영상 [ 좀지:좀비지방이 ]를
실제 개봉하는 공포영화인 듯 표현한 마이크로 사이트로 제작하였습니다.

Client Needs

365mc에서는 고객들에게 재미와 동시에 시술을 효과적으로 홍보하기 위해
지방이가 좀비로 등장하는 영상을 제작하였고,
마이크로사이트를 영화 공식사이트처럼 제작하여 실제 영화인 것처럼 보여지길 원했습니다.

우리는 이런 사이트를 원합니다. 좀비 지방이가 실제로 개봉하는 공포영화처럼 보여졌으면 좋겠고 고객들이 흥미를 가질 수 있는 재미있는 사이트를 원합니다.

Client Interview

365mc의 홍보 플랜과 목적, 비즈니스 현황 및 제약사항 등을 파악하고
프로젝트 목표 및 방향성을 결정하기 위해 365mc측과 인터뷰를 진행했습니다.

365mc Marketing Plan

소셜미디어를 통해 마이크로사이트로의 유입을 유도하고
마이크로사이트에서 [ 좀지:좀비지방이 ]에 대한 고객의 흥미를 유발하고 궁금증을 불러일으킵니다.
마이크로사이트를 통해 본편(시술 홍보영상)이 있는 유튜브로 유도하여
시술을 효과적으로 홍보하고자 했습니다.

Microsite Mission
  • 리얼하게 실제 개봉하는 영화처럼 리얼하게 표현하여 관심유도
  • 궁금증 유발 사용자가 즐길 수 있는 재미있는 콘텐츠로 좀지에 대한 궁금증 유발
  • 홍보효과 극대화 마이크로사이트를 통해 시술 홍보영상이 있는 유튜브로 유입 유도

Target Analysis

마이크로사이트를 통해 유튜브의 본편(시술홍보 목적) 영상을 보도록 유도합니다.
영상을 통해 365mc만의 특화된 시술인 ‘람스’ 에 관심을 갖게하고 많은 고객들이 시술을 할 수 있도록 하는 것이
이번 프로젝트의 최종 목적입니다. 따라서 시술에 대한 관심도에 따라 주요 타깃을 도출하였습니다.

  1. 1

    시술을 잘 모르는 사람

    시술 정보의 전달

  2. 2

    시술을 알고 있지만
    계획은 없는 사람

    시술에 대한 관심 확대

  3. 3

    시술을 알고 있지만
    거부감이 있는 사람

    캐릭터의 친금감으로
    거부감 감소

  4. 4

    시술을 알고, 계획도 있지만
    병원을 선택하지 못한 사람

    인지도 높은
    믿을만한 병원의 선택

Project GoalGOAL

지방이 캐릭터의 변신을 통해 365mc를 다시 한 번 알려
시술을 하려는 사람에게는 인지도 높은 믿을만한 병원의 선택을,
시술을 잘 모르는 사람들에게는 흥미를 유발해 시술 정보의 전달을,
시술에 거부감을 가진 사람들에게는 지방이 캐릭터로
친근한 이미지를 전달해 거부감을 줄여주는 것을 목표로 설정합니다.

CONCEPTDesign Concept

365mc의 홍보 플랜과 목적, 비즈니스 현황 및 제약사항 등을 파악하고
프로젝트 목표 및 방향성을 결정하기 위해 365mc측과 인터뷰를 진행했습니다.

Realistic 진짜보다 더 진짜 영화같은
Identity 좀비지방이의 아이덴티티를 담아

Graphic Motif

좀비지방이 영상 속 요소들과 게임 티저 사이트를 모티프로 하여
사용자의 관심을 유도할 수 있는 재미요소를 만들어냅니다.

  1. Zomzie Movie

    좀비 영상에 등장하는 그래픽 효과의 특징을 사이트에 녹여냅니다.
    영상 속 불꽃, 연기, 핏줄, 갈라짐 등의 디테일을 포착하여
    사이트 전반 그래픽 요소에 적용하였습니다.

  2. Game Teaser Site

    게임 업계에서 유저들의 기대감을 고조시키기
    위해 사용하는 티저사이트를 모티프로 하여
    궁금증을 유발시키는 요소들을 차용했습니다.
    카운트다운, 캐릭터 소개, 콘텐츠 부분공개 등으로
    관심을 이끌어내도록 합니다.

SYSTEM Design System

사이트의 완성도 높은 아이덴티티 구축을 위해 디자인 시스템을 정의합니다.
정의된 가이드는 사이트의 UI 뿐만 아니라 사용자와의 다양한 접점에 활용하도록 합니다.

FOCUS GRADIENT

#542b1c - #000000

BLOOD RED

#B70B00

365MC ORANGE

#FF5A00

Color

콘텐츠에 집중이 될 수 있도록 배경은 브라운에서 블랙으로 짙어지는 컬러를 사용합니다.
포인트 컬러로는 좀비를 연상시키는 핏빛 레드와 365mc의 아이덴티티 컬러 및 좀비지방이 캐릭터의 컬러인 오렌지를 사용합니다.

Typography

공포영화에 어울리는 날카로운 서체를 메인으로 사용하고
캐릭터와 어울리는 귀여운 서체를 팝업 등에 사용하여 강조합니다.
서체의 일관된 사용으로 사용자에게 메시지를 효과적으로 전달합니다.

  • Sando 빛의계승자
  • Sando 네모니2
Page Layout

풀페이지 레이아웃으로 스크롤 다운 시 화면 전체가 스크롤됩니다.
한 페이지에 하나의 메뉴만으로 구성하여 콘텐츠의 집중도를 높였습니다.

Graphic elements

앞서 발견한 두 가지 그래픽 모티프를 기반으로 하여 그래픽 요소를 구성합니다.
브랜드의 컨셉을 반영한 그래픽 요소들을 통해 사용자의 관심 및 브랜드 매력도를 증대시킵니다.

Motif 01 Zomzie Movie
Crack TextureCrack Texture
FlameFlame
Motif 02 Game Teaser Site
CountdownCountdown
Shning ButtonShining Button

reveal
your
existence REVEAL

Main

영화 소개페이지의 느낌을 살려 표현했습니다.
전체적으로 어두운 배경을 사용하여 중앙의 콘텐츠에 집중도를 높였습니다.
사이트에 접속하면 예고편 영상과 함께 개봉일이
실시간으로 카운트다운 되어 사용자의 기대감을 고조시킵니다.

1 Home, 2 About, 3 Cast, 4 Media
Popup

팝업에도 좀비지방이의 아이덴티티를 담아 표현했습니다.
갈라진 배경, 반짝이는 효과 등 사이트 전반에 사용된
그래픽적 표현들을 이어가도록 합니다.

  • 벅지
  • 힙지
  • 좀지
  • 주연배우 지방이 독점 인터뷰
Mobile

풍부한 콘텐츠가 모바일에서도 가독성 있게
표현될 수 있도록 해상도를 고려하여 최적화하였습니다.

  • 01 MAIN
  • 02 ABOUT
  • 03 CAST
  • 04 MEDIA
Wallpaper

미디어 영역 월페이퍼 탭을 통해 다운받을 수 있는 배경화면입니다.
좀비지방이 영상 속 등장인물들의 특징에 위트를 더해
배경화면을 제작하였습니다.

상상 그 이상,
초대형 불룩버스터 탄생

Credits

  1. Director

    • Baek GwangJong
  2. Product Manager

    • 365mc
    • Han SeHui
  3. Design

    • Han SeHui
    • Chris
  4. Development

    • Han SeungYeon
    • Baek GwangJong