레드 스퀘어 방식 (The red square method)

이 글은 Michal MalewiczThe red square method글을 번역했습니다. 저의 모든 글은 허가를 받고 진행 하였습니다

길고 어려운 디자인 설계 프로세스와 혼돈 사이의 차이는 작은 빨간 사각형 하나로 메울 수 있습니다. 방법은 이렇습니다.

presentation
사용자 인터페이스에서 가장 일반적인 문제를 탐구하는 동안 우리는 종종 고객의 무관심의 벽에 부딪혔습니다.
하지만 누가 완벽한 제품을 갖고 싶어하지 않나요? 왜일까요?
최근 몇 년은 "공예-craft"의 혁명입니다. 맥주, 음식, 가구, 심지어 아이스크림까지 모두 이제 "공예품"입니다.
디자인은 왜 그렇게 많은 경우에서 "공예-craft"하지 않는 걸까요? 그리고 왜 주인들은 신경 쓰지 않는 걸까요?

저희가 물어봤습니다.

격자 선(Grid lines)과 긴(lengthy) 전문 용어로 채워진 설명들은 단순히 인지적 불협화음을 튕겨내고 그것을 길들이기 위해 그들이 생각하는 것을 다시 주문합니다. 이 모든 정보를 처리하는 것은 어렵기 때문에, 제품이 "작동"하고 "판매"하는 한, 훨씬 더 쉽게 폐기할 수 있습니다.

우리는 인간들에게 UX를 말하는 것을 중단해야 합니다.

입력 - 빨간색 사각형입니다.
presentation

4x4의 붉은 사각형-그냥 보세요!
빨간 사각형은 사람들에게 뭔가 확실한 것을 줍니다. 그들이 바로 이해할 수 있는 것 말입니다. 모양입니다. 색상이 있어요. 마치 레고 블록이 상상 고속도로에서 차선을 만드는 것과 같습니다.
하지만 역시요...
그것은 제가 무관심의 벽을 뚫기 위해 고안한 단순화된 그리드 설정 방법입니다. 닻입니다. ⚓️

우리의 뇌는 안전한 바다를 항해하는 것을 좋아합니다.

사용자 경험은 오랫동안 인간에게 더 나은 제품을 만들어 왔습니다. 사용자 경험의 일부는 사용자 인터페이스 설계이며, 이는 명확성, 가독성 및 미학을 통해 신뢰를 구축합니다. 그러나 사용자 경험은 모든 사용자들을 생각하지 않고 만들어졌습니다. 🤯
presentation
Photo by Alvaro Reyes on Unsplash
비율을 높이고 디자이너들이 특별하다고 느끼도록 하기 위해, 우리는 진실을 이해하기 위해 단순하게 감추기 위해 사용하는 일종의 코드를 고안했습니다. 우리는 매일 전문용어와 의사소통을 합니다. 그리고 대부분의 경우 우리의 자아는 우리가 "과학과 그런 것"을 하고 있다고 가정했을 때 당황해서 들을 때 그것을 좋아합니다.
물론 많은 경우에서 우리는 그렇습니다. 결국 UX는 과학입니다. 다른 경우에는 휴리스틱스를 사용합니다...
휴리스틱스요? 🧐 정말요?
고객과 대화할 때 좋은 반지가 있습니다. 그의 어리둥절한 얼굴이 우리의 자아를 약간 자극합니다. 🤔 그러나 "우리가 이미 알고 있는 것"이라고 말하는 것이 더 좋습니다. 이것은 빨간 깃발과 빨간 사각형이 모두 하나로 합쳐져 있습니다.
백과사전이 아니라 사람처럼 이야기하세요.
물론 다른 방향으로도 정상을 넘을 필요는 없습니다. 걱정 마세요, 여기 저기서 멋진 말을 쓰셔도 돼요. 그것들을 너무 많이 사용하지 마세요. (연구 또는 성공적인 재설계의) 결과를 통해 작업 품질에 대해 설명하도록 합니다. 화려한 말이 아닙니다. 고객은 UX 프로세스의 사용자입니다. 사용자 환경을 개선합니다. 🙏

빨간색 사각형을 사용하여 그리드를 표시하는 방법입니다.

"우리가 아는 것" aka heuristics는 우리가 대부분의 제품에 대해 꽤 좋은 UX를 만들 수 있게 해주기 때문에, UI라고 불리는 무시당한 어린 남동생이 여기서 초점이 될 것입니다. 그러나 필요할 경우 실제 설계보다 "더 부드러운" ux 필드로 레드 스퀘어 방식을 확장할 수 있습니다. 걱정하지 않아도 됩니다. 또한 저는 연구와 "검증된" UX 방법을 믿습니다. 많은 프로젝트들이 디자인 자체가 아니라 스타일이나 비즈니스 모델에서 차별화되기 때문에 가능한 모든 설계에 적용할 필요는 없다고 생각합니다.

여기 빨간 사각형의 격자가 있습니다.

presentation
물론 배치(황금 비율 포함)를 더 낫고 전문적인 방법이 있지만, 기존 설계에 빨간색 사각형을 여러 개 추가하고 무작위 공간을 보여주는 것보다 나은 방법은 없습니다.
위의 이미지는 그리드 선이나 상자 모델보다 더 잘 이해되고 더 빠릅니다. 그것은 주로 다음의 두 가지 이유 때문입니다.
  1. 빨간색은 원래 잘못된 것과 관련이 있기 때문에 너무 크거나 작은 간격 옆에 표시함으로써 메시지가 더 빨리 전달됩니다.
  2. 그리드 선과 상자 모델은 프로젝트의 광범위한 영역에 걸쳐 있는 큰 요소에 의존합니다. 투명성에도 불구하고 우리의 뇌는 그 모든 가장자리를 따라가고 패턴을 알아채도록 요구합니다. 빨간색 정사각형은 종종 "점" 또는 픽셀로 식별되며 자신의 오른쪽에 있습니다. 그렇기 때문에 주변 지역을 빨리 볼 수 있는 게 더 수월합니다.

하지만 빨간 사각 방식은 단순한 격자 이상의 의미를 가지고 있습니다.

그것은 그리드를 보여주기 위한 방법으로 시작되었지만, 대부분의 통신의 일반적인 단순화로 바뀌었습니다. "우리가 알고 있는 것"은 휴리스틱스만큼 화려해 보이지는 않겠지만, 우리는 우리의 UX 기량을 과시할 시대를 넘어섰습니다. 이제 우리는 좋은 일을 하고 사람들이 이해하는 방식으로 그것에 대해 이야기 할 것으로 기대됩니다.
그렇지 않으면 그들은 단순히 흥미를 느끼지 않을 것입니다.

이 글은 번역 글입니다. 원본 링크입니다.


안녕하세요! Early adopter입니다.
페이스북 [DTF] 디자인 번역 공장 - Design Translation Factory 그룹도 많이 가입해주시길 바랍니다.
"보버"에서 "디자인 번역 공장" 연재를 저와 함께 해주실 분을 찾습니다. 하단 "리뷰" 또는 "페이스북"으로 편하게 메시지 주세요!
PS. 제가 사용하는 블로그 "보버"에 "함께 쓰는 블로그"라는 기능이 요번에 추가됐네요 ㅋ (미디엄에 퍼블리케이션 같은 기능..)
하단 링크 글을 보시면 "디자인 번역 공장"에 어떻게 함께 연재할 수 있는지 자세히 설명되어있습니다. 또는 쉽게 FB 메시지 주세요!
https://bit.ly/2LxR0Bz