Google Resizer 소개
by 스키머
최근 구글 디자인 팀에서는 Resizer 서비스를 시작했습니다. 간략히 Resizer에 관한 내용을 정리했습니다.
Resizer 란?
Resizer는 데스크탑, 모바일, 태블릿에서 머터리얼 디자인 중단점(breakpoint)에 어떻게 응답하는지 테스트 할수 있는 인터렉티브 뷰어 입니다.
Resizer 중단점
이미 구글의 머터리얼 디자인 가이드에서 중단점에 대한 가이드를 제공하고 있습니다. 최적의 사용자 경험을 위해서 머터리얼 디자인의 사용자 인터페이스는 480, 600, 840, 960, 1280, 1440, 1600dp 의 레이아웃을 적용합니다. Resizer에서도 동일한 원칙으로 데스크탑, 모바일, 태블릿의 각 중단점을 제공합니다.
사용방법
Resizer에서는 사용자가 직접 URL을 입력해서 사용할 수 있으며, URL 입력 필드를 클릭하면 미리 등록된 몇개의 데모 사이트를 확인 할 수 있습니다. 웹사이트 접속후 상단 아이콘을 클릭해 데스크탑+모바일 / 데스크탑 / 모바일 화면을 볼수 있고, 사이트 상단에 있는 사이즈 바 에서 원하는 사이즈의 중단점을 클릭하여 변화하는 모습을 테스트 할 수 있습니다.
결론
이미 잘 알려진 반응형 웹 테스트 툴인 다음의 트로이나 Screenfly 등 다양한 에뮬레이터들과의 큰 차이점은 느끼지 못했습니다. 다만 Resizer는 머터리얼 디자인의 가이드라인을 기반으로 반응형 UI 의 표준 가이드를 제시하고 테스트 할수 있는 툴이라고 보여집니다.
참고
구글 디자인 Resizer Introducting Resizer
