ⓅⒶⓇⓉ ⑧ 3주차 학습일지 두번째 | UIUX 디자인 툴 (Figma) | Chapter 6 정리 | 사용자를 생각하게 하지 마 | Talk about

 

📋 오늘의 할 일 📋

💻 UIUX 디자인 툴 (Figma) | Chapter 6

🖋️ 사용자를 생각하게 하지 마

💬 Talk about

 

 

---

 

 

💻 UIUX 디자인 툴 (Figma) | Chapter 6

 

⚡️컴포넌트?

∗ 컴포넌트 요소의 속성을 지정해 준 다음, 복사 시 인스턴스를 생성 가능하다.

∗ 인스턴스는 아무리 갯수가 많아져도 컴포넌트의 속성을 따라가기 때문에, 일괄 수정하기 쉽다.

∗ 인스턴스 개별 수정도 가능한데, 대신에 한 번 개별 수정하게 되면 컴포넌트와의 연결이 끊어지기 때문에, 개별 수정하게 되면 별도로 컴포넌트를 다시 만들어 주어야 한다.

 

 

⚡️베리언트?

∗ 컴포넌트에게 Property를 추가해서 어떤 상태일 때 어떤 오브젝트를 사용할 것인지 컴포넌트 하나로 관리하기 수월하다. 베리에이션의 개념.

∗ 보통 hover, abled&disabled 등 여러 상태를 나타낼 때 사용하기도 하며, 크기별로 property를 추가하기도 한다.

 

 

---

 

 

🖋️ 사용자를 생각하게 하지 마

 

“21세기에 온 것을 환영합니다. 약간의 현기증을 느끼실지도 모릅니다.”

 

내가 이 책에서 가장 좋아하는 문장이다. 이 한 문장으로 책으로 스며드는 몰입도가 높아졌기 때문에.

 

기술이 빠르게 발전하면서 사이트의 유용성이 높아짐에 따라 사용자들은 어느 정도의 기능을 자연스럽게 기대하게 되었다. 이는 인터넷의 발달로 쉽게 많은 웹을 접하면서 더욱 가속화 되었다고 생각한다.

 

“이 정도는 되어야 하지 않나?” or “이것도 되면 좋겠다.”  or “다른 데는 이것도 되던데.”

 

그와 동시에, 사용성이 주류로 인정 받게 되었다. 사용성은 사용자에게 더 나은 경험을 제공하는 데 기여하는 모든 활동을 가리킬 때 포괄적으로 쓰이는 단어다.

사용성은 기술이 아니라, 사람이 사물을 이해하고 사용하는 방법이기 때문에, 사용성이 뛰어나다는 것은 다음과 같은 의미이다.

 

• 평범한 혹은 평균 이하의 능력과 경험을 가진 사람이 어떤 사물을 사용해서 무엇인가 하려고 할 때, 사용법을 스스로 알아낼 수 있다. 
• 단, 투입한 수고에 비해 얻은 가치가 더 커야한다.

 

이 문장을 봤을 때, 마지막 줄이 중요하다고 생각했다. 수고로워도 그만한 가치가 있거나, 대체 불가능한 영역이라면 계속 이용하겠지만, 그렇지 않은 현대의 사용자들은 불쾌함을 느끼고 가차없이 다른 서비스를 찾을 것이기 때문이다.

 

여기서 사용성의 가장 중요한 원칙은 어렵도록 느끼게 하지 말아야 한다.

그것을 계획한 어떤 의도가 있든 간에, 사용하는 사람이 속으로 “이 부분이 번거롭다.” 혹은 “왜 이래" 라고 생각하는 것들이 (책에서는 마음 속의 목소리 라고 언급했다.) 쌓이게 되면 불쾌해진다. 

 

우리는 우리가 사용자들을 잘 알고 있다고 착각하는 경우가 많다. 자신의 호불호를 쉽게 사용자에게 투영하기 때문이다. 글에서는 “평균 사용자 신화” 라고 칭하며, 이것이 끼치는 가장 부정적인 영향은 사람들이 좋아하는 것이 무엇인지 알아내야 좋은 웹디자인이 “완성" 된다는 환상에 힘을 실어주기 때문이다. 

 

나 역시도 이 “평균 사용자 신화" 에 매료되어 사람들이 좋아하는 걸 확실하고 예쁘게 보여줄 수 있다면 그것이 큰 메리트가 되고, 그게 완성에 가까워지는 길이라는 걸 믿었다. 그러나 실제로 사용자들은 훑어보기에 익숙하고, 최선의 선택보다는 최소 조건만 충족되면 만족한다. 사용하는 데에 지장만 없다면 굳이 작동방식을 이해하려고 하지 않는다. 작동하기만 한다면 계속해서 사용할 뿐이다. 

 

이런 부분들을 통해서 느낄 수 있는 건 사용자들은 정말 “목표 달성" 을 위해 도구를 사용한다는 느낌으로, 우리는 그 목표에 빠르고, 쉽고, 정확하게 도달할 수 있도록 사람에 대해 더 접근해나가야 한다고 생각했다.

 

그러면 어떻게 해야 좋은 사용성을 보여줄 수 있을까?

 

첫 번째, 표준화된 디자인 패턴을 이용해서 빠르게 쉽게 이용하도록 만들어라. 일관성이라는 이름 아래 명료성을 배제한다면 그것보다 나쁜 선택지는 없다. 무조건 명료성을 우선시하라.

두 번째, 집중과 선택, 강조를 잘 활용하라. 시각적 계층구조를 효과적으로 구성하여 더 중요한 부분이 눈에 띄도록 만들어야 하며, 요소간 상하위 관계가 형성되어 있다면 이를 시각적으로도 보여주어야 한다. 

