수백만 명의 스마트폰 사용자가 매일 전화기를 사용하고 있는 상황에서, 이를 활용하기 위해 무엇을 할 수 있을까요? "점점 더 많은 소비자들에게, 시장, 소득 수준, 인구 통계를 초월하여, 휴대전화는 가장 가까운 기기이자 커뮤니케이션 채널입니다. 정의상 친밀하고 개인적이며, 어디든 휴대하고, 하루 종일 사용하며, 개인 사진 촬영 및 저장, 음악 다운로드, 배경화면 추가, 바로가기 만들기, 그리고 점점 더 앱과 기능 선택을 통해 맞춤화됩니다." TNS Global Key Insights Mobile Life에서 발췌. 이러한 이유로, 스마트폰은 브랜드가 고객과 친밀하고 일대일의 관계를 가질 수 있는 주요 기회를 나타냅니다. 자사 미디어 관점에서 우리가 가진 옵션은 다음과 같습니다

• 모바일 사이트 개발
• 네이티브 모바일 앱
• Facebook, Twitter, Instagram과 같은 기존 소셜 네트워크 활용

모바일 사이트로는 사진 앨범, 카메라, 비디오, 연락처 접근 등 다양한 기능을 활용할 수 없습니다. 경험이 네이티브 모바일 앱만큼 풍부하거나 인터랙티브하지 않을 가능성이 높습니다. 하지만 좋은 점은 모바일 사이트가 플랫폼에 구애받지 않는다는 것입니다. 즉, iOS, Android 또는 Windows에서 모두 실행될 수 있습니다. 네이티브 앱의 경우, 풍부한 경험, 아름다운 그래픽, 3D 이미지 등을 갖춘 정말 복잡한 앱을 만들 수 있습니다. 하지만 iOS, Android, Windows Mobile 또는 기타 운영 체제에 대해 동일한 앱의 다른 버전을 만들어야 할 가능성이 높다는 것을 아는 것이 매우 중요합니다.

현재 사이트가 모바일 친화적인가요?

이 질문에 답하려면, 스마트폰에서 자신의 사이트를 방문해 보거나 모바일 폰 시뮬레이터를 사용할 수 있습니다 (즉, "모바일에서 내 사이트가 어떻게 보이나요?"라고 온라인에서 검색하면 많은 무료 도구를 찾을 수 있습니다). 사이트가 플래시로 만들어져 있다면, iPhone(또는 iPad, iPod Touch 같은 모든 iOS 기기)에서는 아무것도 볼 수 없습니다. iOS가 플래시를 지원하지 않기 때문입니다. 일부 도구는 모바일 사이트를 최적화하는 방법에 대한 힌트를 줍니다. 도구가 묻는 질문은 다음과 같을 수 있습니다:

• "깨진 이미지나 누락된 콘텐츠가 보이나요?
• 확대하거나 좌우로 스크롤하지 않고 텍스트를 읽을 수 있나요?
• 엄지손가락으로 링크와 버튼을 클릭할 수 있나요?
• 비디오, 게임 또는 기타 애니메이션이 보이나요?
• 시각적 요소와 톤이 다른 마케팅 자료와 일관성이 있나요?"

이러한 질문에 답하고 모바일 사이트 로딩 시간을 확인함으로써, 모바일 사이트가 어떻게 수행되는지와 사이트를 개선하기 위해 어떤 영역을 살펴봐야 하는지에 대한 대략적인 아이디어를 얻을 수 있을 것입니다. 다시 말하지만, 위의 목록은 매우 기본적이며 사이트가 모바일 친화적인지 확인하기 위해 확인해야 할 다른 많은 것들이 있습니다.

모바일 친화적 사이트

베트남에서 모바일 사이트를 개발할 때, 기술적 관점에서 몇 가지 옵션이 있습니다:

반응형 웹 디자인

