브랜딩을 하다보면 디자인을 겁나 해야합니다. 회의실에서 나온 모든 얘기를 거의 다 만들어낸다고 생각하면 되죠. 로고부터 슬로건, 컬러, 제안서, 소개서, 리플렛, 브로슈어, 책자, 굿즈, 컨텐츠, 배너, 옥외광고 뭐 수도 없습니다. 그러니 브랜딩작업과 디자인은 사실상 뗄레야 뗄 수가 없습니다. 생각에서 시작되서 눈으로 확장되고 경험으로 끝나야 하는 것이 브랜딩이니까요. 이뻐보이지? 난 눈물이 나요..하아...ㅠㅠ얼마나 힘들어쓰꼬그래서 디자이너들이 일 좀 해보려고 의자에 앉았는데 이건 뭐 디자인이 너무 안되는 거야. 갑자기 의자가 너무 푹신하다거나, 뭔가 불편하다거나, 디자인요정이 어느 순간 사라져버리거나 또는 급똥악마가 찾아온다거나 뭐 여러가지 이유가 있겠죠. 디자인 할 줄 몰라서 안되는 게 아닙니다. 우리는 모두 능력자죠. 모두 머릿속에 크리에이티브 요정 한 마리 정도는 지니고 있는 똘똘이들입니다. 그럼에도 불구하고 도대체가 디자인을 할 수 없는 상황들이 있단 말입니다. 이런 상황들이 닥쳐버리면 데드라인 직전까지 육신과 나의 소중한 마이헐트가 만신창이가 되면서 머리만 쥐어뜯고 하염없는 공허속으로 빨려들어가기도 합니다. 사실 우스운 것들이지만 무시무시한 것들이죠.  지금 제가 이 글을 쓰는 이유도 디자인이 안되기 때문이죠. 그래서 도대체 왜 디자인이 안되는 지 냉정하게 생각해보았습니다. 그리고 그것을 정리해보았죠. 오늘은 우리의 크리에이티브 요정을 속박하는 잔혹한 현실들을 알아보겠습니다.하아....디자인 개자식1. 의자가 너무 불편해읏챠갑자기 의자가 불편해 집니다. 사실 의자의 탓이 아닙니다. 어제까지 편했던 의자가 왜 갑자기 불편해졌을까요. 물론 날 자꾸 째려보는 옆 자리 대리님의 의자바꿔치기 공격이 있었을지도 모릅니다. 하지만, 그럴 가능성은 매우 적어요. 그럼 혹시 내가 하룻밤만에 뭔가 체형이 바뀐 걸까요? 아니요. 일이 시작되었기 때문입니다. 아침에 입고왔던 팬티조차도 불편해질 수 있습니다.해결책 : 일이 끝나면 다시 편해집니다.2. 침대가 너무 가까워위허매침대는 위험한 존재입니다. 인간에겐 등센서라는 것이 있습니다. 신생아때부터 간직하고 있는 것이죠. 무언가가 등에 눕혀지거나 엄마등에 매달려있어야 잠이 오는 것입니다. 당연히 무언가가 등에 기대지는 순간 나른해지는 것이 양서류가 지상에 올라온 이래 생물의 DNA에 새겨진 본능인데, 그것을 거스른다는 것은 거대한 자연의 섭리를 이겨내야 한다는 것이죠. 그런 일은 우리에게 있을 수 없습니다.해결책 : 카페로 갑시다. 카페에서 일이 잘되는 이유는 누울 수 없기 때문입니다.3. 핀터레스트가 너무 재밌어그건 악마같은 사이트야. 볼수록 재밌다고. 심지어 예전에 봤던 거 또 봐도 재밌음. 레퍼런스 찾으러 갔다가 헤어나오지 못하는 광활한 네트워크가 허락한 유일한 마약이죠.해결책 : 와이파이신호가 2개정도 뜨는 곳에서 작업을 합시다. 이미지로딩이 답답해지도록.4. 배가 고파먹고만있어..디자인은 극도의 크리에이티브 작업이므로 수많은 당을 필요로 합니다. 인간의 당은 간과 허벅지 단일근육 하부에 저장되어 있는데, 두뇌활동이 활발해지기 위해선 이 당을 분해해서 원료를 만들어야합니다. 그러니 일을 할 때 '당이 떨어진다' 라는 말은 일리가 있는 얘기입니다. 근데 디자인할 땐 그냥 시도때도 없이 배가 고프다는 것이 문제입니다. 제 생각엔 그냥 일을 하기 싫어서인 것 같습니다. 해결책 : 참쌀선과, 참쌀선과를 먹읍시다.5. 음악이 맘에 안들어노동요는 필수임디자인할 때 음악은 중요합니다. 물론 케바케지만, 대부분은 자신만의 노동요를 가지고 있기 마련이지요. 하지만 카페에서 자꾸 시끄러운 음악, 싫어하는 종류(저는 주로 아이돌음악..)등이 꾸준히 나오면 아주 환장하겠습니다. 이어폰이나 헤드셋을 끼고 일하는 것도 1,2시간이지 나중에는 귀가 아리고 땀차서 못끼고 있겠더라구요. 노동요의 선정과 청취는 크리에이티브 요정을 편케 해줍니다.해결책 : 노이즈캔슬링 헤드셋을 삽시다. 놀라움을 경험할 수 있습니다. 팀장님 얘기도 안들림.6. 조명이 맘에 안들어눈부셧!조명이 노래서, 조명이 하얘서, 조명이 밝아서, 조명이 어두워서... 모든 조명이 다 거슬립니다.햇빛이 강하면 노트북이 잘 안보이고, 햇빛이 약하면 졸리고..해결책 : 노란 카페!!..노란 카페가 좋습니다. 노란 불빛은 크리에이티브 요정의 양식과도 같죠.7. 사진을 못 찾겠어대부분 디자인은 이미지 찾는데에 시간을 많이 쏟게 되더군요. 환장합니다 정말. 내가 원하는 그 사진을 찾아야 하는데 외국 저작권프리 사이트를 겁나 뒤지는 것은 못잡아도 1,2시간 이상이 걸립니다. 딴 짓하고 있는게 아니라 진짜 이미지를 못 찾겠습니다. 나중엔 막 합성도 하고, 보정도 해보지만 원본자체가 개똥인데 이쁘게 반죽한다고 똥이 아닌게 되는 건 아니죠. 해결책 : 어쩌다 맘에 드는 사진을 찾으면, 워터마크. 결국 돈인가...8. 폰트를 못 찾겠어예쁜 폰트를 찾아야 하는데 도대체 이 폰트 저 폰트 다 찾아봐도 맘에 안듭니다. 보통은 디자이너들이 사랑하는 몇 개의 폰트가 있긴 합니다. 그래서 일반적인 텍스트는 보통 그것만 쓰죠. 하지만 종종 아트웍을 해야할 때는 아웃라인 따서 이래저래 편집해야 하는 경우가 있단 말입니다. 그것에 어울리는 폰트를 찾는 것은 참으로 고역입니다. 해결책 : 유료폰트9. 훈수쟁이의 출현몇 시간 동안 자간 맞추고, 그리드 맞춰서 아트웍해놓으니 스윽 지나가던 훈수쟁이님이 '그거 좀 잘 안보이지 않겠어?' 라고 슥 지나갑니다. 아쉽게도 훈수쟁이는 대부분 나의 윗사람들입니다. 해결책 : 아주 현수막을 만들어서 방에 붙여드립시다.10. 방망이깎는 노인이 오셨다!!!장.인.정.신가끔 그 분이 오십니다. 그 분이 오시면 사실 모든 것이 끝난거야. 바로 장.인.정.신 이죠. 이 분이 마음속에 방문하시면, 사륜안을 개안하면서 픽셀단위의 오점들이 눈에 보이고 누끼의 완성도가 거의 크로마키 사진급으로 상승합니다. 그 댓가로 시력과 손목, 시간을 날려먹을 수 있습니다. 해결책 : 디자이너에게 방망이 깎는 할아버지는 랜덤하게 찾아오시므로, 막을 수 없습니다.11. 아이디어 요정이 오셨다!!!안녕?다 만들고 나면 아이디어 요정이 백색의 간달프마냥 헬름협곡 동쪽에서 찾아오십니다. 왜 시안을 구상할 땐 그게 생각나지 않았을까. 하지만 이 요정을 그냥 지나치기에는 너무 큰 대군을 몰고 오셨기에, 우리는 또 새로운 시안을 만들기도 합니다.해결책 : 대부분은 처음 만든 것이 컨펌됩니다.12. 자료를 안줌그것만 오면 되는데 그게 안옵니다.해결책 : 오후 약속을 취소합니다.13. 뭔 말인지 모르겠어.존나 모르겠다.이해 할 수 없는 비지니스모델이나 전문용어들이나 복잡한 개념들이 가득한 경우가 있습니다. 철골구조 중 H형강의 접합 시 문제점을 해결하기 위한 단방향체결식 볼트라던지... 그런것들.(실제로 만들어 봤었는데 토목공사의 프로세스를 공부해야했습니다.)해결책 : 오유에 이게 뭔 말이냐고 올려봅시다.생각보다 쉽게 잘 알려주더군요. 신뢰도는 반반14. 하얗게 타버렸어주화입마사람마다 다르지만 보통 한 번 방망이 할아버지가 오시거나, 또는 훈수쟁이가 와서 영혼을 불태우다 보면 몇 시간 내로 하얗게 재만 남은 육신을 발견할 수 있습니다. 이 육신은 당분간 제 정신으로 일을 할 수 없으며, 일의 속도가 급격하게 느려지고 사고능력이 저하되는 등 심리적 무정부상태 또는 주화입마와 비슷한 상태가 됩니다. 더 이상 뭐가 생각나지도 않고 생각하기도 싫은 지경이 됩니다.해결책 : 내일의 나를 믿어봅시다.15. 누군가 똥을 싸놓고 갔다..개똥같은...협업은 말은 아름답지만 현실은 잔혹한 경우가 많습니다. 누군가가 대략 시안잡아서 넘겨줄테니 툴작업만 해달라기래 오후6시에 온 시안을 손에 쥐어봤더니 나에게 왠 이 세상의 것이 아닌 듯한 무의식의 청사진같은 것이 쥐어져 있습니다. 해결책 : 그냥 내가 양식을 만들어 주고 빈칸을 채우라고 합시다.16. 해가 떨어지지 않았다.낮엔 디자인이 잘 안됩니다.해결책 : 24시간 카페는 시험기간 대학생과 디자이너를 타켓팅으로 한 공간입니다.17. 화장실에 그 분을 버리고 나옴보통 크리에이티브 요정은 머리나 마음속에 있다고 하는데, 제 생각엔 대장이나 방광 정도에 존재하는 것 같습니다. 한참 소변 참아가며 죽도록 집중해서 디자인하고 있다가, 이제 더 이상은 안되겠다 싶어서 화장실에 다녀오면 그 분이 사라져있습니다. 아마 물과 함께 쓸려내려가신 듯 합니다. 그 분이 떠나신 뒤엔 속도가 엄청나게 떨어지면서 귀찮음이 그 빈자리를 채웁니다.해결책 : 어쩔 수 없지 뭐..18. 컴터가 꼬졌음기회는 이 때다. 새로 사자크게 두 가지 종류가 있습니다. 저장 시에 메모리문제로 튕기는 경우와, 그냥 이것저것 함께 켜놓고 하다가 작동이 중지되는 경우죠. 우리에게 애시당초 선택권이 없는 '온라인으로 해결 방법을 확인하고 프로그램을 닫습니다.' 따위의 선택지를 주지만 어차피 뭘 눌러도 넌 망했다는 얘기입니다. 해결책 : 메모리 문제라면 가상메모리를 늘려서 일시적으로 해결은 가능합니다. 링크참조해보세요. http://imrich.tistory.com/981 / 그냥 작동이 중지되는 경우는 대부분 망할 안랩과 베라포트 등의 백신프로그램이 리소스를 엄청 잡아먹고 있는 탓도 있고, 다양한 프로그램을 한꺼번에 돌리고 있는 경우에 자주 발생합니다. 일단 빌어먹을 백신은 다 지워버리고, 인터넷창이나 쓸데없는 것들은 일단 꺼둡시다. 아니면 그냥 이 참에 다 부셔버리고 좋은 것을 삽시다.19. 저장을 안함뭐라 할 말이없다..침.통해결책 : 절레절레.. 컨트롤에스를 소중히 하지 않았군..20. 그냥 일이 많음사실 이겁니다. 디자인은 이렇게 해줘요! 해서 30분만에 뚝딱 만들어지지 않습니다. 이미지 가져다 붙이고 텍스트 정렬만 하는데 뭐 그렇게 시간이 걸려??? 라는 말은 매우 창피를 당할 수 있으니 삼가도록 합시다. 보통 그렇게 우스워보이는 심플단순한 시안이 나오려면 그 이전에 몇 개의 시안을 갈아엎고 다시 만들었는지 모를 일입니다. PPT 한 장을 장당 10분으로 계산한다거나, 포스터 하나 그냥 2시간정도? 로 생각하시는 분들이 21세기에도 현존하시며 디자이너에게 그냥 생각나는 대로 마구 오퍼를 주시는데... 도덕적으로 옳지 못한 일입니다.해결책 : 곧 이것을 해결하기 위해 책이 나옵니다. 제 책. (헤헤헤헤..)

