피그마활용(2) 2주차 숙제

👳‍♂️ OS와 플랫폼에 따라 UI에 차이가 있는 부분을 찾고 이유를 생각해 보세요.

1.  OS 별로 차이가 있는 부분을 찾아보고, 왜인지 나름의 이유를 적어 보세요.
2.  웹과 앱에 차이가 있는 부분을 찾아보고, 왜인지 나름의 이유를 적어 보세요.

2. 웹과 앱에 차이가 있는 부분을 찾아보고, 왜인지 나름의 이유를 적어 보세요.

출처 : https://brunch.co.kr/@wpgjs0717/11

✅ 이마트 모바일웹 vs 앱

◾ 웹 : 웹은 홈화면에 들어왔을 때 앱다운받기를 유도하는 팝업이 뜬다. 

◾ 앱 : 홈화면에 큰 토스트팝업이 뜨고 캐러샐이 자동으로 적용된다. 

 

◾ 웹 : 장바구니에 상품을 담으면 '장바구니에 상품을 담았습니다.'라는 팝업이 뜬다.

◾ 앱 : '장바구니에 상품을 담았습니다'라는 팝업과 함께 '남은 금액 22,300원 더 담으로가기' 토스트팝업이 같이 뜨면서 추가 구매를 유도한다. 

→  웹은 스마트폰 기능이 제한 적이기 때문에 알림 방식에 차이가 있다. 

 

✅ 네이버 모바일웹 vs 앱

◾ 웹 : 스크롤을 내리면 상단에 메뉴가 뜬다.

◾ 앱 : 하단에 메뉴가 고정되어 있다. 

 

◾ 웹 : Na 메뉴를 클릭하면 상단에 '더 안전하게 Na를 사용해보세요! Naver 앱에서 열기'를 통해 앱사용을 유도한다. 애니메이션효과는 없고 아이콘으로 학생동문증, 출입증, 전자증명서, 자격증이 뜬다,

- 출입증, QR결제 를 클릭하면 웹에서는 기능을 사용할 수 없는지 다운받은 앱으로 연결된다. 

- 송금하기를 누르면 '송금은 앱에서 안전하게 이용해 주세요'라고 알림이 뜨고 누르면 '네이버페이' 앱으로 연결된다. 

◾ 앱 : 웹과 달리 실물과 유사한 카드형태로 디자인 되있으며 누르면 팝업으로 뜬다. 웹에서는 송금, QR결제, 출입증 등 기능을 모두 사용할 수 있다. 

→  모바일웹에는 디바이스 접근 권한이 없고, 앱은 디바이스 전체에 접근 권한을 가질 수 있다. 그래서 웹에서 카메라 접근이 필요한 QR결제를 누르면 앱으로 연결이 된다.