유틸리티 소개

워치 앱 개발할 때 작은 화면 크기 디자인 원칙

스마트워치 화면은 40-45mm 정도다. 손목 위의 작은 화면에서 정보를 효과적으로 전달해야 한다.

Apple Watch 해상도

40mm는 324x394, 45mm는 396x484. 픽셀 수가 적어서 글씨 크기가 중요하다. 최소 17pt 이상 권장.

정보 우선순위

가장 중요한 정보만 보여줘야 한다. 스크롤은 최소화. 글랜스 한 번에 핵심을 전달하자. 화면 크기 확인기로 작은 화면을 시뮬레이션해보자.

터치 영역

손가락으로 누르는 거라 버튼은 최소 38x38pt 이상. 확인기로 다양한 크기를 확인하면서 디자인하자.

개발 워크플로우에 통합

화면 크기 확인을 개발 워크플로우의 일부로 만들자. 코드를 수정할 때마다 화면 크기 확인기로 다양한 크기에서 확인하는 습관이 중요하다. 자동화 테스트에 반응형 테스트를 포함시키는 것도 좋은 방법이다.

디자이너와의 협업

디자이너가 만든 시안이 어떤 화면 크기 기준인지 확인하자. 그리고 개발할 때 그 크기에서 먼저 구현하고, 다른 크기로 확장하면 효율적이다. Figma 프레임 크기와 실제 브라우저 크기를 확인기로 비교해보자.

QA 체크리스트

배포 전 주요 화면 크기에서의 동작을 확인하는 체크리스트를 만들어두자. 모바일(375px), 태블릿(768px), 데스크톱(1200px) 최소 세 가지는 확인하는 게 좋다. 확인기와 함께 체계적으로 테스트하자.

화면 크기 확인기를 자주 활용하면서 다양한 화면 환경에 대응하는 습관을 들이자.