반응형 웹 디자인 (RWD 또는 반응형 디자인)은 비교적 새로운 것이므로 디자이너와 개발자가 이 개념을 마스터하고 아름답게 구현하기까지는 아직 갈 길이 멉니다. http://mashable.com, http://www.bostonglobe.com/ 또는 반응형 디자인을 지원하는 테마를 사용하는 제 블로그와 같은 많은 반응형 디자인 웹사이트 예시가 있습니다. 베트남에서 반응형 디자인을 구현한 사이트는 많이 보지 못했습니다. "Think Insights with Google"에서는 "반응형 웹 디자인(RWD)을 사용하면 여러 웹사이트를 만들지 않고도 다양한 화면 크기에 맞게 사이트 경험을 최적화할 수 있습니다. 유연한 템플릿, CSS 미디어 쿼리, JavaScript 이벤트를 사용하여 반응형 웹 디자인은 기기의 뷰포트 크기에 반응하여 이미지, 템플릿 레이아웃, 콘텐츠 가시성을 조정할 수 있습니다. 터치 기기에서 인식하는 드래그, 스와이프 및 기타 사용자 제스처와 같은 새로운 기기 기능도 활용할 수 있습니다. 이 모든 CSS 및 JavaScript 기술은 모든 기기에 전달되는 단일 HTML 콘텐츠 파일 위에 레이어링될 수 있습니다."라고 썼습니다. 반응형 웹 디자인이 무엇인지 잘 모르시는 분들을 위해 Mashable의 예시를 아래에 보여드립니다: 이것은 데스크톱의 일반 화면 크기이며 (저는 Macbook Pro를 사용하고 해상도는 "best scaled"입니다), 오른쪽 기사 제목 "Google Glass Photographer Makes Picture Taking Awkward"를 주목하세요. 강조된 부분을 보면, 기사 제목이 2줄로 되어 있고 아래에 설명이 있는 것을 볼 수 있습니다. 이제 iPad 화면 크기의 아래 그림을 보세요. 이것을 재현하려면 브라우저 창의 크기를 줄이기만 하면 됩니다. 더 작은 화면 크기 때문에 기사 제목이 이제 4줄로 나타나며, 기사 설명을 위한 공간이 더 이상 없습니다. 하지만 보시다시피 레이아웃은 _반응형_이며 우리의 보기는 여전히 최적입니다. 레이아웃이 깨지지 않고 콘텐츠를 쉽게 읽을 수 있습니다. 마지막 예시는 같은 Mashable 사이트의 스마트폰 화면 크기입니다. 보시다시피, 레이아웃이 완전히 변경되어 작은 화면 크기에 맞게 조정됩니다. 홈페이지에 뉴스 섹션만 보입니다. 메인 내비게이션은 왼쪽 상단 코너의 버튼으로 축소됩니다. 다른 섹션으로 이동하려면 해당 버튼을 클릭해야 합니다.

모바일 사이트: 같은 URL에서 다른 HTML을 동적으로 제공

고객이 웹사이트를 방문할 때, 웹서버가 어떤 종류의 기기를 사용하고 있는지 감지하여 같은 URL에 맞춤 페이지(HTML + CSS)를 제공할 수 있습니다. 이러한 맞춤 페이지는 휴대전화, 태블릿, 데스크톱 컴퓨터, 심지어 스마트 TV까지 모든 종류의 기기에 맞게 디자인할 수 있습니다. 사용자의 기기를 감지하고 제공하는 콘텐츠를 변경하려면 기기별로 유지 관리해야 하는 일부 맞춤화 (예: 스타일시트)가 필요합니다.

별도의 모바일 URL

