'UI Design Guideline'에 해당되는 글 1건

  1. 2013.01.21 Yet Another Usability Testing Kit (8)

지금 다니고 있는 회사는 딱 한 종류의 서비스(여행상품 검색)만 제공하는 영세한 회사라고 할 수도 있을텐데,그럼에도 불구하고 4가지 모바일 OS(iOS,Android, Windows Phone, Blackberry)를 대상으로 앱을 만들어 서비스하고 있다. 타블렛 버전을 따로 치면 6가지 UI. 뭐 대단한 야망이 있다기보다 워낙 공돌이 마인드로 뭉쳐진 회사라 세상에서 어느 정도 쓰이고 있는 모바일 OS들은 한번씩 손을 대봐야 직성이 풀리기 때문이지만, 덕택에 서로 다른 OS의 UI 디자인 가이드라인을 비교하느라 공부는 많이 된다.


책은 잘 안 읽지만 디자인 가이드라인은 IBM UCD Lab 시절부터 열심히 찾아 읽는 성격이다. 그만큼 교과서 역할과 신문 역할을 잘 해주는 것도 없으니까. 그렇게 가이드라인을 읽다보면 재미있는 점이 눈에 띄기도 한다. 몇년전만 해도 마이크로소프트의 가이드라인이나 애플의 가이드라인이나 뭐 비슷한 내용이었는데, 최근에는 UI 특허로 치고받으면서 피흘리는 경우가 워낙 흔해서 그런지 각 OS의 디자인 권고사항에 "쟤네처럼 만들지 마요"라고 되어있는 경우가 종종 눈에 띄는 것이다. 특히 Windows 8와 함께 등장한 마이크로소프트의 소위 모던 UI에서 "Be authentically digital"이라는 디자인 원칙은 아예 경쟁사인 애플의 가이드라인 중 "Metaphors"에서 나오는 내용을 정면으로 반박하고 있을 정도.


[O] 스큐어모피즘 논란에 대하여 -----


뭐 어쨋든 이런 형편이다보니, 아무리 단순한 UI라고 해도 그냥 OS 만든 사람들이 내놓은 가이드라인만 믿고 갈 수가 없게 됐다. 당장 가장 단순한 UI 요소조차도 남들이 쓰는 방식을 빼고 무리해서 차별화하려다 보니 OS의 가이드라인 자체가 사용성이 떨어지는 방식을 종용하는 경우도 있는 것이다. 결국 일일히 사용성 평가를 진행해서 확인하고 넘어가야 한다는 이야기. 그동안은 협력하고 있는 모바일 개발사에서 사용성 평가 역량이 되는지라 그 부분까지 한꺼번에 맡기는 방식으로 어찌어찌 버텼는데, 이번에 마이크로소프트의 소위 "Modern UI"와 곧 출시되는 Blackberry 10의 독특한 (독특하게도 모든 UI가 짬뽕되어 있는) "Flow UI"를 적용해서 앱을 만들다보니 그만한 역량이 되는 개발사를 찾을 수가 없었다. 물론 예산 문제도 있었고. ( '-')y~


결국 그래서 앞으로 모바일 앱에 대한 사용성 평가도 내부에서 추진하기로 결정. 당장 필요한 모바일 기기 사용성 평가 장비를 만들게 됐다. 이번이 세 번째로 만들어보는 것 같은데, 재료부터 완성까지 모두 혼자서 해본 건 처음이다. ㅋ


사실 전부터 생각하고 있던 일이라서 주요한 재료를 어디서 구할 수 있는지는 대충 찍어놓고 있었다. 구조를 만들 재료는 DIY 전문매장인 B&Q, 전기배선은 Maplin. 외근하겠다고 얘기하고 에딘버러에 딱 하나씩 있는 이 매장들을 한바퀴 돌면서 어떤 재료가 있고 어떻게 만들 수 있는지, 어리둥절해 하는 직원들과 함께 매장 구석에 쪼그리고 앉아서 대충의 설계를 했다. 결국 사온 물건들은 목이 구부러지는 스탠드, 케이블 레일(15cm만 있으면 되는데, 2미터 단위로만 판다;;;), 그리고 와셔, 벨크로 테이프 등등.


Building Mobile Usability Testing Kit: Raw Materials


아마 우리 회사에서 업무의 일부로 톱질한 사람은 내가 처음일게다. -_-;;; 심지어 설비팀에서도 십자 드라이버 하나 (사실 PC나 서버 조립하는 데에는 이거면 충분하니깐) 밖에 없다고 해서 결국 실톱에 사포까지 사야 했다. 두어시간 사무실을 시끄럽게 하고나서... (사포질이 몇년만이냐... ㅠ_ㅠ )