시작하기전에...오늘 내용은 디자이너님들을 위한 내용이 주를 이룹니당 :)그런 경험이 겁나 많았어요. 분명 쟤 시안이 딱히 더 이쁜 건 아닌데 이상하게 쟤 건 쓱쓱 컨펌나고 내 껀 원죄라도 짊어진 듯 반려만 오만번... 왜 쟤만 항상...?도대체 뭐가 문젠지 아무리 들여다봐도 시안은 아주 정상적이고 전혀 문제도 없단 말이죠. 정렬도 정확하고 색도 기가막혀. 내가 봐도 이건 천년에 한 번 나올까말까하는 역대급시안이야. 근데.........내 것만 맨날 싫대. 다시 해오래. 그 느낌 아니래. 뭔가 좀 부족하대. 쓰읍...다 괜찮은데 쪼금..그 뭔가 하아..그게 없대. 도대체 그게 뭐냐고오............오늘은 시안컨펌의 비밀을 한 번 까보려고 합니다. 일단 컨펌이 안나는 이윤 3가지가 있습니다.1. 내가 맘에 안들어2. 답정넌이야(내가 원하는 그 그림이 아냐. 물론 그 그림을 얘기해주진 않을거야.)3. 진짜 걔가 더 잘했어 네 그렇습니다.  사실 사회생활이란 게 익히 아시다시피 노력한만큼 정당한 결과가 늘 주어지진 않더라구요. 사실 한 번 눈밖에 나면 내가 국보급 시안을 가져가도 뭔가 색안경을 끼고 보기 마련입니다. 컨펌하는 분과 어느정도의 친근친근한 관계를 유지해놓는 것은 굉장히 유리한 일입니다. 딱히 시안이 예쁘진 않지만 맨날 팀장님과 술친구하던 저 녀석은 조금만 어찌저찌 에이 팀장님, 눈으로 찡긋, 오늘 치맥콜? 하더니 컨펌되버리고..나는 엊그제 팀장하고 옳은 UX에 대해 논쟁을 벌이다가 그 분의 심기를 건드려버린 탓에 벌써 7번째 반려당하고 있는 게 또 현실입니다... 정말 분비물같은 현실이죠...네 맞아요, 우리는 지금 디자인이라기보단... 정확히는 '일' 을 하고 있는 중입니다.아부 클라스가 아주 붓글씨로 적어 현판을 걸어야겠다.2번, 답정넌은 뭐 거의 모든 경우에서 찾아볼 수 있습니다. 대부분은 설명은 잘 못하겠고 할 수 있어도 말해주지 않지만 넌 내 생각을 알고있어야 하죠. 그리고 그 그림과 다르면 반려당합니다.  세번째 원인처럼 진짜 포인트를 잘못잡고있는 경우일 수도 있어요. 지금 우리 기획방향과 이 디자인의 목적성이 예쁨인지 아니면 가독성인지, 자극을 주는 용도인지 뭔지 다시 생각해봐야 할 경우예요. 실상 수많은 디자인업무에서 진짜 고퀄의 예쁜 디자인을 필요로 하는 경우는 그리 많지 않더라구요. 오히려 워딩이나 구성, 가독성이 주가 되어야 하는 경우가 훨씬 많죠. 그렇다면 최대한 컨펌나게 한 번 해봅시다.일단 선작업이 좀 필요해요. 모든 사람들은 뭔가 원하는 그림이 있기 마련입니다. 대부분 그걸 간파해주길 바라죠. 진짜 얼토당토않는 요구지만, 어쨋든 불평만 하고있을 수 없잖습니까. 일은 해야하니까요. 그러니 간파해보자구요.  1.     비슷한 컨셉의 시안은 금물. 보통 처음에 레퍼런스를 보여주면서 컨셉을 정할 때 승부를 띄워야해요. 그때 보통 3개 정도 컨셉레퍼런스 이미지를 가져가잖아요. 이 때 주의할 건, 완벽하게 다른 걸 가져가라는 거예요.(좌부터) 안드레이 몰리 보슈 코 作, 서울사회적기업협의회, Veerle Pieters-  글 없고 여백많은 심플한 컨셉의 시안(누가봐도 포토샵) -  공공입찰제안서와 같은 알차고 빼곡하며 클래식한 분위기의 시안(누가봐도 PPT) -  플랫아이콘과 컬러감이 살아있는 벡터 중심의 시안(누가봐도 AI)  예전에 이상형월드컵 기억나세요? 일단 그런식으로 압축시켜 나가야 해요. 완전히 다른 시안3개를 주면 고민의 폭이 굉장히 줄어들어요. 사람은 대부분 자기 생각에 대한 확신이 없어요. 그냥 확신이 있다고 생각만 하고 있을 뿐이죠. 정작 원하는 걸 구체적으로 물어보면 대부분 자세히 대답하지 못해요. 이를테면 이런 식이예요. 이상형 누구야? 하면 누구같은 사람 어떤 사람 얘기하잖아요. 나름 분명하다고 생각할 거예요. 그럼 이렇게 물어볼까요? 쌍꺼풀은? 코 높이는? 피부톤은? 울대는 나와있어야 해? 어깨가 좋아 등근육이 좋아? ...정작 이렇게 하나하나 물어보면 고민한다구요. 우리가 확실하다고 '생각'하는 것들은 대부분 착각입니다. 눈으로 보여야 그제서야 구체화되기 시작해요. 그래서 눈으로 보여주는 거예요. 구체적으로 까이기도 하고..'당신이 원하던 건 이런거였어!' 라고. 상대방이 생각을 압축할 수 있도록 차근차근 제시해주는거죠. 그래서 이 때 보여주는 시안들은 비슷해선 안되요. 완전히 하나를 선택할 수 있게 확실하게 다른 종류들이어야 합니다. 하나가 사진위주의 스큐모픽이라면 다른 하나는 완전 벡터이미지 가득한 플랫디자인 이미지인거죠. 2.     컬러, 정렬, 톤 순서로 압축시켜요!뭔가 디자인컨셉이 잡혔다면 이젠 컬러를 잡읍시다! 세상엔 오조오억개의 색이 존재해요. 그러니 무턱대고 어떤 색으로 할까요? 라는 질문은 '그건 니가 정해야지!' 라는 카운터어택으로 돌아옵니다. 그러니 객관식으로 정리해서 선공을 날리도록 합시다.색구성방식엔 HSB가 있는 걸 알고계실 거예요. HSB는 색도(Hue), 채도(Saturation), 명도(Brightness)로 나뉘어지잖아요. 상대방에게 컬러를 제안할 땐 B-H-S 순서로 제안해보도록 해요!- 밝게 가요? 어둡게 갈까요?(전체톤)- 빨주노초파남보 중에 어떤 컬러톤으로 갈까요?(메인컬러)- 색은 진하게가요 부들부들하게 가요?(메인컬러 채도)B복잡하게 갈 필요없이 ‘어두운 톤에 밝은 글씨로 갈까요? 밝은 배경에 어두운 글씨로 갈까요?’ 이것부터 확정지어 보아요. 회색배경은 거의 선택하지 않아요. 그러니 선택항에서도 아예 빼버리도록 합시다. 괜히 하나 더 물어봐야 혼란스럽기만 하거든요. H다음은 색도를 정해보아요. 빨주노초파남보 중 뭘 고르고 싶은지 물어보는 거예요. 놀랍게도 대부분의 사람들은 파란색이나 보라색계열을 많이 선택하더라구요. 물론 팬톤에선 올해의 색을 출시하고 실제로 컬러는 산업전반에 큰 영향을 미치기는 하지만, 우리 옷장엔 무채색 옷이 즐비한 것을 보면 인간의 색채선택은 꽤나 제한적이예요. 새로운 색에 대한 공포심은 디자인시안에도 그대로 적용되죠.  실제로 조선일보에서 진행한 색채 선호도조사에선 우리나라 355명의 성인 중 16.9%가 파랑을 가장 좋아하는 색으로 선택했다고 해요. 2위와 3위는 동률로 초록색과 보라색이 선택되었어요. 모두 푸른 계열의 색상이죠. 싫어하는 색은 18.6%로 주황색, 핑크(12.2%)와 빨강(11.9%)가 그 뒤를 이었답니다. 모두 붉은 계열의 색상이예요. 특히 우리나라 사람들의 옷장엔 대부분 검정, 남색, 흰색, 파랑, 회색 등의 옷이 가득한 것을 생각해보면, 어떤 색을 먼저 제안해야 할 지 대략 감이 올 듯 하죠?근데 이런 고민이 들어요. 이번컨셉은 도저히 파란색이 어울리지 않아. 무조건 부농부농으로 가야해!! 그런데 팀장님이 파란색덕후야 완전 스머프야. 어떻게 할까요? 네 맞아요. 일단 파란색으로 가요. 우리는 일을 하고 있어요. 일단 그 사람의 신뢰와 호감을 얻는게 먼저에요. 파란색으로 가면 본인도 이게 아니라는 걸 알거예요. 그러면 그 때 넌지시 제안해봐요. '그럼 혹시...부농색은 어떨까요? 이번 컨셉에도 꽤나 잘 어울리고.. 좀 색다를 것 같은데요..'라고. 팀장의 의견을 충분히 들어주었으니 이제 본인도 너그러운 사람이 되고싶어요. '어 그래, 그렇게 한 번 해보자.' 라고 말할 수 있어요. 뭔가를 요구할 때는 상대방이 자신의 체면을 구기지 않으면서 무언가를 제공할 명분이 있어야 해요. 하나를 주고 두번째 수를 생각하는 게 훨씬 좋아요.S 만약 윗사람의 취향이 놀랍게도 특이해서 민트색이 정해졌다고 해볼께요. 이젠 마지막으로 채도를 정할 차례예요. 파스텔톤의 부드러운 민트색도 있고, 화창한 하늘색과 같은 민트도 있고, 페리오치약색도 있고, 굉장히 불량해보이는 피스타치오 아이스크림 색과 같은 진한 민트색도 있어요. 민트색은 그 종류만 수백만가지가 될 수 있어요. 미묘한 차이까지 포함하면 거의 무한대에 가깝죠. 그러니 거두절미하고 우리가 먼저 제안하도록 해요. 채도를 10단계로 쪼개요. 어렵게 할 필요없어요. 진한색기준으로 투명도(opacity)를 10%씩 줄여요. 그렇게 10개 색을 만들어서 고르게 만들어요.물론 이렇게 해서 최종적으로 색을 골라도 어차피 나중에 또 바뀔거예요. 반쯤 포기하고 그냥 고르라고 하세요. 색이 정해진 후엔, 가운데/왼쪽/오른쪽 정렬 중 어느 쪽으로 레이아웃을 정리할 지 정해요이미 대략적인 레이아웃 포맷을 잡아가도 좋아요.마지막으로 폰트와 톤을 정리해요.전체적으로 둥글고 부드러운 톤으로 갈 것인지, 각지고 정렬된 느낌으로 갈 것인 것 등의 톤을 정리하면 두 번째 관문이 끝나요. 짱복잡해요. 하지만 글로 쓰니까 긴거예요. 실제로는 5분안에 끝날 수 있어요.   3.     순서를 정하고 이유를 달아줘요!시안을 보고하러 가는 눈빛이젠 시안이 완성된 다음 보고하러 갈 때의 노하우예요. 보통 하나만 덜렁 가져가진 않아요. 그건 아주 초보적인 거예요. 적어도 3개의 안을 들고가는게 맞아요. 보통 노련한 분들은 이쁜거 하나, 특이한 거 하나, 그지같은 거 하나를 들고가요. 하나는 버리는 카드고 내가 미는 시안을 1번으로 달아요.사실 시안이란 것은 대부분은 ‘느낌’에 의해서 만들어져요. ‘쌍꺼풀 있는 사람이 좋아.’라고 얘기하면서도 정작 내 연인은 무쌍인 경우를 생각해보면 쉽게 이해가 가죠. 원함과 실제는 굉장히 달라요. 원함은 굉장히 추상적이예요. 그리고 이유를 설명하기 어렵죠. 그러니 우리가 이유를 만들어줘요. 이유를 달아줄 땐 어려운 얘기 쓰지 말고, 이것을 선택하지 않으면 생기는 문제점들 위주로 말해줘요. 2번시안은 좋긴 한데, 가독성이 좀 떨어질 수 있고, 3번 시안은 사람에 따라 호불호가 있을 수 있다는 등등…맞아요 결국엔 ‘1번을 선택하세요.’ 란 얘기예요. 만약 그럼에도 상대방이 2번이 좋다고 할 수도 있어요. 사람의 마음은 순천만갈대보다 더욱 휘청거리니까요. 하지만 막무가내로 우기진 않을거예요.  ‘2번에서 글자를 크게 키워서 가독성을 높여주세요.’ 정도로 정리되겠죠. 왜냐구용?앞에서 우리가 그렇게 하나하나 꼬집꼬집 물어보면서 정리해놓은 히스토리가 있잖아요. 본인이 직접 정하고 골랐던 경험이 있으니 자신의 선택에 대해 번복하는 건 좀 부끄러운 일이예요. 그냥 적당히 합리화시키는 편이 더 빠르고 효율적이예요. 사람의 선택은 대부분 이렇게 이루어지죠. 물론 이와같은 각고의 노력에도 불구하고 그냥 다 맘에 안드니 다시 해!!! 라고 할 수도 있어요. 사람도 아니예요. 그래선 안되는거예요. 나쁜새럼...혼란하다 혼란해.....아니 그럴거면 왜 이런 고생을 해요? 라고 하겠지만, 저 과정은 그 자체로 두 가지 의미가 있어요.일단 여러분이 명쾌하고 깔끔한 커뮤니케이션을 하는 사람임을 어필할 수 있어요. '와, 쟤 진짜 뭔가 체계적이다...' 라는 이미지를 줄 수 있죠.그리고 명분을 획득할 수 있어요. '팀장님이 이거 좋다면서요!?' 라는 명분과 '지금까지 주구장창 당신의견을 들어줬으니 이제 내 의견도 들어워요!' 라고 말할 수 있는 명분말이예요. 그러니 앞으로 컨셉 레퍼런스를 정할 땐, 조금 더 몇장 준비해서 가져가도록 해봐요. 질문 몇 개가 더 추가되는 것만으로도 뭔가 쉽게 정리되는 느낌을 받을 수 있을거예요. (물론 그전에 다소 돈독한 관계가 쌓여있는 상태라면 더욱 좋을 것 같아요.. 혹시라도 찌릿찌릿한 웬수관계라면 이번 기회에 커피타임이라도 한 번 가져보도록 해요... 이것도 저것도 아니면 팔근육과 갑빠를 키워보아요...)스킬사용조건 : 최소한 상대방이 사람의 말을 이해할 수 있어야 한다. 시전자와 상대방의 관계가 좋을 경우 100%의 추가효과를 부여받는다. 그러나 상극일 경우 효과는 일정확률로 효과는 0가 된다.