기기 유형에 따라 사용자 경험을 맞춤화하는 또 다른 옵션은 원래 데스크톱 사이트와 독립적으로 모바일 트래픽을 위한 별도의 사이트를 구축하는 것입니다. 브라우저가 방문자가 모바일 기기에 있는지 감지하고 사이트의 모바일 최적화 버전으로 리디렉트합니다 (예: m.vnexpress.net). 전용 모바일 사이트를 사용하면 모바일 사용자를 위해 사이트를 특별히 맞춤화할 수 있으며, 독립적으로 구축되고 호스팅되는 경우가 많습니다. 이 솔루션은 베트남에서 꽤 일반적으로 사용됩니다. 베트남의 가장 큰 뉴스 포털 중 일부가 VnExpress, Vietnamnet (2013)과 같이 이 유형의 구현을 사용합니다.

모바일 친화적 사이트인가, 네이티브 모바일 앱인가?

예산 관점에서, 가장 적은 예산이 드는 옵션은 별도의 모바일 사이트를 갖는 것, 즉 별도의 모바일 URL입니다. 반응형 웹 디자인은 모바일 사이트에 비해 일반적으로 더 비싸겠습니다. 물론 반응형 디자인으로 모바일 사이트를 구축하는 것은 네이티브 앱에 비하면 훨씬 저렴합니다. 모바일 사이트 대비 네이티브 앱이 정확히 얼마나 저렴한지 물으시면, 역시 상황에 따라 다르다고 답하겠습니다. 기능에 따라 네이티브 앱이 3-20배 더 비쌀 것으로 추정합니다. 구축 비용이 적게 든다는 사실 외에도, 모바일 사이트는 도달 범위, 플랫폼 간 호환성, 브라우저 호환성의 이점이 있습니다. 사용자는 Google에서 검색하기만 하면 모바일 사이트를 꽤 쉽게 찾을 수 있습니다. 반응형 웹 디자인 사이트의 경우, 모바일 사이트의 위의 모든 이점을 상속받으면서, 맞춤 레이아웃으로 인해 기기 간 훨씬 나은 사용자 경험을 제공합니다. 반응형 웹 디자인(RWD) 사이트를 업데이트하고 싶다면, CMS를 통해 꽤 쉽게 할 수 있습니다. Apple AppStore의 경우와 같이 제3자의 승인 없이 변경 사항이 사용자의 브라우저에 즉시 반영됩니다. "일반" 모바일 사이트와 RWD 사이트 모두 다음과 같은 매우 큰 단점이 있습니다:

• 많은 경우 인터넷 연결 없이는 작동하지 않습니다 (제한된 이해로는 오프라인 모드를 제공하는 일부 Web App이 있습니다)
• 전화기 자체의 사용자 개인 데이터, 카메라, 캘린더, 사진 스트림, 가속도계 등에 접근할 수 없습니다 (이것은 미래에 변경될 수 있습니다)
• 복잡한 애니메이션, 게임, 보고서, 계산 등을 쉽게 구현할 수 없기 때문에 일반적으로 네이티브 앱만큼 풍부한 사용자 경험을 제공하지 못합니다.
• 푸시 기능: 모바일 사이트(웹 앱)가 백그라운드에서 실행되면서 알림을 보내는 것은 현재 시점에서 불가능합니다
• 수익화의 용이성: Google Play와 Apple App Store 또는 기타 마켓플레이스를 통해, 네이티브 앱을 마케팅하고 앱을 다운로드하거나 인앱 아이템을 구매할 수 있는 대규모 사용자에게 도달하는 것이 훨씬 쉽습니다. 모바일 사이트의 경우, 구독 모델이 수익화를 위한 몇 안 되는 선택지 중 하나인 것 같습니다.

네이티브 앱의 큰 단점 하나는 최상의 사용자 경험을 제공하기 위해서는 각 플랫폼에 맞게 앱을 맞춤화/구축해야 한다는 것입니다. 즉, iOS용 하나, Android용 하나입니다. 이는 네이티브 앱의 개발 비용이 더 높다는 것을 의미합니다. 유지보수 비용도 더 높습니다. 모바일 사이트의 단점은 자연스럽게 네이티브 앱의 장점이 됩니다. 하지만 네이티브 앱도 소셜 미디어 자산이나 웹사이트와 마찬가지로, 한번 만들면 사용자에게 홍보하고 이후에도 유지보수해야 한다는 점을 알아두세요. 그래서 2개월짜리 캠페인을 위해 앱을 개발한 후 지원을 중단하는 것은 추천하지 않습니다.

