본문 바로가기
UX

PC 웹 서비스의 모바일 전환

by 화분 2014. 5. 14.

모바일은 옵션이 아니라 필수이다


스마트폰 이용자가 늘어나고 기기의 이용에 점점 익숙해지면서 모바일 앱 또는 웹을 통하여 인터넷을 이용하는 비중이 PC를 넘어서고 있다. 2014년 1월 미국 기준으로 모바일 앱을 이용한 인터넷 이용은 48%로 PC에서 웹을 이용하는 45%를 넘어섰으며, 모바일 웹 브라우져의 8%를 포함하면 모바일을 통하여 인터넷을 이용하는 시간은 55%에 달한다(http://money.cnn.com/2014/02/28/technology/mobile/mobile-apps-internet/, http://www.internetretailer.com/2013/10/01/its-official-mobile-devices-surpass-pcs-online-retail). 결국 모든 서비스에서 모바일은 이제 옵션이 아니라 필수가 되었다.




스마트폰이 등장한 초기에는 PC에서 제공하는 동일한 디자인을 모바일 브라우저에서 제공하는 경우를 쉽게 볼 수 있었지만, 최근에는 모바일에 맞추어 디자인을 제공하는 경우가 대부분이다. 이처럼 모바일에 맞추어 서비스를 전환하여 제공할 경우 사용자의 관여도 및 서비스 이용율이 크게 증가한다는 결과를 쉽게 볼 수 있다. Vegas.com은 기존의 PC 사이트 디자인과는 다른 모바일 전용 사이트를 제작하여 서비스를 제공한 결과 page view는 16%, 호텔 검색은 14%가 증가하였고, bounce rate(웹 페이지를 방문한 후 다른 페이지로 이동 없이 바로 나가는 경우. 어렵게 진입은 했지만 서비스에 머무르지 않는다는 의미이다)는 22%가 줄어들었다(http://uxmag.com/articles/navigating-the-mobile-jungle?utm_source=Facebook&utm_medium=ArticleShare&utm_tone=sf). 이렇게 모바일 웹을 제공할 경우 얻을 수 있는 효과는 쉽게 찾아볼 수 있다.  


이처럼 모바일 서비스를 제공할 경우 좋은 효과를 볼 수 있으며 서비스 확장에 필수 조건이다. 물론 단순하게 모바일로 전환하기 보다는 더욱 사용자를 위하여 기획하고 디자인한다면 훨씬 더 큰 효과를 볼 수 있을 것이다. 그렇다면 더 좋은 모바일 서비스의 UX 디자인을 위하여 유의해야 할 것은 무엇인가? 



모바일 사용자와 사용 행태는 PC와 다르다


많은 사람들이 온라인 호텔 검색, 예약 서비스를 이용한다. 그렇다면 어떤 사람들이 어떤 상황에서 스마트 폰을 이용하여 호텔을 검색하고 예약을 하게 될까? PC에서 호텔을 찾고 예약을 하는 사람들과 같은 사용자들이 같은 상황에서 이용하는 것일까? 여름 휴가에 여행 계획을 세우면서 숙소를 찾아보고 예약을 하는 상황에서 스마트폰을 이용할 것인가, PC를 이용할 것인가? 아마도 화면이 넓고 조작이 편리한 PC를 이용하여 다양한 숙소들을 찾아보고 예약을 하게 될 것이다. 충분히 시간 여유가 있기 때문이다. 그렇다면 누가 어떤 상황에서 모바일에서 호텔을 검색하고 예약을 하게 될까? 

조금 다를 수는 있겠지만 모바일에서 호텔을 찾고 예약하는 상황은 급하게 오늘 머무를 수 있는 숙소를 찾는 경우이다. 회사 업무로 지방에 출장을 갔는데 회의 또는 일이 예상보다 길어져서 바로 올라오지 못하는 상황에서 숙소를 예약해야 할 수도 있다. 여행객이 예상하지 못했던 상황이 벌어져 예정된 장소로 이동하지 못하고 하룻밤을 보내야 하는 경우나 즉흥적으로 여행을 하는 경우도 이에 해당할 수 있다.  

스마트 폰에서 서비스를 이용하는 사용자들과 이용 상황은 다르다. 따라서 이 사용자들이 누구인지, 어떠한 상황에서 우리 서비스를 이용하는가를 이해하고 기획, 디자인을 해야 한다. 



모바일에서 제공하는 기능과 콘텐츠는 다르다


해외 여행이나 출장을 위하여 출국을 해야 하는 경우 한두개의 가방을 들고 공항으로 향한다. 공항에 도착하면 항공권을 발권하기 위하여 해당 항공사의 카운터로 이동하는데, 줄을 서기 전에 여권과 인터넷에서 출력한 예약 확인증을 미리 찾아서 준비한다(카운터 앞에서 가방을 뒤적거리는 사람들도 쉽게 볼 수 있다). A4에 출력한 이 예약 확인 종이는 여간 불편한게 아니다. 비라도 오는 날이면 물기 묻은 우산과 걸리적거려 젖기도 하고 여간 사람을 귀찮게 하는 것이 아니다. 이런 상황에서 모바일에서 예약증 또는 보딩 패스를 제공한다면 (어떤 상황에서도 지갑보다 훨씬 쉽게 찾을 수 있는것이 모바일폰이다) 사람들을 더욱 편리하게 해줄 수 있지 않을까?

모바일 보딩 패스 기능을 제외하더라도 항공사에서 제공하는 PC의 웹 사이트와 모바일 앱 서비스에서 제공하는 정보와 기능은 조금씩 달라진다. 위에서 살펴보았듯이 모바일은 PC와 이용자와 이용 상황이 다르기 때문에 사람들이 사용하는 기능과 확인해야 하는 정보는 다르다. 동일한 기능을 제공할 경우라도 그 우선 순위가 달라지기 때문에 메뉴를 제공하는 방법과 접근하는 방법이 달라야 한다. 

모바일에서 제공하는 콘텐츠는 모바일에 맞추어 디자인 해야 한다. 



  



모바일의 장점을 극대화하라

스마트폰은 PC보다 할 수 있는 것들이 많다. 다양한 센서들을 열거하지 않더라도 내가 찾은 매장의 전화번호를 확인하고 전화번호를 외울 필요 없이 바로 전화를 걸 수 있다는 것만 들더라도 PC보다 더욱 편리한 이용이 가능하다. 기존에 제공하던 PC 웹 서비스의 기능에 국한하지 말고 모바일에서 활용할 수 있는 다양한 기능을 활용할 수 있는 아이디어를 고민하고 적용한다면 더욱 좋은 서비스를 제공할 수 있다. 

같은 정보를 제공한다고 하더라도 제공하는 방법을 사용자에게 친숙하게 제공할 수도 있다. 같은 전화번호 정보를 제공할 경우에도 단지 파란색의 밑줄로 처리하기보다 [전화하기] 버튼 형태로 제공한다면 사용자가 더욱 빨리 전화걸기 기능을 인지하거나, 전화를 걸 수 있도록 유도할 수 있는 디자인이 될 수 있다. 




기기에 맞춰 디스플레이 하라

페이스북이나 트위터 등 SNS 서비스가 활성화되면서 SNS를 통하여 웹 페이지로 유입하는 경우가 많다. 이때 PC 화면에서 모바일 웹 페이지가 열리는 경우나 반대로 모바일에서 링크를 선택했는데 PC 웹 화면으로 이동하는 경우를 흔히 겪을 수 있다. 링크를 게시한 사용자가 모바일에서 게시한 경우에는 모바일 웹 페이지로 이동하고, PC의 링크를 게시한 경우에는 PC의 웹 페이지를 그대로 보여주는 경우이다. 때로는 모바일에서 링크를 선택했을 때 "모바일 페이지로 이동하시겠습니까?" 라고 물어보는 친절한(?) 사이트도 볼 수 있다. 왜 링크를 이용하는 사용자가 아닌, 링크를 게시한 사용자에 화면을 맞추는가?

HTML 스크립트를 이용하면 이용자가 접근하는 브라우저를 쉽게 알 수 있다. 같은 콘텐츠의 화면을 PC 웹과 모바일에서 동시에 제공할 경우에는 게시한 사용자가 아닌 이용하는 사용자의 브라우저에 맞추어 제공해야 한다.  



반응형 웹이 답인가?

모바일 웹 페이지를 기본으로 제공하게 되면서 반응형 웹 디자인에 대한 관심도 높아지고 있다. 반응형 웹 디자인(Responsive Web Design, RWD)은 휴대폰에서부터 데스크탑 컴퓨터에 이르기까지 다양한 디바이스에 대응하여 최소한의 변화(Resizing, Panning, Scrolling)로 내용 탐색을 쉽게 하여, 사이트를 최적의 형태로 제공하는 기술이다(http://en.wikipedia.org/wiki/Responsive_Web_Design). 이는 서비스 제공자가 더욱 편리하고 효율적으로 (시간과 인력 투입, 비용 등의 측면에서) 수없이 등장하는 다양한 기기에 어새하지 않게 최적화하여 콘텐츠를 제공하여 사용자에게 더 좋은 경험을 제공할 수 있다는 장점을 갖는다. 

그렇지만 반응형 웹 디자인이 PC 웹 사이트를 모바일로 전환하는 정답으로 생각하고 개발 효율 측면에서만 생각한다면 더욱 좋은 서비스를 제공할 수 없다. 반응형 웹 디자인의 기본 전제는 동일한 콘텐츠를 PC와 모바일에 제공할 경우라는 점이며, mashable과 같이 수시로 글을 게시하는 매거진 형태의 서비스에서 가장 잘 적용할 수 있는 기술이다 (PC에서 접근하든 모바일에서 접근하든 동일한 콘텐츠를 제공하기 때문이다). 종종 화면 디자인을 타일 또는 블록 형태로 PC와 모바일을 비슷하게 디자인하면서 우리는 반응형 웹 디자인을 했다고 이야기하는 사람들이 있지만 그것이 어떤 의미가 있는가? 반응형 웹 디자인은 만능이 아니다.


앞에서 이야기했듯 PC와 모바일은 사용자와 사용 상황, 행태가 다르다. 따라서 모바일에서 사람들이 가장 잘 사용할 수 있는 기획을 하여 다른 콘텐츠를 제공할 경우에는 반응형 웹 기술이 유용하지 않을 수도 있다. 옥션과 같은 쇼핑몰에서 모바일 서비스를 제공한다고 할 때 반응형 웹 기술을 잘 적용하여 PC의 첫 화면에서 제공하는 모든 콘텐츠를 모바일 화면에서 제공한다고 가정하자. 이쁘게 담을 수는 있겠지만 과연 사람들이 그 많은 상품 정보들을 볼 수 있겠는가?


웹 서비스를 모바일로 전환하여 제공할 경우 가장 중요한 것은 모바일에 맞추어야 한다는 것이다. 모바일에서 어떤 사람들이 어떤 상황, 환경에서 어떤 목적으로 서비스를 이용하는가를 고민하고 모바일을 위한 서비스를 기획하고 디자인 해야 한다.