[치미] UI, UX디자이너로 살아남기

 

 

안녕하세요, 트리브 마케터/디자이너 치미입니다!

 

저는 마케팅팀으로 트리브에 들어오게 되었지만, 합류 이후에 디자인 팀 인원이 축소되면서 디자인 보조 느낌으로 UI디자인에도 참여하게 되었어요. 그전까지 UI/UX 디자인은 수업 과제와 동아리 활동 정도로만 진행해 보았고,프로토타이핑 또는 GUI단계까지만 경험한 상태였습니다. 그래서 언니들이 처음에 디자인팀으로 참여해 보겠냐고 제안했을 때 정말 많이 망설였던 기억이 있어요. 그래도, 언니들이 격려와 응원을 해준 덕분에 디자인팀원으로 활동을 잘 시작할 수 있었던 것 같아요!

디자인팀에서의 처음: 통일성과 일관성에 대해 생각해 보다

세상의 모든 아마추어에게 샤라웃을 드립니다.

 

호기롭게 시작했지만,,, 아마추어아마추어 UI 디자이너의 명성이 어디 가지 않습니다. 이론상 디자인시스템을 세워야 한다는 것을 알았지만, 실제로 교내 팀 프로젝트를 할 때에는 시간이 부족해 대충 메인컬러와 폰트 정도만 통일하고 각자 작업하는 경우가 대부분이었습니다. 어차피 대표 기능의 페이지만 제작하면 되었기에 그렇게 깊이 있게 통일성에 대해 생각해 본 경험이 없었어요.

 

 하지만, 트리브는 이미 디자인이 되어 있던 애플리케이션이고, 저는 새로운 화면을 추가하거나 기존 화면을 수정하는 일을 해야 했습니다. 기존 디자인 시스템을 익히고 무드에 맞추어 제작하는 연습을 해야 했어요. 디자인만 하다가, 정해진 틀이랑 규칙 안에서 제가 구상한 화면을 그려내는 것이 생각보다 쉽지 않았어요! 기존에 만들어진 스낵바나 바텀시트가 있다면 최대한 활용해야 품이 덜 들기 때문에 가르디언니한테 ‘이거 있어?’를 많이 물어보면서 디자인했답니다.

 

디자인팀에서의 처음: 개발자와 소통하다

무척 당황하신 참바다씨=회의 중 치미

 

카메라를 켜지 않아서 언니들은 못 보았겠지만, 초반에 줌 회의를 할 때에는 대체로 이런 표정을 하고 회의에 참여했습니다. 진짜 기초 단어도 못 알아들어서 구글에다가 ‘큐…에…이…’라고 검색해 봤던 기억이 납니다. 그러다 발음을 못 알아들으면,'규에이’, ‘큐 에잇’, '큐에잇'이렇게 말도 안 되는 검색어를 치기도 했어요. 당시에는 마케팅팀원이라 회의록을 보고 모르는 것들은 따로 묻고 검색하며 넘길 수 있었죠!

 

 

하지만! UI디자인을 하게 된 치미! 개발자 언니가 질문을 하거나 수정사항을 이야기하면, 대답을 해야 하는 상황에 놓이게 되고 마는데….

 

 가르디 언니(디자이너)는 유언니(개발자)가 개발차원에서 어렵다고 말하면, 찰떡같이 알아듣고 ‘그럼 이렇게 바꾸는 건?’하고 대안을 내놓는 사람이었고… 저에게는 어떤 경지로 올라간 사람처럼 보였어요 마치 like buddha.

하지만 저는 언니가 쉽게 설명해 주어도,이런 상황에서 어떻게 수정하면 좋을지에 대한 데이터가 하나도 없는 사람이었기에… 문제가 생기면 당황해버리고 말았습니다.

 

 

회의 중에 유언니가 여행탭의 스크롤 영역 때문에 디자인을 바꿔야 한다고 이야기한 적이 있습니다. 언니가 분명 어려운 단어로 설명해주지 않았을 텐데, 제가 정확하게 못 알아 들었어요. 하지만…왜인지 솔직하게 아직 이해를 못 했다고 말하기가 어려웠습니다. 그래서 가르디언니한테 가서 다시 질문을 하는 상황이 종종 생겼습니다.

 

사실 이걸 극복하는 방법은 다양한 개발자와 협업해 보면서 경험을 쌓는 것이겠지만... 학부생에게 이런 기회가 많지는 않기 때문에, 당시에는 웹 프런트개발 스터디를 하면서 극복하려고 했었어요. HTML/CSS 배우는 걸로 개발언어를 이해할 수 있기는 만무하지만.... 그래도 화면 위에 디자인이 올라가는 방식에 대해서 생각해 볼 수 있는 계기가 되었던 것 같아요!

 

사실 그때 웹퍼블리셔처럼 기깔나게 웹사이트를 만들고 싶었는데... 실패하다.

 

 

디자인팀에서의 처음: 다양한 경우의 수를 고려해 디자인하다

 

