Ro-Lu 살펴보기: 사용성 사례 연구

Ro-Lu는 가구, 조경 및 환경 디자인 스튜디오로 예술 및 기타 디자인 관련 프로젝트도 진행합니다. 스튜디오는 개방적이고 탐구적인 연습을 하는 것으로 확인하고 다른 많은 분야로 모험을 떠났습니다. 사이트가 구상되었을 때 디자인의 의도는 스타일과 이데올로기를 반영하는 것이었다고 가정합니다.

다음은 Toptal 디자이너 Darko Stanimirovic과 Kent Mundle이 Ro-Lu의 사이트를 탐색하고 해당 사이트의 미학, 사용성 및 전반적인 사용자 경험에 대해 논의하는 대화입니다. (편집자 주: 토론 이후 사이트 디자인이 변경되었습니다.)

이 프로젝트는 사용자 경험을 포함하여 디자인 스튜디오의 웹 기반 포트폴리오가 무엇인지에 대한 많은 가정에 도전합니다. 사이트 방문자 중 일부는 실험적인 모양과 느낌이 사용성을 손상시킨다고 생각할 수 있습니다.

주요 질문 중 일부는 다음과 같습니다. UX를 희생하면서 시각적 미학이 중심 무대를 차지하는 것이 허용됩니까? 이 사이트는 현상 유지에 도전하는 것에 대해 다른 디자이너들에게 무엇을 말합니까? 너무 멀리 밀어 버렸습니까?

Kent: Darko, 이전에 이와 같은 인터페이스를 본 적이 있습니까?

다르코: 이 그룹의 히스토리나 사이트 뒤의 디자이너의 히스토리에 대해 제대로 알지 못한 채 페이지에 들어왔기 때문에 신선한 눈으로 볼 수 있었습니다. 시각적으로 흥미롭다는 것을 알았습니다. 색상과 레이아웃은 훌륭했지만 사이트가 무엇인지, 사이트와 상호 작용하는 방법에 대해 알려주는 정보가 없었습니다. 나의 첫 번째 성향은 아티스트가 누구인지 배우기보다 사이트가 어떻게 작동하고 어떻게 참여하는지 이해하는 것이었습니다.

사이트를 방문하는 대부분의 UX 디자이너는 열악한 탐색과 일관된 구조의 부족으로 인해 사이트를 승인하지 않을 것이라고 생각합니다. 당신이 어디에 있는지 또는 탐색에 사용할 수 있는 옵션이 무엇인지 불분명합니다. 그러나 동시에 독특한 방식으로 스튜디오와 소통한다고 생각합니다. 확실히 기억에 남습니다.

특정 프로젝트나 최신 전시회를 찾기 위해 특별한 의도로 현장을 찾았다고 해도 길을 찾기가 어려웠을 것입니다. 스튜디오의 디자이너와 사이트 디자이너는 사이트 방문자의 요구에 무관심하고 사용자 경험이 얼마나 당황스럽더라도 독특한 경험을 제공하는 데 더 관심이 있어 보입니다.

흥미로운 포트폴리오 디자인은 단순한 작업 목록이 아닌 일종의 전시로 생각됩니다.

Kent: 일부 디자이너의 온라인 포트폴리오에 내재된 품질이 디자인을 표준에서 벗어나게 하는 것입니까?

Darko: 디자인 스튜디오의 웹 포트폴리오는 일반적으로 개발자가 아닌 디자이너가 수행합니다. 종종 그들은 사이트를 개발하는 방법을 모르지만 프로젝트에 대해 다른 방식으로 자유롭게 생각할 수 있습니다. Ro-Lu 사이트와 마찬가지로 가장 흥미로운 온라인 포트폴리오는 단순한 작업 목록이 아닌 가상 갤러리에서 일종의 온라인 전시회로 간주됩니다.

일반적으로 디자이너는 "사이트의 목표는 무엇입니까? 방문자에게 어떤 인상을 남기고 싶습니까? 어디에서 이메일을 수집합니까? 등." 이 경우 스튜디오의 작업을 개념적으로 보여주는 전시회에 초대받은 듯한 느낌이 듭니다. 사이트 디자이너는 디지털 스크린을 마치 갤러리의 방과 벽, 광택있는 잡지의 한 페이지처럼 취급하고 방문자의 요구에 대한 배려가 별로 없다.

Kent: 디자이너가 사이트의 의도된 디자인을 손상시키지 않고 탐색을 개선할 수 있는 방법은 무엇입니까?

