6/10 웹과 앱 환경에 대한 이해

 웹 

- 브라우저 사용

- URL 주소 보유

- HTML/CSS 코드 사용

- JSP,PHP 등 개발 언어 사용 (서버, 네트워크)

 

 앱 

- 기기에 설치하여 이용

- 인터렉션 구현 가능(하드웨어의 기능 활용)

- OS에 따른 개발 도구, 언어의 차이 (안드로이드 - JAVA, 코틀린 / iOS - Objective-C, Swift)

 

 웹과 앱 차이 

	장점	단점
웹	- 여러 브라우저를 동시에 사용 가능 - OS로 인한 환경 격차 적음 - 설치가 불필요 - 업데이트나, 수정 변경이 용이하다 - 검색, 노출이 용이하다	- 조작 인터렉션이 부족하다 - 하드웨어의 기능을 사용할 수 없다
앱	- 실행 속도가 빠르다 - 다양한 기능을 구현할 수 있다 - 하드웨어의 기능 사용으로 사용자 경혐을 극대화할 수 있다 - 사용자 맞춤형 정보, 개인화 서비스를 제공할 수 있다 - 다양한 제스처에 대응할 수 있다	- OS별 플랫폼 개발에 따른 시간과 비용이 소요된다 - 업데이트나 수정이 용이하지 않다

 

- 기업이 하는 모든 것과 기업의 이미지를 위해서는 웹을 만드는 것이 좋다. 

- 사람들이 기능을 빨리, 잘 사용할 수 있게끔(잔액 보기/송금하기) 하기 위해서는 앱을 만드는 것이 좋다. 

 

적응형 웹 : 서버나 클라이언트에서 웹에 접근한 기기를 체크해 그 기기에 맞는 템플릿을 제공하는 개념

반응형 웹 : 하나의 템플릿을 제공하며, 디바이스나 해상도에 따라 레이아웃이 달라지는 방식

* 보안이 중요한 경우, 적응형 웹으로 설계한다. 

* 반응형 웹은 브라우저에 대한 경험이나 이해도가 필요하기 때문에 더 고연차의 인력이 투입된다. 

 

모바일 앱의 종류

네이티브 앱 

OS 환경에 맞춰 개발된 앱

- 운영체제에서 제공하는 개발 언어로 개발

-스마트폰 기능의 활용(GPS, 카메라, 센서, Push)

 

ex) 지도앱, 지하철앱 등, 계산기, 노트

 

하이브리드 앱 

모바일 웹과 네이티브 앱의 장점을 합친 앱

(html 코드로 작동. 껍데기만 웹이고 다운로드 받을 수 있음.)

- 처음에 웹으로 만들다가 앱으로 추가적인 기능을 제공하고 싶을 때 

- 외부 데이터를 수시로 끌고 와서 봐야할 때

- 적은 개발비용

- 설치 과정 필요

- 업데이트 수정 보완이 용이(업데이트시 자동 반영됨)

 

ex) 지도앱, 지하철앱 등, 계산기, 노트

 

프로그레시브웹앱

 

앱처럼 동작할 수 있는 웹사이트

- 앱 아이콘도 제공, 브라우저 창 없이 앱처럼 기능

- 브라우저에서 사용 가능

- 설치 과정 불필요

- 인터넷 연결 없이도 사용 가능

 

앱디자인작업시 필수 요소

앱 아이콘, Splashs(처음에 앱 켜면 보이는 화면), 하단(Tab bar)

 

센서의 활용

자이로스코프 센서 - 방치의 신, 만보기, 멤버십(흔들기), 디지털 수평계, 스포츠게임, 레이싱 게임(터치 가중치)

지자기 센서 - 나침반, 네비게이션, 길 방향 안내) 

 

타깃 디바이스 선택시 고려사항

√ 타깃 유저의 모바일 OS 점유율 확인

√ 타깃 유저의 디바이스 해상도 점유율 확인

√ 다양한 디바이스 크기에 대응할 수 있는 사이즈