이건 정말 경험의 차이라고 생각했던 부분이었는데, 저는 실제 사용자를 고려한 디자인을 했던 경험이 없었어요. 그러니까, 과제에 제출하기 위한 기능과 기획에 집중되어 있는 프로젝트만 경험했기 때문에 실제 사용자가 어떻게 이 기능을 사용할 것인지에 대한 조건들을 고려하는 관점이 부족했어요.

 

대표적으로는 텍스트 입력창을 디자인할 때, 사용자들이 당연히 '적당한' 양의, '적절한' 내용의 텍스트를 입력할 거라고 생각했어요. 그래서 텍스트 필드나 글자 수 제한까지 고려하는 습관이 없었습니다.

황당한 수준의 아마추어 디자이너.

 

물론 기획팀에서 글자 수까지 정해주는 경우가 대부분이기는 하지만, 기존 페이지를 리뉴얼하는 경우에는 디자인팀이 체크를 했어야 했는데, 저는 깔끔하게 잊어버리고 전달했습니다ㅜㅜ 몇 번 피드백을 받은 이후에는  기본적인 실수가 줄어들긴 했지만, ‘슬라이드하면 몇 번째 이미지까지 보일건지’, ’사진 업로드는 몇 장까지 되는지 ‘생각하고 디자인하는 버릇을 들이는 데에는 시간이 좀 걸렸습니다.

자괴감 가득한 글이네요...

그리고 여러 경우의 화면을 고려하는 습관도 부족했어요...(부족한 것 투성이네...) 메인 페이지를 구성할 때 모든 화면을 만들었다고 생각했는데, ‘여행 만든 적 없는 사용자에게 보여줄 화면'을 놓친다던가 하는 일들이 종종 발생했답니다. 언제쯤 꼼꼼하게 필요한 모든 화면을 만들어갈 수 있을까 걱정이 되었던 나날이었습니다. 

오늘도 디자인 화면을 하나 빼먹은 치미

 

이렇게 빼먹게 되는 이유를 생각해 보니 필요한 화면을 텍스트로 정리하고 디자인을 시작했기 때문인 것 같아요. 가르디언니처럼 필요한 화면 플로우차트를 다 만들고 시작하고, 세부 화면까지 꼼꼼하게 정리하고 시작하는 것이 필요하다는 것을 느꼈답니다.

 

글 다 쓰고 나니 눈물 싹 닦게되네예

 

너무 자괴감만 가득한 글인 것 같지만, 과거의 저를 보니 반성도 되고, 더 많이 배우고 공부해야겠다는 다짐도 되고 좋습니다! 그리고 트리브에서야 이렇게 막내+대학생 취급을 받지만, 저도 어엿한 4학년이고...트리브에서 배운 것들로 학회도 다니고 과제들도 잘 냈습니다. 이렇게 성장했다는 것만으로도 너무 뿌듯하고, 키워주신 언니들 감사합니다!

 

그 외에 말하고 싶었던 것~

 

1) 1:1 피그마 강습

후반부에는 UI를 전부 개편하면서 기존 디자인 시스템에서 많이 변경되었는데, 가르디 언니랑 같이 3D아이콘 찾기 모험하는 것부터 너무 재밌었어요! 이 과정에서 피그마로 오토레이아웃 짜고 컴포넌트 설정하는 걸 많이 했는데, 그게 나중에 진짜 도움이 많이 되더라고요. 일하면서 피그마로 디자인하는 스킬이 정말 많이 늘어서, 동기들 도와주고 그랬는데.... 또 업데이트가 많이 되어서 복학 후에 부지런히 따라잡고 있어요...

 

2) 질문봇 치미의 과거

치미의 간절한 질문 퍼레이드

무슨 슬랙 올리는 것까지 물어봤던 게 너무 웃겨서 올려요..

 

3) 묘하게 파란색을 사랑하게 된 사람..

이상하게 트리브 이후에 작업한 UI가 모두 파란색이더라고요... 무서워서 공유합니다.

 

 

4) 언니들을 향한 편지~

그리고 너무 좋은 팀원언니들을 많이 만나서 정말 많이 배웠어요. 언니들한테 부끄러워서 사실 말을 못 했지만,제가 진짜 존경하고… 늦게 들어온 막내인데도 불구하고 데리고 놀아줘서 고맙다는 이야기… 그리고 언니들이 팀활동하면서 저에게 의견 물어주고, 뭘 하고 싶은지 이야기해 보라고 하는 것들이 다 너무 고마웠어요. 뭔가 이 팀에서 뭘 해내고 싶은지, 어떤 걸 도전해보고 싶은지 생각해 본 적이 없었는데, 계속해서 해보라고 이야기해 주고 더 잘해볼 수 있지 않냐고 조언도 많이 해주셔서 감사했습니다. 삐그덕 거리던 시기도 분명히 있었던 것 같아요. 그치만 이렇게 회고 남길 수 있게 마무리된 것은 다 언니들 덕분인 것 같습니다. 진짜 진짜 감사해요…싸랑해YO!

 

다음 글은 저와 함께 UI/UX를 했던 디자이너 가르디님의 글입니다! 

[가르디/디자이너] 사이드프로젝트에서 UI/UX 디자이너가 해온 것들 (2) 디자인 시스템과 구조 정비