(UX 디자이너 Nikita Gangwal의 미디엄을 번역하였습니다. 의역 많습니다. 원문 출처: https://medium.com/@nikitagangwal.27)어떻게 하면 앱 개인화를 통해 사용자 경험을 다음 단계로 끌어올릴 수 있을까?앱을 비롯한 많은 제품들의 개인화는 사용자들에게 유용한 정보를 추가적으로 제공함으로써(그들이 요구하지 않았음에도) 사용자 경험을 한 단계 끌어올린다. 낯선 장소에 방문했을 때 그 곳에 대한 추천을 받고 싶지 않은 사람은 몇이나 될까? 매일 아침 간단한 아침 레시피를 빠르게 추천받고 싶지 않은 사람은? 만약 네비게이션이 당신의 사용 패턴을 파악한 뒤 매일 저녁 6시에 집으로 향할 것인지 조심스레 물어본다면 어떨까? 이 모든 것들이 당신이 요청하기도 전에 이뤄진다면? 이처럼 인간은 누군가가(혹은 무언가가) 자신들을 관리해주고 작업량을 덜어줄 때 편안함을 느끼는 경향이 있다.‘개인화’란 무엇일까?시스템이 정보, 기능, 콘텐츠 등을 사용자의 니즈와 기대에 따라 실시간으로 추천(curation)해줄 때, 우리는 이것을 개인화라고 부른다. 이 때 앱은 사용자에게 가장 최적화된(unique) 경험을 제공하기 위해 시스템 내에서 유저 데이터로부터 습득한 기술을 사용한다.개인화는 왜 필요한가?사람들은 앱이 개인적인 경험을 제공할 때 더 좋아한다. 자신이 좀 더 특별하고 앱과 연결된 것처럼 느낄 수 있기 때문이다. 만약 앱에 개인화된 요소가 단 하나도 없다면, 해당 앱이 실제로는 도움이 될지언정 사용자는 딱히 도움이 안된다고 느낄 수도 있다. 이해를 돕기 위해 Spotify Running의 사례를 보면, 스포티파이는 이제 단순한 음악 감상 앱이 아니다. 스포티파이는 단순 음악 감상에서 나아가, 사용자가 달리는 속도에 맞는 템포의 음악을 추천함으로써 달리기를 계속할 수 있도록 의욕을 불어넣어 준다. 핸드폰 센서를 통해 사용자가 분 당 몇 걸음이나 걷는지를 감지하고 이와 비슷한 비트의 곡을 찾아내는 것이다. 이처럼 Spotify Running이라는 고도화된 개인화 기능이 없다면, 스포티파이는 단순한 음악 앱에 불과할 것이다. 오해는 마시라. 플레이리스트에서 내가 가장 좋아하는 곡을 찾아 듣는 경우라면, 스포티파이는 여전히 최고다. 하지만 여기서 한걸음 더 나아가, 개인화된 서비스는 사용자의 페인 포인트와 니즈에 적절히 대응할 수 있다는 점에서 대단히 매력적으로 어필할 수 있다. 이는 빠르게 사용자와 앱 사이의 유대감을 만들어내고 해당 브랜드에 대한 충성(loyalty)을 이끌어낸다.앱 내에서 개인화 서비스가 효과적으로 이루어진다면, 당신은 브랜드에 대단한 충성심과 애착(affinity)을 지닌 사용자들을 확보한 셈이 되고 장기적으로 매출이 눈에 띄게 오를 것이다. 연구에 따르면 유저가 멋진 사용자 경험을 했을 경우 ‘closing the deal’ 상황에서 더 빠르게 행동하는 경향이 있다.어떻게 제대로 실행할 것인가?1) 리서치, 또 리서치: 절대 이 단계를 건너 뛰면 안된다. 당신의 브랜드에 개인화가 필요하다면 어느정도가 적당한지 반드시 이해하라. 사용자에게 무엇이 중요한지, 한계는 무엇인지, 다양한 고객과 관련되어 있는지 파악하라. 2) 단순하고 자연스럽게: 사용자가 앱을 이용할 때 단 1초라도 혼란을 느낀다면 좋은 경험이 아니다. 개인화는 물흐르듯한 사용자 경험을 위한 첫 단계이기 때문에 사용자가 거의 눈치챌 수 없을 정도로 매끄러워야 한다.3) 반복적인 테스트: 1단계 리서치 만큼이나 중요하다. 유저 테스트는 지금 하고 있는 것이 옳은 것인지 알 수 있는 유일한 방법이다. 반복된 테스트를 통해 발견하는 인사이트는 대단히 놀라울 것이다. 이를 통해 각각의 사용자에게 꼭 맞는(tailor-made) 경험을 제공할 수 있을 것이다.Luminosity사용자의 매일의 활동과 스킬 수준에 따라 훈련 활동을 추천해주는 고도로 개인화된 두뇌 훈련 앱이다. 사용자는 앱에 빠르게 적응함으로써 서비스를 대단히 흥미롭고 재미있게 이용할 수 있다.Airbnb최근 업데이트된 에어비앤비 모바일 앱은 개인화가 핵심이라고 한다. 사용자가 도착지를 설정하면 에어비앤비는 백만 개가 넘는 현지인의 여행 팁이 담긴 해당 도시의 가이드북을 제공해준다. 가이드북에는 해당 도시에 살고 있는 호스트가 직접 추천한 최고의 식당, 경험, 볼거리 등이 담겨있다.Netflix넷플릭스는 사용자가 봤던 영화들과 비슷한 종류의 시리즈를 추천해줌으로써 개인화를 제공한다. 이들은 사용자들의 영화 관람 내역과 랭킹을 모니터링하는 복잡한 자체 알고리즘을 통해 이를 성공적으로 해내는 중이다.YummlyYummly는 사용자의 음식 선호도나 제약 조건과 관련된 레시피를 찾도록 도와주는 유명한 사이트 중 하나다. 사이트에 접속했을 때 사용자들은 본인의 음식 선호를 나타내는 조건들을 세팅하게 된다. Yummly는 이 조건들과 함께 사용자의 검색 패턴을 이용해 그들의 기대에 완벽하게 부응하는 레시피를 추천한다.개인화가 잘못되었을 때...개인화 경험을 제공할 때 주의를 기울이지 않으면 사용자와의 유대감 뿐만 아니라 그동안 이들과 쌓아올린 브랜드의 신뢰도까지 망가질 수 있다. 이러한 실수를 방지하기 위해서는 당신의 사용자에 대해 잘 아는 것이 중요하다. 요약하자면, 개인화는 적절한 사람에게 적절한 타이밍에 적절한 양의 정보를 제공할 때에 효과적이다.Know your audience!완전히 잘못된 타이밍에 적절하지 않은 사용자에게 정보를 제공한다고 가정해보자. 어떤 일이 벌어질까? 아마 당신은 전반적인 브랜드 평판에는 영향을 주지 않는 작은 에러 정도로 생각할 수도 있겠다. 하지만 불행히도 마케팅이 잘못됐을 때, 이는 정말(very, very wrong) 잘못될 가능성이 있다. 이 예가 대단히 정확하진 않지만 나는 시사하는 바가 있다고 생각한다. 다음과 같은 최악의 고객 경험을 생각해보자. 이 아버지의 날 광고는 고객 타겟팅을 할 때 절대 하지 말아야 할 완벽한 예시다. 이 광고는 많은 잠재 고객들을 고려했지만, 때때로 이 가정들이 옳지 않을 수도 있음을 보여준다. 잠재 고객의 고통을 의도한 건 아니지만 이는 명백히 잘못된 타겟팅이다.몇 가지 중요한 팁들1. 개인화를 가치를 더하기 위해 사용하라. 그냥 중요하다고 느껴져서 사용하는 것은 삼가라.2. 잠재 고객에 대해 가정하지 마라. 완전하고 정확한 정보를 얻을 때까지 조사하고 테스트하라.3. 개인화가 너무 자세해지면(If it goes to far) 사용자는 소름끼쳐 한다.4. 좋은 사용자 경험은 미묘하고 눈에 띄지 않을 정도로 이루어질 때 가능함을 기억하라.사용자 경험의 전망개인화 트렌드는 계속 진화하고 있다. 가장 친숙한 개인화 방법은 사용자의 이름을 불러주거나 키워드 매칭을 통해 그들과 관련된 콘텐츠를 보여주는 것이다. 현재 앞서 살펴본 사례들과 같이 다방면에서 개인화된 앱을 볼 수 있다. 앞으로 머신러닝이 사용자의 정성적인 데이터로부터 ‘스토리’를 이해하고, 사용자들이 삶 전반의 다양한 변화를 경험함에 따라 개인화는 완전히 새로운 수준의 완성도를 갖추게 될 것이다. 이를 통해 개인화된 앱들은 사용자에게 놀라운 경험을 제공하게될 것이다.#더팀스 #THETEAMS #디자이너 #디자인 #인사이트 #성장 #마음을움직이는디자인

출처 – 한화 스토리허브　아름다운 불꽃을하늘로 쏘아 올리는 회사에취직하고 싶다면?　서울의 가을밤을 아름답게 수놓는 한화 서울세계불꽃축제! 이 아름다운 불꽃은 과연 누가 만드는지, 어떻게 하면 나도 이렇게 멋진 불꽃을 쏘아 올릴 수 있는지! 멀티미디어 불꽃 쇼를 보며 '나도 이렇게 모두에게 감동을 주는 사람이 되고 싶다'라고 생각한 분들이 있을 것 같아서 준비했습니다. 한화의 풍성한 채용정보를 전하는 ‘JOB 길라잡이’, 네 번째 순서는 ㈜한화와 함께합니다.이번에는 ㈜한화/화약 불꽃프로모션팀에서 10년 차 불꽃 디자이너로 활약 중인 윤두연 과장과 인사팀에서 조직문화, 교육 및 해외인사를 담당하고 있는 권지연 사원께서 ㈜한화의 채용 정보를 알려드립니다. 이들이 쏘아 올린 채용의 불꽃, 지금 #키워드로 전해드립니다.　출처 – 한화 스토리허브　Q. 감동을 선물하는 ‘불꽃 프로모션 팀’의 #탄생 비화는?윤두연 과장(이하, 윤 과장): 한화가 화약을 기반으로 성장한 회사라는 사실, 모두 알고 계시죠? 일반적으로 ‘화약’ 하면 부정적이거나 위험한 이미지를 연상하는 경우가 많아요. 하지만, 화약이 사람들을 행복하게 하는 ‘불꽃’으로 빛날 수도 있다는 것을 알리기 위해 불꽃프로모션팀이 탄생했어요.원래 ‘연화사업부’라는 이름으로 활약하고 있었지만, ‘불꽃의 모든 것’을 다 해내자는 취지에서 한자어인 연화 대신 지금의 이름으로 바뀌었답니다. 현재 불꽃프로모션팀은 한화를 세계에 알리는 얼굴로서, 매번 새롭고 아름다운 불꽃을 표현하기 위해 노력하고 있습니다.　출처 – 한화 스토리허브　Q. ㈜한화의 주요 #사업 분야와 불꽃 프로모션 팀의 사업 분야는?㈜한화는 1952년 국가와 사회에 기여한다는 창업 정신으로 설립되어 지난 60여 년간 국가발전에 기여해왔습니다. 사업군은 크게 화약, 방산, 기계, 무역 4개 부문으로 나뉘는데요. 핵심 역량을 바탕으로 국내뿐만 아니라 세계 시장까지 진출하고 있는 한화그룹의 자랑스러운 모기업입니다.그중에서도 여러분이 가장 친숙하다고 할 만한 사업군이라면 바로 ‘화약’이겠죠? ㈜한화는 멀게만 느껴지는 ‘화약’을 보다 친근한 소재로 만들기 위해 ‘불꽃 프로모션 팀’의 주도하에 매년 불꽃 축제를 기획 및 진행하고 있습니다.　출처 – 한화 스토리허브　윤 과장: ㈜한화의 불꽃 프로모션 팀을 좀 더 설명해 드리자면, 불꽃에 대한 전 분야를 망라하는 ‘올어바웃 불꽃’ 팀이에요. 불꽃 쇼를 기획, 디자인하고 실행하는 일까지 모두 도맡아 하고 있습니다. 지난 평창 동계올림픽과 같은 대규모의 국가 행사를 진두지휘할 수 있는, 국내에서는 흔치 않은 팀이에요.일단 진행할 프로젝트가 확정되면 불꽃 행사가 진행되는 지역과 관객의 특성에 맞는 전체 콘셉트를 정하게 됩니다. 그 이유는 지역별로 선호하는 불꽃의 스타일이 다르거든요. 예를 들어 여수밤바다불꽃축제는 여수의 낭만적인 분위기를 표현하기 위해 아기자기한 불꽃을 연출하는 한편, 서울세계불꽃축제는 불꽃의 크기가 더 크고 화려하면서, 동시에 관객의 호응도와 트렌드를 분석하여 불꽃 연출에 적극적으로 반영하죠. 불꽃의 기획 단계 중 ‘제조’는 유일하게 저희가 하지 않고 있어요. 다양하고 새로운 불꽃 모양과 연출을 보여드리기 위해 끊임없이 연구, 개발하고 있습니다.　출처 – 한화 스토리허브　Q. 불꽃 프로모션 팀은 어떤 #직무를 맡고 있나요? ㈜한화의 다른 직무는?윤 과장: 불꽃프로모션팀은 오직 한화에만 존재하는 아주 특별한 팀이에요. 저희 팀 직무만의 특별함이라면 모든 팀원이 ‘불꽃 디자이너’가 될 수 있다는 점이 아닐까요? 화학을 전공한 팀원도, 자원 공학을 전공한 팀원도 모두 불꽃 디자인에 일가견이 있죠. 서울세계불꽃축제 PM인 문범석 차장님의 경우, 불꽃 디자인은 물론 화약류 관리기사 자격증까지 갖춘 ‘불꽃 전문가’랍니다.권 사원: 지난 ㈜한화 신입사원 공채는 생산관리, 생산기술, 기술영업, 경영관리 등 다양한 직무에서 모집이 진행되었습니다. 불꽃프로모션팀의 경우는 공채 및 수시 채용 모두 기회가 열려 있는데요. 이번 ㈜한화 신입사원 공채를 공략하는 것도 방법이지만, 평창 동계올림픽과 같은 특수 프로젝트에 따라 경력직 채용도 진행하고 있어요. 실제로 평창 동계올림픽을 준비할 당시에 성화봉 전문가분이 입사하기도 했답니다. ㈜한화 채용정보는 한화인 사이트를 자주 눈여겨봐 주세요!　출처 – 한화 스토리허브　Q. 불꽃 프로모션 팀에서 #최고의 순간은 언제?윤 과장: 불꽃프로모션팀에 근무하면서 경험한 최고의 순간이라면 역시 평창 동계올림픽 개막식을 빼놓을 수 없죠! 실수가 용납되지 않는 단 한 번의 행사인 만큼, 공연 전 리허설만 수백 번 한 것 같아요. 올림픽 기간 내내 수만 발의 불꽃을 준비했고, 쏘아 올려진 불꽃이 세계인의 함성을 자아냈을 때 가슴이 정말 뭉클했습니다.　출처 - 한화 스토리허브#한화 #한화그룹 #직무정보 #기업문화 #회사소개 #업무환경 #구성원인터뷰 #신입사원 #공채정보 #불꽃프로모션팀 #채용정보 #채용꿀팁

** 본 글은 문돌이 PM의 마케터 따라하기 시리즈 입니다.** 1화 보기 - 초기에 할만한 ASO (앱스토어 최적화) 팁** 2화 보기 - 초보 PM이 알아야 하는 초기 모바일앱 분석 101** 3화 보기 - 스타트업 브랜딩: 내가 보는 나와 너가 보는 나의 일치자금이 쪼들리는 초기 스타트업이 지출하기 가장 부담스러운 비용이 무엇일까? 서버비? 광고비? 나는 개인적으로 '원샷페이먼트'라고 부르는 비용들이라고 생각한다. 원샷페이먼트는 말 그대로 한번에 제법 큰 돈을 내야하는 비용들로서 외주제작비, 장비구입비, 그리고 콘텐츠 제작비가 여기에 해당한다. 특히 페이스북이나 유투브에 뿌릴 광고에 태울 동영상들을 외주 맡길 경우 보통 제작비가 백만원은 훌쩍 뛰어넘는데 이 돈 내는거 여간 부담스러운게 아니다. 그렇다고 윈도우 무비메이커로 허접하게 해서 광고태우면 효율이 안나온다.그래서 오늘 글은 저 수백만원을 아낄수 있는 어느정도 퀄리티가 나오는 광고영상을 맥북 하나만 있으면 뚝딱 만들어내는 방법론에 대해 소개하고자 한다. (물론 이 방법론으로 전문가분들의 고퀄편집이 가능한건 절대로 아니다. 어디까지나 임시방편임을 다시한번 강조한다!!) 본 방법론은 맥북이 있는 사람들, 그리고 Garage Band와 iMovie를 가지고 있는 사람들만 가능하다는 것을 미리 밝혀둔다. 빠른 이해를 위해 필자가 운영하고 있는 바크 앱의 홍보영상 제작 과정을 기준으로 설명하도록 하겠다.본 방법론은 총 5단계로 이루어져 있다.1. 아이디에이션 및 컨셉잡기2. 스토리 짜기3. 아이폰으로 촬영하기4. Garage Band로 고퀄의 음원 제작하기5. iMovie로 영상 편집하기본 방법론으로 탄생한 홍보 영상은 다음과 같다. (전문가들이 보기에는 웃음나오는 수준이지만 일반인들이 보기에는 미적으로 큰 무리는 없는 영상이다)https://www.youtube.com/watch?v=o7g_0yRjDoA<iframe width="700.000000" height="394.000000" src="//www.youtube.com/embed/o7g_0yRjDoA" frameborder="0" allowfullscreen="">내 와이프의 노동력을 착취해서 직접 촬영/편집한 영상이다Step 1. 아이디에이션 및 컨셉 잡기우선 내가 어떤 홍보영상을 만들지에 대한 대략적인 아이디에이션 및 컨셉을 그려봐야 한다. 아이디에이션에 필요한 세부내용은 다음과 같다.본 영상의 목적은 무엇인가? 내 제품의 정보전달인가? 소비자의 관심 환기인가?영상의 주 타겟이 누구인가?주로 어떤 채널로 집행될 영상인가? 페이스북? 유투브? 인스타그램?내 제품의 정보전달이 목적이라면 어떤 핵심 포인트들을 전달할 것인가? (3-4개 정도)내 제품에 어떤 후킹포인트가 있어서 소비자의 관심을 낚아올 수 있을까?Tone & Manner는 어떻게 잡을것인가? 발랄하고 활기찬 분위기? 감성적인 분위기? 섹시한 분위기?위 아이디에이션에 대한 부연설명을 좀 더 해 보겠다. 우선, 영상의 목적이 제품의 정보전달일 경우 최대한 제품의 사용성을 직관적으로 보여주는 영상이 되어야 하는 반면 소비자의 관심 환기가 목적일 경우에는 무언가 강렬한 메시지가 들어있는 영상이 필요하다. 사실 비전문가의 입장에서 제작을 시도하기에는 후자보다는 전자의 영상이 도전하기 더 수월하다. 후자의 영상은 크리에이티브도 중요하고 영상의 미적인 부분이나 퀄리티, 후킹포인트 등등이 아주 유기적으로 조합되어야 하기 때문이다.또한, 영상의 주 유통채널이 페북/유투브/인스타 모두를 아우를것인지, 아니면 인스타 위주로 갈 것인지에 따라서 영상의 사이즈가 달라진다. 보통 위 채널을 모두 아우르는 영상은 16:9 또는 16:10의 와이드형으로 제작되지만, 인스타의 경우 (또는 페북도 조금 포함되는 경우) 영상 사이즈는 스퀘어 (정사각형)으로 산출되어야 하기 때문에 제작단계부터 나중에 스퀘어로 영상을 자를 것을 감안해서 편집을 해야 한다. (물론 여력이 된다면 영상을 유투브는 와이드로, 페북과 인스타는 스퀘어로 각각 적용해주는게 가장 좋기는 하다만, 우리에겐 그럴 시간과 여유가 부족하다...아 그리고 요즘은 인스타도 와이드스크린을 게시는 가능하지만 왠만하면 기존 형성된 SNS의 컨벤션을 따라가주는게 좋다.) 한가지만 더 추가하자면, 인스타의 경우 동영상의 분량도 1분을 넘지 못하도록 되어있다. 따라서 힘들게 스퀘어 사이즈로 작업해 놨더니 영상 분량이 1분이 넘어가서 인스타에 태워보지도 못하는 불상사가 생기지 않도록 주의하도록 하자.에어비앤비는 페북에 동영상을 게시할 때 유투브와 연동된 광고는 와이드 스크린으로, 인스타와 연동될 경우 스퀘어 사이즈로 게시하고 있다.바크 홍보 영상의 경우 아이디에이션 세부 내용은 다음과 같다.영상의 목적: 정보전달 - 제품이 실 생활에서 어떻게 쓰이는지를 직관적으로 전달한다.영상의 타겟: 젊은 직장인, 대학생채널: 유투브, 페이스북핵심포인트: 제품의 4가지 유즈케이스를 보여준다 - 아침인사, 직장에서 앱 사용, 앱을 통해 친구 사귐, 파티에서 앱 사용후킹포인트: 외국인을 출현시켜 한국에서 앱 사용하는 모습으로 시작Tone & Manner:  발랄하고 여성스런 느낌, 잡지를 읽는것 같은 분위기, 여성의 낭랑한 나레이션이러한 아이디에이션을 통해 잡은 영상의 컨셉은 다음과 같다.Dear Barkers - 한 유저가 보내는 바크 사용자들을 향한 메시지이러한 컨셉은 향후에 시리즈물로 제작할 것 까지 염두에 두고 구상한 컨셉이다. 즉, 바크 앱을 잘 활용하는 유저들 중 독특하거나 눈에 띄는 유저들을 한명씩 출현시켜서 그들의 눈으로 본 앱 사용기를 'Dear Barkers by 아무개' 이런 시리즈물로 제작하고자 정한 컨셉인 것이다.Step 2. 스토리 짜기영상의 스토리에는 크게 두가지 요소가 있다. 첫째는 장면에 대한 설정인데 영상의 전체 장면들이 어떤 큰 섹션들로 이루어져 있고, 그 하위에는 어떤 장면들을 찍어나갈 것인지를 세세하게 계획하는 부분이다. 둘째는 각 장면마다 들어가는 나레이션이나 자막, 특수효과 등 장면에 붙일 다양한 요소를 기획하는 부분이다. 영상 작업을 처음 해보게 되면 가장 삽질을 많이하는 단계가 바로 스토리짜기 인데, 그 이유는 내가 상상만으로 작업한 스토리대로 실제 촬영이 절대로 매끄럽게 되지 않기 때문이다. 스토리를 최대한 자세하게 짜서 현장에서 직접 촬영하면서 매끄럽지 못한 부분들은 쳐내거나 하는 임시방편이 필요하다.처음에 잡았던 바크 영상의 스토리라인이다. 실제 촬영하면서 엄청나게 난도질되었다.Step 3. 아이폰으로 촬영하기흔히들 영상 제대로 촬영하려면 DSLR이나 캠코더가 있어야 하지 않느냐는 질문을 많이 한다. 사실 이런 전문장비가 필요한 상황은 다음 세가지 밖에 없다. 1) 내 영상이 TV나 옥외광고같은 큰 화면에 송출된다. 2) 아웃포커싱으로 뎁스있는 영상표현이 필요하다. 3) 야간씬이 꼭 들어가야 한다.초기 스타트업이 처음부터 4대매체 광고를 한다면 지금 이 글을 보면서 영상 외주제작비를 아끼려 할리가 없기 때문에 첫번째는 패스하고, 두번째의 경우는 쉽게 말해서 특정 영상에서 포커스 되는 피사체를 제외한 배경이 흐릿하게 보이는 현상을 아웃포커싱 됐다고 표현하는데, 스마트폰 카메라로는 유의미한 아웃포커싱 효과를 얻기 힘들다. (물론 이를 가능하게 해주는 아웃포커싱 앱이 있기는 하다만 퀄리티는 그닥...) 세번째의 야간에서의 장면은 사실 야간이지만 도심 한 복판에서 불빛이 많은 상황에서의 촬영은 아이폰6급 이상, 갤럭시 S6급 이상에서는 충분히 스마트폰으로 가능하다. 하지만 불빛이 적은 상황에서의 야간촬영은 반드시 DSLR 카메라와 조리개 2 이하의 밝은 렌즈가 필요하다. 이 세가지 경우가 아니라면 굳이 영상제작하려고 비싼 카메라 살 필요없이 아이폰이나 갤럭시폰 촬영으로도 충분하다.영상촬영을 초보자가 하려고 하면 이거 아무리 찍어도 뭔가 허접해 보이고 각이 안나온다. 걱정하지 마라. 내가 얘기하는 다음 3가지만 명심하면서 최대한 많은 영상을 촬영하면 반드시 쓸만한 클립이 건져질 것이다.1. 한 클립에서는 절대로 앵글을 바꾸지 마라모든 화면에 앵글이라는게 있다. 바로 로우, 미들, 하이앵글이다. 로우앵글은 밑에서 위를 쳐다보는 것, 미들앵글은 그냥 내 눈높이로 보는것, 하이앵글은 위에서 아래로 내려보며 찍는것을 말한다. 각 앵글마다 느낌이 확 다르고 목적도 다른데, 이에대한 팁들은 다른 전문 영상제작자들의 블로그를 찾아보면서 공부하면 좋다. 여기서는 그냥 내가 지금 찍는 화면이 어떤 앵글이구나 정도만 판단할 수 있으면 되고, 중요한건 한 클립에서 앵글이 왔다갔다 하면 안된다는 것이다. 예를들어 어떤 화면을 미들앵글로 시작했는데 도중에 갑자기 로우앵글로 카메라를 내린다던지, 갑자기 줌인을 한다던지 해서 앵글을 확확 바꿔버리는 경우가 많은데 이러면 그 영상은 불안정해 보여서 홍보 영상으로 쓸 수가 없다. 한번 시작한 앵글은 바꾸지 말고 일단 그 클립을 종료한 후 다시 새로운 앵글로 촬영을 시작하는게 중요하다. 또한, 여러 앵글의 클립을 촬영해 놓으면 나중에 편집할때 영상표현미가 풍부해 져서 더 좋다.카메라 앵글은 크게 3가지가 있는데 하이앵글은 왠만하면 시도하지 말자.2. 인물에 대한 촬영이면 내가 과하다 싶을 정도로 포커스해서 찍어라뭔가 인터뷰나 사람이 얘기하고 있는거나 인물의 행위를 촬영하는 클립인데 초보자들이 많이 하는 실수가 바로 피사체를 너무 줌아웃해서 찍고 있는 경우이다. 사람이 얘기하는 장면인데 실제로 찍은 영상을 보면 사람이 너무 멀리 떨어져 보이는 경우가 많다. 이런경우 내가 찍으면서 '너무 줌인해서 찍고있는거 아냐?' 싶을 정도로 포커스해서 찍어보도록 하자. 물론 얼굴을 꽉 채워서 찍으라는 게 절대 아니다. 보통 가슴 아랫부분이 잘릴정도로 포커스해서 촬영하면 화면에서 제법 인물이 포커스되어 보인다.3. 영상을 끊어 찍어라초보자들이 또 많이 하는 실수가 전체 영상을 한번에 촬영하고 있는 경우이다. 예를들어 한 인물이 카페에 들어와서 주문하고 앉아서 커피마시는 장면이 있다고 상상해보자. 이걸 초보자들이 촬영할때 그 인물의 전체 동선을 따라가면서 한번에 찍는 경우가 많다. 그리고 이걸 여러번 반복해서 찍기도 한다. 이렇게 되면 편집하기도 어렵고 연결된 영상에서 어디서 끊어야 하는지도 애매해 진다. 이 케이스에서는 크게는 1) 인물이 카페이 들어오는 씬, 2) 들어와서 주문대로 걸어가는 씬, 3) 주문하는 씬, 4) 기다리는 씬, 5) 커피 나와서 받아가는 씬, 6) 받아서 자리로 걸어가는 씬, 7) 자리에 앉는 씬, 8) 커피 마시는 씬 이렇게 구간구간 나누어서 촬영을 해야 한다. 보다 전문적인 촬영은 저 구간구간을 카메라 여러대를 동원해서 다양한 앵글로 찍기도 한다. 뭐 이건 카메라가 여러대 있으면 시도해 볼만 하다.한가지 팁은, 아이폰으로 촬영시 손에 들고 촬영하는것 보다는 집에 만일 셀카봉이 있다면 셀카봉에 끼워서 봉을잡고 촬영하는게 더 안흔들리고 안정적으로 촬영 가능하다. 삼각대가 있으면 최고겠지만 대부분은 삼각대도 없는 경우가 많을테니 시중에 널려있는 오천원짜리 셀카봉을 사서 장착하도록 하자.Step 4. Garage Band로 고퀄 음원 제작하기홍보영상 만들때 우리같은 비전문가들이 저작권에 대해 개념이 별로 없어서 특히 음원을 그냥 내가 평소에 좋아하는 음악 다운받아서 입히는 경우가 많다. 요즘은 페북도 유투브도 음원 오토스캔이 발달되어 있어서 내가 마룬5 음악을 입히면 100% 자동 검열로 영상 안올라간다. (페북같이) 올라는 가더라도 광고가 안걸리는 경우가 많다. 이런 경우를 대비해서 시중에는 수 많은 유/무료 음원 사이트들이 존재하고 유투브에도 다양한 무료음원을 제공하는 아카이브가 있기도 하다. 유투브에서 제공하는 이 무료 음원 사이트는 다양한 장르의 무료 음원 및 효과음을 제공하기에 제법 유용하다. 여기서 괜찮은 음원을 찾는다면 이 단계는 그냥 패스해도 좋다. (다만, 각 음원마다 사용 조건이 명시되어 있으니 그걸 꼭 지키도록 하자.)유투브에서 제공하는 무료 음원 라이브러리이다. 각 음원마다 클릭해보면 사용 조건이 명시되어 있으니 유의하자.당신이 맥북유저고 Garage Band가 있으면 진짜 마법처럼 손쉽게 제법 고퀄의 음원을 만들수가 있으니 이 단계를 스킵하지 말고 꼭 한번 도전해 보기 바란다.거라지밴드를 처음 열면 다음과 같이 생겼다. 고민하지 말고 'Empty Project'를 선택한다.거라지밴드의 첫 화면이다.아무리 초보자를 위해 쉽게 디자인된 프로그램이라지만 역시 머리가 아득해질 정도로 복잡해 보인다. 하지만 겁먹지 말자. 하나씩 차근차근 인터페이스에 대해 설명해 주도록 하겠다.프로젝트 메인화면이다. 머리가 아득해질 정도로 복잡해 보인다.1) 미디 (MIDI) 악기를 선택 가능한 좌측 악기 라이브러리 - 이 곳은 마치 내가 연주할 악기를 고르듯이 거라지밴드에 구비되어 있는 미디 악기 창이다. 이 창이 처음에 안보일 수 있다. 당황하지 말고 맨 위 좌측에 책장서랍처럼 생긴 아이콘을 누르면 슉 하고 나온다.2) 연주한 음악을 배치하는 타임라인 - 1번 섹션에서 선택한 악기에 기본 제공되는 건반작업 등으로 곡을 연주하고, 이를 분량에 맞게 배치하는 영역이다. 이 부분은 항상 보인다.3) 다양한 pre-made된 음원 조각들이 모여있는 루프 - 가장 중요한 섹션이다. 사실 이 단계에서 당신이 음악을 한번도 만들어 본 적 없는 생초보라면 위의 1번, 2번은 그냥 무시하고 이 3번섹션만 집중하도록 하자. 이 루프 탭 역시 처음에 창이 안보일 수 있다. 맨 우측 위에 세개의 아이콘 중 가운데 노란리본 모양으로 생긴게 이 탭을 여는 버튼이다.1번과 2번은 음악에 조금이나마 흥미가 있었던 사람이라면 이것저것 악기도 추가해 보고 만지작 만지작 하다 보면 금방 감이 오긴 하는데, 그렇지 않은 사람들에게는 매우 어려운 영역이니까 이 글에서는 패스하도록 하겠다. 사실 3번의 루프 라이브러리만 가지고도 어느정도 고퀄의 배경음악을 만들 수 있으니까 말이다. 루프 라이브러리를 활용하여 음원을 만들기에 앞서 간단히 알고 있어야 하는 사전지식에 대해 짚고 넘어가도록 하자.1. 모든 음악의 기본은 [드럼비트-베이스-멜로디 + 효과음]의 구조로 이루어져 있다. 하지만 경우에 따라서 베이스는 생략하고 [드럼비트-멜로디 + 효과음]으로 구성되기도 한다.2. 모든 음악에는 bpm이라고 불리는 일종의 스피드 같은게 있다. 보통 70-90정도면 느린음악, 100-120정도면 보통, 120 이상이면 빠른 음악이다. 거라지밴드에서 상단에 계기판처럼 생긴 탭에서 'bpm'이라는 부분의 숫자를 더블클릭해서 변경해 줄 수 있다.3. 한 음악은 여러개의 뭉탱이 단위의 음원들이 모여서 이루어진다. 이 뭉탱이 단위는 거라지밴드에서는 기본적으로 타임라인에서 8개의 눈금을 차지한다. 즉, 모든 음악을 8개 단위의 뭉탱이로 조합시키라는 뜻이다.그럼 루프 라이브러리를 활용해서 간단한 댄스 음악을 만들어 보도록 하자. 우선 첫번째 단계는 비트를 선택하는 건데, 루프 라이브러리에 'beat'라는 탭을 누르면 비트 음원만 보여준다. 여기서 하나씩 들어보고 마음에 드는 비트를 선택해서 마우스로 드래그해서 타임라인에 가져다 놓으면 된다. 위에서 말했듯이 갖다놓은 비트를 마우스로 드래그해서 8개의 눈금을 차지하도록 늘려놓은 후, 이 8개 눈금의 뭉탱이를 계속 복사해서 분량을 늘려나가도록 하자. 예를들면 다음과 같은 모습이 될 것이다.갖다 놓은 비트를 8개 눈금 뭉탱이로 늘린 후에 이를 8마디마다 계속 복붙한다.다음 여기에 어울리는 멜로디를 찾아보자. 루프 라이브러리에 멜로디가 너무 많아서 이거 고르고 있는데만 시간 크게 잡아먹기 마련이므로 심플하게 기타, 피아노, 스트링 위주로 찾아보도록 하자. 역시 상단에 guitar, piano, string이라는 탭이 있다. 마음에 드는 음원을 찾으면 역시 위에서와 같이 8눈금을 차지하는 뭉탱이로 늘려주고 적절히 배치한다. 이때 팁은, 음악에도 기승전결 같은게 있다는거다. 처음부터 막 시끄럽게 시작하지 않고 차분하게 시작해서 클라이막스를 찍고 종료하는 흐름이라는게 있기 때문에 이 멜로디를 너무 처음에 배치하지 말고 앞의 한 뭉탱이 (8눈금)은 비트만 틀어주고 9번째 눈끔 부터 멜로디를 넣도록 하자. 또 한가지 팁은, 멜로디 중에서 '~~~01,' '~~~02' 이런식으로 같은 이름에 숫자가 여러개 존재하는 멜로디들이 있는데 이걸 사용하면 같은 느낌으로 다양한 변주를 넣을 수가 있다. 예를들면 다음 사진과 같다.뭉탱이 단위로 기승전결의 흐름을 만들어서 배치하면 음악이 더 풍성해 진다.'Brixton Lights Rhythm Guitars' 라는 음원이 01, 02 두개가 존재하기에 한 뭉탱이 단위로 순차적으로 배열하니까 음악이 제법 풍성해 보인다. 보통 진짜 심플한 영상의 배경음악으로 들어갈 꺼면 그냥 이렇게 비트+멜로디 딱 두개만 넣어서 한 30-40초분량 음악 만들어서 익스포팅 해버려도 상관은 없다. 하지만 여기에 좀 더 풍부한 효과음원들을 추가할 수 있는데, 예를들면 루프 라이브러리에서 'voice'라는 탭을 눌러보면 다양한 목소리 코러스가 있고, 'Conga' 탭을 눌러보면 아프리카 음악같은 효과도 추가 가능 하다. 음악을 다 완성하고 나면 맨 상단에 'Share' 메뉴에 'Exporting to Disc'라는 메뉴가 있는데 이걸 클릭해서 MP3  파일로 추출할 수 있다.Step 5. iMovie로 영상 편집하기이제 드디어 마지막 단계이다. 지금까지 촬영한 영상들과 위에서 만든 음원을 조합하여 영상을 아이무비로 편집하는 과정이다. 역시 아이무비를 처음 다뤄보는 분들을 위해 인터페이스에 대한 기본적인 내용을 다루고 진행하도록 하겠다.아이무비도 심플한듯 보이지만 처음에는 머리가 아득해지는 인터페이스다.1번탭은 영상의 각 요소대로 만들어진 가장 큰 단위의 탭이다. 즉, My media는 내가 지금까지 촬영한 클립들을 불러오는 탭, Audio는 아까 작업한 음원, Title은 각 영상에 들어가는 자막, Backgrounds는 굳이 촬영한 클립이 없어서 배경에 채워넣거나 중간중간 화면전환용으로 필요한 배경화면들인데 별로 많이 쓰이진 않는다. 마지막으로 Transitions는 각 클립마다 영상 전환이 칼같이 될 것인지, 흐려졌다가 나오는지, 겹쳐져서 나오는지 등등의 다양한 화면전환 효과들이 들어있다.2번탭은 1번탭을 클릭하면 그 하위내용들이 표시되는 탭이다. 예를들어, Titles를 클릭하면 자막으로 쓸 수 있는 다양한 형태의 자막 라이브러리가 뜨는 것이다.3번탭은 거라지밴드와 마찬가지로 영상의 각 요소들을 시간순으로 배치시키는 타임라인이다. 이 부분은 크게 4가지 요소로 이루어져 있다. 1) 맨 밑부분의 초록색 바는 영상 전체에 깔리는 기본 음원이다. 아까 거라지밴드에서 작업한 음원이 여기에 들어간다. 2) 그 위의 초록색 바 들은 영상에 부분부분 들어가는 음원인데 주로 영상에 넣는 효과음들이나 나레이션 목소리가 여기에 들어간다. 3) 영상 클립들이 그 위에 배치된다. 4) 각 영상에 들어가는 자막들이 바로 그 위에 있는 초록색 바 이다. 5) 간혹 이미지를 영상에 삽입하고 싶은 경우가 있는데 3번탭의 맨 왼쪽 위를 보면 바크 로고 이미지가 영상 위에 입혀져 있고 자막은 그 위에 들어가 있다. 이게 이미지와 영상이 함께 들어간 부분이다. 이 부분은 picture in picture 기능을 잘 활용하는 트릭인데 나중에 별도의 글로 따로 설명하도록 하겠다.4번탭은 각 부분마다 현재 꾸며진 영상을 프리뷰하는 부분이고 그 상단에 있는 아이콘들은 그 해당 장면에서 다양한 설정이 가능하도록 해주는 기능들이다. 역시 하단에 따로 설명하도록 하겠다.아이무비로 영상작업하는 순서는 다음과 같다.1. 음원 배치아까 거라지밴드로 작업한, 또는 유투브 무료 라이브러이에서 다운로드 받은 음원파일을 타임라인 (4번탭) 맨 하단에 드래그해서 갖다놓는다.2. 영상 배치영상 역시 파일을 그대로 타임라인에 드래그 해서 갖다 놓으면 되는데, 가져다 놓은 후 잘라내기 (Split) 및 줄이기의 두가지 툴로 원하는 부분만 가져다 놓는다.  화면을 잘라내는 방법은 해당 클립에 커서를 놓고 우측 버튼을 클릭하면 'Split Clip'이라는 메뉴가 있고, 이걸 클릭하면 영상이 그 지점에서 둘로 쪼개진다. 영상을 늘리고 줄이는것은 (스크린샷이 안찍혀서 그냥 말로 설명하겠음) 마우스를 해당 클립 끝 부분에 가져다 놓으면 갑자기 화살표로 커서가 바뀌는데 그때 드래그하면 된다.3. 화면전환화면전환은 너무 많이 넣으면 영상이 촌스럽고 복잡해 보인다. 다음 4가지 부분에만 넣도록 한다. 1) 첫 시작, 2) 도입부-메인부 사이, 3) 메인부-클라이막스 사이, 4) 클라이막스-종료부 사이. 보통 첫 시작은 어두워지면서 밝아지기에 'Fade to Black' 화면전환을 맨 처음에 넣으면 영상이 어두웠다가 밝아지면서 시작한다. 또한, 도입부, 메인부 등 각 섹션 안의 클립들은 화면전환을 넣지 말고 그냥 연결해서 붙여넣고, 위에서 언급한 4가지 부분만 Cross Blur (흐려지면서 전환), 또는 Cross Dissolve (겹치면서 전환)를 배치하도록 한다. 마지막은 어두워지면서 끝내고 싶을때는 'Fade to Black'을, 밝아지면서 끝내고 싶을때는 'Fade to White'을 배치하도록 한다.각 영상클립 사이에 있는 나비리본같은 모양이 화면전환 효과가 들어간 지점이다. 보다시피 한 섹션 안의 영상들은 화면전환 없이 연결한다.4. 화면효과 - 밝기조절 및 필터아이무비에는 마치 사진의 밝기를 조절하고 필터를 넣듯이 영상에도 밝기조절 및 필터를 넣을 수 있는 강력한 기능이 있다. 이건 해당 클립을 클릭하면 4번탭 상단에 아이콘 메뉴들 중 파레트 모양의 아이콘을 클릭하면 화면의 밝기 및 색온도를 조절할 수 있고, 삼원모양의 아이콘을 클릭하면 필터를 입힐 수 있는 기능이다.영상 클립의 밝기조절 및 필터효과를 통해서 다양한 화면 연출이 가능하다. 바크 영상에도 도입부와 후반부에 필터를 입혔다.5. 자막작업자막이 필요한 경우 1번탭에서 Titles탭을 클릭하면 다양한 자막기능을 선택해서 타임라인으로 드래그한 후 4번탭에서 글을 입력할 수 있다. 하지만 우리가 예능에서 보는것 처럼 현란한 자막작업은 불가능하다. 아이무비에서 그나마 쓸만한 자막 기능은 Upper, Lower, Centered 요 3개밖에 없고, 나머지는 너무 과하거나 촌스럽다. 아무튼 저 3개중 하나를 선택해서 드래그해서 타임라인에 갖다 놓은 후 더블클릭하면 4번탭에 다음과 같은 텍스트 편집 창이 활성화 된다. 여기에서 폰트 종류, 정렬, 크기등을 조절할 수 있다. 한가지 팁은, 처음에는 글씨에 외각선이랑 그림자, 볼드처리가 자동으로 되어있어 매우 촌스러워 보이는데 당황하지 말고 'B'라는 버튼과 'O'라는 버튼을 클릭하여 외각선과 볼드처리를 해제시키면 된다. 또한 자막을 드래그해서 원하는 장소에 갖다 붙이는 기능 역시 지원하지 않아 당황할 수 있는데 역시 당황하지 말고 Lower의 경우 맨 끝에서 엔터를 여러번 치면 글씨가 점점 위로 올라가서 인위적으로 중간쯤에 갖다 놓을 수 있고, 역시 스페이스바를 여러번 쳐서 원하는 장소에 딱 글씨를 갖나 놓을수도 있다.자막을 더블클릭하면 텍스트 수정창이 활성화 된다.이런 과정을 거쳐서 모든 작업을 끝 마쳤다면 상단의 메뉴에서 File > Share > Export to Disc 탭을 통해서 만든 영상을 mp4 포맷으로 추출할 수 있다.아이무비로는 사실 이것 보다 훨씬 다양한 영상편집 기능을 제공하는데, 이걸 잘만 활용하면 비싼 어도비 프리미어나 파이널컷 프로가 필요 없을 정도로 알차게 활용 가능하다. 이 부분은 향후 별도의 글을 통해서 팁을 전하도록 하겠다.자, 이제 모든 단계가 끝났다. 다시한번 바크 영상을 보자.https://www.youtube.com/watch?v=o7g_0yRjDoA<iframe width="700.000000" height="394.000000" src="//www.youtube.com/embed/o7g_0yRjDoA" frameborder="0" allowfullscreen="">서론에 보여준 이 영상은 사실 이 5단계를 모두 거쳐 작업시간이 약 2주정도 소요된 영상이다.바크 홍보 영상은 위의 단계를 모두 거쳐서 약 2주정도의 시간이 걸려서 완성되었다. 다시한번 강조하지만 에이전시에서 전문적인 툴로 작업하는 고퀄영상에 비할바는 절대로 못되지만, 초기 스타트업이 페이스북이나 인스타 등에 주로 마케팅 하는 용도의 영상으로는 크게 나쁘지는 않다고 생각한다. 당신이 혹시 주머니돈 아껴가며 어렵게 제품 홍보하고 있는 초기 스타트업이라면 수백만원의 아까운 돈을 영상제작에 쓰지 말고 차라리 영상을 직접 제작한 후에 그 돈을 영상을 뿌리는 광고비에 쓰라고 꼭 말씀드리고 깊다. (혹시 이 글이 어느정도 도움이 됐다면, 보답으로 바크 페이스북에 가서 본 홍보영상에 라이크 버튼을 살포시 눌러주시면 매우매우 감사하겠습니다!!!)글쓴이는 스팀헌트 (Steemhunt) 라는 스팀 블록체인 기반 제품 큐레이션 플랫폼의 Co-founder 및 디자이너 입니다. 비즈니스를 전공하고 대기업에서 기획자로 일하다가 스타트업을 창업하고 본업을 디자이너로 전향하게 되는 과정에서 경험한 다양한 고군분투기를 연재하고 있습니다.현재 운영중인 스팀헌트 (Steemhunt)는 전 세계 2,500개가 넘는 블록체인 기반 앱들 중에서 Top 10에 들어갈 정도로 전 세계 150개국 이상의 많은 유저들을 보유한 글로벌 디앱 (DApp - Decentralised Application) 입니다 (출처 - https://www.stateofthedapps.com/rankings).스팀헌트 웹사이트 바로가기

 게임 산업은 UX 분석 및 적용을 가장 빠르고, 정확하게 하고 있는 산업 중 하나라는 것을 알고 계신가요? 많은 분들이 생각하시기에 "UX = 비주얼적인 산출물을 만드는 과정."이라고 생각하실 수 있겠지만, 사실 UX는 "가설을 검증하고, 확인하고, 문제가 파악되면, 해결방법을 찾아 개선하는 과정." 즉, 가설 검증과 적용이라는 과학, 통계학에 더 가까운 업무라고 생각합니다. 해당 세션은, 아직 UX 리서치엔 무슨 방법이 있고, 현업에서의  UX 분석 과정은 어떤 식으로 하는지를 기본지식이 없는 분들도 쉽게 이해할 수 있는 좋은 세션이었습니다.우선 인간은 감정을 두 가지로 나타내는데요,표면적 표상: Event에 대한 자신의 감정을 행동을 통해 표현 해 내는 일내재적 감정: Event에 대한 감정을 표현하진 않지만, 이를 통해 느낀 감정을 가지고 있고, 표면적인 표상은 유저가 직접 쏟아내는 피드백을 통해 알 수 있지만, 유저들의 내재적인 감정을 알아내기 위해서 서비스 제공자들은,  1. 설문조사  2. FGT(Focus Group Test)  3. FGI(Focus Group Interview)  4. UT(User Test)  5. 로그 분석등의 방법을 사용합니다.또한 이런 분석의 종류는, 유저들의 선택을 수치적으로 표현할 수 있는 정량적 분석, 예를 들어   1. FGT   2. FGI   3. 로그분석모든 부분을 수치적으로 표시할 순 없지만, 유저의 심리적인 부분을 파악할 수 있는 정성적 분석,   1. User Test   2. Shadowing 두 가지 방법으로 조사할 수 있습니다. 이후부터는 그렇다면 넥슨은 어떤 식으로 리서치를 했는가? 에 대한 프로세스를 보여드릴게요. (굉장히 시퀄 하고, 단순합니다.... 글을 못써서 노잼일 거예요...)메이플 스토리 M (User Testing)의도 1.- 초반 유저 플로우가 기획한 방향대로 흘러가고 있는지에 대한 파악- 의도한 플로우 VS 유저의 실재 플로우를 비교해 보며 어떤 부분에서 다른 점이 있는지 파악해결 프로세스  > 모바일 유저들과 UT (UX 리서치 결정)  > 파악 결과, 매우 다르게 진행(문제 인지)     - 리서치를 통한 이유 파악: 제공하는 플로우에 대한 인지가 매우 부족  > 초반 플레이 구간을 매끄럽게 진행할 수 있도록 "자동 이동"이라는 구간을 설정 (해결 방안 고안)  > 보상 제공 즉시 바로 사용이 가능하도록 플로우를 유도 (해결 방안 고안 2)의도 2. - 플로우에서 유저가 어려움을 느끼는 부분을 파악 해결 프로세스  > 1:1 UT;  행동 관찰 + 인터뷰 통해 이슈 발견 (UX 리서치 결정)  > 파악 결과, 유저들의 대부분이 조작에 대한 어려움을 느낌 (문제 인지)  > 상세정보 부족으로 의도하는 바에 대해 유도하는 부분에서 오류가 발생 (문제 파악)  > 자동기능 추가 (해결 방안 고안)Tera의도 1. - 새로운 콘텐츠에 대해 유저들의 어떤 방식으로 전략을 어떻게 구상하는지에 대해 사전 파악- 필요한 콘텐츠, 필요 없는 콘텐츠에 대한 확인 작업- 행동사항에서 유저들이 필요한 부분 확인해결 프로세스  > 해결 숙련자 40인 FGT + 게임 플레이 (UX 리서치 방법 결정 1)  > 플레이 페턴 확인 및 분석 (UX 리서치 방법 결정 2)  > 채팅 로깅 확인을 통해  유저의 코멘트 파악 (UX 리서치 방법 결정 3)의도 2. - 가장 중요하게 생각하는 승리의 조건은 무엇인지해결 프로세스  > 설문조사 + FGI 병행을 통한 내재적 감정 파악 (UX 리서치 방법 결정)  > 설문조사와 FGI의 간극에서 유저가 내재적으로 가지고 있는 부분들을 분석으로 파악 가능마비노기 영웅전의도 1. - 초기 유저들이 10분~15분 이후 이탈해결 프로세스  > Shadowing (UX 리서치 방법 결정)  > 유저 의도 + 나와있는 조건 + 결과가 유저가 생각하는 방향으로 이동하지 않음 (문제인지)  > 토스트 팝업이 주는 가이드의 부족 + UI 상의 그림이 주는 어포던스 + 워딩 메시지가 주는 모호함 존재 (문제 파악)덧,1. 이후 레고도 있었지만, 끝까지 정확하게 듣지 못해서 패스.. 나중에 업데이트할게요!2. FGT? FGT? UT? Shadowing? 등에 대한 자세한 설명은 다음 세션에서 세세하게 설명드리도록 할게요! 많은 분들이 보시기엔, "UX에 관련된 일을 하고 있습니다."라는 것이 밖에서 볼 땐  백조와 같이 우아하고 멋져 보일 수 있겠지만, 속을 보면, 가라앉지 않으려고 열심히 발버둥 치고 있는 게 진짜 현업의 UX다.라고 한 글을 봤었는데요, 세션을 듣는 내내  그런 생각을 했던 것 같아요.유저의 마음을 읽기엔 그 무슨 방법을 사용한다고 해도 쉽지 않습니다. 속칭 "UX를 한다."라는 것은 "이럴 것 같으니깐 진행해야 합니다."보단, "이런 결과가 나왔기 때문에, 이렇게 진행해야 합니다."라는 당위를 만들어 가는 과정이기 때문에 리서치를 준비하는 과정, 리서치를 진행하는 과정, 리서치를 통해 문제를 해결해 나가는 과정은 고행의 연속입니다. 쉽지 않아요. 내가 생각한 서비스의 플우가가 맞는 걸까?유저가 내가 생각한 져니와 같이 생각할까?문제가 생긴다면 어떤 식으로 조정해야 할까?문제가 생긴 게 내가 예측한 가설이 맞는 걸까?문제를 파악하기 위해선 어떤 식으로 리서치를 하는 게 적합할까?내가 고려하지 못한 부분에서 문제가 있으면 어떡하지?결과를 보고 잘못된 인사이트를 내면 어떡하지?보고 시간이 곧 다가오는데 분석은 끝이 안 보이는데 어떡하지?기타 등등... 그래서 "직관을 믿을 때도." 또는 "문제를 문제라 여기지 않으려 할 때도." 생기기 마련이죠. 그때마다 무엇이 중요한지, 또 어떤 것들을 기반으로 어떻게 유저들의 마음을 읽으려 노력해야 한다는 것은 항상 중요한 포인트라고 생각합니다. 그리고 유저를 알기 위해 노력하는 여러분들에게 박수를 보냅니다!#코인원 #블록체인 #기술기업 #암호화폐 #스타트업인사이트

1. 새해인사2017년이 다 갔고, 이제 댕댕이해가 다가왔습니다. 저도 해를 보았죠. 해가 둥실하더군요. 2017년 한 해의 절반동안 브런치와 열심히 함께 해왔습니다. 사실 처음엔 클라이언트에게 영업용도로 시작했던 포트폴리오 같은 거였는데, 어느덧 묘하게 콘텐츠가 되어가고 있더라구요. 멈추기도 뭐하고 기왕 쓴 김에 계속 쓰자~라고 달려왔는데.. 연말에 상까지 받고 말았습니다. (상에 밑줄) 덩기덕쿵덕 어기여차.부산에서 해를 보게 되었음둥. @송도해수욕장2. 애프터모멘트 이야기2016년 11월, 남미에 두 달 정도 여행을 다녀오고 나니 통장에 7만원정도 있었습니다. 와나 이제 어떻게 살아야 하나 싶어서 아침에 모닝빵에 쨈발라묵으면서 고민했던 시간이 있었습니다. 그 때까지만 해도 전 회사나 들어가서 월급이나 받으며 살아야겠다 싶었습니다. 왜냐면 대출을 갈망했기 때문이죠. 어차피 빚이 있으나 없으나 돈 모으긴 애당초 글러먹었고, 죽을똥살똥 모아도 집 한채 마련하기 힘든 것이 현실이니..... 이러나 저러나 돈이 없다면 일단 지하방이라도 탈출하자 싶어서 말이죠. 물론 남들에게 해놓은 말이 있어서 이제와 대출때문에 회사를 들어가는 것이 참으로 뭔가 실패한 느낌이고, 존나 현실에 타협하는 소시민적인 느낌이 들어서 갈등이 있었지만, 아니 그럼 돈이 없는데 어쩌라고. 라는 생각으로 그냥 이력서와 자소설을 집필하게 되었습니다.그래서 몇 군데 회사에 지원했고 모회사에 3차까지 합격을 하게 되었습니다. 근데 최종면접에서 대표님이 이런 말을 하시더군요.  '우리 회사는 자발적으로 스스로 일을 찾아서 하는 사람들을 원합니다. 스스로 일을 만들고, 최선을 다해 그것의 결과를 내길 바라죠.'그 면접이 끝나고 나오면서 곰곰히 생각해봤습니다. 내가 스스로 일해야하고...그 만큼 보수를 받고...자유롭게 기획하고, 내 생각을 개진하고, 결과를 내야 하는 것...이라면....A: '아니 그러면 그게 사업하는 거랑 뭐가 달라.'라는 생각이 들더군요.그래서 그 길로 세무서로 슝슝 달려가서 애프터모멘트라고 이름을 바꾸고 그냥 제 일을 하기로 했답니다. (원래는 프레젠티지라는 이름으로 PPT디자인이나 깔짝깔짝받으며 지내고있었습니다) 애프터 모멘트는 '그 순간 이후' 를 의미하는데....여기서 '그 순간'은 위에 표기된 A의 순간 이 후를 의미한답니다. 결과적으론 모회사에 들어가서 받았을 연봉보다 조금 웃도는 매출을 잘 내면서 잠도 잘 못자고 이러고 지내고 있죠. 즐겁고 행복하고 힘들고 쑤십니다. 크리에이티브랩..을 뒤에 붙인 이유는 디자인만 하는 게 아니라, 시스템이나 제 컨텐츠를 다루고 싶었기 때문입니당. 지금이야 브랜드 관련 외주프로젝트를 주로 진행하지만.. 2018년 새해부턴 조금 다른 결로 사업을 운영해보고자 합니당.원래는 브랜딩관련 일을 하려고 했던 것이 아닙니다. 투자제안서와 회사소개서 등을 주로 만들었었는데, 보통 그렇게 미팅을 하다보면 대표님의 울분과 한이 손 끝에서 느껴지곤 했습니다. 주로 수족냉증으로 많이 오시는 것 같더군요. 차가운 손을 내밀며 이토록 나를 이해해주는 사람이 있었다는 것에 감격하시며 얼싸안고 그럼 로고도 같이 만드시고, 행사도 기획해보시고, 브로슈어도 만들고 온드미디어도 운영해주시죠!!(물론 저렴한 가격에) 라는 오퍼를 받게 된 것입니다. 어느덧 눈떠보니 내가 하는 일이 너무 많아져버린 케이스죠.하지만 좀 지치는 것도 있더군요. 전 주로 컴퓨터를 몽땅 싸들고 클라이언트네 사무실에 가서 일을 하는 스타일인데 인턴사원 내지는 일일잡부 느낌을 받기도 하고, 뭔가 계약서에 0.01pt로 뭔가를 적어놓으셨는지 제 육안으론 보이지 않는 다른 업무도 함께 맡기도 하고, 무엇보다 프로젝트가 끝나고 나왔을 때 소위 브랜딩이란 게 꾸준히 유지되지 못하는 경우가 많았습니다. 그놈의 인수인계를 아무리 60pt 크기로 써주고 나와도 맨날 전화가 오기도 했구요. 폰트크기와 가독성은 아무 상관이 없다는 걸 깨달았습니다. 읽는 이의 마음의 달린 일이지요. 원효대사님도 이미 그 사실을 깨닫고 계셨습니다.분명 보람차고 즐거운 일도 많았습니다. 의외의 챙김도 많이 받았고, 그렇게 동고동락하다보니 여느 클라이언트와 디자이너의 관계 이상으로 끈끈한 것들이 생겨나기도 했죠. 다사다난한 2017년이 아닐 수 없었습니다.3. 2018년의 애프터모멘트일단 로고가 바뀌었습니당..난리부르스를 쳐서 현재의 로고가 만들어졌죠. A는 당연히 애프터모멘트의 이니셜이고 똥그라미는 마침표입니다. 원래 모멘트라는 게 '순간' 아니겠습니까. 고민되고 어려웠던 브랜드콘텐츠 고민은 이제 안녕~ 이라는 뭐 나름의의미를 담고 있습니다. 투 톤 컬러를 쓴 이유는 디자인과 텍스트의 두 가지 콘텐츠를 다루고 있기 때문이예요. 차가운 이성과 정보성 콘텐츠를 의미하는 진한 파랑과, 감성과 가치를 의미하는 진홍색을 썼습니다.그리고 로고에 맞춰 명함과 제안서도 싸악~~바꾸었죵. 곧 랜딩페이지와 브로슈어도 만들어서 여차하면 가방에서 슉슉 꺼내 드릴 수 있는 무기들을 풀셋으로 갖추도록 할 예정입니다.명함!~뚜루룬명함은 크림보드와 비슷한 엑스트라머쉬 350g 재질입니다. 앞뒤 8도 인쇄로 진행했고 개비싸더군요. 하지만 매우 이뻐서 아주 흡족한 느낌이라고 할 수 있습니다.제안서 뚜루룬!~이뿌죵. 그렇습니다. 혹시나 제안서를 받고 거대한 금액으로 함께 일해보고 싶으신 분들은 전혀 부끄러워하지말고 막 연락을 주셔도 됩니다. 올해는 '글쓰고 디자인'을 하려고 합니다. 콘텐츠제작을 중심으로 프로젝트를 진행할 계획이예요. 물론 기존의 브랜딩작업도 계속 합니다. 먹고 살아야 하니까요. 음 또...올해 초순엔 책이 나올 듯 합니다. 책이 나오면 제 책을 제가 리뷰해서 스스로 감동해보도록 하겠습니다.  글쓰고 디자인해요4. 매거진 이야기'눈으로 보이는 생각, 비쥬얼 브랜딩' 을 쭈욱 써왔습니다. 벌써 35개의 글이 올라왔더군요. 많은 것은 아니지만 그 동안 많은 분들이 좋아해주셔서 좋은 결과를 낼 수 있었습니다. 구독자가 1,000여명 이 되는 터라 고민이 많이 되었던 시점인데, 확실히 2018년엔 좀 다른 얘기를 하고 싶어서 새로운 매거진으로 시작하려고 합니다.매거진 제목은 "삶분의 일" 이예요 :) 대충 제목에서 느껴지실 듯한 느낌인데..ㅎㅎㅎ 일과 삶에 대한 부분을 다루려고 합니당. 요즘 흔히 말하는 워라밸의 느낌과는 조금 다를 수도 있겠습니다. 사실 일과 삶이 분리되어 있다곤 하지만 딱히 현실은 그렇지 않더라구요. 퇴근 후에 카톡감옥에 갇히는 그런 얘기가 아니라, 회사에서 빡친 것이 퇴근하자마자 싸그리 잊혀지고, 현실에서 애인과 헤어진 게 회사에 들어오면 갑자기 괜찮아지진 않듯, 사실 결국 한 사람의 삶에 대한 이야기인 것 같아요. 둘은 떨어질래야 떨어질 수도 없구요. 일과 삶 모두 중요한 가치를 지니고 있다는 것이죠. 다만 일과 삶은 각각 그 목적과 방식이 다른터라 심리적으로 챡챡 스위칭되거나 필요한 지식들을 쏙쏙 얻기가 다소 어려운 것 같아요. 그래서 이번 매거진은 일과 삶의 연결고리에 대해 다루어 보려고 해요. 역시나 깨알같이 디테일하고 뭔가 삐딱한 시선은 잃지 않되, 업무와 개인사업을 하는 입장에서의 라이프에 초점을 맞출 예정입니다.  독립을 준비하는 프리랜서 분들이나, 일하면서 아침드라마 회장님 마냥 곧 혈압으로 쓰러지실 것 같은 신입과 대표님들에게 유쾌함을 선사해드렸으면 좋겠군요.곧 기획이 끝나는 대로 하나하나 새로운 매거진에 게재할 예정이니 매거진 바뀌었다고 쌩까버리지 말고, 즐겁게 봐주시면 감사할 것 같아요!그럼 이 매거진을 어떻하느냐!!!이 매거진은 이번 글 36화를 끝으로 빠이빠이 입니다. 아쉬워하셨으면 좋겠군요. 그동안 매거진을 구독해주신 많은 분들께 감사드리고 또 잼나는 글로 찾아올께요. 모두 늦었지만 새해복 많이 받으세요!!!!

