상세 컨텐츠

본문 제목

[노주환의 유저인터페이스] Liquid Design

프로그래밍

by 라제폰 2008. 12. 30. 13:01

본문

검색포털에서 API를 공개했다는 소식을 접하면서, 실로 새로운 패러다임의 웹이 등장할 것 같다는 생각이 들었다. 그런데 현 수준에서 무언가 정리하지 않은 채 새로운 변화를 시도한다면, 우리의 웹 환경은 오히려 퇴보할 것 같은 불길한 예감이 든다.

지금 시점에서 가장 먼저 해야 할 일은 서비스 품질과 사용 품질을 일정 수준까지 향상시키는 일이다. 그런 다음 Web 2.0을 준비해도 늦지 않다고 본다. 이런 의미에서 해묵은 논쟁쯤으로 간주될 수 있는 해상도와 레이아웃의 관계를 짚어보고자 한다.

2년 전 게재했던 컬럼(해상도와 적당한 너비)에서 해상도가 높아졌지만 사용자의 보는 능력은 변하지 않았으므로 기능 영역(예, 네비게이션)이 과도하게 넓어지면 곤란하다고 언급한 바 있다. 그러나 본문에 해당하는 스토리 영역은 좀 다르다.

해상도에 관계없이 동일한 레이아웃을 제공하여 일관성 있는 디자인을 추구하는 것은 의미 있는 전략이다. 그러나 잃는 것도 적지 않다. 우선 다른 브라우저나 어플리케이션, 특히 물리적 크기가 다른 장치에선 적용 자체가 불가능하다. 또한 텍스트 크기를 키울 경우 화면에 담을 수 있는 정보가 줄어들게 된다.



서체 크기를 키우면 고정된 디자인에선 스크롤하지 않고 볼 수 있는 정보가 줄어들게 된다(www.joins.com)



유연한 디자인(Liquid Design)이라 함은 화면이 사용자 환경과 사용 상황에 따라 물 흐르듯이 적절한 디자인으로 보여지는 것을 의미한다. 물론 적절한 디자인이 최적화된 디자인을 의미하는 것은 아니다. 머지 않은 미래에 다양한 해상도를 만족시킬 수 있는 디자인 기법과 이를 기능화시킨 웹 에디터가 등장한다면 유연한 디자인 넘어 최적화된 디자인(Optimized Design)에 초점을 두어야 할 것이다.

Liquid Design은 사용자에게 비슷한 경험을 제공하기 위한 목적도 있다. 낮은 해상도를 고려한 디자인은 높은 해상도에선 너무 많은 여백으로 인하여 전혀 다른 Look & Feel을 제공하게 된다. 주어진 시간 내에 보다 많은 정보를 처리해야 하는 사용자에겐 화면 전체를 이용한 Liquid Design이 필요하다. 그리고 이런 이유로 더 높은 해상도의 모니터와 노트북을 구입하기도 한다.

고정된 레이아웃을 추구하는 디자이너는 가독성에 우려 때문에 Liquid Design을 기피하는 경향이 있다. 행의 길이가 길어지면, 행을 따라가는 것과 다음 행을 찾는 것이 어려워지기 때문에 가독성이 낮아질 수 있다. 그런데 이러한 문제는 전체 화면에 대한 스토리 영역의 크기를 적절히 조절함으로써 충분히 해결할 수 있다. 그리고 낮은 해상도에 최적화된 디자인이 높은 해상도에선 듬성듬성 원하지 않은 여백이 현상은 디자이너의 고민으로 충분히 해결할 수 있다고 본다.

여하튼 예전처럼 단순히 예측할 수 없는 디자인은 보여주지 않기 위해 고정된 디자인을 고집하는 것은 너무 보수적이라고 생각한다. 이제는 모든 사용자에게 동일한 디자인을 보여주는 것이 적절한 선택인가에 대한 고민이 필요할 시기이다. 더 효율적인 정보 처리를 위해 더 투자한 사용자에게 일종의 프리미엄을 제공하는 것은 어떨까라는 생각도 해 본다.

이것은 낮은 사양 환경의 사용자에게 차별을 주자는 의도는 결코 아니다. 다만 가용한 화면을 충분히 활용하게 되면 스크롤이 줄고, 불필요한 여백으로 인해 읽기와 보기의 집중력이 떨어지는 것을 보완할 수 있을 것이다. 스크롤이 줄어든다는 것만으로도 장점은 충분해 보인다.

덧붙여 검색포털의 초기 화면처럼 기능성 페이지(화면 요소가 대부분 네비게이션이나 버튼으로 조합된 화면)인 경우에는 Liquid Design을 신중하게 적용하되, 읽기 중심의 스토리 페이지는 전체 화면을 충분히 활용하는 방안을 강구할 것을 권하고 싶다.

※ 구글에서 Liquid Design을 입력해보면 보다 자세한 내용을 얻을 수 있음

관련글 더보기