세 번째, 사용자가 고민 없이 선택할 수 있도록 적절한 안내를 동반하라.

네 번째, 내비게이션 전체 구조를 아우를 수 있는 샘플 페이지 제작이 중요하다.

 

이를 통해 만들어진 홈페이지는 네 가지 질문에 빠르고 명확하게 답할 수 있어야 한다.

 

이게 무슨 사이트지? 

이 사이트에는 무슨 내용이 담겨 있는 거지?

이 사이트에서 무엇을 할 수 있지?

비슷한 다른 사이트가 있음에도 내가 이 사이트를 이용해야 하는 이유가 뭐지?

 

위의 모든 것을 통틀어서, 그렇기에 모든 것을 고려하여 훌륭한 웹이나 앱을 만드는 건 어려운 일이라고 필자는 말한다. 또한 이 외에도, 다양한 제약으로 인해 트레이드오프 - 제약 때문에 이상을 버리고 선택하는 현실적 대안 - 를 선택할지라도 어떻게 잘 다루느냐에 따라서 사용자에게 좋은 경험을 충분히 선사할 수 있다고 한다.

---

이 책을 통해 처음에는 큰 생각 없이 가볍게 접근했지만 다 읽고 나서는 무언가, 내가 오랫동안 고민했던 하나를 덜어낸 기분이 들었다. 이전 회사에서 일했을 때, 나는 항상 우리의 평균 사용자에 대해 생각했고, 그들이 이런 걸 좋아하고, 싫어할 것이라고 당연하게 생각했다. 왜냐하면 평균 사용자에는 “이해관계자라는 걸 망각한 나"도 해당된다고 생각했기 때문에. 그래서 후반부의 내용은 반쯤은 뜨끔한 마음을 가지고 한 글자씩 읽었다. 그럼에도 우리가 놓치지 않고자 했던 것들은, 사용자들의 반응을 리뷰하고, 방향성을 잡고, 개선하고자 하는 마음이었다. 더 많은 것을 알아가면서 우리의 사용자, 혹은 사용자가 될 수 있는 사람들에 대해 고민하다 보면 나도 사용자에게 좋은 경험을 선사할 수 있지 않을까? 

 

 

 

---

 

 

💬 Talk about

4차 과제, 클론 디자인 그 이후.

 

∗ 이것은 "내가 과제를 어렵게 받아들였을지도 모른다' 그 결과로 어떤 과정을 거쳐 과제를 제출하게 되었는지 회고한다.

 

↪️ 대체 왜 이렇게 많은 레퍼런스를 잡았을까?

∗ 처음에 과제 조건에서는 레퍼런스 종류 및 갯수에 대한 제한은 없었고, 사실 화면 하나 정도 클론하는 거야 그렇게 오래 걸리지 않을 거라고 자신했다. (물론 실제로 클론만 하는 물리적 시간은 그렇게 오래 걸리지 않았다.)

∗ 그래서 그냥 대책없이 많은 레퍼런스를 보면 좋을 것 같아서 내가 사용하는 앱, 사용했던 경험이 있는 앱, 글로벌 서비스를 진행하고 있는 앱 다양한 앱의 레퍼런스를 수집하다 보니 10개가 되었다.

∗ 사실 마음 같아서는 각 과제별로 다른 앱을 하고 싶었으나 그것보단 10개의 앱을 각각 다른 페이지를 뜯어서 어떤 페이지는 내가 보기에 잘 만들어진 것 같고, 어떤 건 이런 부분이 아쉬운지 그걸 확인하는 게 낫겠다고 판단했다.

(그리고 솔직히... 각 10개의 화면의 모듈 및 요소가 많다 보니 그걸 정리하는 데만도 꽤 오랜 시간이 걸렸다. 오히려 주 과제인 클론보다 훨씬 더.)

∗ 그 부분에 대해서 후회가 되냐고 생각해보면, 사실 작업할 때는 조금 후회했을지도 모른다. 그래도 어차피 했어야 할 일이고 해두면 다음 번에는 다른 앱을 레퍼런스 분석할 수 있으니 조금만 열심히 해보자 생각했다.

 

↪️ 대체 왜 이것까지?

∗ 처음 회원가입 페이지 클론 디자인을 진행하면서, 선정한 앱의 화면 내 요소 사이 각 영역의 넓이를 재야 했다. 이후 연달아 클론 디자인 과제를 진행하면서 문득, 이것도 영역을 재보고 비슷한 커머스 앱 사이에서도 각자 어떤 영역 규칙을 주는지 볼 수 있으면 좋겠다 싶었다.

∗ 이게... 조금 큰일이었다.

∗ 생각보다 요소가 많은 경우 영역 재는 게 꽤 걸렸다. 1px 차이가 사실 짝수냐 홀수냐... 같은 영역 넓이를 줬냐 아니냐 차이처럼 보일 거라 생각하니 나름대로 기준을 잡으면서 측정하면서 시간이 많이 걸렸다.

∗ 그리고, 제출 양식이 PDF여서 아무래도 이미지와 클론 차이가 별로 안 날 것처럼 보여져서 별도로 모듈끼리 따로 정리하면 좋을 것 같았다. (수업 들었던 부분을 재점검 할 겸...)

 

*️⃣ 하면 좋지 뭐

∗ 물론 시간이 배로 걸린 느낌이지만? 처음에는 확신을 갖고, 의심을 거쳐 마지막에는 해냈다라는 그 자체로 스스로가 뿌듯했다. 설령 이게 과제의 목적이 아니었더래도 이후의 피드백에 맞춰 고쳐 나가고, 더 나아지고자 노력해야지. 해서 나쁠 건 없다. 그나마 지금 시간이 조금 있을 때 해볼 수 있는 것들 아니었을까.