Darko: 디자이너가 이 사이트를 보다 효과적으로 만들 수 있는 방법이 있을 수 있지만 디자이너가 탐색을 보다 명확하게 만드는 데 얼마나 관심이 있었는지 모르겠습니다. 웹 디자인을 하는 전통적인 그래픽 디자이너는 방문자가 사이트를 효과적으로 탐색하는 방법을 알아내는 것에 대해 캐주얼한 태도를 보이는 경우가 많습니다. 마치 게임을 하고 재미의 "발견" 부분을 수행하는 것처럼 말입니다. 제 생각에는 이것은 역효과입니다.

내가 이 사이트를 재설계한다면 방문자에게 이것이 눈에 보이는 것보다 더 많은 것을 보여주는 작업을 보여주는 캔버스라는 신호를 보낼 것입니다. 방문자가 사이트에 처음 방문하면 보는 것이 얻는 것처럼 보이고 더 이상 탐색할 것이 없습니다. 아무 것도 이동하기 위해 클릭할 수 있는 것을 신호하지 않습니다(사람들에게 단서를 제공하는 기표 부족). 이것은 주요 사용성 실패이며 사이트의 목적에 해롭습니다.

나는 사용자가 움직임을 통해 그림의 평면 보드와 상호 작용하는 것이 의도라는 것을 어떻게든 전달할 것입니다. 아마도 입력 시 전체 페이지가 약간만 빠르게 이동한 다음 제자리에 남아 있을 수 있습니다. 또는 약간의 움직임으로 개별 요소를 식별할 수 있습니다. 그러면 사람들은 UI가 다양한 수단을 통해 탐색될 수 있다는 것을 깨닫게 될 것입니다. 사진이 한쪽으로 약간 이동하고 텍스트가 다른 쪽으로 이동하여 방문자에게 상호작용적임을 알리는 신호를 보낼 수 있습니다.

마찬가지로 캔버스를 확대하는 옵션도 명확하지 않습니다. 왼쪽 상단 모서리에 위치한 버튼은 너무 작아서 눈에 띄지 않습니다. 또한 한 번 확대하면 시각적으로 매력적이지 않으므로 그렇게 하는 것에 대한 보상이 거의 없습니다. 너무 눈속임으로 인해 방문자는 더욱 길을 잃고 무엇을 해야 할지 확신이 서지 않습니다.

프로젝트 자체 내에서도 주의가 필요합니다. 프로젝트를 선택한 후 다음에 무엇을 해야 할지 명확하지 않습니다. 데스크탑과 달리 태블릿을 사용하면 커서를 가리키면 기본 이미지를 클릭할 수 있음을 나타내기 위해 커서를 변경할 수 없으며, 이는 다음 단계로의 이동을 의미합니다.

방문자가 마침내 들어오면 UI에 있는 네 개의 탐색 화살표가 혼란스러워집니다. 왼쪽과 오른쪽은 그 자체로 간단해 보이며 논리적 진행을 제공합니다. 위쪽과 아래쪽을 추가하면 전체 구조가 손상됩니다.

이 포트폴리오 디자인의 일부는 한계를 가지고 노는 것에 관한 것입니다.

Kent: 이 경험의 독특한 특성이 실험의 단점을 정당화합니까?

Darko: 느슨한 캔버스의 개념은 유지하면서 사이트를 더 유용하게 만들 수 있습니다. 사용성을 향상시킨다는 것이 반드시 전통적인 석조 웹 레이아웃으로 되돌아가는 것을 의미하지는 않습니다. 여기서 주요 문제는 사용자가 "발견"의 여정을 떠나야 한다는 것입니다. 이것은 실수입니다. 사람들이 웹사이트를 방문할 때 기대하거나 할 준비가 된 것이 아닙니다.

이 사이트를 알게 되는 데는 마찰이 내재되어 있습니다. 아마도 이러한 마찰이 사이트를 매우 독특하게 만드는 원인일 것입니다. 즉, 사람들이 웹사이트를 즐기기 위해 "일하도록 만들어"야 한다고 생각하지 않습니다. 마찰이 너무 많으면 상황이 너무 커져 방문자가 좌절감을 느끼며 사이트를 떠날 수 있습니다.

Kent: 사이트 디자이너의 좋은 의도가 제품의 부정적인 특성을 완화할 수 있습니까?

