오늘 작성할 글의 주제는 안드로이드 스튜디오의 똑똑한 기능 중 하나인, weight에 대해서 써보려고 한다.
weight가 유용하게 쓰일 대표적인 모바일 화면에는 갤러리(사진)뷰나 하단에 4~5개의 탭바 등에 해당되는데, 대표적인 앱으로는 플립보드나 인스타그램이 있다.
플립보드에서 weight가 적용될 수 있는 부분은 갤러리뷰와 상단 탭이다.
이런 화면을 디자인했을 때, 개발자에게 어떻게 가이드를 해줘야 모든 폰에 아름답게 보일 수 있을까?
대부분의 디자이너는 개발 환경을 잘 모르기 때문에 가로값을 전달할 것이다.
PSD상에서 180px니까, 가로는 90dp입니다.
대부분은 이렇게 전달할 것이다.
특정 수치를 전달하면 왼쪽처럼 디자인과 같은 사이즈의 모바일에서는 완벽한 뷰를 볼 수 있지만, 그것보다 큰 화면을 보거나 화면전환을 했을 때에는 오른쪽과 같은 비주얼이 나오게 될 것이다. (두둥;)
이미지 또한 마찬가지이다.
PSD상에서 180px니까, 가로는 90dp입니다. 라고 가이드를 전달했을 경우...
위처럼 포토샵에서 작업한 사이즈와 동일한 크기의 폰에서는 문제없이 보여집니다. 하지만, 이와 다른 화면일 경우에는 여백의 똥이 나타난다.
이런 경우에 해결할 수 있는 방법 중 하나가 weight이다.
각 가로값을 weight로 처리해주세요.
이 한 문장으로 우리는 모오오오든 디바이스에서 우리가 의도한 디자인을 확인할 수 있다.
위의 두 화면 모두 가로값을 수치로 적용하지 않고 weight로 처리하였다.
그 결과, 720기준으로 작업한 포토샵 화면임에도 불구하고 1240의 디바이스에서 원하는 화면을 볼 수 있었다.
물론 개발자에게 디바이스에 맞게 동일한 비율로 화면에 채워달라고 해도 무관하다.
그래도. 살짝 아는 척(?)하면 개발 환경도 좀 아는 디자이너구나~라고 생각할 수 있고,
장황하게 설명하는 것보다 weight 한 마디로 설명하는 것이 개발자도 더 빠르게 이해할 수 있으므로,
이 정도는 알아두면 디자인 업무에 도움이 될 거라고 생각한다.!
FIN.