UX 기본 알아가기

첫 삽질은 '기본'부터 시작합니다

제로베이스 UIUX 디자인 스쿨

인트로 이미지

첫 삽질이 중요하다.

옛말에도 '첫 단추'를 잘 꿰어야 한다 했었고 그 말이 괜히 나온 말은 아닐 게다. 그런데 그 처음. 도대체 어디서 어떻게 잘 시작해야 하는 걸까? 현재 그 누구도 내게 알려주진 않는다. 경력직은 사실 사수도 따로 없다. 다만 감사하게도 내겐 숱한 랜선 사수가 있다. 책과 각종 아티클과 유경험자들의 이야기. 키워드 검색만 하면 쏟아지는 정보들. 바야흐로 지식의 시대다. 마음만 단디 먹으면 못 배울 게 없더라. 업계와 업종을 확실히 전환시킨 현재의 나로선 디자인 세상에서 UX 냐 UI 냐 CX/BX 기타 기획자의 자세와 태도 등등을 가슴에 각인시키며 오늘도 '출근길의 주문'을 외워본다. 삽질을 잘 하자는 마음으로. 그리고 오늘 그 삽질의 첫 번째 셀프 스터디는 1 cycle 둘러보기. 바로 디자인 프로세스에 대한 학습이다.

디자인 프로세스, 그게 뭐지

프로젝트엔 '순서'가 있다. 그리고 때에 따라 일종의 '규칙' 도 존재한다. 물론 넷플릭스는 '규칙 없음'이라 했지만 어떤 행위든 성공을 해야 비로소 그것이 세상에 드러나는 법. 그 말은 반대로 실패하면 아무도 모른다는 반증이기도 하다. 여하튼 신선한 규칙 파괴가 블랙스완처럼 시장에 출몰되는 걸 지켜보기도 하는 우리는 '사용자' 로서 그 서비스들이, 그 사업모델이 얼마나 각고의 치밀한 소리 없는 총성이 난발하는 전쟁터에서 탄생되었는지 사실 모른다.(나도 사실은 몰랐으니까) 그리하여 이제는 입장을 바꿔 처음과 기본은 순서와 규칙을 배우며 전장에 입성. 그리하여 다음과 같은 것들을 자체적으로 익히는 것으로 첫 삽질을 시작한다.

더블 다이아몬드 모델 예시 이미지

더블 다이아몬드 모델

눈에 비친 이 사각형 두 개가 서로 연결되는 모델은 '더블 다이아몬드'라 불린다. 그것이 뭐신가 알아보니 나름 유명해 보이는 'British Design Council' 이 개척했단다. 그들이 정의하는 디자인 프로세스에 따르면, 이 업계의 프로젝트는 다음과 같은 순서를 가지고 있는 것으로 보인다. (그리고 이 업계는 3D를 넘어 4D구나 싶었다... 와아- 4D다)

발견 - 정의 - 구현 - 도달
Discover - Define - Develop - Deliver

이해해보자면 다음과 같다. 무언가 발견했다! 그 무엇이 문제점이 될 수도 (B2C 에선 아마도 그럴 듯싶다. MVP ―Minimum Value Product를 거쳐 PMF―Product Market Fit에 닿기 위해선) 혹은 B2B BM 위주의 디자인업체에겐 클라이언트의 디자인적 문제점(!)을 개선 혹은 아예 없던 걸 만들어 주기를 바라는 '요구사항' 이 될 수 있겠다. 자, 어쨌든 일꾼들에겐 그것이 '발견' 된 그 순간부터 가동이 프로세스 가동이 시작된다.

새로운 '제안'을 위해서는, 기존의 '분석' 이 필요하다.

분석과 설계를 함에 있어서는 사전에는 반드시 기본적으로 고객 (혹은 시장)의 요구사항 및 문제점 분석을 요한다. 이 시간이 있어야 다음으로 넘어갈 수 있다. 최소한 '우리/나' 만의 특장점을 어필하려 해도 기존 레퍼런스들과의 차별성을 보여야 할 것이다. 그리하여 벤치마킹이나 서비스 분석은 필수이며 더욱 깊이 있고 넓은 시선과 마음으로 들여다봐야 하는 세계가 어쩌면 디자인 업계일지 모르겠다. (사실 뭐 다른 일들도 레퍼런스 분석은 필수이겠지만, 너무 많이 하다 보면 생각 자체가 기존의 것 안에서 맴돌며 매몰될 수 있음은 주의해야 할지도;)

