오늘의 UXUI 아티클 스터디: 모바일웹 / 웹앱 /하이브리드앱 / 네이티브앱

1. 아티클 이름

모바일웹 / 웹앱 /하이브리드앱 / 네이티브앱

침착한 주먹밥 / 2022.01.04.

모바일웹 / 웹앱 / 하이브리드앱 / 네이티브앱  

2. 아티클 정보 요약

4가지 대표 개발 방식

모바일앱(Mobile Web): 모바일 화면에 맞게 구성한 웹
웹 앱(Web App): 모바일 웹과 비슷하지만 구동방식이 앱처럼 보이게 한 앱
하이브리드 앱 (Hybrid App): 웹 앱과 네이티브 앱의 기능을 결합하여 개발된 앱
네이티브 앱 (Native App): 모바일 기기에 최적화된 네이티브 언어로 개발된 앱
 

개발방식의 표 별 비교

	모바일앱 Mobile Web	웹 앱 Web App	하이브리드 앱 Hybrid App	네이티브 앱 Native App
정의	모바일 화면에 맞게 구성된 앱	모바일 웹과 비슷하나 구동방식이 앱처럼 보이게 한 앱	웹 앱과 네이티브 앱의 기능을 결합하여 개발된 앱 하나의 코드 베이스로 ios, 안드로이드에서 둘다 작동	모바일 기기에 최적화된 네이티브 언어(개발 언어)
특징	개발: 웹 개발 방식과 동일 실행: 웹 브라우저 (풀 브라우저 방식) - PC 웹페이지를 모바일에 맞게 줄인 모습	개발: 웹 개발 방식과 동일 실행: 웹 브라우저 (단일페이지 방식) - 겉 모습과 구동방식이 마치 네이티브 같은 웹페이지 (모바일 웹보다 모바일 최적화)	개발: 모바일 웹앱을 모바일 운영체제로 패키징 (외부는 네이티브 모습/내부는 모바일 웹앱) 실행: 플레이스토어, 앱스토어에서 다운 설치(PC접속 불가) 웹브라우저로 접속한 것과 차이 없음 그러나 QR코드리더, 음성 인식 등 지원	개발: 해당 운영체제에 최적화되어 있는 개발 실행: 구글 플레이스토어, 앱스토어에서 다운 안드로이드 SDK: kotlin / JAVA ios SDK: swift / Objective-C
장점	운영체제 별로 개발할 필요 없음 ➡︎ 비용.시간 절감 / 심사과정 X	운영체제 별로 개발할 필요 없음 ➡︎ 비용.시간 절감 / 심사과정 X	네이티브 API와 브라우저 API를 이용해 다양한 개발 가능 개발 비용.시간 절감(네이티브 앱 보다) 유지.보수 쉬움(네이티브 앱 보다) 모바일 웹 보다 속도 빠름 디바이스 고유 정보 접근 가능	높은 퍼포먼스 더 많은 디바이스 접근 빠른 속도.안정성
단점	- 디바이스 접근 권한 제한 - 웹 브라우저에서 검색.URL로 접근 (불편함)	- 디바이스 접근 권한 제한 - 웹 브라우저에서 검색.URL로 접근 (불편함)	제한적 기능. 느린 속도(네이티브 앱보다) 네이티브 앱 개발 지식 필요 심사과정 O 브라우저 성능에 따라 앱 성능 영향 받음	각 운영체제마다 개발 및 유지 보수 필요 ➡︎ 각 운영체제별 개발인력 필요 심사과정 O 업데이트 할 때마다 플레이스토어.앱스토어를 통해 해야 함

3. 인사이트

기존 인사이트

• 네이티브 앱 또한 웹앱과 같이 해상도가 한정되어 있어 앱 개발 시 늘리거나 줄이지 않고 해상도를 유지하며 디자인하는 방향으로 해야 함 ➡︎ 큰 해상도를 사용하여 작은 해상도를 커버할 것

서치 및 발표 피드백 후 인사이트

• 네이티브 앱은 해상도 변경이 가능한가에 대한 의문은 아직 해소되지 않았으나, 튜터님 말씀 중 "작은 것에서 큰 것으로 늘리는 것은 쉽다"라고 하신 것으로 보아 작은 해상도에서 큰 해상도로의 변경은 가능할 것으로 예상