Building Mobile Usability Testing Kit: Structure Frame


위 사진 왼쪽에 보이는 물건이 만들어진 기본 얼개가 된다. 드릴이 없었는데, 구멍 하나 뚫자고 새로 사기는 아까와서 그냥 커터칼로 후벼팠다. -_-a;;


Building Mobile Usability Testing Kit: Microsoft LifeCam HD-6000

다음은 카메라. 인터넷을 뒤져보니 USB 웹캠 중에서 품질이 좋고 그나마 대가리가 작은 놈(받침대를 제외하면 3cm 정육면체 정도 된다)이 Microsoft LifeCam HD-6000이라서, 그걸로 주문을 했다. 다행히 우리 회사는 IT 장비에 대해서는 예산을 아끼지 않는 편이지만, 받으면 바로 분해해서 카메라 부분만 쓸꺼라고 하니까 좀 멈칫하기는 했다. ㅎㅎㅎ 어쨋든 택배가 오자마자 바로 뽀각. (사실 "뽀각"이라고만 하기는 좀 복잡한 과정이 있었다. 내부 구조를 모르는 상태에서 무작정 잘라버릴 수도 없고 해서, 받침대의 플라스틱 부품들을 플라이어(뻰찌)로 일일히 조금씩 열어보면서 조각조각 떼내야 했으니까.)


Building Mobile Usability Testing Kit: Off with the camera


전에 다니던 연구소에서 (하라는 연구는 안 하고!) 어깨너머로 배웠던 기술이 많은 도움이 됐다. Thermal contraction tube라는 이름으로 배웠던 "열수축튜브"를 여기쟁이들은 heat shrink tube라고 하는 걸 알아내기까지 좀 헤매긴 했지만.


Building Mobile Usability Testing Kit: Wiring 1


뭐 남은 건 그저 튀어나온 부분 갈아주고, 너트 제대로 조여주고, 전선 정리해 주면 된다. 여기서부턴 단순히 정리 작업.


Building Mobile Usability Testing Kit: Wiring 2


다른 일상적인 업무들도 병행하느라고 결국 시작에서 완성까지는 총 3일이 걸렸다. 웹캠 구매하느라 이틀동안 택배 기다린 걸 제외하면, 밖에서 3시간 쇼핑하고 사무실에서 4시간 정도 짬짬이 뚝딱거린 것만으로 꽤 그럴듯한 물건이 나왔다.


Completed Usability Testing Kit for Mobile Devices


팀에서 쓰는 사용성 평가용 노트북에 연결해서 동작시켜 봤는데, 기대했던대로 동작해 준다. Morae Recorder와도 문제없이 연결되고. 과도하게 친절한 자동초점 기능 덕택에 잠시 당황스러운 순간이 있었지만, 다행히 옵션에서 바로 해결.


[O] 재료 목록 및 가격 -----


아직도 모바일 기기의 사용성 평가 키트를 USB 카메라로 직접 만들어서 쓰느냐고 할지도 모르겠지만... 아무래도 제한된 조건 하에서 업무를 하려면 가끔은 UI가 막 자리잡던 시절의 막막한 상황으로 돌아가야 하는 때가 온다. 한편으로는 그런 때를 통해 사용자 중심 디자인이라는 방향성과 큰 원칙을 되새기게 되고 회사 내에서도 그때그때의 흐름에 휩쓸리지 않고 늘 같은 방향을 가리키는 역할을 할 수 있게 되니 나름 도움은 되지만.


이제 이번 주부터는 요 장난감을 갖고 바로 평가에 들어간다. 과연 큰 문제 없이 그 역할을 해줄지는 두고볼 일이지만, 그래도 최소한 지난 주 며칠은 이걸 만들면서 뚝딱뚝딱 재미있게 보냈다!!!


참고: 이 글은 회사 블로그에 올린 글의 한글/블로그 버전입니다.


... 이제 그만 놀고 일해야지. ㅡ_ㅡa;;;


저작자 표시 비영리 변경 금지
신고
Posted by Stan1ey

BLOG main image
by Stan1ey

카테고리

분류 전체보기 (347)
HTI in General (45)
User eXperience (11)
Voice UI (50)
Vision UI (14)
Gesture UI (25)
Tangible UI (28)
Robot UI (14)
Public UI (9)
Virtuality & Fun (56)
Visual Language (15)
sCRAP (70)

글 보관함



www.flickr.com
This is a Flickr badge showing public photos and videos from Stan1ey. Make your own badge here.