🗒15w_스스로 찾아서 하는 공부 / iOS 와 Android 기본 앱 디자인의 차이

-

궁금함을 해결하고자 행동하다

강의를 들으면서 어느 정도 앱을 디자인하는 흐름을 알게 되었다.

그런데 과연 이게 실무에서는 어떻게 사용이 될까? 에 대한 궁금함이 생겼다.

그래서 사이드 프로젝트를 해보고자 하는 마음이 생겼다.

나는 개발자와의 협업도 처음이고, 다른 현직에서 일하고 있는 UIUX 디자이너와도 처음이라서 과연 잘 할 수 있을까?

하는 두려움이 컸다.

 

-

사이드프로젝트에 들어가다

막상 프로젝트 팀에 들어갈 때는 감사하게도 서브역할로 들어갈 수 있었다.

그런데 메인 UIUX 디자이너가 연락두절이 되어.. 이러저러 쿵짝뽀짝한 일들을 지나..

답답한 마음에 급한대로 대표가 기획한 내용을 토대로 와이어프레임을 내가 잡아보겠다고 했다. 

 

우당탕탕타앙

 

-

와이어프레임을 만들다

와이어프레임을 만들고 톡방에 올린 후, 이후에 첫 회의를 들어갔는데 IOS 버전과 안드로이드 버전을 따로 만드는 것에 대한 이야기였다.

그리고 웹도 함께 만들려고 하는데, 기획이 아직 덜 되었다는 이야기였다.

그런 저런 이야기를 들으면서 둘 다 혼용해 사용할 수 있는 버전인 하이브리드가 아니고서야

IOS 버전과 안드로이드 버전 두가지를 디자인해야한다는 사실을 처음 알게 된 날이었다.

 

그럼...! 도대체 차이점이 뭔데!!!!

하고 찾아본 그 둘의 차이점_

 

-

iOS 와 Android

Apple 및 Google의 지침은 가능한 경우 플랫폼 제어 탐색 도구(페이지 컨트롤, 탭 bar, 세그먼트 컨트롤, 테이블 뷰, 컬렉션 뷰 및 분할 뷰)를 사용하는 것이 좋다. 사용자는 이러한 컨트롤이 일반적으로 각 플랫폼에서 작동하는 방식에 익숙하므로 표준 컨트롤을 사용하면 앱을 둘러 보는 방법을 직관적으로 알 수 있다. iOS와 Android에서 앱이 다르게 보이는 이유와 그 이유를 명확히 하기 위해 iOS와 Android의 상호 작용 디자인 패턴 간의 주요 차이점에 초점을 맞춘다. 또한 기본 앱 디자인 템플릿과 기본 모바일 애플리케이션 예제를 제공하여 우리가 말하는 것을 시각화 할 수 있다.

 

 

왼쪽에서 오른쪽으로 스와이프 동작

iOS -  돌아 가기(이전 화면으로)

Android - 탭 간 전환(이전 화면은 아래 탐색 표시 줄에 따로 있음)

 

 

iOS

iOS 사용자는 부드러운 전환, 장치 방향의 유동적 인 변화, 물리 기반 스크롤과 같은 iOS 전체에서 사용되는 미묘한 애니메이션에 익숙하다. iOS 사용자는 움직임이 의미가 없거나 물리 법칙을 무시하는 것처럼 보일 때 혼란 스러울 수 있다. 예를 들어 사용자가 화면 상단에서 아래로 밀어서보기를 표시하면 다시 위로 밀어서 보기를 닫을 수 있다. 게임과 같은 몰입 형 환경을 만들지 않는 한 사용자 지정 전환을 기본 제공 애니메이션과 비슷하게 만드는 것이 HIG의 권장 사항이다.

 

Android

머티리얼 디자인 가이드 라인에 따르면 전환 중에 변환 된 인터페이스 요소는 발신, 수신 또는 영구로 분류된다. 항목이 속하는 범주는 변환 방법에 영향을 준다. 애니메이션은 사용자의 주의를 집중시킵니다. UI가 모양을 변경하면 모션은 전환 전후 요소의 배치와 모양 사이에 연속성을 제공한다.

탐색 전환은 인터페이스와의 전반적인 상호 작용에서 중요한 요소다. 앱의 계층 구조를 표현하여 사용자가 자신을 향하도록 도와준다. 예를 들어, 전체 화면을 채우도록 요소가 확장되면 확장 동작은 새 화면이 하위 요소임을 나타낸다. 확장되는 화면은 부모 요소다.

등등등의 내용들

 

-

그렇다면 질문이 있어요!

Q. 실제 앱 디자인을 할 때, 하이브리드가 아닌 경우 대부분이 ios 와 안드로이드를 따로 만들어야하는 걸까요?그렇다면 ios 와 안드로이드의 차이는 구체적으로 어떻게 다른지, 작업을 일일이 모든 화면을 다 해야하는지 궁금한데 알 수 있는 책이나 정보가 쓰여진 사이트가 혹시 있을까요?

A. 아 회사마다 다르지만 보통은 1개 디바이스로 통일해서 작업해요. 서비스 마다 많이 사용하는 디바이스를 알 수 있어서 그 디바이스 크기로 제작하는데 보통 IOS 아이폰14크기 (390) 로 많이 작업합니다.

 

Q. 그리고 추가로 앱 디자인을 하는 UIUX가 웹도 함께 디자인할 수 있으면 더 할 수 있는 일의 범위가 넓어질까요?

A. Web은 UI 대응을 다시 잡아야하기 때문에 리소스는 더 추가됩니다 (반응형으로 아이패드 크기도 작업 필요)

 

Q. 사이즈 뿐만 아니라 움직이는 디테일한 기능들까지는 UIUX디자이너의 역할이 아니라 개발쪽 역할인 것일까요?

A. 움직이는 디테일한 가이드는 플랫폼팀(디자인시스템 만드는 팀) 에서 가이드를 만들고 개발자분들께서 가이드대로 개발해주십니다.

 

Q. 기획과 개발쪽은 따로 역할이 있어서 UIUX디자인 포트폴리오에 어떻게 넣어야할지 조금 어려워서 질문드립니다. 간단한 앱 소개와 디자인부분만 따로 넣으면 되는 것일까요?

A. 사이드 프로젝트의 디자인 100% 담당으로 넣으시면 될 것 같아요! 디자인쪽에서도 화면기획 관련해서는 UX롤이기 때문에 그부분을 살려서 넣으면 될 것 같습니다~ (와이어프레임, flow )

 

감사합니다.