반응형 사이트, 왜 필요할까요?
반응형 사이트가 필요한 경우와 아닌 경우를 알아봅니다
본 글은 닐슨 노먼 그룹의 <Repurposing vs. Optimized Design>를 바탕으로 구성했습니다.
요약
온라인, 데스크톱, 모바일 등 서로 다른 형태의 미디어에서 콘텐츠와 디자인을 재사용하는 것은 비용을 아낄 수 있지만 사용성은 저하됩니다. 뛰어난 UX를 사용하려면 긴밀한 플랫폼 통합이 필요합니다.
사용자 경험 전략에 대한 두 가지 의견
용도 변경
가능한 한 적은 설계(가능하면 1개만)를 작성하여 가능한 한 많은 플랫폼에서 동일한 재료를 재사용하는 것
관련 설명
용도 변경은 비용 면에서 큰 이점이 있습니다. 일을 한 번만 하면 된다는 장점이 있지만, 대부분의 플랫폼에서는 표준 이하의 사용자 경험을 얻을 수 있습니다. 이는 특히 설계가 처음에 하나의 플랫폼에 최적화되었다가 나중에 최소한의 변경으로 다른 플랫폼에 이식된 경우에 해당됩니다.
플랫폼 최적화
메인 플랫폼별로 다른 사용자 인터페이스를 설계하여 사용자 경험 계층을 최대한 긴밀하게 통합하는 것
관련 설명
플랫폼 최적화에서 좋은 예시로는 애플을 꼽을 수 있습니다. 아이폰이 나온 후, 많은 경쟁사들이 터치스크린 하드웨어 제품을 출시했지만, 다른 플랫폼에 최적화된 시스템에서 이식된 제대로 통합되지 않은 소프트웨어를 제공했습니다. 단순히 큰 터치스크린을 전화로 제공하는 것만으로는 사용자에게 충분하지 않았습니다. 소프트웨어 사용자 인터페이스도 이 플랫폼의 특성에 맞게 최적화되어 있어야 합니다.
플랫폼에 최적화된 사용자 인터페이스의 이점
조작성이 향상됩니다.
사용자는 목표를 달성할 가능성이 높아집니다.
전환율이 증가합니다.
더 많은 이익을 낼 수 있습니다. (투자비용보다 수익이 커짐)
대부분의 경우 비용 편익 분석은 통합 설계를 선호합니다. 예를 들어 데스크톱 웹 사이트를 설계할 때 한 PC용과 또 다른 PC용 버전을 다르게 만들 필요가 없습니다. 현재 두 플랫폼이 매우 유사하기 때문입니다. 모니터 크기에 따른 살짝의 차이밖에 없습니다.
태블릿의 경우 사용 편의성 요건이 충분히 다르며, 이를 위해 별도의 사이트를 설계하는 데 이점이 있는 것으로 나타났습니다.
한편, 당사의 연구에 의하면, 인기 있는 휴대전화에 최적화된 사이트는, 태블릿 화면 전체에 걸치면 꽤 잘 동작하는 것을 알 수 있었습니다. 이곳에서 주목해야 할 점은 태블릿을 위한 별도의 사용자 인터페이스를 설계하고 유지함으로써 얻을 수 있는 작은 추가 이익은 추가 비용을 지불할 가치가 있는가?입니다.
최적화 관련 예시
이에 대한 예시로 대부분의 기업이 장애를 가진 사용자를 위한 별도의 사용자 인터페이스를 개발하지 않는 것을 볼 수 있습니다. 시각장애인 사용자를 완벽하게 지원하려면 청각 매체에서 선형적으로 표현하도록 최적화된 설계가 필요합니다. 그러나 시각적 매체에서 2D 프레젠테이션에 최적화된 디자인을 소리 내어 읽는 것만으로는 접근성이 부족하여 뛰어난 사용성을 얻을 수 없습니다.
모든 장애 사용자에게 완벽한 서비스를 제공하려면 다양한 장애에 최적화된 것보다 광범위한 사용자 인터페이스가 필요합니다. 각 장애 등급마다 사용자 수가 상당히 적기 때문에 비용적인 측면에서 고민할 수밖에 없습니다.
인쇄 업체가 본인들 방식을 고집하면 안 되는 이유
인쇄 콘텐츠를 온라인용으로 변경할 때 대부분의 신문사와 잡지사는 기존 방법을 고수했습니다. 그 결과, 웹용 작성 가이드라인을 사용하여 콘텐츠를 작성하는 사이트보다 노출 결과가 안 좋았습니다.
신문의 인쇄된 내용을 버리고 처음부터 온라인 콘텐츠를 만들면 웹사이트가 개선될 것입니다. 그러나 기존 기사의 용도 변경에 드는 비용은 상당하기 때문에 비용 대비 편익은 부정적이라고 할 수 있습니다.
반응성이 뛰어난 설계 : 높은 모바일 조작성
휴대전화와 데스크톱 컴퓨터를 고려할 때, 플랫폼 차이는 두 개의 개별 디자인을 만드는 것의 이점이 상당할 정도로 충분히 큽니다. 또, 어느 플랫폼에도 유저가 많기 때문에, 전환율을 높이면 이익도 상당할 수 있습니다.
그러나 비용적인 측면에서 두 개의 사이트와 단일 사이트를 중 어느 것을 고수하는 것이 더 수익적일 것인지에 대한 의문은 여전히 남아 있습니다.
먼저 조직의 규모와 모바일 사용자 및 데스크톱 사용자와 거래하는 비즈니스 규모를 고려해야 합니다. 일부 회사들은 너무 작아서 높은 전환율을 적용해도 두 개의 디자인을 운영하는 비용을 감당하기 어려울 수 있습니다.
반응성 설계란?
모바일 설계와 데스크톱 설계의 차이는 레이아웃의 차이만 있다고 착각하면 안 됩니다. 가장 중요한 것은 내용이 달라야 한다는 것입니다.
콘텍스트가 부족하면 텍스트 이해력이 떨어지기 때문에 작은 화면에는 짧고 간단한 쓰기가 필요합니다. 사람들은 태블릿에서 소설을 읽을 수 있지만 주로 이해하기 단순한 소설에 유용합니다. 더 높은 수준의 인지 처리를 필요로 하는 비즈니스 지향 콘텐츠나 기타 논픽션을 읽는 것은 작은 화면에서는 더 어렵습니다.
텍스트 외에 다른 콘텐츠 형식도 미디어에 맞게 설계해야 합니다. 예를 들어, 작은 이미지는 큰 이미지와 다르게 잘라내고 확대/축소하여 눈에 띄는 세부 정보를 강조해야 합니다. 특정 화면 크기에 사용할 수 있는 공간을 채우기 위해 단일 이미지의 크기를 조정하는 것만으로는 충분하지 않습니다.
플랫폼에 맞게 최적화하는 시기
사용성은 전환율(ex. 사이트를 둘러보다가 결제하는 사람들의 비율)에 집중하고 디자인은 이익 극대화에 집중합니다.
반응형 페이지가 필요 없는 경우
플랫폼이 매우 유사할 경우, 작은 적응만으로도 동일한 설계가 잘 작동하도록 할 수 있습니다.
플랫폼에서 비즈니스 가치를 거의 얻을 수 없을 것으로 예상하거나 두 번째 설계를 작성할 여유가 없는 경우.
일부 고객에게 표준 이하의 사용자 경험을 제공하고 있는 경우
반응형 설계를 하면 좋은 경우
플랫폼이 매우 다르고 서로 다른 상호작용 기법, 기능, IA 및 콘텐츠가 필요한 경우
반응성이 뛰어난 설계를 통해 구현하기 어려운 매우 다른 레이아웃이 필요한 경우
예시
해상도별 콘텐츠 차이가 없는 경우
해상도별 콘텐츠 차이를 둔 경우
작성자: 신다혜
사용성을 가장 중시해야 디자이너로서 최선을 다한 것이라고 생각했는데 비용적인 측면에서 그렇지 않을 수 있다는 것을 알았다. 또한 반응형 설계를 할 때 세세하게 디자인해야겠다고 다짐했다.
<관련 글>