Momatu Mobile Website Concept 이미지

Momatu Mobile Website Concept

분석 이후엔 '정의' 그리고 '설계' 한다.

일종의 '기능 / 정책 정의서' 같은 과정을 거친다. 즉 고객 요구 사양 혹은 반드시 알아야 할 정책들에 대한 서로 간의 부합 및 리스크 여부에 대한 확인을 거치는 것으로 보다 비로소 탄탄한 웹/앱 서비스의 기본 골조를 만들어 나간다. 그 이후엔 화면을 설계한다. app 이든 web 이든 보이려는 '화면' (소비자/사용자의 '눈') 에 어떻게 '디자인'이라는 옷을 입고 탄생돼야 하는지! 기획자는 서비스 사용자들을 예상하면서 각 화면과 상세 기능을 설계하는 역할을 한다. 마치 건축 설계사랄까.

생각해보자면 건축과 흡사한 느낌이다.

집 공사라 따지자면 건축주의 의뢰를 받은 이후의 일련의 과정이랄까. 공사 환경을 분석하고 의뢰인의 요청을 확인한 후 전체 집의 콘셉트와 공사 방향에 대한 기본 합의를 이룬다. 그 이후 설계를 꼼꼼히 하여 시공에 착수되는데 바로 웹/앱 서비스도 마찬가지. 기획자는 설계사의 마음과 흡사하게 골조공사를 해야 한다. IA(Information Architecture)를 거친다. 나로선 이것이 꽤 중요해 보였다. 왜? 그 서비스/그 화면이 앞으로 탄생될 일종의 나침반' 역할을 하는 것 같아서. 뭐든 '방향성' 이 우선 아닐까? 그리고 방향을 그리려면 사전에 숱한 '리서치'와 '콘셉트' 정의를 해야 할 테니. (그렇지 않고서야 튼튼할 리 만무) 여하튼 그렇게 상세하게 각 페이지 정의를 풀어낸 후 실제 사용자 눈으로 보이게 되는 화면 설계를 한다. 이것이 화면 정의서 혹은 스토리 보드 혹은 와이어프레임*이라고 우리가 말한다면 그 이후엔 실제 어떤 식으로 서비스가 구현되고 보이는지를 개발적으로 구현된 디자인 옷을 입혀 본다. (프로토타입**)

*와이어프레임 : 화면 설계서, 화면 청사진, 실제 디자인이 입혀지기 전 화면 (각 페이지)의 골격 확인을 위해 만드는 기획 산출물

** 프로토타입
- 개발 전, 이해관계자들이 함께 보며 정보 위치나 구조 등을 이해하고 합의하기 위해 만든 것
- 이 단계는 3단계로 다시 쪼개진다
: Lo-Fi (손으로 그리는 핸드 스케치)
: Mid (피그마나 PPT로 대략 만든 스케치)
: Hi (디자인 인터랙션이 가미된, 실제 완성본과 흡사한 버전)

JUSTINMIND BLOG 발췌, 와이어프레임의 베네핏

JUSTINMIND BLOG 발췌, 와이어프레임의 베네핏이라 한다. 음 아무튼 '베네핏' 임. 추후 좀 더 알아보는 것으로.

와이어 프레임 스케치 이미지

나는 손 버전을..... 좋아하는데... 뭐든 아날로그 인간이라는 반증;; 큰일 났다..

그 이후엔 일정(WBS)을 토대로 (보통 B2B에선 아마 '납기'에 준수하기 위한 일정일 테지만) 이후 설계와 구현 및 결과물 전달과 상호 wrap up 등을 거쳐 1 cycle 이 종료. 그런데 막상 머리로 이렇게 1 cycle을 이해한다고 해서 다 안다고 말할 수 있는 게 '절대' 아니라는 것을, 안다.... 알아서 다행이다. 다만 기획자의 마음가짐이랄까. 공부를 하면서 슬슬 업무 가동을 위한 준비의 시간에서 매일 괜히 진지각 자세로 느껴지는 건 바로 이런 것들이다.

'사용자'에서 무엇이 더 '가치' 있고 '편이' 하며 '좋은 경험'을 줄지 고민할 것