마운틴 뷰의 삼성 UX 디자인 연구소에서 인터렉션 디자이너로 근무를 마치고 개인적인 사정으로 한국에 들어왔다. 폭넓은 디자인을 할 수 있는 환경을 찾던 중 미디엄을 통하여 IoT 하드웨어 스타트업인 아이오를 알게 되었다. 아이오는 스위치 위에 부착하여 쉽게 불을 켜고 끄는 '스위처'라는 스마트홈을 제품을 만드는 한국 하드웨어 스타트업이다. 현재 이 곳에서 인터렉션 디자이너로 앱 내 기능의 디자인뿐만 아니라 PM으로서 기능 개발, 배포까지 마무리하는 프로덕트 매니저의 역할 맡고 있다.아이오에 합류하기 전, 유저와 제품의 인터렉션을 만드는 것뿐만 아니라 끊임없이 오피스를 돌아다니며 비주얼 디자이너, 사용성 연구원 그리고 엔지니어 사이에서 소통하고 커뮤니케이션을 이어주는 역할을 했다. 돌아보면 책상 앞에서 작업하는 시간보다 오피스를 뛰어다니는 시간이 더 많았던 것 같다.디자인, 개발, 테스트의 사이클을 돌며 각각 단계에 위와 같은 작업을 진행했다.커뮤니케이션 스킬에 좀 더 많은 주의를 기울여했던 경험으로 인하여, 2개월의 수습 기간 동안 아이오 팀원들 사이의 커뮤니케이션 과정에 나타나는 구멍을 발견하게 되었다. 같은 목표를 공유하지만 서로 다른 언어를 사용하여 싱크가 빠르게 이루어지지 않는 바벨탑과 같은 상황을 자주 목격하게 되었고, 커뮤니케이션을 싱크 하는 작업이 우선이라는 것을 깨달았다. 복기 겸 글을 통해 첫 3개월 동안 모두 같은 언어를 사용하고 같은 방향을 바라볼 수 있는 환경을 만들기 위해 디자인한 툴과 프로세스를 공유해본다.첫 번째, 정보 구조(Information Architecture)를 이용하여 용어 통일하기두 번째, 트렐로를 이용하여 팀 전체가 고객의 목소리에 집중할 수 있는 프로세스 만들기  첫 번째, 정보 구조(Information Architecture)를 이용하여 용어 통일하기가장 자주 목격한 상황은 제품에 관한 대화를 나눌 때 모두가 다른 용어를 사용하는 것이었다. 이 문제의 경우, 빠른 개발과 론칭으로 인하여 제품의 설계를 한눈에 볼 수 있는 정보구조(Information Architecture)의 부재와, 이로 인한 통일된 용어 체계가 없는 것이 원인이었다.정보 구조는 웹디자인에서 파생된 개념으로 유저의 입장에서 지금 현재 위치한 스크린으로 어떻게 들어왔는지, 원하는 정보를 어느 스크린에서 찾을 수 있는지를 다이어그램으로 표현한 문서다. UXbooth의 Complete Beginner’s Guide to Information Architecture 나온 설명을 번역하면, 정보 구조는 사이트 맵, 상하 구조, 카테고리, 내비게이션 그리고 메타 데이터의 집합체이다. 이 문서는 디자이너, 엔지니어 외 제품 개발을 긴밀하게 협업하는 다양한 구성원이 최신의 제품의 설계를 공유하고, 제품에 관하여 통일된 언어를 쓸 수 있도록 도와주는 가이드 역할을 한다.아이오에서는 단 한 명의 디자이너가 4개월이라는 기간 동안 브랜딩, UIUX 그리고 심지어 하드웨어 제품 디자인까지 해왔으므로 시간과 공을 들여서 시스템 체계를 정리하고 싱크 하는 것이 불가능했다. 하지만 정보 구조의 부재로 팀 전체가 사용하는 통일된 언어가 없다 보니, 알고 보니 30분 동안 서로 다른 스크린을 두고 토론을 벌이는 현상이 일어나거나 플로우를 다르게 기억하고 개발하는 일이 일어났다."안 그래도 추가할 기능이 많은데 굳이 그 작업을 지금 해야 하나", "충분히 머릿속에 다 그려지는 간단한 구조다"라는 의견이 있었지만, 더 자세히 들여다보니 iOS와 안드로이드에서 플로우 차이가 나는 구간이 여러 곳 있었고 팀원끼리 동문서답을 하는 경우도 많아서 더 이상 미룰 수 없는 작업이라고 결론을 내렸다. 준비 단계로 iOS와 안드로이드 앱을 나란히 두고 스크린을 맞춰보는 작업을 시작으로 대표와 함께 스튜디오에 있는 큰 화이트보드에 여기저기 흩어져있었던 스크린을 하나도 빠짐없이 그리기 시작했다. 그렇게 화이트보드 여기저기 그려진 모든 스크린 위에 다른 색상의 포스트잇으로 내비게이션 뎁스(Depth)에 나눠서 스크린을 분류하고 그룹을 지었다. 어느 정도 화이트보드 위에 상하구조가 정리가 된 후에는 마무리 작업으로 스크린마다 번호와 영문 라벨을 붙이고 모든 멤버가 원할 때 열어볼 수 있도록 구글 드로잉에 옮겨 저장했다.구글 드라이브에 저장하는 것에서 멈추지 않고 프로젝트를 진행할 때마다 첫 미팅에 어떤 기능이 추가, 수정될지 함께 리뷰하고 방향을 정하는 지도로 활용하고 있다. 정보 설계를 처음 만들고 나면 늘 그렇듯 처음에 이 개념을 소개한 나조차 프로젝트 킥오프 때 스크린 번호를 헷갈려하거나 미팅 중 이름을 헷갈리는 실수를 했지만, 현재 팀원들은 번호만 불러주면 스크린 라벨을 바로 떠올릴 수 있을 정도로 정보구조를 활용하는 것에 익숙해졌다. 처음에 익숙지 않아했던 엔지니어들도 6개월 동안 정보 구조를 이용해서 구글 애널리틱스를 설계하고 적용시키면서 자연스럽게 활용하고 있다. 지금도 항상 프로젝트가 끝날 때마다 팀 전체가 가장 최근의 앱 구조를 열람할 수 있도록 업데이트하고 있다.  두 번째, 트렐로를 이용하여 팀 전체가 고객의 목소리에 집중할 수 있는 공간 만들기단 한 명의 디자이너만 근무하고 있었던 일손이 부족한 상황에서 앱 개발에 좀 더 집중할 수 있는 디자이너가 투입되자 희망을 갖은 팀원들이 개발해야 하는 기능, 현재 기획은 되어있지만 비주얼 디자인이 없는 기능 등등... 다양한 디자인 작업을 요청하며 환영해줬다. 팀원들 뿐만 아니라 외부에서도 페이스북 페이지, 옐로 아이디 그리고 고객 방문 등을 통해서 고객들의 요구가 넘쳐나고 있었다.어떤 것부터 시작해야하나...개발할 것들은 넘쳐나는 상황에서 더욱 혼란스러운 것은 고객들이 겪고 있는 문제를 수집하고 관리하는 공간과 우선순위를 정하는 시스템의 부재였다. 조직 구성원 모두가 쓰는 트렐로 스크럼 보드의 백로그 덱에 이러한 내용을 등록할 수 있었지만, 이 보드에는 앱뿐만 아니라 하드웨어, HR, 운영, CRM, 미래의 제품 계획 등 모든 아이디어 및 이슈가 다 섞여있기 때문에 고객의 목소리에 집중할 수 없었다.아이오의 CEO, 엔지니어, 디자이너, 마케터 등 모든 팀원의 업무가 담겨있는 스크럼 보드, 고객의 목소리 또한 이 곳에 같이 섞여있었다.실리콘 밸리의 수많은 스타트업과 디자인 프로젝트를 진행한 Google Ventures의 디자인 파트너 Braden Kowitz는 자신의 글과 밋업을 통해 스타트업 디자이너들에게 고객이 겪고 있는 문제를 찾는 것을 소홀히 하면서 고객이 아닌 자신들이 원하는 제품을 만드는 실수를 피해야 한다고 여러 번 강조한다. 아이오 또한 이런 실수를 하지 않기 위해서 의도적으로 기획 전에 고객을 제일 우선순위에 고려할 수 있도록 도와주는 프로세스가 필요했다.기존에 사용하던 트렐로 스크럼 보드에서 분리되어 실제 고객들이 제품(앱과 하드웨어)을 사용하면서 불편을 겪고 있는, 또는 겪을 가능성이 있는 이슈만 모아서 관리하는 보드를 만들었다. 이 보드에는 고객의 의견뿐만 아니라 팀원들 또한 예상되는 이슈나 고객에게 필요하다고 생각되는 기능도 등록할 수 있다.팀원이라면 누구나 이슈를 등록할 수 있지만, 새로운 룰을 적용시켰다. 이슈 카드의 제목을 "A라는 기능을 만들기"가 아니라, 학교에서 반복적으로 하던 디자인 프레젠테이션의 첫 시작처럼 "고객은 A로 인해 B라는 어려움을 겪고 있다"라고 적어서 고객(Who)이 무엇으로 인해(Why) 어떤 문제를 겪고 있는지(How)를 먼저 밝히는 과정을 넣었다.페이스북의 디자인 VP Julie Zhuo는 자신의 글, "Building Products"를 통해 페이스북의 제품 개발 과정에서 누구를 위하여 어떤 문제를 해결할 것인가를 명확하게 정의하는 것이 첫 번째 단계라고 밝히고 있다. 이렇게 고객이 불편한 점을 중심으로 다시 문제를 적어보는 프로세스를 적용한 후, 개발할 기능을 정할 때 우선순위를 고객에게 둘 수 있는 기회를 가질 수 있게 되었다. 현재 이렇게 등록된 수많은 이슈들 중, 매주 CRM 담당자와 상의 후 가장 시급한 이슈를 선정하여 배포하는 사이클로 개발하고 있다.한국에서는 내가 하는 일을 주로 UX 디자이너 또는 기획자라고 하는데.. 지금까지는 기획자와 디자이너 개념이 나눠져 있지 않은 환경에서 근무했고 기획자라는 어감이 어려워서 아직도 스스로 인터렉션 디자이너라고 부르고 있다. (아이오에서는 별도의 직함이 없어서 원하는 포지션을 붙이면 된다. 대표는 명함에 스스로 CEO 대신 hacker라고 써넣었다.)이번 글에서는 디자인보다는 커뮤니케이션 개선에 중점을 두었지만 다음 글에서는 아이오가 위의 이렇게 만들어진 보드를 통해 기능을 배포하는 프로세스와 그 프로세스 단계별로 디자이너로서 어떤 작업을 하는지 복기하는 글을 작성할 예정이다.#스위처 #Switcher #디자인 #디자이너 #UX #UX디자인 #인사이트 #조언

