[iOS Toy Project] 기준 해상도 정하기

Andorid 앱 개발을 맡은 친구와 UI 를 똑같이 맞추기 위해 기준 해상도를 정하고 Pigma 로 UI 를 그려보기로 했다.

 

평소 혼자만 개발했어서 Oven 으로만 그렸었는데, Oven 은 dp 가 안나와서 UI를 맞출 수가 없었기 때문... + Zeplin 은 포토샵 같은 유료 UI 툴이 있어야 해서 Pigma 를 사용함! (1개 Project 는 무료인듯)

 

Android 기본 해상도 360x800

iOS 기본 해상도 375x812

 

=> 많이 사용하는 해상도를 기준으로 작업하고 나머지 해상도는 유동적으로 대응 가능하게 하는 것을 목표로 함!

---

[Figma 로 모바일 UI 그리기]

 

1. Figma 회원가입 및 새 프로젝트 생성

처음 회원가입하면 Team 왼쪽에 Team 이 생성된다.

여기서 Project를 추가하거나 기존에 만들어진 Project에서 내부 박스를 클릭하면 된다.

 

2. F 키를 눌러서 마우스 커서 + 모양으로 바뀐것을 확인한 후 오른쪽에서 Design Frame 을 선택하기

 

3. iOS 기본 해상도 375x812, Android는 360x800 으로 선택.

비슷해보이는데 Android 가 조금 더 세로가 짧다.

 

4. Text, 도형 등을 배치하기

객체를 클릭하면 객체의 크기, 정보를 볼 수 있다.

객체 클릭 후 Alt 키를 누른 상태에서 다른 객체에 커서를 올리면 간격을 확인할 수 있다.

 

5. 팀원과 공유하기

상단 공유하기 버튼으로 팀원과 공유하면 끗.

---

아래 사이트를 참고하여 작성하였습니다.

안드로이드 iOS 모바일 해상도 기준

모바일 환경 이해하기

2023 앱 디자인 사이즈의 기준은? 안드로이드와 ios 그리고 노치디자인