사실 여전히 첩첩산중일 테지만.... 초심의 중심에서 내내 이 본원적 생각 하나만큼은 앞으로도 흐려지지 않기를 바라는 마음뿐이다. Desk 혹은 Field 리서치를 함에 있어서 사용자의 행동 패턴을 하나하나 세심하게 관찰하려 노력할 것. 만약 성공하는 서비스가 시장과 고객에 답이 있는 것이라면 (거기에 보태어 나는 '운' 도 조금은 믿는 편이지만;) 결국 모든 중심엔 '사용자' fit 함이 필요하다는 것. 거기에 모델링을 하고 전략 콘셉트를 세워서 경험 디자인이라는 아이데이션이 붙고 그 이후 프로토타입이라는 구체화를 시키며 실제 필드 테스트를 통한 구현을 통해 비로소 '만족'을 극대화시키는 세계. 재빨리 돌아가고 새로운 지식도 서비스도 시간이 흐름에 따라 빨리 변화해가는 어마무시한 생태계....

dribbble, The Smilewallet landing page design

dribbble, The Smilewallet landing page design

dribbble, mobile app landing page

dribbble, mobile app landing page

바로 디자인 세계.

기기로 정보를 접하는 세상 속, 우리는 사과 회사 덕분에 (AAPL) 더더욱 디지털 기기와 그에 맞춘 혁명적 혁신을 아주 오래전부터 경험하는 중일 지 모른다. 자신도 모르는 사이에 우후죽순 늘어나는 IT 기기들과 서비스들. app과 web의 세상. 너무나도 빨리 변하는 트렌드들. 재빨리 떠오르다 사라지는 것들, 반대로 오래 남는 것들의 계속되는 작고 큰 변화들. 이 모든 변곡점들의 중심에 언제나 존재하는 디자인. 그리고 그것들을 탄생시키는 데 적잖은 영향을 끼치는 기획. 디자인 세상의 기획은 그래서 참 매력 있고 계속해서 공부하지 않으면 살아남을 수도 없는, 확실히 엄청난 세계인 것만은 분명........(하다고 아직까지 엄숙히 긴장 타며 업계에 랜딩 중!) 하여튼 웰컴 투 매직킹덤이다. 나로서는..... (다음 편 제목은 이것으로 해볼까 싶고)

ABC부터 시작! 참고 이미지

어쨌든 ABC 부터 알아가는; 삽질을 잘 해 보자!

갈 길이 구만 리다.; 천리 길도 한 걸음부터라고 했지만 마음이 좀 조급해진다. 그래도 평정심을 잃지 않고 (다만 매일 동공 지진되는 열공의 나날들;) 이 커리어의 터닝포인트 앞에서 어떤 실패를 거듭해 어떤 성장이 다가올지 개인적으로도 기대가 꽤 크다. (사실 좀 무섭다;ㅎㅎ) 아울러 어쭙잖지만 그동안 사용했던 몇 가지의 앱들 혹은 웹 세상 속의 내가 사용했던 혹은 사용하고 싶었던 혹은 정말 '이건 아니지 않나' 싶었던 서비스들도 기회가 된다면 촘촘히 리뷰를 해 보고 싶기도 하다. 우선은 잘 적응(?) 하면서 틈틈이 기획자로서의 생각, 공부, 자세에 대한 개인 단상과 더불어 실제 현업에서 부딪히며 배우게 되는 여러 장면들을 맛깔난 글로 표현해 보는 것으로! (나름 주특기는 '라이팅' 이 되고 싶어서! 강력한 포부! 의지! 가즈아...;; )

본 게임을 이제부터 짤

하.... 그렇죠. 본 게임은 이제부터인 거죠.

제 무지한 이해에 혹시 오류가 있거나 덧붙이고 싶으신 말씀. 모두 피가 되고 살이 된다 겸허히 생각합니다. 현업 종사자분들 누구든 댓글로 남겨 주시면 감사히 배우겠습니다.

  • *이 콘텐츠의 원문은 헤븐 님의 브런치입니다. 제로베이스 미디어에서 더욱 다양한 필진의 인사이트 콘텐츠를 만나보세요.

    *해당 콘텐츠의 저작권은 원문 작성자에게 있으며, 무단 전재, 복사 및 배포 등을 금지합니다.


추천 컨텐츠