세상에서 제일 어려운 게 자기꺼 만드는 거예요. 제가 일을 하면서 느낀건데 회사소개서든 제안서든 뭐든 남에게 맡기는 게 제일 좋은 것 같습니다. 물론 내가 만들면 굉장히 굉장한 걸 만들 수도 있겠지만, 도대체 그 굉장한 게 언제 만들어질 지 모르니 문제죠.어제 만든거 오늘보면 막 쓰레기같고 버리고싶고... 어제의 나는 환형동물같고 막 그렇거든요.그래서 저도 도무지 지금까지 제 새끼. 애프터모멘트를 손도 못대고 있었습니다. 아니 명색이 제가 디자인을 하고 브랜드 어쩌고 하면서 이것저것 뚝딱이똑딱이 만들어내고 있잖습니까. 근데 정작 제 제안서는 어디 길가에 구르는 잎파리 뭉치와 다름이 없더라구요.시간없는 건 둘째치고 아무리 만들어도 도무지 맘에 들지 않는 영속의 굴레에 빠져 허우적 대고 있었지요. 이대로 가다간 백골이 되어 관속에서나 완성하겠구나 싶어서... 조금 여유있던 6월에 뚝딱뚝딱 손을 대보기로 했습니다. 애프터모멘트는 '정리' 를 최우선 목표로 합니다!그러니 깔끔하고 챡 정리된 느낌의 디자인이었으면 했어요. 하지만 너무 칼같이 냉철한 느낌은 싫더라구요. 제가 그런 성격도 못되는 데다가 그렇게 막 엄청 전문적으로 보이는 게 딱히 도움이 될 것 같지도 않아서, 색을 좀 부들부들하게 써보고 싶었어요.대신 딱 두개만 쓰쟈!!~~라고 생각했죠. 그래서 그 두 개를 정하기 위해 굉장히 고민이 많았답니다. 전 개인적으로 보라색을 좋아해서 어떻게해서든 보라색을 넣고싶었어요. 일단 보라색을 넣고 의미를 부여해보쟈!! 싶었죠. 이빨을 까보자는 거죠. 그래서 기어코 보라색을 넣어버렸습니다. 보라색을 넣은 이유는, 제가 좋아해서예요. 이보다 더 명확한 이유가 있겠습니까! 하하하하하ㅏㅎ하ㅏ하하하하하하하하하....(브랜드철학 그런 거 없..)나머지 한 색은 보라색과 좀 대조되는 색이면서 충돌하지 않아야 하고, 예쁜 색이면 좋을 것 같았어요. 제가 하는 일은 브랜드를 오물조물 잘 정리해서 필요한 것만 보여주는 일이예요. 그렇게 쏙 뽑힌 것들이 나와 너와 지구인의 마음에 스르르륵 녹아들면서 퍼져나가길 원하죠! 그래서 뭔가 아이스크림 녹은 느낌?..내지는 잉크가 퍼지는 느낌을 표현하고 싶었어요. 색도 발산속성의 색이면 좋을 것 같더라구요! 그래서 노란색이 채택!!이렇게 색이 구성되었는데, 아무리봐도 자색고구마 같아. 자색고구마라고!!!!!!자색고구마다아아아아아!!!아놔..완벽히 오사쯔잖아.................하지만 돌이킬 수 없었어요. 저 이상 다른 색을 생각하고 싶지도 않았고 생각할 수도 없었거든요. 그래서 그냥 밀어붙이기 시작했습니당. 패턴은 자색고.. 아니.. 저 노란색이 주룩주룩 흘러내리는 몰캉몰캉함을 살려서 만들었어요.이렇게 몰랑몰랑 액괴 주물거리듯 흘러내리는 패턴을 써보았죠. 이게 과연 이쁠까 싶었는데, 은근히 괜찮더라구요. 대비가 강한 색이라서 뭔가 눈에도 잘띄는 듯 싶었구요.이제 로고를 좀 손대보았어요. 사실 제 로고는 별게 없어요. 애프터모멘트의 A와 크리에이티브랩와 마침표를 형상화한거예요. 마침표의 의미는 뭐 다들 아시다시피 '내 선에서 끝냅시다.' 라는 뜻이죠. 미팅다녀보면 대표님들이 다들 어디선가 멘탈과 비용을 털려서 굉장히 시무룩하시더라구요. 이제 고민말고 내가 마무리 지어드릴께요!!~~라는 거만한 메시지죠. 다른 의미론 이리저리 고민 끝! 저에게 오세용~~ 이라는 졸라 유혹의 손길같은 것이기도 하구요.그래서 이렇게 간단하게 A+마침표로 형상화했어요. 마침표부분을 C로 쪼갠건 '크리에이티브랩' 이라는 부속명칭때문에 그래요. 사실 너무 길다라는 느낌을 받아요. 저놈의 크리에이티브랩은 처음에 왜 붙였는지 사실 잘 모르겠어요. 아마 저 땐 마냥 디자인만 하고싶진 않았나봐요. 그래서 디자인에이전시나 뭐 그런 말을 붙이고싶지 않았던거죠. 창의적인 콘텐츠면 다 만들꼬야!!라는 의지가 있었달까요. 뭐 덕분에 지금은 글도 쓰고 곧 유튜브도 생각중이고 이래저래 확장할 생각을 하고있긴 합니당 :) 다만 회사이름이 겁나 길어서 맨날 클라이언트님들이 힘들어해. 사실 저도 풀네임 부르기가 좀 힘들더라구요. 가끔 소개할 때 입꼬이고.. 애픝어모멘트 크리이에뷥탭.........그냥 애프터모멘트라고 합시당.컬러는 메인컬러 자색고구마와, 노란색에 어울리는 두 컬러를 조합해서 총 4개로 구성해보았어요. 종종 포인트로 쓰기도 하고 조합컬러로 쓸 것 같아요. 근데 지금까진 쓸 일이 없어요. 그냥 비상용으로 만들어놓은 거예요.이렇게 자기만족을 위한 브랜드가이드를 뚝딱뚝딱 만들어보았어요. 이제 제가 만든 이걸 제가 지켜야해요. 겁나 귀찮더라구요. 브랜드가이드를 지킨다는 건 생각보다 엄청 귀찮은 일입니다. 하지만, 하나 만들어놓으면 나름의 기준이 있어서 맘대로 쓸 때마다 양심의 가책과 죄책감에 시달릴 수 있어서 좋습니다. (그게 좋은건가?..)목업도 만들어봤어요. 만들고보니 괜찮드라구요. 그래서 난 언제 저런 앱도 만들고 굿즈도 만드냐...돈이 없어. 얼른 굿즈 제작해서 막 굿즈도 팔고싶은데...... 저런 지우개..저런 명함..저런 앱 봐봐요. 얼마나 저 깔끔하고..저런거 다 만들어서 온 지구에 저렇게 깔고싶다. 저런 다이어리도 막 만들고싶고 만년필도 만들고싶고 그렇다구요. 일단 전세자금을 모은 후 돈이 남으면 여행도 좀 다녀오고...아이맥프로도 좀 사고..그리고도 남으면 다이어리제작을 해봅시다.(47억년 후쯤..)이렇게 브랜드정리를 하고나니 이제 웹도 손대야 하고... 서류들도 손대야 하고, 리플렛도 제작해야 하고.... 그렇더라구요. 일이란 게 참 그래요. 뭐 하나 벌리면 뒤따라 오는 일들이 오백만가지야. 아기오기마냥 졸졸졸졸 따라와선 엉덩이를 깨물고 절대 놔주지 않죠. 이제 한마리한마리씩 좀 처리를 해봐야 할 것 같아요.실제로 제 브랜드를 제작하면서 굉장히 3자입장이 되려고 노력을 많이 했어요. 제가 미팅할 때 하는 질문들을 녹음해서 틀어놓고 혼자 대화도 해봤다니까요. 누가보면 완전히 자아분열스럽달까.... 생각보다 저도 제 브랜드를 그냥 마구 다루고 있었더라구요. 로고ai 하나 놔두고 그냥 막 아무렇게나 쓰고있었달까...지금부터라도 반성하고 귀찮아죽겠지만 제 브랜드가이드를 잘 지켜서 써보려구 합니당. 저는 사실 브랜드쪽으로 업력이 오래된 것도 아니고, 비전공출신인지라 디자인퀄리티가 엄청나다고 얘기하긴 어려워요. 훨씬 레퍼런스 좋은 업체들도 많구요. 아무래도 협력업체와 프리랜서 디자이너님들과 함께 일하긴 해도 1인기업의 특성상 일을 쳐내는 속도라는 게 한계가 있거든요. 게다가 프로젝트를 취향대로 받는 내맘대로 성향때문에 여기저기 제가 맘에 드는 회사들을 대상으로 일하고 있죠. 하지만 분명한 건 이번에 브랜드가이드만들면서도 느낀 거지만... 이게 얼마나 '일' 인지 아주 잘 알고있답니다. 그래서 무작정 예쁘고 멋진걸 우르르 만들어서 PSD 던져놓고 안녕!!! 하고싶진 않아요. 브랜딩이 내부직원들에게 과중한 업무가 되지 않도록 '일'을 생각하는 브랜드를 만들려고 노력하고 있어요. 결국 브랜드란 건 사람들이 만드는 것이라서, 사람이 지치면 그때부터 흔들거리기 시작하더라구요. 이러면 안된다고!그래서 사람이 중심이 되는 브랜드를 구축하려고 꽤나 노력하고 있어요. 그리고 맥락!!..맥락없이 예쁜건 그냥 예쁜 쓰레기라고 생각해요. 브랜드는 그냥 책상에 세워놓는 게 아니잖아요. 그래서 그놈의 맥락을 찾고 연결시키기 위해서 클라이언트 님을 집요하게 괴롭힐 거예요. 계속 물어보고 계속 귀찮게 할거야!!! 하하하하하하하하하핳...그리고 말도 안되는 소리하시면 눈을 지그시 감고 '놉!' 이라고 고개를 가로저을거예요!!예쁘게 리뉴얼한만큼 나머지도 하나하나 손대면서 열심히 일을 해보겠습니다. :)돈도 많이벌고싶다....아이고 마음의 소리를 적어버렸네.