다르코: 저는 이 중 많은 부분이 의도적이며 임의성이 무작위가 아니라고 생각합니다. 이는 최근 한동안 인기를 끌었던 노출 콘텐츠라는 그래픽 디자인의 트렌드와 비슷하기 때문입니다. 여기서 문제 는 웹상의 디자인은 그래픽 디자인이 아니라는 것입니다. 웹디자인 입니다.

실험의 이름으로 "다르다"고 원하는 잘 알려진 클라이언트를 위해 많은 전통적인 웹 디자인 표준이 폐기되었습니다. 최고의 UX를 통해 가장 효율적인 방식으로 프레젠테이션하는 데 중점을 두지 않고 이 사이트는 제작자가 자신의 작업, 작업, 작업에 대해 생각하는 방식, 그리고 이를 세상에 선보이고 싶은 방식을 나타냅니다.

예를 들어, "정보" 페이지에는 문장 중간에 썸네일 사진과 같이 처음에는 관련이 없어 보이는 요소가 표시됩니다. 평범한 사람에게는 이러한 요소가 불필요하거나 쓸모 없어 보일 수 있지만 이 스튜디오가 모든 기회를 활용하여 자신의 스타일을 표현하고 방문자에게 자신이 누구인지 전달하는 방법을 실제로 보여줍니다.

이 사이트는 포트폴리오가 단순히 작품 자체를 말하게 놔둘 필요는 없지만 그것이 표현되는 방식 또한 개인의 가치를 표현할 수 있음을 보여주는 예시입니다.

Kent: 이 웹사이트에서 문제가 되는 내용 중 많은 부분이 포트폴리오 유형의 콘텐츠에 국한되어 있지만 일반적으로 웹 디자인에 적용할 수 있는 교훈이 있습니까?

Darko: 포트폴리오 프로젝트가 항상 모든 것을 완벽하게 전달할 필요는 없다는 점에서 본질적으로 더 유연하지만 이 웹사이트는 웹 디자인에서의 실험이 가능하고 필요하다는 것을 보여줍니다.

대부분의 웹 디자이너는 대화형이 아닌 구성 요소로 목업을 시작합니다. 이 웹사이트는 그런 식으로 생각할 수 없습니다. 그러나 그것을 피하는 것보다 분명히 실행하기가 쉽지 않았기 때문에 이 웹 사이트가 무엇을 하려고 하는지 분석하는 것이 중요하다고 생각합니다.

웹에는 여전히 한계가 있지만 제 생각에는 웹 디자이너가 종종 한계를 지나치게 느끼는 경우가 많습니다. 이 사이트는 가능성을 확장하기 시작하는 방법을 보여주며 디자이너가 원하는 모든 것을 자유롭게 할 수 있는 "예술적인 포트폴리오 사이트"로 단순히 무시되어서는 안됩니다.

그런 다음 문제는 사용성을 손상시키지 않고 이 작업을 수행하는 방법이 됩니다.

Kent: 물론 종종 예산과 일정의 한계 내에서 바퀴를 재발명하기가 어렵습니다.

Darko: 예, 종종 이러한 제한은 디자이너로 하여금 이미 존재하는 것 또는 사람들에게 익숙한 것의 안전으로 후퇴하도록 만듭니다. 이것은 웹 디자인에서 독창성의 중요성과 그러한 장점 또는 단점을 이해하는 것에 대한 광범위한 논의를 의미합니다. 독창성을 위해 유용성을 희생해야 하는 곳은 어디입니까? 아니면 그 반대의 경우도 마찬가지입니까? 그 균형을 어떻게 찾습니까? 흥미로운 토론입니다.

(Ro-Lu 웹사이트는 Dylan Fracareta와 Eric Price에 의해 디자인되었습니다. 현재 시카고 현대미술관의 디자인 디렉터인 Fracareta는 예술, 건축, 패션 및 예술을 위한 디자인에 중점을 둔 독립적인 디자인 관행을 운영했습니다. Price는 디지털 미디어, 출판물, 예술 및 문화 분야의 아이덴티티 디자인에 중점을 둔 그래픽 디자이너이자 프로그래머입니다.)

• • •

Toptal Design 블로그에 대한 추가 정보:

• UX를 ​​위한 휴리스틱 분석 – 사용성 평가를 실행하는 방법
• 예쁜 디자인에 대한 호언장담
• 경험이 전부입니다 – 최고의 UX 가이드
• 대중을 위한 UX 테스트: 간단하고 비용 효율적으로 유지