05. UI설계에 필요한 용어들-2
Prologue
오랜만에 들어오니 뷰가 많이 늘었네요. 정제되지 않은 글임에도 관심 가져주셔서 감사합니다. 'UI설계에 필요한 단어들-2,3'에서는 디자이너가 기획 또는 개발 직군과 커뮤니케이션하기 위해 알아두면 좋을 용어들에 대해 다루고자 합니다.
오늘의주제
네이티브앱/하이브리드앱/웹앱/모바일웹
네이티브앱/하이브리드앱/웹앱/모바일웹
모바일에서 서비스를 이용하는 창구로는 크게 웹과 앱으로 구별되지만, 그 안에서도 세부적으로 종류가 구분된다. 디자이너가 원활히 소통하기 위해서는 일단 '모바일웹','네이티브앱'.'웹앱','하이브리드앱' 이 네 가지만 우선 알아두면 좋다.
모바일웹: 모바일로 접속한 웹사이트
네이티브앱: 다운로드가 필요한 어플리케이션
웹앱: 앱처럼 생겼지만 브라우저를 통해 접근하는 방식
하이브리드앱: 다운로드된 앱 안에서 웹 페이지를 불러오는 방식
모바일웹
평범하게 브라우저를 통해 모바일 기기로 접속한 웹사이트를 칭한다.
별도의 앱을 설치하지 않고도 url로 접근할 수 있는 방식이다. 흔히 알고있는 PC 웹사이트를 모바일 사이즈에 맞게 재구성한 형태이다. 다시 말해 반응형 또는 적응형으로 모바일 사이즈에 맞춘 웹페이지이다.
ex) 마켓컬리 웹, 야놀자 웹, 알바몬 웹 등 브라우저 검색을 통해 모바일에서 이용가능한 웹사이트
장점
1. PC/ 태블릿/ 모바일 모두에 적합한 반응형 웹을 제작할 수 있다.
모바일에 최적화된 앱은 PC에서 사용하고자 하는 경우 설치가 아예 불가능하거나 PC용 앱을 별도로 설치해야 한다(ex.카카오톡). 하지만 모바일 웹은 별도의 설치과정 없이 PC나 태블릿PC 등 다른 디바이스에서도 사용이 가능한 사이트를 제작할 수 있다.
2. 네이티브나 하이브리드 앱에 비해 개발에 필요한 리소스나 비용, 시간이 적게 소모된다.
네이티브나 하이브리드 앱에 비해 모바일 웹은 개발에 드는 시간이 적으며 앱스토어/ 구글 스토어 등의 절차가 필요하지 않다. 자연스럽게 그에 따르는 전체 프로젝트 기간, 인건비 등도 적게 요구된다.
3. 설치가 필요없이 누구나 접근 가능하기 때문에 링크 공유가 용이하다.
링크 공유가 용이하면 콘텐츠의 빠른 확산에 유리하다. 링크를 수신하는 사람이 앱 설치없이 브라우저로 바로 공유된 링크에 진입할 수 있기 때문이다. 따라서 접근성을 높이기 위해, 앱과 모바일웹을 모두 운영하고 있는 서비스에서는 콘텐츠를 공유하는 사람이 앱을 통해 링크를 공유하더라도 공유받는 사람은 모바일웹으로 확인할 수 있도록 하고있다.(네이버 링크공유 등)
4. 앱 배포에 필요한 승인 절차가 없기 때문에 상시로 수정사항을 반영할 수 있다.
앱 배포에 필요한 승인 절차가 없다는 것은 제작시간이 적게 든다는 것도 의미하지만, 상시 업데이트가 간편하다는 말이기도 하다. UI 업데이트나 이런 저런 실험적인 시도가 잦은 서비스에게 필요한 부분이다.
단점
1. OS에서 제공하는 기능을 수행할 수 없다.
(Push 알림, 블루투스, GPS, QR코드, 주소록 연동, SNS 로그인, 인앱결제 등)
만약 본인의 서비스가 수시로 Push 알림을 전송해야 하는 습관형성 서비스라던가 현재 위치를 추적해야 하는 여행 서비스 등 OS 자체 기능을 활용하여 주기능을 구현해야 하는 상황이라면, 모바일웹만 운영하는 것은 상당히 곤란할 수 있다.
2. 즐겨찾기 등으로 URL을 저장하는 단계가 필요하기 때문에 설치된 앱에 비해 접근성이 떨어진다.
웹사이트는 공유로 인한 접근성은 높을 수 있지만 서비스를 실행하기 위한 접근성은 좋지 못 하다. 이용하고자 하는 사이트를 (그것도 사용자가 자의로) 핸드폰 배경화면에 따로 저장해서 사용하지 않는 한, 즐겨찾기나 북마크 등의 기능으로 브라우저에 저장하는 방법이 최선이다. 하지만 이런 즐겨찾기나 북마크는, 목적을 갖고 진입하지 않는 이상 평소에 지나치듯 마주치기 어려운 페이지이기 때문에 역시나 사이트 노출도가 떨어진다.
3. 서비스 이용을 위해서 필수적으로 인터넷을 연결해야 한다.
접근성이 떨어지는 또 다른 이유이다. 브라우저를 통해 접근하는 방식이기 때문에 와이파이 또는 데이터 연결이 필수이다.
네이티브앱
앱스토어/구글스토어 등을 통해 기기에 설치하는 어플리케이션이다.
흔히 생각하는 그 어플리케이션이 맞다. 모바일웹과는 달리 OS에서 제공하는 기능(카메라,GPS,알림,지도,메신저 등)을 수행할 수 있는 기능 위주의 서비스에 적합하다.
ex. 스노우(카메라 앱), 토스, 카카오톡, 스타벅스 사이렌오더, 튜터링, 트리플, 따릉이 등
장점
1. 고퀄리티의 그래픽을 구현할 수 있다.
고사양이 요구되는 그래픽 이미지를 사용하거나 동적 인터렉션을 자연스럽게 구현하기가 용이하다.
2. OS 기능을 활용할 수 있다.
카메라, GPS, PUSH 알림, 지도, 메신저 등의 OS 자체 기능을 활용한 서비스를 만들 수 있다.
3. 일부 서비스에 한해, 인터넷이 불가한 환경이어도 기존에 저장된 데이터를 활용할 수 있다.
넷플릭스나 유튜브, 밀리의 서재의 '오프라인 저장 콘텐츠' 기능이 이에 해당한다. 인터넷이 사용한 환경에서 콘텐츠를 미리 저장해두면, 오프라인 환경에서도 해당 콘텐츠를 사용할 수 있다. 모바일웹은 진입 자체에 인터넷 연결을 요구하기 때문에 이와 같은 기능이 불가능하다.
단점
1. 다양한 운영체제에 각각 대응해야 한다.
네이티브앱은 ios,안드로이드 등 OS 별로 개발환경이 상이하다. 따라서 한 번만 개발하면 되는 웹보다 비용,시간 등이 몇 배로 필요하다. 때문에 주요 사용자가 많이 분포되어 있는 OS의 네이티브 앱을 먼저 상용화 한 뒤, 다른 OS 개발을 후에 진행하는 경우도 있다.
2. 업데이트 시 스토어의 심사가 필요하다.
앱스토어, 구글스토어에 어플리케이션을 등록하기 위해서는 해당 스토어의 심사과정을 거쳐야 한다. 사용자의 안전한 경험과 신뢰관계를 위해 필요한 과정이지만, 심사과정만큼 리소스가 추가되는 건 어쩔 수 없다.
3. 사용자가 자의적으로 업데이트를 해야 지속적인 사용이 가능하다.
업데이트가 영영 일어나지 않는 일부 서비스(미니게임 등)가 아니라면 어플리케이션의 업데이트는 불가피하다. 심지어 최근 앱스토어에서는 '2년 이상 업데이트하지 않은 앱은 앱스토어에서 삭제하겠다'는 정책을 내세우기도 했다. 모바일웹은 개발사에서 업데이트하면 그걸로 끝이지만, 사용자의 디바이스에 다운로드되어 있는 어플은 사용자가 수동으로 업데이트를 해야 한다. 사용자에게 약간의 불가피한 불편함을 안길 수 있다.
4. 용량이 크다.
사용자 기기에 설치하는 방식이기 때문에 아무래도 기기용량을 일부 차지하게 된다.
웹앱
앱처럼 보이는 모바일 웹 형식이다.
모바일웹과 동일하게 브라우저를 통해 접근해야 하지만, 인터페이스와 인터렉션이 앱처럼 구현된 방식이다. 화면 한 장 한 장을 이미지처럼 보면 모바일웹과 뭐가 다르지? 싶을 수 있으나, 코드방식과 화면전환 등이 앱과 유사하다.
ex) 네이버, 우리은행 등
장점
1. 모든 OS와 브라우저에서 접근 가능하다.
2. 네이티브나 하이브리드 앱에 비해 리소스가 적게 든다.
3. 배포 승인 과정이 없고 수정사항을 빠르게 반영할 수 있다.
1,2,3은 모바일웹의 장점과 동일하다. 설치없이 인터넷으로 진입하기 때문에 사용자의 기기나 브라우저 형식이 그다지 중요하지 않다. 모바일웹과 마찬가지로 리소스가 적게 들며 승인절차 없이 수정사항을 바로바로 반영할 수 있어 유지보수가 간편하다.
4. 브라우저임에도 앱을 사용하는 듯한 경험을 준다.
비록 서비스 진입은 브라우저를 통하지만, 사이트 내에서 사용자가 경험하는 것은 앱의 인터페이스/인터렉션과 같다. 브라우저 사용자가 추후 해당 서비스의 앱을 설치해도 낯설지 않게 같은 경험을 유지할 수 있다.
단점
1. 인터넷 연결이 필수이며, URL로 진입해야 하기 때문에 접근성이 떨어진다.
2. OS기능을 사용하기 어렵다.
3. 앱에 비해 로딩속도가 느리다.
웹의 한계가 있기 때문에 아무리 앱의 방식을 구현했다고 하더라도 로딩속도가 느리다고 느낄 수 있다. 앱처럼 생겼기 때문에 앱과 같은 성능을 기대하는 사용자들이 실망할 가능성이 있다.
하이브리드 앱
앱 안에서 웹페이지를 불러오는 형식이다.
다운로드가 필요하며 업데이트가 잦은 서비스에서 많이 사용된다. 앱의 일부는 웹으로, 웹으로 구현 불가한 부분은 네이티브 형식으로 개발해서 만들어진다. 모바일웹과 네이티브앱 사이 그 어딘가에서 양쪽의 단점을 보완하며 포지셔닝 되어있는 형식이다.
ex) 지메일, 크롬, 쿠팡, 우버 등
장점
1. 상시 업데이트가 가능하여 유지보수가 용이하다.
2. 브라우저 API와 OS 기능을 모두 사용할 수 있다.
4. 네이티브앱보다 용량이 가볍다.
5. 순수 네이티브앱에 비해 리소스가 적게 든다.
기능의 일부를 웹으로 구현할 수 있기 때문에 순수하게 네이티브로만 구현한 앱보다 리소스가 적게 들 수 있다.
단점
1. 네이티브앱보다 동적 인터렉션이나 고사양 그래픽 최적화가 어렵다.
2. 네트워크 연결 상태나 웹사이트의 용량에 따라 사용자마다 속도가 다르다.
같은 앱을 이용하는 사용자라 해도 네트워크 상태에 따라 경험의 차이가 많이 날 수 있다.
회사에서 지원 가능한 인력,비용,기간 또는 서비스 방향에 따라 각자에게 최적인 방식은 모두 다를 것이다. 이 중에서 어떤 특정한 방식을 추천하기 위해서가 아니라, 고려할 수 있는 다양한 방법을 가볍게 소개하고자 작성한 글이니 기획과 소통에 있어서 참고가 되었으면 한다.
다음 글 주제
문서 정리 시 필요한 용어들. 화면설계서/UID/IA/기능정의서...
