이번에 소개할 작업은 인천 서구 심곡동에 있는 자동차 디테일링 매장, 지테크닉 인천점의 홈페이지형 블로그 디자인이에요. 디테일링세차부터 유리막제거·발수코팅까지 매장의 시공 항목과 연락처를 첫 화면에 모았고, 그 아래에는 매장소개·이벤트안내·시공포스팅·오시는길·모바일 실시간 문의로 이어지는 메뉴 배너를 배치했어요.
다크 그레이 배경 위에 붉은 차량을 올린 메인 화면
메인 배경은 짙은 차콜 그레이 톤으로 깔고, 오른쪽에는 광택이 살아 있는 빨간 쿠페 이미지를 크게 넣었어요. 배경이 어두워서 차체의 붉은색과 반사광이 더 또렷하게 보이고, 차를 다루는 매장이라는 게 첫눈에 들어와요.
왼쪽 상단에는 GTECHNIQ 로고와 SMART SURFACE SCIENCE 문구를 두고, 바로 아래 파란 라벨에 '지테크닉 인천점'을 넣었어요. 브랜드명과 지점명이 한 덩어리로 읽히도록 묶어둔 구성이에요.
시공 항목과 연락처를 체크리스트처럼 정리했어요
로고 아래에는 디테일링세차, 실내크리닝, 내시경에바, 유리막제거 및 발수코팅 네 가지 항목을 체크 아이콘과 함께 큼직하게 나열했어요. 굵은 글씨에 흰 테두리를 둘러서 어두운 배경 위에서도 글자가 묻히지 않아요.
그 아래로는 대표번호, 휴대폰 번호, 매장 주소를 파란색·청록색·주황색 버튼 형태로 하나씩 나눠 담았어요. 앞에 전화기, 휴대폰, 위치 핀 아이콘을 붙여두어서 글을 다 읽지 않아도 어떤 정보인지 바로 구분돼요.
매장형 업체 블로그 첫 화면에는 무엇을 보여줘야 할까요?
직접 방문해서 서비스를 받는 매장이라면 첫 화면에서 '무엇을 하는 곳인지', '어디에 있는지', '어떻게 연락하는지'를 바로 확인할 수 있게 하는 편이 좋아요. 블로그 글을 하나씩 넘겨보지 않아도 시공 종류와 위치, 연락처를 알 수 있으면 처음 들어온 분도 매장을 금방 이해할 수 있거든요.
지테크닉 인천점 블로그는 이 세 가지를 메인 비주얼 한 화면 안에 모두 담았어요. 위에서부터 시공 항목, 전화번호, 주소 순서로 내려오기 때문에 어떤 시공을 하는 곳인지 확인한 뒤 바로 아래에서 연락처와 위치까지 볼 수 있어요.
시공포스팅과 모바일 문의까지, 다섯 개의 메뉴 배너
메인 비주얼 하단에는 매장소개, 이벤트안내, 시공포스팅, 오시는길, 모바일 실시간 문의 다섯 개 배너를 나란히 배치했어요. 초록·청록·파랑·회색·노랑으로 배너마다 색을 달리해서 메뉴끼리 헷갈리지 않게 했고, 오른쪽 아래에는 공통으로 'go' 표시를 넣었어요.
배너 이미지도 메뉴 내용에 맞춰 골랐어요. 이벤트안내에는 풍선과 선물상자가 담긴 차량 트렁크를, 모바일 실시간 문의에는 카카오톡 말풍선이 떠 있는 휴대폰 이미지를 사용했어요.
디테일링이나 세차처럼 작업 전후가 눈에 보이는 업종은 시공 기록을 블로그 글로 쌓아두기 좋은 편이에요. 시공포스팅 메뉴가 메인에 따로 있으면 방문자가 매장의 실제 작업 기록을 첫 화면에서 바로 찾아갈 수 있어요.
굿파크는 2012년부터 웹디자인을 해오면서 여러 업종의 블로그 디자인을 작업해왔어요. 세차나 차량 관리처럼 매장 방문이 중심인 업종의 블로그를 준비하고 있다면 지테크닉 인천점 사례를 참고해보세요.
이 게시물을