안녕하세요, Y입니다! 매력 넘치는 옐로모바일 구성원을 소개하는 옐로피플 인터뷰, 그 일곱 번째 이야기! 여섯 번째 주인공은 바로 ‘말랑스튜디오’에서 본인의 꿈을 열심히 반죽하고 있는 ‘백지수 UI 디자이너’입니다! 말랑스튜디오와의 특별한 인연부터 취미로 화보촬영을 하게 된 스토리까지! 백지수 디자이너가 들려주는 옐로피플 이야기를 지금 만나보세요! :D Y: 바쁘실 텐데 이렇게 시간 내주셔서 감사합니다. 옐블 독자 분들을 위해 자기소개 부탁 드려요. 백: 안녕하세요, 독자 여러분! 말랑스튜디오의 말랑말랑한 UI 디자이너, 백지수입니다. 반가워요!  Y: UI 디자이너라! 정확히 어떤 직무인가요? 백: 한마디로 모바일 앱에 들어가는 디자인적 요소를 작업하고 있어요. 소소한 앱 화면 디자인부터 앱 전체 컨셉 디자인까지, 유저들이 저희 앱을 보다 편리하게 사용하게 하기 위한 전반적인 디자인을 한다고 보시면 됩니다. 개편 예정인 알람몬 화면 사진백: 저는 지금 ’알람몬’ 앱 디자인을 담당하고 있는데요. 이게 제가 디자인하고 있는 앱 화면입니다. 특히 조만간 알람몬 개편이 있을 예정인데, 이 작업을 열심히 하고 있어요. 지금은 전부 공개할 수 없지만, 새로운 알람몬을 기대해주세요 ☺ Y: 이렇게 모바일 앱 화면들이 UI디자이너 분들 손에서 탄생하는 거군요! 이 분야를 선택하게 된 계기가 궁금하네요.백: 대학생때 우연히 ‘어플리케이션 리뉴얼 수업’을 듣게 됐는데, 너무 재미있어서 이게 제 길이라고 느꼈습니다. 그때부터 관련 수업이나 디자인아카데미를 찾아 다니면서 열심히 배웠어요.요즘은 눈떠서부터 잠에 들기 직전까지 모든 생활에서 스마트폰을 사용 하잖아요? 이렇게 생활에 밀접한 분야에서 디자인을 하고 있어서 굉장히 만족스럽고 보람차요.  Y: 어떻게 말랑스튜디오와 인연이 닿게 되었나요? 백: 원래 첫 직장이었던 에이전시에서 웹/모바일 디자인을 담당하고 있었어요. 그런데 저는 웹을 제외하고 모바일 앱 디자인만 집중적으로 해보고 싶었거든요. 말랑스튜디오에서는 모바일 앱 기반의 다양한 컨텐츠를 실제로 경험할 수 있겠다고 생각해서 지원했어요. 실제로 제가 하고 싶었던 일을 하게 되니까 효율로 높아지고 즐거운 마음으로 일하고 있어요.Y: 말랑스튜디오와 특별한 인연이 있다고 들었어요!백: 네. 실은 전 직장이 지금 말랑스튜디오 사옥 바로 앞 건물이더라고요! 근데 그걸 몰랐다가 면접 보러 왔을 때 엄청 당황했었던 기억이….. 인터뷰 장소로 이동하는데 계속 익숙한 장소로 가길래, 저는 제가 주소를 전 직장으로 잘못 쓴 줄 알았어요ㅋㅋㅋ 말랑스튜디오가 제 운명처럼 느껴지기도 했고, 정말 세상이 좁다는 걸 느꼈어요Y: ㅋㅋㅋ정말 좁은 세상이네요. 그럼 다음 질문으로 넘어가서, 업무 외 이야기도 듣고 싶은데요. 지수님만의 특별한 취미활동이 있나요? 백: 저는 정말 사진 찍는걸 좋아합니다. 찍히는 것도 좋아하고요. 특히 여행 갔을 때 포즈를 연구까지 해가서 찍는걸 즐기는데, 제 SNS를 보시고 어떤 사진작가님이 연락이 왔어요. 그 후부턴 그 사진작가님의 뮤즈로 활동하고 있습니다. Y: 세상에, 모델이라니! 너무 멋져요! 저는 카메라만 들이대도 표정이 굳어버리던데 ㅠㅠ백: 저도 처음부터 쉽진 않았어요. 대학생 때 사진 수업에서 다른 학생들과 함께 모델역할을 했었는데, DSLR 수십대가 저를 찍고 있고 플래쉬가 계속해서 터지니까 당황스럽더라고요. 그런데 한번 경험을 해보고 나니, 민망함을 극복하는 계기가 된 것 같아요. 카메라 앞에서의 뻔뻔함도 늘었고요.  Y: 여행가서 사진 찍는걸 좋아한다고 했는데, 여행지에서 인생샷 찍는 방법 좀 공유해주세요! 백: 제 노하우를 알려드릴게요! 각 여행지마다 사람들이 꼭 한번씩 사진 찍는 곳이 있잖아요? 저는 인스타그램이나 페이스북, 블로그 등을 통해서 최대한 많은 레퍼런스를 찾아놓고, ‘이 장소에서는 이런 포즈로, 이런 컨셉으로 찍어 보자’라고 미리 설정을 해놓고 가요. 그리고 최대한 많이 찍는 것도 중요해요. 이렇게 미리 컨셉을 정하고 가서 백장 찍으면 그 중 적어도 한 장은 건질 수 있다고 보장합니다!! Y: 이런 모델 활동이 업무에 어떤 영향을 주나요? 백: 사실 모델만 하는 게 아니라, 종종 제 사진을 직접 제가 보정하기도 하거든요. 이런 부분이 결국 업무로 연결돼서 말랑스튜디오 가족들 사원증이나 언론에 나갈 대표님 사진 보정을 맡아서 하기도 합니다. 또 연예인 알람 촬영 현장에서 연예인 메이킹 사진을 찍고 보정하는 작업을 하는데요, 그럴 때마다 정말 잘 선택한 직장이다라는 생각이 들더라고요ㅋㅋㅋ Y: ㅋㅋㅋㅋ어떤 연예인 촬영할 때 가장 행복(?)했는지 궁금하네요. 백: 제가 위너를 좋아하는데요!  위너알람 촬영할 때 정말 꿈만 같았어요. 말랑스튜디오에 감사하고 제 직무에 감사하고 그랬죠ㅋㅋㅋ 이런 게 바로 덕업일치가 아닐까요! Y: 덕업일치 부럽네요(ㅠㅠ) 다음 질문으로 넘어가서, 가장 보람을 느끼는 순간은 언제인가요? 백: 대중교통을 이용할 때 업무습관상 저도 모르게 다른 분들의 핸드폰 화면을 보게 되는데, 제 옆자리 사람들이 제가 만든 앱을 쓰고 있을 때 가장 뿌듯한 것 같아요 ☺ 또 친구들이 저희 회사 앱인줄 모르고 저에게 말랑스튜디오 앱들을 역으로 추천해 줄 때, 우리회사 앱이라는 자부심도 들고요. Y: 그럼 말랑 앱을 제외하고, 옐로 서비스 중 가장 많이 이용하는 서비스는 뭔가요?백: 알람몬을 매일 사용하는데…… 말랑 앱을 제외한다면 ‘쿠차’를 많이 사용하고 있습니다! 온라인 쇼핑을 정말 좋아하는데, 쿠차는 한번에 가격비교가 되니까 좋은 것 같아요☺ Y: 그럼 앞으로 지수님의 꿈은 어떤 건가요? 마지막으로 옐로가족들에게 한 말씀도 부탁 드려요! 백: 제가 좀 앱을쓸때는 프로불편러 기질이 있거든요ㅋㅋㅋㅋ 다른 앱을 쓰다가 불편한 점이 있으면 바로 바로 다 적어놓는 편입니다. 리스트를 만들어 놓고 참고하며 앱을 만들 때 디자인적인 불편함이 최대한 없도록 노력하고 있어요. 앞으로도 계속해서 배우고 성장하며 유저들의 입장에서 앱을 디자인하는 UI 디자이너가 되고 싶어요. 말랑스튜디오 앞으로도 많이 사랑해주세요! 

