스포카 블로그에 게재한 글을 편집한 뒤 모비인사이드에서 한 번 더 소개합니다.
by 김재석 스포카 CTO
이번에 스포카의 ‘도도 포인트’ 새 버전을 개발하면서 디자인 팀 내에서 콘텐츠의 스크롤 방향에 대한 이의 제기가 나왔습니다. 기존에는 별 생각없이 세로 방향 스크롤을 사용하게 끔 만들어져 있었는데, 가로 스크롤이 더 낫지 않겠냐는 제안이었습니다. 사실 이에 대해 깊게 생각해본 적이 없어, 이번 기회에 자세히 알아보게 됐습니다.
결론부터 말하자면, 가로 스크롤이 정답에 가깝습니다. 인간 공학(Ergonomics)적인 이유 때문인데요. 사람의 관절 기본 상태와 움직일 수 있는 각도는 거의 정해져 있기 때문입니다. 매대의 태블릿을 만지는 환경이라면 주로 (1)손목 관절과 (2)집게손가락 마디를 활용하게 되는데, 하나씩 살펴보면 아래와 같습니다.
1. 손목은 기본적으로 수직 형태입니다.
손목의 관절 구조를 보면 휨 없이 중립상태를 기준으로 손이 수직을 향하게 됩니다. 손등을 내보이거나, 손바닥을 내보이는 모양은 팔과 손목 관절을 휜 형태가 되기 때문에 기본적으로 약간의 부하를 주게 됩니다. 한동안 유행했던 버티컬 마우스도 이 중립 상태를 유지하며 마우스를 사용하게 하여 손목 터널 증후군의 발생을 최소화하기 위해 개발됐습니다.
- 손목 관절에 관련 된 글: Amit Bhattacharya,James D. McGlothlin (2012). Occupational Ergonomics: Theory and Applications, Second Edition. 327p
2. 수평 상태 기준으로, 집게손가락 마디는 첫째를 제외하고 상하 운동만을 지원합니다.
두 번째로 수평 상태의 손바닥을 기준으로 엄지를 제외한 손가락 마디는 손허리손가락관절을 제외한 나머지 관절은 상하 운동밖에 지원하지 않습니다. 손허리손가락관절 마저도, 상하 운동에서 훨씬 자연스러우며 좌우 운동은 조금 불편하다는 것을 알 수 있습니다. 결론적으로 수평 상태를 기준으로, 집게손가락 마디는 상하 운동이 좌우 운동보다 훨씬 편리하고 자연스럽습니다.
* 손허리손가락관절: 손바닥에 가장 가까운 관절. 손가락 골격에서 손허리뼈와 첫마디뼈를 연결하는 관절을 말합니다.
* 손허리손가락관절 관련 글: A BIOMECHANICAL MODEL OF INDEX FINGER DYNAMICS(RESEARCH GATE)
두 가지 결론을 조합해보면, 손목의 중립 상태를 기준으로 집게손가락 마디는 좌우로 움직일 때 가장 자연스럽고 부하가 적습니다. 그러므로 도도 포인트와 같은 서비스는 가능한 가로 스크롤을 최대한 활용하는 방향으로 디자인하는 것이 유리합니다.
마치며
UI 디자인에 있어 스크린 내 화면만을 보며 좋은 디자인을 구현하는 것은 많은 한계가 있습니다. 결국, 총체적 경험은 기기의 위치, 사용하는 자세를 종합적으로 고려하여 최적의 동선을 고안해야 하는 것 같습니다. 특히, 사용자가 많은 서비스의 경우, 이 작은 디테일이 기여하는 영향력은 굉장히 클 것입니다.