네이티브 앱 개발 흐름

네이티브 모바일 앱을 만들고 싶다면, 일반적인 흐름은 다음과 같습니다:

• 아이디어: 앱 컨셉, 핵심 기능을 포함합니다. 일반적으로 캠페인 집중 기간(1-2개월)이 아닌 앱의 장기적인 이점(사용자와 브랜드 모두를 위한)을 생각하는 것이 좋습니다. 앱을 구축하고 사용자에게 다운로드를 촉진하는 비용이 적지 않기 때문입니다.
• 비즈니스 분석: 요구 사항을 분석하고 각 운영 체제에 적합한 기술 솔루션, 기반 프레임워크를 제안합니다.
• 와이어프레임, 디자인: 웹사이트를 만드는 것과 마찬가지로, 와이어프레임은 사용자 인터페이스의 기초이기 때문에 앱에 매우 중요합니다. 와이어프레임에 논리적으로 잘못된 것이 있거나 누락된 것이 있으면, 사용자 경험이 심각하게 영향을 받을 것입니다.

화면 흐름은 애니메이션이 어떻게 작동하는지 설명합니다. 화면 흐름을 통해 클라이언트는 앱 사용 방법, 버튼을 터치하면 어떤 일이 일어나는지 "시각화"할 수 있습니다.

• 데이터베이스, CMS 및 API: 이 단계는 데이터베이스를 설계하고 요구 사항에 따라 CMS와 API를 코딩하는 것입니다. CMS와 API를 php, Java 또는 .Net으로 코딩할 수 있으며, 선택은 자유입니다. "일반적인" 웹 제작 팀이 이 부분을 처리할 수 있으며, 요청된 대로 API를 제작하기만 하면 됩니다.
• 앱의 프론트엔드를 데이터베이스, CMS 및 API와 연결하기 위한 프로그래밍: 이 단계에서는 Apple/Android SDK를 사용하여 프로그래밍해야 하며, iOS용 Objective C 등의 언어를 사용합니다.

다음으로 고려해야 할 질문은 Android, iOS, Windows 중 어디에서 네이티브 앱을 개발해야 하는가입니다.

Android인가, iOS인가, Windows인가?

고려해야 할 주요 사항 중 하나는 타겟 오디언스 사이에서 iOS와 Android의 시장 점유율입니다. Windows는 분명히 일반적인 플랫폼이 아니므로 Android와 iOS 중에서 선택하게 됩니다. 예산이 있다면 둘 다 하시는 것을 추천합니다. 공식 스토어를 통한 결제로 앱을 수익화하고 싶다면 iOS가 정답입니다. Apple App을 사용하는 사용자가 Android보다 무언가에 대해 비용을 지불할 가능성이 훨씬 높습니다. 그 이유 중 하나는 Android 앱의 크랙 버전을 찾는 것이 훨씬 쉽기 때문입니다. App Annie에서 보시면 iOS Store 매출이 월간 기준으로 Google Play의 약 4배인 것을 알 수 있습니다. 하나의 플랫폼을 선택해야 한다면, 모든 것은 타겟 오디언스와 그들의 스마트폰 선택에 달려 있습니다. 마케터로서 우리는 사용자를 따라가고 물고기가 있는 곳에서 낚시해야 합니다. 마지막으로, 위의 내용은 베트남 디지털 마케팅에 관한 제 최신 책의 "모바일 자산" 챕터에서 발췌한 것입니다. 전자책을 구매하시려면 이 링크를 사용해 주세요.