어떤 버튼을 넣어드릴까요?세상에 온전하게 혼자 만든 물건은 매우 드뭅니다. (풀스택이라는 개념도 있지만) 웹서비스 역시 여러 사람의 협업으로 만듭니다. 슬로워크에서 운영하는 이메일마케팅 서비스 스티비도 예외는 아닙니다. 살짝 말씀드리면 스티비는 기획/PM 1명, 디자이너 1명, 개발자 2명이 만들고 있습니다. 큰 조직은 아니지만 소통의 틈은 늘 존재하기 마련입니다.그중 하나가 UI 용어입니다. 동상이몽이라는 말처럼 각자 웹서비스 개발을 해왔지만, 모두가 같은 상황과 맥락에서 학습한 것이 아니고, 머릿속에 그리는 이미지가 달라 사용하는 용어가 서로 다를 수 있습니다. 그리고 같은 용어를 사용하면서도 그 의미와 구현된 결과물이 다를 수 있습니다.“‘드롭다운’이 들어가야 해요”라고 요청받고 나온 결과물은 ‘버튼을 클릭하면 아래로 펼쳐지는 메뉴’일 수 있습니다. 하지만 요청한 사람이 실제로 원했던 것은 <select>일 수 있다는 것이죠. 이런 소통의 틈을 채우기 위해 우리는 장문의 기획서를 쓰고 시간과 공을 들여 프로토타이핑을 합니다. 시간과 인력 자원이 허락된다면 아주 좋은 과정입니다. 하지만 자원이 적은 스타트업 팀에게는 부담스러울 수 있습니다. 모든 것이 비용이죠. 그저 “‘드롭다운’은 아래로 펼쳐지는 메뉴이고, 옵션 선택을 위해서는 셀렉트(<select>)를 쓰자”고 미리 약속하면 많은 부분이 해결됩니다. 그래서 UI 용어 통일은 중요합니다.이런 것이 헷갈리고, 이렇게 씁니다.몇 가지 사례를 살펴보겠습니다. 서비스를 2년 가까이 만들어 오면서 헷갈렸던 용어와 서로 약속을 통해 바로 잡은 것들, 그리고 아직도 헷갈리는 것들이 섞여 있습니다. 그리고 다른 팀에서 사용하는 의미와 또는 웹표준과 다를 수 있습니다. 그저 “스티비는 이렇게 쓰는구나”하고 봐주시면 되겠습니다.1. 버튼(button)버튼은 생각보다 다양합니다사용자의 클릭을 끌어내는 버튼. 마우스와 키보드를 가지고 할 수 있는 많은 액션이 있지만 무언가를 클릭하는 것만큼 직관적이고 친숙한 UX는 없을 것입니다. 그 중심에 버튼이 있습니다. 어떤 때는 이동을, 어떤 때는 실행이나 취소를 위해 버튼을 클릭합니다.버튼의 개념과 역할은 아주 명확한 것처럼 보이지만 프론트엔드 개발자 입장에서는 때로 ‘링크’와 혼동될 때가 있습니다. 어떤 것은 로 만들어진 링크로 만들어야 하고, 어떤 것은 <button>으로, 또 어떤 때는 <input type=”submit”>처럼 하기도 합니다. 하지만 표현되는 결과물은 마우스를 올리면 색이 변하는 ‘버튼’이죠. 보통 는 페이지의 이동을 나타내고, <button>은 실행이나 취소, <input type=”submit”>은 양식의 전송을 말합니다.스티비에서는 ‘버튼’, ‘링크’, ‘링크 버튼’을 혼용해서 사용합니다. 결과물은 버튼이지만 개발자의 재량에 따라 어떤 방식으로 구현할지 정합니다. 위 용어들에 대한 추가 질문은 따로 하지 않습니다. 그리고 SPA 방식으로 개발된 탓에 실제로 구분이 명확히 되지 않는 경우가 있습니다.* 이렇게 씁니다.→ “개발자가 알아서 한다”2. 팝업(popup)과 모달(modal)pop하고 뜬다고 다 팝업은 아님다음으로 헷갈리는 것이 팝업과 모달입니다. 과거 ‘팝업’은 작은 새로운 윈도우를 띄우는 기능을 말했습니다. 최근 팝업 차단이나 모던 브라우저들의 다중탭 기능 덕분에 많이 사용하지 않는 기능이 되었습니다만 아직도 많이 사용되는 용어입니다. 그리고 모달은 비교적 최근에 등장한 개념으로 화면 위에 레이어를 덮어 마치 새로운 창이 나타나는 것처럼 보여주는 방식입니다.“이 부분은 모달로 해주시고요.”, “다음 페이지는 역시 같은 팝업에서 이동하는 것으로…”. 이처럼 초기에는 위 용어를 혼재하여 사용했습니다. 새로운 윈도우를 띄우는 상황은 없거나 매우 희박하므로 소통에 큰 문제는 없었습니다. 다만 모달은 ‘기존(부모) 페이지와 맥락을 달리하는…”이라는 함의를 가지고 있습니다. 이런 경우는 되도록 ‘모달’이라는 용어로 통일하려고 합니다.* 이렇게 씁니다. → 팝업/모달은 중에 하나를 선택하지는 않지만 열리는 상황과 맥락에 따라 용어를 구분하면 좋다. 구현은 하나의 통일된 템플릿으로 진행한다.3. 얼럿(alert)항상 경고만 하는 건 아닙니다‘얼럿’은 사용자가 무언가 잘못된 길로 갔을 때, “띵”하고 뜨는 그 경고창입니다. 과거에는 브라우저에 내장된 기본 기능을 많이 사용했지만, 디자인과 사용성을 위해 최근에는 디자인이 입혀진 레이어로 구현된 유사 얼럿이나 하단에 위치한 토스트얼럿UI 등 다양한 변형이 사용되고 있습니다. “사용자가 취소하려고 하면 이런 메시지로 경고를 해주세요”라는 요청을 받는다면 개발자는 이것을 단순히 alert()으로 처리할지 상단에 뜨는 예쁜 레이어로 띄웠다가 일정 시간이 지나면 없앨지, 하단에 커다랗게 보여줄지 고민이 됩니다. 앞서 살펴본 모달 형식의 경고도 있으니 혼란은 커집니다.대부분 서비스가 그렇겠지만 스티비는 미리 설계된 얼럿 디자인을 사용합니다. 보통의 경우 당연히 이 UI를 사용하고, 추가 액션이 필요하거나 화면의 가운데 모달 형식으로 보여줘야 할 경우라면 디자인 작업물에 명시합니다. 화면에 붉은 글씨로 보여주는 경우도 있어 이 부분은 대부분 디자인 결과물로 소통합니다.* 이렇게 씁니다.→ 디자이너가 각 상황과 맥락을 파악하며 적당한 경고 방식을 선택, 디자인 작업물에 배치하여 개발팀에 전달합니다. (디자인 결과물은 제플린으로 전달합니다)4. 드롭다운(dropdown)과 셀렉트(select)그 누르면 뭔가 아래로 스르륵 나오는 그거결과부터 말씀드리면 ‘드롭다운’과 ‘셀렉트’는 다른 UI입니다. 하지만 비슷한 역할을 하는 경우가 있어 혼용하여 사용되는 것 같습니다. ‘드롭다운’은 하위 메뉴가 숨겨져 있다가 사용자의 마우스 오버나 클릭에 숨겨진 메뉴를 보여주는 UI입니다. 셀렉트는 <select>태그로 구현되며 사용자에게 내재된 옵션값 중 하나(또는 여러 개)를 받기 위한 양식 UI입니다.예쁜 디자인을 위해 레이어로 구현된 드롭다운처럼 구현한 셀렉트도 있고, 셀렉트인데 옵션의 선택에서 그치는 것이 아니라 선택과 동시에 페이지가 이동된다든지 하는 액션을 가진 경우가 있어 혼란이 생긴 것으로 생각됩니다.* 이렇게 씁니다.→ 초기 기획 단계에서 이 둘은 명확히 구분합니다. 사용자에게 어떤 값의 입력(선택)을 요구하기 위해서는 셀렉트를 사용합니다. 이때 디자인은 변형될 수 있지만, 선택이라는 핵심 기능은 그대로 둡니다.버튼 뒤에 숨겨진 메뉴를 표현하기 위해서는 드롭다운을 사용합니다. 하위 메뉴에서 어떤 액션이 있어야 한다면 드롭다운으로 합니다. 구현은 기획에 맞추어 진행합니다.5. 인풋(input)입력하는 곳인데, 마우스 갖다데면 색 바뀌고요. 입력하는 동안은 다른 색으로…‘인풋’, ‘입력창’, ‘필드’ 등 여러 이름으로 불리웁니다. 사용자에게 텍스트 형식으로 어떤 내용을 입력받기 위한 UI로 보통은 그냥 사각형이고, 여기에 테두리(border)나 옅은 배경(background)를 주어 사용합니다.딱히 헷갈릴 일이 없긴합니다. 하지만 뭔가 용어 통일을 한다면? 아마도 ‘텍스트 입력’이나 ‘텍스트 인풋’이 적당하지 않을까 합니다. 결과물은 입력을 위한 상자이지만 구현은 보통 <input>태그로 합니다. 하지만 단순히 인풋이라고만은 할 수 없는 것이 <input type=”checkbox”>나 <input type=”radio”>, <input type=”submit”> 같은 예외가 있기 때문입니다. “인풋으로 해주세요”, “인풋 중에 뭐요?”같은 상황이 생길 수 있습니다. 그렇다고 ‘텍스트 입력’이라고 한다면 <textarea>와 혼동할 수 있습니다. 구현 과정을 생각하여 되도록 명확한 용어가 사용되는 편이 좋습니다.* 이렇게 씁니다. → 무엇을 입력할지 디테일한 전달 필요. 용어 통일은 조금 더 논의해 본다.마치며쓰임에 따라, 상황에 따라 다를 수 있는 UI 관련 용어들. 각자 편한 대로 쓰면 되지 왜 꼭 통일해야 할까요? 오히려 하나의 단어로 통일하는 순간 그 단어만 제한되는 것은 아닐까요? 개발 조직마다 다르겠지만, 스타트업이나 스타트업처럼 작고 빨라야 하는 조직에서의 팀원 사이의 이런 작은 ‘싱크’들은 매우 중요합니다. 드롭다운을 열심히 그렸는데, 실제로 필요한 건 셀렉트였다면? 이렇게 소통이 어긋났을 때 발생하는 시간과 자원의 낭비가 줄어듭니다. 세세한 UI까지 디자이너가 그리는 시간을 줄일 수 있습니다. 미리 약속된 UI(일종의 스타일 가이드)가 있다면 개발자는 상세 디자인 없이도 기존 것을 재사용하면 되기 때문입니다. UI 용어의 싱크만 잘해도 많은 시간을 절약할 수 있습니다. 그 시간에 더 많은 아이디어를 실험하고 구현해볼 수 있습니다.#슬로워크 #스티비 #UI #디자인 #디자이너 #인사이트

2010년, 스탠포드 대학(Stanford University)으로 석사 유학을 떠났다. 왜 스탠포드여야만 했는지는 2가지 이유에서였다. 내게 디자인씽킹(design thinking)이라는 새로운 사고 방식을 알게해 준 아이데오(IDEO)의 창업자 데이빗 켈리(David Kelley)를 만나는 것과, 세계 혁신의 중심인 실리콘밸리의 창업 문화를 배우고 싶다는 것이었다. 이전 포스트에서 다뤘듯이 디자인씽킹의 핵심은 (1) 사람들이 무엇을 필요로 하는지 관찰하고 탐색해나가는 니드파인딩(needfinding), (2) 이렇게 발견된 니즈를 충족시켜주기 위한 솔루션을 반복적인 실험을 통해 검증해나가는 프로토타이핑(prototyping)이다. 정말 흥미롭게도, 실리콘밸리의 전설적인 창업가 스티브 블랭크(Steve Blank) 교수의 린 론치패드(Lean Launchpad) 수업에서 나는 디자인씽킹과 동일한 접근을 배웠다. 국내에서는 스티브의 제자인 에릭 리스(Eric Ries)가 2011년 발간한 린 스타트업(The Lean Startup)이라는 책이 크게 화제가 되었는데, 린 스타트업 전략의 핵심은 (1) 기존의 수십, 수백장짜리 사업 계획서를 쓰는 것이 아니라 사업의 핵심 구성 요소와 주요 가정들을 정의하는 비지니스 모델 캔버스(business model canvas)를 작성하고, (2) 이 가정들을 검증하기 위해서 끊임없이 잠재 고객을 만나 테스트하면서 이 캔버스를 수정하는 것이다. 스탠포드 유학에서 만난 교수님들. 데이빗 켈리(출처: ideo.com)와 스티브 블랭크(출처: entrepreneur.com)디자인씽킹과 린 스타트업 방법론은 무언가를 필요로 하는 사람, 즉 잠재 고객을 모든 프로세스의 중심에 둔다는 점에 공통점이 있다. 잠재 고객이 어떤 것을, 어떤 이유로, 어떻게 필요하는지는 아직 아무도 알지 못하기 때문에 이에 대한 가정(hypothesis) 수립이 선행되어야 하고, 이를 검증하기 위한 솔루션의 반복(iteration) 실험이 수반되어야 한다. 린 스타트업에서는 이러한 반복이 비지니스 모델 캔버스에서 정의하고 있는 9가지 요소 중 하나 이상을 크게 뒤집는 경우 이를 피봇(pivot)이라 부른다. 그런데 디자인씽킹이나 린 스타트업 방법론을 실제에 적용할 때 흔히 범하는 실수 2가지가 있다. 첫째, 너무 거대한 가정을 수립하는 것이다. 가정을 최대한 정교하게 쪼개어 하나의 유닛(unit) 단위로 만들지 않으면 반복적인 실험을 함에 있어서 어떠한 이유로 본 가정의 검증이 성공했는지, 실패했는지 알기 어렵다. 린 스타트업 방법론에서 최소 기능 제품(minimum viable product)을 강조하는 이유가 여기에 있다. 가정이 너무 거대하면 이 가정을 검증하기 위한 최소 기능 역시 거대해질 수 밖에 없고, 초기 실험을 위해 너무 많은 리소스가 들어갈 뿐만 아니라 검증의 결과 해석도 어려워진다.둘째, 린 스타트업 방법론을 빠른 제품 개발과 피봇으로 잘못 해석하는 것이다. 린 론치패드 수업을 마치고 스탠포드를 자퇴하며 창업했던 스타일세즈에서 우리 팀이 가장 치명적으로 범했던 실수다. 나의 경우와 마찬가지로, 많은 사람들이 린 스타트업 방법론을 "한두달 안에 빠른 속도로 제품을 개발하고, 반응이 좋지 않으면 아이디어를 뒤집는 방법론"으로 잘못 해석하는 경우가 있다. 하지만 개발할 제품의 스펙을 정의하는데 있어서 앞서 언급한 정교한 가정 수립이 선행되지 않으면, 엉뚱한 제품을 개발한 후 엉뚱한 방향으로 방향을 틀면서도 어디서부터 잘못된 것인지 제대로 파악하기가 힘들다.디자인씽킹과 린 스타트업 방법론 모두 실리콘밸리에서 시작된 실증적 접근 방법이다보니 사실상 맥락을 같이 하고 있는 것으로 생각된다. 다음 포스트에서는 이 방법론들을 잘못 해석함으로 인해서 스타일세즈 창업 때 범했던 실수들을 좀 더 구체적으로 복기해 볼 예정이다.