스토리 홈

인터뷰

피드

뉴스

조회수 1286

UI, UX 그리고 디자인 프로세스

 이 글은 아무래도 실무를 진행하면서 쉽게 잊게 될 수 있는 이야기 입니다. 실무를 하고 계신분들은 다시한번 상기할 수 있는 기회를, 준비를 하시는 분들에게는 꼭 필요한 인사이트를 드리고 싶네요:)"내가 만든 서비스를 보다 쉽고 재밌게 이용자들에게 제공하고 싶다."라는건, 세상 모든 기획자, 개발자, 디자이너 분들이 다 가지고 있는 궁극적인 목표입니다. 열심히 만든 서비스가 단순히 "보기 힘들어서, 서비스 외적인 부분에 결함이 있어서" 사용하지 못하게 된다면 그것만큼 화나는 경험이 없겠죠. 그런 의미에서 UI/UX는 서비스의 얼굴을 만드는 과정이기 때문에 엄청나게 중요한 역할을 차지합니다. 굳이 서비스를 제작하시는 분들이 아니더라도, UI, UX에 대한 이야기들은 많이들 들으셨을 텐데요, 두단어가 비슷하게 보일 수는 있지만, 기본적으로 UI와 UX는 큰 차이가 있는 단어라고 생각합니다. 1. UX (User Experience) 직역하자면 사용자 경험이고, 이용자가 재화나 서비스 등을 사용할 때 생기는 신체적 반응이나 심리적 기호도(또는 선호도), 그리고 상징적 상호적인 사회적 기준 등을 수집하고, 이에 대한 조사와 연구 등을 통해 "이용자가 더 맘에  들어할 수 있는 재화 또는 서비스."를 설계하는 큰  과정입니다. UX는 개발자 중심이 아닌 사용자 중심의 컴퓨터 시스템을 구축하기 위한 제록스사의 연구 중 HCI(Human Computer Interection) 연구에서 처음 사용된 개념이며, 처음엔 하드웨어에 집중된 연구였다고 합니다.  현재는 UX라는 개념이 컴퓨터와 관련된  것뿐만 아니라 모든 산업을 통해 제공되는 재화와 서비스 전반적인 사회의 흐름이나 문화에 이르기까지 널리 응용되고 있고, 이를 연구하기 위하여는 다방면의 관점과 지식, 시야를 가지고 접근해나가야 합니다. 2. UI (User Interface) UI는 아무래도 더 친숙한 개념이실 텐데요, 왜 아이폰이나 애플, 또는 샤오미 같은 전자기기 회사에 대한 이야기를 할 때 "UI가 직관적이고 혁신적이다." 이런 말 많이 들어보셨죠? 정말 간단히 설명하자면, 전자기기 또는 어플이나 웹을 사용했을 때 이용자들이 보게 되는 화면 구성을  이야기하는데요, 이용자들이 선호하는 구성, 배치, 콘텐츠 등을 UX 조사를 통해 분석하고, 조율하여 보다 직관적이고 빠르게 서비스를 이용할 수 있도록 하는 개념입니다.  보시다시피 UI는 사용자의 경험을 기반으로 하여 어느 위치에 어느 기능이 담긴 어떤 기호 또는 인포그래픽을 그리고 어떤 콘텐츠를 기입함에 따라 보다 쉽게 이용자들의 생산성을 향상 시키는 분야라고 할 수 있습니다.(자세한 이야기는 여기, 와 여기를 참조하세요!) 설명에서  보시다시피 UX가 UI의 개념을 포괄하는 것을 보실 수 있죠, 그렇다면 UX, 또는 UI 정보는 어떻게 얻을 수 있을까요? 기본적으로 여러분들이 초보 디자이너 또는 기획자 시라면, 성공적으로 돌아가고 있는 서비스들이나, 다양한 UI 제작 회사나, UX 에이전시들의 제작 리뷰, 리서치 결과 등을 벤치마칭 하는 것으로 디자인 프로세스를 시작들 하시곤 하죠. 물론 검증이 된 서비스의 틀을 사용하는 것은 기존 이용자들의 편의성을 이끌어 낼 수 있기 때문에 굉장히 효율적인 방법이라고 생각합니다. "이용자의 경험에  기반한다."라는 약속을 100% 지킨 제작 방법이니깐요. 그러나 유명한, 또는 큰 서비스들의 심미성이나, 배치만을 보고 그대로 따라 하는 디자인은 절대로 옳지 않은 판단이라고 생각합니다. 아이디어의 유용에도 이유가 있어야 합니다. 출처: http://austinkleon.com/steal/ 저는 디자이너는 아니지만 재화 또는 서비스를 기획하고 디자인하시는 분이라면, 자신이 제작한 디자인, 또는 목업작업에 내재된 인사이트를 정확하게 설명을 할 수 있어야 하고, 이를 위해 스스로 리서치에 대한 결과를 분석하고 판단할 수 있어야 한다고 생각합니다. 예를 들면, 서울시 지하철 바닥에 붙인 동그라미 스티커나 버스 정류장에 붙여 있는 빨간색 스티커를 보신 적이 있으신가요? 출처: http://news.sbs.co.kr/news/endPage.do?news_id=N1003310218출처: http://www.lgchallengers.com/career/young1829/20130118_inter/  경제(행동경제학) 용어로는 넛지 효과(Nudge Effect)라고 하는데요, 의연 중에 이용자의 결정에 개입하여 원하는 결과를 이끌어 내는 효과를 뜻합니다. 제가 생각하기에는 이러한 피지컬 한(또는 비져블 한) UX도 그냥 여기서 끝나는 것이 아니라, 응용을 통하여 다방면의 분야에 퍼질 수 있다고 생각합니다. "이용자의 심리적인 판단의 흐름을 읽고, 인지적 선호에 따라 이용자의 행동을 파악, 이용자에게 시각적인 제한을 줌으로써 공공이익을 유도할 수  있다."라고 개인적인 인사이트를  발전시킬 수 있는 것 이죠. 웹을  벤치마킹하는 것도 다르지 않다고 생각합니다, 분명히 같은 모양, 같은 색, 같은 배열로 서비스 디자인을 할 수 있지만, 개인의 연구와 조사를 통해 인사이트를 발전시켜 나감에 따라 정당한 디자인 프로세스를 진행하고, 인사이트를 기반으로 익숙한 UX에 새로운 UX를 적용하는 것이 가장 바람직하다고 생각합니다.#코인원 #블록체인 #기술기업 #암호화폐 #스타트업인사이트
조회수 1374

“디자인과 기술을 이어주는 존재, 마크업 개발자를 함께 알아볼까요?” - 유저플로우셀 오혜진

'마크업 개발자', 아직은 우리들에게 다소 생소한 직군이죠. '마크업 개발자'는 디자이너와 개발자 사이에서 '오작교' 같은 역할을 하는 아주 중요한 포지션이에요. 오늘은 코인원의 마크업 개발자로 활약 중인 혜진님과 이야기를 나눠보려 해요. 자신의 위치에서 묵묵히 유저 친화적인 웹 환경을 만들어나가고 있는 혜진님을 만나러 가보시죠!사실 이미 혜진님은 지난 4월 13일(토), 테크 업계 여성들의 목소리에 집중하는 소중한 행사 ‘Women Techmakers Seoul 2019’에서 ‘스타트업에서 마크업 개발자로 살아남기’를 주제로 자신의 이야기를 널리 알리고 왔답니다. 스타트업 그리고 코인원에서 마크업 개발자로 살아남는 혜진님만의 방법은 무엇일까요? :-)Q. 혜진님 안녕하세요, 자기소개 부탁드립니다.안녕하세요, 코인원 유저플로우셀에서 마크업 개발자로 일하고 있는 오혜진입니다. 유저플로우셀은 암호화폐 거래와 프로차트와 같은 트레이딩 영역을 제외한 전반적인 서비스 영역을 담당하고 있어요. 특히 ‘셀'이라는 목적조직으로 개편된 이후 PM, 디자이너, 개발자가 한곳에 모여 누구나 코인원에서 거래를 하고 싶은 마음이 들도록 매력적인 곳으로 탄생시키고 있답니다. 저는 셀안에서 마크업 개발자로 일하며 디자이너와 프론트엔드 개발자를 이어주는 다리 역할을 하고 있습니다.Q. 지난 ‘Women Techmakers Seoul 2019’에서 마크업 개발자를 널리 알리는 발표를 했다고 들었어요. 어떤 내용인지 소개해주세요!감사하게도 ‘스타트업에서 마크업 개발자로 살아남기' 라는 주제로 300명이 넘는 관중들 앞에서 발표를 하고 왔습니다. (사실, 많은 분들이 와주셔서 땀이 좀 나기도 했고요;) 마크업 개발자는 스타트업에서 발견하기 힘든 직군이기도 해요. 보통은 웹 에이전시에 많이 속해 있거든요. 제가 마크업 개발자로 일한지 6년이라는 시간 동안 스타트업에서 어떤 방식으로 일해왔는지 알리고 싶었어요. 그래서 지금까지 이런 일들을 해왔고, 앞으로도 더 활발하게 할 것이라고 속시원하게 말하고 왔습니다.Q. 마크업 개발자는 구체적으로 어떤일들을 하나요?마크업 개발자는 한마디로 디자인(Design)과 기술(Tech)의 오작교 같은 존재입니다. 디자인의 의도가 개발과 충돌하는 부분은 없는지 파악하고, 개발에 잘 녹아들 수 있도록 프론트엔드의 앞단을 맡고 있어요. 코인원 웹 서비스에서 제공하는 신규 기능의 마크업 개발을 담당하고, 운영하면서 생긴 이슈들을 처리합니다. 또한 마크업 레거시에 대한 유지보수 작업도 병행하죠.예를 들어, 코인원의 회원가입 페이지를 제작할 때 디자인 작업을 먼저 들어갑니다. 그럼 디자인 작업을 바탕으로 개발자들이 기능을 만들어 넣게 돼요. 이 때, 기능적인 개발을 제외하고 UI(User Interface)적인 부분을 제가 담당합니다. 회원가입 페이지에는 이메일 인증, 휴대폰 인증 등 여러가지 개발요소들이 많아요. 그래서 개발하기 전에 기능이 들어가는 기본적인 레이아웃을 만들어 개발자에게 전달합니다. 마크업 작업이 바탕이 되어 그 위에 기능 개발이 이뤄진다고 보시면 돼요.디자이너가 레시피를 만드는 사람이라면, 마크업 개발자는 레시피 재료를 세팅해 주는 사람이에요. 개발자들은 세팅된 레시피를 끓이고 버무려 요리를 완성시키고요. 저는 좋은 요리가 탄생할 수 있도록 중간과정을 도와주는 역할인거죠. ▲ 'Women Tachmakers 2019'에서 발표에 열중한 혜진님!Q. 디자인과 기술의 중간 역할을 담당하고 계시군요, 사실 중간자의 역할이라고 하면 이어주는 과정에서 고충(?)이 생길 것 같아요.아무래도 디자이너와 개발자, 양쪽과 다 소통해야하는 부분입니다. 디자이너 입장에서는 ‘왜 프론트엔드에서 이 디자인이 안되는걸까?’ 라는 불만이 생길때도 있고, 프론트엔드에서는 ‘왜 디자인이 이렇게 들어가야 하는걸까?’ 라고 이해를 못할 때도 있어요. 서로의 이해관계를 잘 전달해야 한다는 점이 나름의 고충이죠. 코인원에서는 ‘디자이너 - 마크업 개발자 - 프론트 개발자’의 협업 프로세스를 정립해서 각자가 맡은 분야에 집중 할 수 있는 초석을 다졌어요. 무엇보다도 배경이 다른 세 개의 직군이 원활하게 소통할 수 있는 체계가 잡혀 고충이 해결되고 있습니다 :) Q. 그렇다면 마크업 개발자는 어떤 부분을 기여한다고 볼 수 있나요?코인원 메인 화면에 기능 개발을 추가하지 않고도 마크업단에서의 처리만으로도 쉽게 변화를 줄 수 있습니다. 메인화면의 배너 이미지는 유저들이 코인원에 접속해 제일 먼저 마주하는 부분이죠. 그래서 유저들이 코인원의 시각화된 정보를 빠르게 접할 수 있도록 이미지를 교체합니다. 웹 페이지의 운영 측면에서 비주얼 개편을 빠르게 할 수 있는 환경을 만들어 놓고 대응하는거에요.곧 코인원 마이페이지 화면이 개편될겁니다. 웹 페이지를 새로 만든다는 것은 무에서 유를 창조하는 과정과 같아요. 제가 마크업 개발을 잘 해놓으면 다른 직군에게도 도움이 됩니다. 개발 속도도 더 잘 붙고, 디자인에서도 빈공간이 없는 페이지가 탄생하는거죠. 최대한 밑바탕을 꼼꼼하게 만들어 모두가 일에 더 집중할 수 있는 환경을 만든다고 보시면 돼요.Q. 코인원 마이페이지에서 새롭게 바뀌는 부분은?기존의 마이페이지는 유저들이 보기에 정리가 잘 안되어있다는 느낌이 있었어요. 어떤 인증과정을 끝마쳐야 하는지 한눈에 들어오지 않는 부분이 있었거든요. 이번에 개편될 마이페이지는 좀 더 명확해졌습니다. 이전의 인증페이지가 도돌이표의 느낌이었다면, 이번에는 UX(User experience)를 생각해서 flow 개선도 많이 이뤄졌습니다. 편리한 암호화폐 거래 경험을 코인원에서 느낄 수 있어요. (새롭게 바뀔 마이페이지 많은 기대 부탁드립니다! 물론 편리한 암호화폐 거래도 언제나 코인원!)Q. 유저들에게 편리한 거래경험을 선사하기 위해 어떤 가치를 가장 중요시 여기나요? 저는 중간자이므로 유저들 뿐만 아니라 개발까지 두 가지 측면을 모두 고려합니다. 유저의 입장에서 사용성과 접근성이 용이한 마크업을 짜려고 하고, 개발측면에서는 유지보수가 편리한 마크업을 최대한 짜려고 해요. 개발하기 편한것과 사용하기 편한 것은 다른 맥락이거든요. 요새는 코인원 디자인시스템을 적용하고 있어요. 디자이너 분들이 정리해주신 디자인 시스템을 잘 적용시켜서 코드적으로도 재사용성이 용이하게 관리가 되도록 하고, UI도 정돈이 되어가는 과정을 진행 중입니다. 이런 과정을 계속 거치면 유저들에게 편리한 거래 경험을 선사하는 부분은 놓치지 않을 것 같아요.▲ 마크업에 열중하고 있는 혜진님 (약간의 설정샷 +_+)Q. 코인원 크루로 일하면서 장점을 뽑자면?유저플로우셀은 코인원이 셀이라는 목적조직으로 개편되고나서 만족도가 높은 셀이라고 알고 있어요. 업무도 많은 편인데, 톱니바퀴처럼 잘 맞물린다는 느낌이거든요. 특히 일에 대해서 선긋지 않고, 이슈가 발생했을 때 해결할 수 있는 부분들을 빠르게 파악해주는 부분들이 정말 좋아요. 속도랑 효율성 측면에서 이만큼 해낼 수 있는 팀은 앞으로 만나지 못할 것 같아요. 항상 원활한 업무 소통을 위해 힘써주시는 셀원들에게 감사 드립니다!Q. 앞으로 이루고 싶은 목표가 무엇인가요?회사 안 뿐만 아니라, 바깥에서의 활동도 꿈꾸고 있어요. 마크업 개발자들이 모두 모여 이야기할 수 있는 CSS 컨퍼런스를 열어 좀 더 커뮤니티를 활성화 시키고 영향력을 높이고 싶습니다. 아직 마크업 개발자들만이 모여서 이야기 할 수 있는 곳이 부족하거든요. 저의 이야기도 차곡차곡 쌓아서 여러 창구를 통해 들려드리고 싶고요.코인원에서는 지금 하는 것 이상으로 마크업 개발도 열심히 할거에요. 우선 단기적인 목표로, 프론트엔드에서 사용하고 있는 angular에 대한 이해력을 높일 겁니다. 마크업 컴포넌트 단위에 최적화 된 CSS로 개편해서 사용하지 않는 스타일 리소스가 최소화가 되도록 만들거에요.▲ 마크업 개발자에 많은 관심 부탁드려요 :)디자이너가 디자인에 집중할 수 있게, 개발자가 개발에 집중할 수 있게 ‘일잘러’로 통한다는 혜진님. 혜진님의 인터뷰를 통해 ‘마크업 개발자’에 좀 더 친해지는 시간이길 바라봅니다. 그리고 이렇게 멋진 코인원 크루와 함께 성장하고 싶지 않으세요?  현재 코인원은 멋진 크루들과 함께 크립토갤럭시를 헤쳐나갈 분들을 기다리고 있습니다 :-)
조회수 1702

Quiet By Design: Naomi Campbell Interviews Jony Ive

애플 사의 수석 디자이너이자 세계에서 가장 영향력 있는 사람 중 한 명인 조너선 아이브는, 그를 만나러 캘리포니아에 간 나오미 캠벨이 말하길 또한 가장 겸손한 사람이기도 하다고 한다.“나는 캘리포니아 쿠퍼티노 주 외곽에 있는 우주선 같이 생긴 거대한 빌딩을 방문하는 중이다. 유리 외벽으로 된 이 새로 지어진 사무실은 시가총액 9000억 달러인 애플 제국의 수도가 되었다.70만 제곱미터에 달하는 애플 캠퍼스는 가뭄에 잘 견디는 나무들로 둘러싸여져 있는데, 이는 직원들의 조깅을 유도하기 위함이라고 한다. 또한 이곳에는 아이패드와 얼굴 인식으로 이용할 수 있는 10만 제곱미터 크기의 피트니스 센터와 구내식당도 위치해 있다. 심지어 이곳의 모든 물품들은 맞춤 제작이다. 피자 박스조차 가장자리가 눅눅해지는 것을 막기 위한 기술이 적용돼 있다. 이 모든 것에 5조 3천억이라는 거금이 들었을 지 몰라도, 내가 구내식당을 지나가면서 느낀 것은 애플 파크는 기술 혁명이 무엇인지를 정확히 보여준다는 것이다. 결국, 애플의 이런 면들이 모여 자신들을 세계에서 가장 가치 있는 브랜드로 만들었을 것이다.이러한 애플 파크의 설계자는 조너선 아이브이다. 51세의 영국 에식스 주 출신의 이 산업 디자이너는, 애플 소비자들 삶의 일부가 되었다고 해도 과언이 아닐 것이다. 그는 1992년 애플에 입사하였는데, 2015년인 지금은 수석 디자이너로 활동할 정도로 급성장 하였다. 또한 그는 스티브 잡스가 모든 제품에 하얀색을 쓰게 만들게 한 인물이기도 하다. 이외에도 애플식 터치 스크린 개발하였으며 아이팟, 아이폰, 그리고 아이맥까지 도맡아서 디자인을 하였다. 모든 애플 기기들의 요소 요소를 감독하는 그의 안목은 그를 세계에서 가장 영향력 있는 인물 중 하나로 만들어 줬을 뿐 아니라, 단순히 스마트폰 업계를 넘어서 패션, 예술, 그리고 상업과 정치에까지 영향을 주었다. 그의 디자인 역량은 아제딘 알라이아나 자하 하디드 같은 위대한 경지에 이르렀다고 할 수 있지만, 개인적으로 조너선에 대해 가장 놀라웠던 점은 그가 겉으론 정말 평범해 보인다는 것이다. 그는 친절하고, 거만하지도 않으며, 사실 약간 수줍어 하는 경향이 있기도 하다. 하지만 그는 분명한 천재이다. 아래의 내용은 애플 파크 구내식당에서 조너선과의 인터뷰를 정리한 것이다. 우리는 그의 놀라운 커리어와 남다른 시각에 대해 이야기를 나눴다.”나오미 캠벨: 인터뷰의 시작으로 이런 질문을 던져보고 싶네요. 어렸을 때는 어떤 일을 하고 싶으셨나요?조너선 아이브: 음, 저는 항상 뭔가를 그리고 만드는 것을 좋아했습니다. 그리고 무언가를 그렸던 이유는, 그게 실제 제가 원하는 걸 만드는 데 도움이 됐기 때문이었어요. 그러니까 그림 자체에 흥미가 있었다기 보단, 수단으로써 관심이 있었던 것이죠. 저는 나중에 그걸 ‘디자인’라고 부른다는 걸 알게 됐습니다.나오미: 그런 행동을 부모님이 많이 지지해주셨나요?조너선: 제 아버지는 정말 훌륭한 장인이었습니다. 은세공사였죠. 그래서 저는 어렸을 때부터 물건들이 어떻게 만들어지는지에 대한 이해를 할 수 있게 되었습니다. 이런 개념을 당연한 걸로 받아들이기 쉬운데, 생각해보면 모든 제품들은 생각, 디자인을 통해 만들어 진 겁니다. 이렇게 제품의 본질에 대한 이해를 할 수 있는 환경에서 자란 것은 저에게 큰 영향을 미쳤다고 생각합니다.나오미: 학창 생활은 어땠나요? 공부를 잘 하는 편이었습니까?조너선: 저는 다른 건 잘 못했어요. 하지만, 그림과 공예쪽은 꽤 잘했었죠. 그게 제가 원하고, 좋아하는 것이었으니까요. 아이러니하게도, 다른 걸 잘 못한다는 사실이 오히려 저를 그림과 공예에 집중할 수 있게 만들었습니다. 제가 좋아하고, 제가 잘할 수 있는 것을 이른 시기에 알게 된 것은 정말 행운인 것 같네요.나오미: 학창시절 당신은 착한 편이었나 보군요?조너선: 저는 아주 조용한 편이었습니다. 왜냐하면 그때도 그렇고 지금도 여전히 낯을 많이 가리는 편이니까요. 그리고 사실 그림이나 공예같은 건 혼자 하기 아주 좋은 것들이죠. 그래서 제가 그것들을 더 좋아하게 됐는지는 모르겠지만, 어쨌건 저는 그런 작업을 할 때 아주 편안했습니다. 혼자서도 할 수 있으니까요.나오미: 그런 낯가림을 극복하기 위해 어떤 행동을 했나요?조너선: 그냥 사람을 피해다녔습니다! 저는 제가 잘하는 분야는 상당히 깊이 파고들 수 있지만, 그 분야의 범위가 그렇게 넓지는 않거든요. 저는 제가 잘하는 것에 대해서도 알고 있지만, 제가 못하는 대부분의 영역에 대해서도 확실히 인지하고 있습니다.나오미: 당신이 어렸을 때 디자인 했던 것 중에 뭔가 눈에 띌 만한 것들이 있었나요? 처음 디자인 했던 것 중에 가장 자랑스럽게 생각하는 건 무엇인가요?조너선: 10살에서 11살쯤에, 두꺼운 종이로 아주 간단한 것들을 만드는 걸 즐겨 하곤 했습니다. 그 때 뚜껑 달린 박스를 만들려고 했던 게 기억나네요. 할 수 있는 한 완벽하게 만들려고 애썼씁니다. 결과물에 만족하지 않고, 만들고, 또 다시 만들었었죠. 그 박스 자체에 집착했다기 보단, 그걸 만드는 과정, 그리고 제가 정말 무언가를 완벽하게 만들 수 있는지에 대해서 집착했던 것 같습니다.나오미: 그런 걸 얼마나 많이 만든 건가요?조너선: 대충 6개정돌까요? 박스가 대부분이었습니다.나오미: 당신이 어떤 물건을 볼 때 관심있는 부분은 어디인가요? 사람들이 그 물건을 쓰는 방식인가요? 아니면 그 물건이 사람들을 어떻게 반응하게 만들지에 대해선가요?조너선: 당신이나 저나 똑같은 사물을 보더라도, 그 사물이 우리에게 어떤 의미가 있을지는 엄청나게 많은 역사적, 문화적인 배경에 의해서 결정되는 것입니다. 사물을 받아들이는 데 있어서 어떤 단 하나의 보편적 진리 같은 것은 없는 것이죠. 제가 관심있어 하는 부분은 당신이 본 것을, 당신이 어떻게 받아들일지에 대해서 입니다. 그게 당신에게 어떤 의미가 있게 될 것인지에 대해서 말이죠.나오미: 사람들은 종종 당신과 스티브 잡스의 관계를 ‘궁극적인 창조적 동반자 관계’라고 표현합니다. 그와 만났을 때 어땠나요? 어떤 공통점 같은 게 있었나요?조너선: 우리는 세상을 같은 시각에서 바라봤습니다. 세상을 이해하기 위해 애썼고, 계속 머릿속으로 생각하며, 우리가 가져올 결과에 대해 매우 의식하고 있었죠. 우리는 1997년에 같이 일하기 시작했습니다. 그는 정말 대단한 사람이었어요. 시간이 지나고 나니, 저는 그가 더 대단했다는 게 느껴지고, 그가 더 그리워집니다. 이제 그가 얼마나 특별한 사람이었는지 더 분명해졌죠. 스티브는 창조적인 과정이란 걸 이해하고 있었고 어떻게 보면 그건 극도로 드문 재능이죠. 또한 그는 많은 사람들과 함께 어떻게 회사를 만들어야 하는지도 이해하고 있었습니다.나오미: 그렇다면 그에게서 배운 점은 무엇인가요? 그가 당신에게 영감을 주기 위한 어떤 방법이 있었나요?조너선: 그가 생각하는 방법에는 엄청난 자유도가 있었습니다. 그는 일반적으로 똑똑하다고 생각되는 방법과 규칙들을 따르지 않았죠. 또한 그는 엄청나게 낙천적이고 열정적인 사람이었습니다. 호기심도 정말 많았고 저를 많이 지지해줬습니다.나오미: 제품 생산 과정에서 당신의 역할은 무엇이었나요? 처음 아이폰을 만들었을 때 당신이 공장에서 잠을 잤다는 루머도 있습니다.조너선: 우리가 일하는 방식의 특징 중 하나는 우리 모두 무언가를 만드는 데 있어 아주 깊이 관여되어 있다는 것입니다. 추상적인 걸 디자인하고 다른 사람보고 만들어보라고 할 수는 없는 거니까요. 당신은 모델이니까 당신이 좋아하는 패션 디자이너의 일에 대해서 잘 알고 있겠죠. 그들은 디자인의 모든 단계에 참여합니다. 저도 우리가 제품을 만들 때 공장에 몇 달씩 머물렀었죠. 그렇게 하지 않고 성공적인 디자이너가 될 수 있는 방법은 저는 모르겠습니다. 나오미: 당신이 작업하는 모든 것은 일급 비밀로 다뤄집니다. 당신이 뭘 하고 있는 지 이야기하는 것은 어려운 일일까요?조너선: 제가 하는 일이 일급비밀이라니 저는 모르겠네요. 저는 그저 제가 뭔가를 작업하고 있고, 아직 완료된 게 아니라면 누구에게도 보여주고 싶지 않을 뿐입니다! 아이디어라는 것의 본질 중의 하나는 그것이 아주 손상되기 쉽다는 점입니다. 당신 스스로가 생각해낸 아이디어에 대해서 확신하지 못하고 있다면, 그 아이디어가 어떻게 될지 아주 불안정한 것이죠. 누구에게 아이디어를 보여줘야 할 지 신중히 결정하는 것 역시 아이디어를 보호하는 방법 중 하나입니다. 왜냐하면 아이디어가 공개돼서 섣부르게 비판을 받는다면 자칫 그 아이디어가 가진 잠재력이 차단될 수도 있기 때문입니다.나오미: 그래도 스트레스 받지 않고 그것에 대해 이야기해보고 싶지 않나요?조너선: 저는 걱정이 많은 게 제 특징이라고 말할 수 있을 것 같습니다. 제 일에 대해서도 걱정이 많은 편이죠. 헤더(아이브의 부인)는 대충 제가 뭘 하고 있는 지는 알고 있습니다. 하지만 저도 구체적으로 제가 뭘 하는 지에 대해선 말하지 않아요. 왜냐하면 그 편이 그녀가 더 안심할 거라는 걸 아니까요.나오미: 그렇다면 당신은 삶과 일의 균형을 어떻게 맞추나요? 조너선: 그 부분에서 저는 형편없죠!나오미: 당신은 과로를 했을 때, 다시 영감을 얻기 위해 잠깐 쉬어야 할 때를 알 수 있나요?조너선: 디자이너로써 힘든 점 중에 하나는 그저 스튜디오에서만 일을 하는 게 아니라는 겁니다. 눈을 뜨고 돌아다니면서 뭔가를 보고 “왜 이렇게 만든 거지?” 다르게 만들 수는 없었을까?” 라고 의문점을 품거나 “저거 정말 괜찮은데” “흥미로운 발상이야” 라고 계속해서 생각해야 하죠. 그걸 “일”이라고 하는 게 정확한 표현인지는 모르겠지만, 다른 직업과는 다른 방식으로 세상을 접해야 합니다. 그게 디자인이라고 하는 것 같네요.나오미: 디자인에 있어서 특별히 자랑하고 싶은 점이 있나요? 저 같은 경우 페이스타임 같은 걸 살아서 볼 거라는 생각은 안해봤거든요. 처음 그거에 대해 들었을 때도, 미래에나 일어날 일이라고 생각했습니다. 나이로비나 델리 어딘가에 있으면서 부모님의 얼굴을 보고 대화할 수 있다는 건 마법 같은 일이었어요.조너선: 저도 그렇게 생각합니다. 페이스 타임 같은 경우는 커뮤니케이션에 있어 가장 아름다운 사례 중 하나라고 말할 수 있겠네요. 텍스트 문자처럼 연결이라는 건 서로 교류할 수 있어야 하죠. 아니면 페이스타임처럼 엄청나게 친밀한 감정을 주고 받던가요. 누군가의 눈을 본다는 것은 정말 중요합니다.나오미: 당신은 저에게 있어 아버지라고 할 수 있는 아제딘 알라이아와도 친구이죠. 당신도 공감한 그의 세계관, 디자인에 대한 접근 방식은 무엇이었나요?조너선: 그는 완벽한 장인이라고 할 수 있습니다. 저는 그가 일했던 스튜디오를 사랑했고, 그의 과정, 그가 일하는 방식도 정말 좋아했습니다. 그를 바라보면 경외감이 들었어요. 그는 작업하는 걸 제가 볼 수 있게 해줬는데 그것도 정말 좋았습니다. 아주 관대하다고 생각해요. 그가 직물을 이해하는 방식, 직물에 대해 만족하지 못하고 또 새로운 것을 만들어내는 모습을 지켜보는 것은 정말 놀라웠습니다. 그래서 그렇게 아름다운 형태가 만들어지게 되는 거겠죠.나오미: 아제딘은 옷감에 바늘만 넣어봐도 그 옷감이 어떨지를 알았습니다.조너선: 그는 어떤 것도 강제하지 않았습니다. 그가 다루는 직물에 대해 통달했기 때문에 원하는 모양은 자연스레 나왔어요. 직물에 대한 아주 깊은 이해가 있었죠.나오미: 제 말이 그 말입니다. 때떄로 그가 만든 옷을 입었을 낄거라고 생각했던 부분도 자연스럽게 펼쳐지더군요. 그래서 항상 궁금했습니다. 어떻게 이 사람은 옷이 이렇게 펼쳐질지 알고 있었을까? 라고요.조너선: 그렇습니다. 그는 창조에 대해 그러한 순수함을 가졌죠. “이게 내가 원하는 형태다” 라고 말만 하는 게 아니라, 옷이 만들어지는 과정 속에 그것을 집어넣었죠.나오미: 그 외에 섬유를 이런 경지로 다룰 수 있는 사람은 일본인들 밖에 보지 못했습니다. 당신이 생각하기에 오늘날 특별히 디자인쪽에서 영향력 있는 문화가 있나요?조너선: 대부분의 문화들은 당신이 그것에 충분히 관심을 갖고 그 외면 이상의 것을 보려 노력한다면, 엄청난 아름다움이 숨겨져 있다는 것을 알 수 있게 됩니다. 그렇게 보려고 시도하는 건 좋은 연습이 되겠죠. 저 역시도 여행을 좋아하고, 일본 문화를 좋아합니다. 사실 21살전까진 비행기에 타 본 적도 없었죠.나오미: 처음 비행기를 타봤을 때 어떤 생각이 들었습니까? 더 좋게 디자인할수도 있다고 생각했나요?조너선: 그 때 저는 애였습니다. 그저 큰 비행기를 탄다는 것에 흥분해 있었죠. 그리고 이상하게 들릴 지 모르겠지만, 저는 그 때 “이게 어떻게 날 수 있다는 거지?” 라고 생각했습니다. 제 짐은 꽤 무거웠거든요…나오미: 작년에, 당신은 왕립예술대학(RCA)의 총장으로 임명됐습니다. 어떻게 된 일인가요? 왜 그 직책을 맡기로 했습니까?조너선: 저는 항상 왕립예술대학에 애착을 갖고 있었습니다. 회화, 조각, 그래픽 디자인과 건축에 이르기까지 창조적인 학과의 다양성 측면에서 그 대학은 아주 특별한 위치에 있다고 생각합니다. 아주 특별한 에너지를 갖고 있다고 할까요. 저는 그간 훌륭한 사람들과 함께 일해왔고, 제가 배운 것들이 다른 사람에게도 유용할 수 있다고 생각합니다. 그게 중요한 이유였다고 할 수 있겠네요. 제가 배운 것들을 공유하는 것 말입니다. 비록 제가 배운 모든 게 다 의미가 있진 않겠지만요. 또, 당신도 이렇게 생각할 수 있겠죠. “만약 내가 지금까지 배워온 것을 말로 설명할 수만 있다면, 배움이라는 것의 개인적인 고통 중 조금은 어떻게든 이해 될 것이다” 라고요.나오미: 그러겠죠. 마지막 질문입니다. 새로운 팀 멤버를 채용할 때, 어떤 점을 기대하나요?조너선: 가장 중요한 점은 세상을 바라보는 관점입니다. 궁극적으로, 스티브의 유산이란 건 일련의 가치, 제 생각에는 노력에 대한 믿음에 있다고 봅니다. 종종 작은 목소리들은 무시되곤 하지만, 그는 리더쉽이나 말하는 것 뿐만 아니라 다른 사람의 이야기를 듣는 것에도 뛰어났습니다. 커뮤니케이션에 있어 많은 부분은 듣는 것에 있으니까요. 그저 하고 싶은 대답을 하기 위해 듣는 것은 진정으로 듣는다는 것이 아닙니다.원문 : http://www.vogue.co.uk/article/naomi-campbell-jonathan-ive-interview#더팀스 #THETEAMS #디자이너 #영감 #Inspiration #애플 #팀빌딩 #멤버구성
조회수 7652

Adobe XD로 페이퍼 UI 디자인하기

Adobe XD(이하, XD)는 Sketch, Balsamiq 등의 프로토타이핑/와이어프레임 툴에 대항하기 위해, Comet이라는 프로젝트 이름으로 시작된 Adobe의 프로토타이핑 툴입니다.그동안 그래픽 디자인 툴에서 Adobe의 영향력은 절대적이었습니다. 하지만 UI 디자인에 특화된 툴들이 등장하기 시작하면서 Adobe의 입지는 좁아졌고, 이런 상황을 극복하기 위해 출시된 툴이 바로 XD입니다. 저는 페이퍼 UI 작업을 하면서 8개월 동안 XD를 사용해왔습니다. XD를 실무에서 사용하며 느낀 점과 어떤 기능을 사용해 UI 디자인을 진행했는지 이야기해 보려고 합니다.XD를 도입하게 된 배경현재 UI 디자인 영역에서 가장 높은 점유율을 보이는 툴은 스케치일 것입니다. 빠르고, 편리하며, 다양한 익스텐션으로 UI 디자인에 최적화된 모습을 보여주고 있습니다. 이렇게 많이 사용되고 있는 스케치에 비하면 출시 된 지 얼마 되지 않은 XD는 아직 부족한 점이 많습니다. 그런데도 불구하고 현재 XD를 이용해 페이퍼 UI 디자인하는 것에 대해 만족하고 있는데요, 그 이유는 다음과 같습니다.UI 디자인에 제약이 많은 PAPER리디북스에서 판매하고 있는 PAPER와 PAPER Lite(이하 페이퍼)는 2015년 10월에 출시한 리디북스 전용 전자책 단말기입니다. 일반적인 LCD와 달리 EPD(Electrophoretic Display)를 사용한 제품입니다.EPD 패널은흑백만 표현 가능하다는 점흑백도 (실질적으로) 16단계만 표현할 수 있다는 점반응 속도가 느리다는 점특징이 있습니다. 이러한 특징 때문에 일반적인 모바일 디바이스와는 다른 방향으로 UI를 디자인해야 합니다.빠르게 작업하고, 쉽게 공유할 수 있는 XD하지만, 그러한 제약 덕분에 XD를 사용해보는데 더 좋은 환경이 되었습니다. 디테일한 패스 제작이 불가능한 점이나 UI 요소에 필요한 스타일을 완전히 표현할 수 없다는 XD의 단점은 페이퍼 UI 디자인을 하는 데 큰 문제가 되지 않았습니다. 오히려 빠르게 프로토타입을 진행하고 바로 공유할 수 있는 점이 다양한 팀과 함께 진행해야만 하는 페이퍼 UI 디자인에 큰 장점으로 다가왔습니다.XD의 강점올해 초부터 지금까지 XD를 통해 페이퍼 UI 작업을 진행했고, 기능이 부족했음에도 계속 사용해온 이유는 크게 세 가지였습니다.1. 기존 Adobe 툴 사용자에게 익숙한 UIXD를 사용하기 시작하면서 처음 느낀 장점은 기존 Adobe 툴과 UI가 비슷해 적응하기 쉽다는 점이었습니다. 이는 새로운 툴임에도 불구하고 사용성의 진입 장벽을 낮춰주는 역할을 합니다. 스케치를 처음 시작했을 때 느꼈던 낯선 작업 환경과 적응하는데 걸렸던 시간을 생각한다면 오랫동안 써왔던 툴과 비슷한 경험을 제공하는 XD의 장점이 드러납니다. 스케치 또한 적응하면 능수능란하게 사용할 수 있겠지만 당장 입문자에게 편리한 쪽은 XD라 생각합니다.2. 빠른 플로우 제작 시간/과정다른 툴들과 다르게 XD는 디자인 화면과 프로토타입 화면을 유연하게 왔다 갔다 할 수 있습니다. ‘디자인’ 탭에서 각 화면 디자인을 끝낸 후 바로 ‘프로토타입’ 탭으로 전환해 플로우를 구성할 수 있습니다. 프로토타입을 제작하는 방법도 UI 요소와 각 화면 사이를 노드로 연결하는 방식이라 쉽고 빠르게 플로우를 검증할 수 있습니다. 일반적인 LCD 기반 기계와 달리 페이퍼는 디스플레이의 한계가 많아서 UI 테스트가 많이 필요합니다. 이럴 때, 유용합니다.3. 쉬운 공유 기능이렇게 만들어진 플로우를 다른 팀과 손쉽게 공유할 수 있다는 것도 큰 장점입니다. 프로토타입을 제작하고 버튼 몇 번만 눌러주면 Adobe 서버에 업로드되고 공유 링크가 만들어지는데 이 링크를 전달해 다른 팀의 의견을 받을 수 있습니다.XD를 이용해 페이퍼 UI 디자인해보기그럼, 실무에서 어떻게 XD를 사용하고 있는지 간단히 소개해보려고 합니다. 보여드릴 예시는 암호를 입력해 구매목록에 접근하는 기능입니다.디자인 : 기본 UI 디자인벡터/텍스트 툴을 이용 기본 UI 디자인기본 UI 요소들은 XD에서 충분히 표현할 수 있으므로 버튼, 토글스위치, 프로그레스 바, 텍스트 등의 UI 요소는 XD에서 바로 작업합니다. EPD의 특성상 컬러를 다양하게 사용할 수 없으므로 검은색(#000000), 회색(#333333, #666666, #999999), 흰색(#FFFFFF)만 컬러 셋에 등록해두고 사용합니다. XD에서 작업하기 힘든 복잡한 모양의 아이콘은 일러스트레이터에서 작업한 후 패스를 복사해 붙여넣기 합니다.디자인 : 반복 그리드XD에서 호평을 받는 그리드 기능을 이용해 책 목록을 만들어 보겠습니다. 리디북스 서점이나 뷰어에서 가장 많이 보이는 레이아웃이 ‘책 목록’인데 이러한 그리드 구조를 XD에서는 손쉽게 만들 수 있습니다. 책 커버 이미지, 제목, 저자 등 개별 항목을 선택한 후 ‘반복 그리드’를 적용해줍니다. 그리고 그리드 전체 크기와 각 항목 사이의 간격을 드래그로 조절해주면 책 목록을 쉽게 만들어낼 수 있습니다. 스케치에서는 Craft 같은 플러그인을 이용해야 하는 기능이지만 XD에서는 별도의 플러그인 없이 구현할 수 있습니다.디자인 : 프로토타이핑각 화면이 완성되었다면 프로토타이핑을 진행합니다. 이번 예시에서는 ‘내 서재에서 구매목록 탭’ → ‘암호 확인’ → ‘구매목록’으로 이동하는 프로세스를 구현합니다. XD의 프로토타입 탭으로 이동한 후 ‘구매목록’ 텍스트를 선택하고 노드를 ‘암호 입력’ 페이지로 연결해줍니다. ‘암호 입력’ 페이지에서는 아트보드 전체를 ‘구매목록’ 아트보드로 연결합니다.온라인 공유프로토타입 확인을 위한 공유 링크 만들기프로토타입을 완료했다면 오른쪽 위의 ‘미리 보기’ 버튼을 눌러 이상이 없는지 확인해보고, 타 팀에 공유할 링크를 만듭니다. 오른쪽 위의 ‘온라인 공유’를 클릭하면 제목, 섬네일 이미지를 지정할 수 있고 링크 업데이트나 새 링크를 눌러 웹에서 확인할 수 있는 링크를 복사할 수 있습니다. 이제 이 링크를 타 팀에 전달하고 피드백을 받으면 디자인 과정이 완료됩니다.XD에 바라는 기능제가 담당하고 있는 페이퍼 UI 디자인을 할 때는 XD의 불편함이 그리 크지 않습니다. 페이퍼 UI 특성상 세밀한 디자인이 필요하다기보다 전체 흐름을 점검하며 사용자 경험의 단계를 줄이는 것이 더 유용한 경우가 많기 때문입니다. 하지만 이러한 상황에서도 XD에 아쉬운 점이 있는데 몇 가지 부족한 점을 꼽아보겠습니다.1. Photoshop/Illustrator 파일 호환Adobe에서 출시한 툴답게 단축키와 인터페이스가 포토샵/일러스트레이터를 많이 닮아있습니다. 하지만 파일 호환성은 만족스럽지 않은데요, 일러스트레이터 파일이나 포토샵 파일을 불러오는 것이 불가능합니다. 가져올 수 있는 파일은 SVG와 JPG, PNG 등의 비트맵 이미지뿐입니다. 저는 따로 파일을 가져오지 않고 일러스트레이터에서 패스를 복사 → XD에 붙여넣는 방식으로 작업하고 있습니다. 포토샵 파일은 어렵더라도 일러스트레이터 파일은 손쉽게 들고 올 수 있으면 좋겠습니다.2. 가이드 추출 및 공유스케치는 Zeplin, Sketch-measure 같은 훌륭한 가이드 익스텐션이 존재합니다. 각 오브젝트의 위치와 크기, 코멘트를 공유할 수 있는 툴인데요, 아쉽게도 XD에서는 가이드를 생성하고, 전달하기가 마땅치 않습니다. 별도로 이미지를 제작하거나 문서로 전달해야 한다는 게 아쉽네요.3. 레이어XD에는 레이어 패널이 없습니다. 일러스트레이터처럼 ‘앞으로 가져오기/뒤로 보내기’ 등의 높낮이 개념은 존재하지만, 포토샵에서 볼 수 있는 레이어 패널은 없습니다. 그래서 오브젝트를 레이어 별로 정리하거나 조절할 방법이 없는데요, 차후 지원되면 좋겠습니다.4. 심볼스케치에는 UI 요소나 반복적으로 사용할 요소를 만들어두고 재사용할 수 있는 심볼 기능이 있습니다. 포토샵의 스마트 오브젝트와 비슷한 개념인데요, 대표 심볼을 수정하면 모든 심볼에 반영이 되어 편리하게 사용할 수 있다는 점이 좋은데, 아직 XD에는 이런 심볼 기능이 없습니다. 그래서 거의 비슷한 요소들을 복사 → 붙여넣기 해야 한다는 단점이 있습니다. 반드시 추가되면 좋겠습니다.5. 컬러 관리마지막으로 컬러를 관리할 수 있는 기능이 없습니다. 포토샵에서는 Swatch를 통해 컬러 세트를 관리할 수 있는데 XD에서는 자주 사용하는 컬러를 등록할 수는 있어도 별도의 파일로 추출 → 공유하는 것이 불가능합니다. 특히, 리디북스에서는 RSG(Ridibooks Style Guide)를 통해 컬러를 일관되게 사용하고 있는데요, XD에서는 이러한 컬러 세트를 사용할 수 없어 아쉽습니다. 미리 컬러를 등록해둔 XD 파일을 이용해 작업을 시작하고 있지만 좀 더 세심한 컬러 관리 기능이 도입되면 좋겠습니다.다음 업데이트가 기대되는 툴그동안 디자이너에게 포토샵과 일러스트레이터의 위상은 높았습니다. 하지만, 어느 순간부터 UI 디자인의 무대가 웹에서 모바일로 이동하고, 모바일 UI 디자인이 필요로 하는 다양한 기능들을 가지고 있는 툴에게 자리를 내주게 되었습니다. 하지만, Adobe도 가만있지 않고 기존의 툴에서 부족한 점이 무엇인지 정확히 파악하고, 그 부분을 쉽게 사용할 수 있는 XD를 출시하게 된 것이죠.디자이너의 입장에서는 아직 아쉬움이 많지만 간단하게 만들 수 있는 그리드, 빠르게 진행할 수 있는 프로토타이핑, 그리고 만든 프로토타입을 쉽게 공유할 수 있는 기능 등 XD만의 특별한 부분도 많아 계속 XD를 통해 작업해볼 생각입니다. 또, 정식 버전으로 출시된 후 한, 두 달에 한 번씩 업데이트되고 있는데요, 업데이트 내용을 보면 XD가 어떠한 방향으로 나아가야 할지 Adobe가 잘 알고 있음을 느낄 수 있었습니다. 앞으로도 발전할 XD를 기다리며 글을 마칩니다.맥 사용자이고 Adobe에 회원 가입이 되어있다면 무료로 XD를 사용할 수 있습니다.http://www.adobe.com/kr/products/experience-design.html#리디북스 #디자인 #디자이너 #Adobe #XD #AdobeXD #꿀팁 #디자인꿀팁 #UI #페이퍼UI #반복그리드 #프로토타이핑 #공유기능
조회수 1030

브랜딩을 다시 생각해보자: 개념원리 브랜딩

브랜딩에 관련된 수많은 얘기가 넘쳐나는 요즘입니다.이미 원론적인 내용은 다양한 전문가님들의 고견들을 통해 섭렵하셨으리라는 전제 아래, 조금 다른 얘기를 해보려고합니다. 전략이나 방향성 등등 브랜딩은 그 자체가 추상적인 개념이기에 원론적인 내용을 빙빙 돌 위험성이높습니다. 하지만 변하지 않는 절대명제는 어떤 방향성이든, 무슨 전략과 계획을 수립하던 누군가는 ‘일’을 해야 한다는 것입니다. 그리고그 시작은 항상 본질에서 비롯되지만, 폭망은 디테일에서 비롯된다는 점이죠.   500만원을 들여서 브랜딩 컨설팅을 몇 개월 내내 받았습니다. 비즈니스모델도 손보고, 마케팅 전략도 일체화 시키고, 막 로고와 슬로건도 재정비하고, 퍼포먼스 브랜딩 전략도 기똥찬 아이디어로 구축했습니다. 막 잘될 것 같아서 만세를 외치고 있는데 정작 폭망의 이유는 단순한 것들에서 비롯됩니다. 엉기 성기 대충 붙인 주소 라벨이나, 전날 술 먹고 퀭한 얼굴로 불친절한 점원의 삐딱한 짝다리 등이 그것이죠.  실무단의 브랜딩은 전문가들의 브랜딩과는 조금 결이 다릅니다. 그들에겐 일이고, 노력이고, 몸을 움직여야 하는 것들입니다. 그래서 저는 이러한 이야기들을 다뤄보고자 합니다. 바로 실무자들의 브랜딩에 대해서 말입니다.  이 글은 브랜딩의 성공을 위한 글이 아닙니다.오히려 대폭망을 예방하는 차원의 디테일한 이야기들에 가까울 것 같습니다. 물론, 그 전에 이번 시간을 통해 브랜딩의 기본적인 개념은 한 번 정리를 해야 할 것 같습니다. 브랜딩이 어떤 식으로 작용하는지 공급자와 소비자 입장에서 나누어 생각해보죠.먼저공급자 입장에서의 브랜딩입니다. 브랜딩. 각인시킨다는 뜻이죠. 알린다는 의미와는 조금 다릅니다. 그 어원도 다르고, 단어자체의 뜻도 다르죠. 물론 어원이 기능을 상징하는 것은 아니지만, 꽤나 의미가 있는 것이니 짚고 넘어갈 필요는 있다고 생각합니다.  일단 ‘알린다.’는 뭔가 정보를 주는 느낌입니다. 이를테면 이런 문장들입니다.우리건 놀라운 기능이 있어. 우리건 화소수가 5천만이야. 우리건 유기농이야. 우리는 사회취약계층에게 일자리를 제공해. 우린 자신을 찾는 교육을 해.이처럼 무엇인가를 ‘가지고 있다.’ 또는 ‘한다’ 등의 정보를 제공합니다. 그러니까 이것은 행위의 문제죠. 이렇게 얘기를 해보겠습니다. 저는 브랜드에 관련된 기획과 디자인을 합니다. 그렇죠. 이것들은 제가 하는 겁니다. 그럼 이것을 하는 저는 어떤 사람일까요? 까칠한사람? 생각 많은 사람? 잘생긴 사람? 네, 모두 맞을 겁니다. (함정이숨어있어!!! -0-!)  제가 하는 일을 알리고 명함을 드리고 제안서를 던지는 것은 ‘정보를 주는 행위’ 입니다. 문제는 누가 이 행위를 하고 있느냐 하는 것이죠. 브랜딩은 이 질문에 대한 해답을 내야 합니다. 당신이 무엇을 하는 지가 아니라, 그러니까 너흰 누군데?  당신이 무엇을 하는 지가 아니라, 그러니까 너흰 누군데?  각인이란 표현을 썼습니다. 각인. 새긴다는 뜻이죠. 원래는 가축이나,벽돌, 목판, 또는 살에다가 새겼던 것입니다. 불로 지져서. 아프게. 물론 꼭 노예와 전쟁포로를 구별하기 위함만은 아니었습니다. 목조건물과 선박이 많았던 옛날옛적에는 인두로 까맣게 태워서 고유의 문장을 만들곤 했으니까요. 나무나 벽돌, 가축에 불로 각인시키는 것도 Brand의 행위 중 하나였죠. 이것은 현재의 브랜딩 개념과는 조금 다른 단순한 식별과 책임소재, 품질에 대한 보증을 나타나는 일종의 표시행위와 같다고 할 수 있어요. 이 행위는 이미 기원전 수 천년 전, 인류문명의 발단과 함께 발생하기 시작했습니다. 이 후 산업의 발전과 다양한 경제체제의 발달, 문화와 종교의 발전과 기업와 온라인매체의 등장으로 그 정의가 다양하게 바뀌긴 했습니다만, 브랜딩이 가진 고유의 가치는 변치 않고 항상 내포되어 있습니다. '표기'의 기능이죠. 그럼 여기서 질문. 그럼 브랜딩은 단순히 로고 만드는 거예요? 불로 새겨서 간판 만들듯이? 아닙니다. 그런 얘기를 할 거면 글을쓰지 않았을 겁니다. 아마 간판을 만든 이유는 이랬을 겁니다.  13세기중반 무렵 옆 집 말발굽(편자) 장인이 어느 순간 무쇠로만든 것을 만들어서 팔기 시작했을 겁니다. 13세기 이전에는 청동등을 이용해서 편자를 만들었는데, 녹이 쉽게 슬고 성형이 어려워서 무쇠로 만든 편자가 유행하기 시작했죠. 그래서나도 질 수 없으니 무쇠편자를 만들기 시작했습니다. 그런데 녀석이 간판에 ‘원조 말발굽’ 이라고 써 붙이고 자기 이름도 막 써 붙인 겁니다. 녀석이 원조긴 하지만, 그렇다고 내 손님들을 다 뺏길 순 없으니, 뭔가 다른 점을 어필하고 싶었을 겁니다. 고민하던 편자집 사장은간판에 이렇게 써 붙입니다. ‘말사랑 편잣집’. 그리곤 5살때부터 말을 타고 놀았던 프로교감러의 특기를 살려 ‘내 말이 말같지 않을 때.’ 라는 캐치프라이즈를 써 붙이곤 말의 종합검진 서비스까지 함께 진행하기 시작했습니다. 내 말이 소중해서 매일 쓰다듬어주던 마주들은 종합검진 서비스까지 받으면서 나에겐 무뚝뚝하지만 내 말에겐 자상한이 츤데레 영감에게 빠져들기 시작했을 겁니다.  그리고 사람들은 저 말사랑 편잣집을 애용하기 시작했습니다. 그리고 소문을 냈겠죠. 거기 어디야? 라고 사촌 에넬슨도 물어보고, 사돈의 팔촌인 에릭도 물어 봤을 겁니다. 설명을 해줘야 하는데 ‘거기 시장골목 안쪽으로 들어가서 45걸음을 걸어간 후 옆에 과일가게 맞은편 골목 안쪽 어쩌고……’라며 주구장창 말할 순 없었겠죠. 뭔가 신호가 필요했던 것입니다. 이 때 이미지나 이름이 있다면 쉽게 말할 수 있었을 겁니다. ‘하트안에 말 그려진 곳으로 가’‘말사랑말발굽이라고 써진 곳을 찾아봐’ 라고 말이죠. 간판과 로고, 심볼의 존재 목적은 이것입니다. 무엇인가를 인식하고 식별하는 역할이죠. 우리가 좀 착각하고 있는 것은 로고가 겁나 예쁘면 우리가 브랜딩 된다는 생각들입니다. 비주얼 브랜딩의 측면에서 비주얼은 당신이 이미 하고 있는 행동을 상징화시키는 도구일 뿐입니다. 그 예쁜 이미지가 당신의 행위나 가치관을 상징하지 못한다면 공허해지는 것이죠. 물론 위는 가상의 예지만, 중요한점을 시사하고 있습니다. 행위가 먼저이고, 인식은 그 후입니다. 각인은 그 인식의 반복 또는 섬광기억을 통해 형성되는 것 이고요. 이게공급자 입장에서의 브랜딩입니다. 행위가 먼저이고, 인식은 그 후입니다.소비자입장에서의 브랜딩은 오히려 조금 다른 개념입니다.  공급자 입장에선 인식을 시켜야 하고 그걸 반복시켜야 하는데, 소비자에게 그걸 직접 어필할 순 없습니다. 길가가던 사람에게 로고를 들이밀고 외워주세요!! 라고 외치지 않는 이상 말이죠.  소비자 관점에서 브랜딩이란 자신도 모르는 사이에 서서히 무의식에 쌓여가는 느낌이 더 강합니다. 게다가 우리는 의식적인 기억에 대한 허무함을 잘 알고 있습니다. 기억해야지!! 라고 다짐한 것들을 내일이면 죄다 까먹는다는 사실을 지난 12년+대학생활의 중간/기말 고사를 통해서 충분히 깨달았을 테니까요.  대신 어디 빵집의 딸기 케익이 겁나 맛있었다는 사실은 아주 오래도록 기억할 수 있죠. 그렇다고 딸기 케익이 생존과 연관이 있는 것은 아닙니다. 물론 뇌 입장에선 딸기 케이크야 말로 내 삶의 원동력이라고 인식했을순 있겠습니다만, 기존의 생존용 기억의 우선저장 메커니즘과는 조금 결을 달리합니다. 물론 인간은 옛 본성을 대부분 간직하고 있기에, 생존에 필요한 정보를 우선적으로 저장합니다. 하지만, 이제 인간은 길가다가 사자에게 물려 죽을 걱정은 하지 않아도 되는 세상에 살고 있습니다.  대신 정보들이 겁나 많으니 그것을 취사선택 해야 할 필요가 생겼습니다. 버려야 하는 것들을 일일이 검증해서 골라내는 것은 뇌 입장에선 귀찮은 일이죠. 인간의 기억메커니즘은 ‘선호도나 긍정적인 경험’을 우선적으로 받아들이고 나머지는 ‘모르니까 안 해’ 카테고리에 던져버리기 시작했습니다. 물론 짱 싫은 것들은 따로 분류를 해놓았겠죠. 그것은 짱 싫으니까요. 이를테면 저에게 브로콜리 같은 것 말입니다. 그러니 이러한 관점에서 보자면 소비자에게 브랜딩이란 ‘자신이 경험한 것’ 그 자체입니다. ‘경험을 사고 판다.’ 라는 것이 마케팅이나 브랜딩의 기본 명제가 된 것도 무리가 아닙니다.  하지만 이 ‘긍정적인 경험’ 이란 것의 기준은 무엇일까요. 물론 대다수에게 행복한 경험들이 존재합니다. 사랑이나, 이타심, 따뜻한 것(마음이 아니고, 진짜 그냥 따뜻한 것), 맛있는 것, 고양이와 강아지 등이 그것이죠. 대부분 이러한 것들은 인간의 본능에 접점을 두고 있는 것 들입니다.  그러나 대부분의 인간은 ‘취향’을 지니고 있고, 이 때문에 수많은 변수와 갈래들이 생겨나기 시작합니다. 허나 70억 인구가 모두 다른 취향을 지니고 있느냐 하면 또 그것은 아닙니다. 물론 사소한 취향까지 경우의 수를 따져보면 모두 다를 순 있겠지만 대부분 ‘나만의 취향’ 이라고 생각하는 것들은 이미 함께 하는 다른 사람들이 존재하기 마련입니다. 코딱지를 파서 책상 밑에 붙이던 것도 나만 하는 줄 알았겠지만, 이미 이 자리를 지나간 선배님들의 역사 속 분비물들을 손 끝으로 느꼈을 때의 소름처럼 말이죠. 원피스나 나루토도 명확하게 그 파가 갈립니다. ‘순대에 된장을 찍냐 초장을 찍냐’도 그렇죠. 자박한 된장찌개나, 시원한 된장찌개도 그 취향을 공유하는 사람들이 꽤나 있습니다. 꽃 향을 좋아하는 사람과 시원한 향을 좋아하는 사람도 나뉘죠. 이처럼 취향이란 것은 개인의 것이기도 하지만, 카테고리화가 가능한 수준의 것 들입니다. 덕분에 소비자심리학에선 소비자들의 행동패턴과 취향을 분류하여 데이터화 시킬 수 있었죠. 이러한 혼돈 속의 질서, 그러니까 ‘심리적프랙탈’ 덕분에 인간은 공감대를 나누고 사회라는 것을 이루며 살아갈 수 있게 되었습니다.  문제는 대부분의 기업들이 인간이 지닌 이 취향과 경험을 혼돈한다는 것입니다. 취향은 말그대로 취향일 뿐입니다. 그러나 경험이란 것은 좀 더 다양한 요소의 결합이죠. 소비자들은 대부분의 객관적 정보에 대해선 호/불호를 가를 수 있습니다. 그러나 그저 노출되는 것에 대해선 그 경계를 구분 지을 수 없어서 애매한 정보로 남겨놓기 마련이죠. 그리고그것을 호기심과 경계의 시선으로 바라봅니다. 처음엔 경험도 꺼리게 되죠. 하지만 그 경험에서 어떠한 좋은 요소를 발견했다면, 얼른 ‘좋은 쪽’으로 남겨놓으려고 합니다. 뇌 입장에선 불투명한 것보다 섣부른 판단이 더 합리적이고 편하거든요. 무엇이 좋은 경험을제공하는 요소일지는 취향과는 별개로 굉장히 다양한 디테일들이 결정합니다. 취향은 그 시발점을 제공하지만, 결과물을 보장하진 않습니다. 예를 하나 들어볼까요.뇌 입장에선 불투명한 것보다 섣부른 판단이 더 합리적이고 편하거든요.  원피스 카페가 오픈했습니다. 원피스 팬들은 막 원피스 레어 피규어와 메리 호 인테리어를 보는 것만으로도 취향 저격당해서 심장을 움켜쥐었을 것입니다. 그러나 그것만이 경험의 모든 것이었을까요? 아닙니다. 입구에서 카페주문, 음식의맛, 애기들이 얼마나 뛰어다니고 시끄러운지, 좁은 공간과, 화장실의 청결도 등…… 다양한 행위들의 합을 통해서 경험의 총평을 내립니다. 물론 취향저격이란 것은 어느 정도의 마이너스요소를 방어해주는 +5방어력의 쉴드 아이템 이지만 무적은 아니죠. 그 마이너스점수가 인내심을 초과하는 순간, 소비자는 그곳을 ‘싫어!’ 로 분류합니다. 재미있는 것은 그곳이 싫다고 해서 원피스가 싫어지는 것은 아니란 점입니다. 이것이 취향과 경험의 차이입니다. 소비자 입장에서의 브랜딩이란 것은 내 취향을 저격하는 것이 아니라, 내 시간과 비용을 만족으로 채울 수 있는 경험을 의미합니다. 정리해 보자면 공급자는 행위를 하는 것이고, 소비자는 그 행위를 통해 만족스런 경험을 얻는 것입니다. 여기서의 경험이란 내가 직접 하는 행동 이외에도 앱 하단에 미친 듯 떠오르는 광고창에 x가 눌러지지 않아서 막 광고링크로 넘어가 버리거나, 카페에 와이파이가 잘 안 잡혀서 곤혹스러웠다든가, 불량상품의 교환이 1달씩걸린다든가, 고객센터 상담원님이 한숨 쉬면서 상담할 때 등의 다양한 간접/환경적 경험도 포함합니다.  경험을 제공해야하는 공급자 입장에선 당연히 세세한 부분의 매뉴얼이나 기획, 운영, 제작 측면에 대한 고민이있을 수 밖에 없죠. 지금까지는 브랜딩의 나름대로의 정의와 역할에 대해 알아보았습니다. 다음 글에선 이러한 브랜딩이 실무단으로 넘어갈 때 어떤 일들이 발생하는 지 살펴보도록 하겠습니다.
조회수 306

이런, 박쥐같은!

B.A.T는 매달 한 번씩 돌아오는 노마드데이에서진행되고 있는 프로젝트별 상황 공유와 함께 조직 가치를 상기시킨다.하지만 우리는 꽤나 인간미 넘치는 사람들인지라 막상 그때뿐,눈에 보이지 않고 시간이 지나면 잊는 것이 인지상정 아닌가 하는자연스러운 현상(...)에 그동안 매우 충실해왔다.그래서 우리 스스로가 일할 때마다 조직 가치를 되새기고 인지할 수 있도록포스터를 만들어 사무실에 붙여놓아야겠다는 갑작스러운 대표의 근엄스러운,다짐 같은 의뢰로부터 이 프로젝트는 시작되었다.(고백하건대, 처음엔 학교 다닐 때 칠판 위에 떡하니 붙어있던 급훈 정도라고 생각했...)하지만 어느새 여기포스터 작업을 맡게 된 디자이너들의 크리에이터와 의지가,이 매력적인 작품들로 재미있는 작업을 해보고싶다는 모션 디자이너의 추가 의견이,그리고 우리 디자이너들의 멋진 작품들을 자랑 좀 해야겠다는 글쓴이의 욕심이 더해져이렇게 본격 셀프-자랑 브런치 포스팅이 나오게 된 것이었다.어쩌면 판만 깔아주면 일을 알아서 더 벌리는 우리의 습성을너무나도 잘 알고 있었던 대표의 빅피처였을지도. (대표님... 리..리스펙!)자, 서론은 여기까지 하는 걸로 하고본격적으로 B.A.T의 네 가지 조직가치 포스터에 대한 이야기를 해보자.왼쪽부터 나하나, 주영진, 이건용, 임철규 디자이너 작품 순1. 놀라운 고객 경험 (Amazing Customer Experience)우리는 단순한 고객 만족을 넘어 그 이상으로 고객의 감탄을 나아내는 것을 지향합니다.1) 새롭고 차별화된 것을 추구2) 고객 원츠가 아닌 고객 니즈를 파악2. 끊임없는 성장 (Constant Growth)우리는 개인적으로나 조직적으로나 끊임없이 성장하기를 원하는 사람들이 모여있는 조직입니다. 단기간의 오버페이스가 아닌 장기적인 관점에서 끈기를 가지고 성장을 추구해야 합니다.1) 빠른 러닝커브와 성장지향형 마인드2) 철저한 자기관리3. 압도적인 성과 (Overwhelming Achievement)우리는 매우 탁월하고 압도적인 성과를 추구하는 사람들입니다. 매우 뛰어난 한 명이 보통의 여럿보다 훨씬 낫다고 믿는 우리는 개개인이 압도적인 성과를 만드는 전문가가 되어야 한다고 생각합니다.1) 중요한 것에 집중하기2) 더 높은 퀄리티와 완성도에 집착하기3) 철저하게 타임라인 지키기4) 집요하게 파고들어 결과를 만들기5) 똑똑하고 효율적으로 일하기4. 유기적인 협업 (Organic Collaboration)우리가 만드는 결과물은 결국 한 명의 힘으로 이뤄지지 않습니다. 전에 없던 브랜드를 만들기 위해서는 상황에 맞게 변화하는 유기적인 협업이 필요합니다.1) 투명한 커뮤니케이션2) 수평적인 문화+수직적인 의사결정3) 동료들의 성장을 지원 (이타심)4) 장기적인 조직 성장에 기여이렇게 힙하고, 세련되고, 감각적인 조직가치를 본 적 있던가!어떻게 보면 조직가치 요소만 덜렁 주어진 꽤 불친절한 상황일 수도 있었지만,네 명의 디자이너는 자신만의 크리에이티브와 스타일을 뽐내는 작품들을 척척 만들어냈다.(심지어 각자 맡은 분야의 디자인 작업을 위한 스케치 설명 덱까지 직접 기획.. 대단한 분들...)각자의 다른 매력들이 드러나서, 그리고 그 다름들 속에서도 B.A.T의 성향이 공통적으로 묻어난다는 점이 묘하면서도 좋은 것 같다. 일종의 B.A.T 유대감 같은 걸 지도. 그리고 각자의 작품이 모션으로 어떻게 표현될 것인지에 대해 모션 디자이너와 의견을 충분히 나눴고,모션 디자이너 역시 생각지도 못했던 아이디어를 끊임없이 제안하며 퀄리티를 높이는데 공을 들였다.그러니 이런 대단한 작품들이 나올 수밖에!실컷 멋진 작품을 선보였는데 글이 더 길어지면 힙한 무드가 깨질 수 있으니 이만 쓰려 한다.그러니까 결론은,B.A.T 디자이너와 모션 디자이너는 욕심 많고 멋지고 크리에이티브하며(비주얼에 속았을 수도 있지만) B.A.T 조직가치는 만만치 않게 빡세다는 것...!
조회수 1915

슬라운드 브랜드 아이덴티티(B.I) 개발기 - 4화

슬라운드의 철학을 균형있게 꿰어줄 브랜드의 이름표(로고와 심볼)이 정해졌고,이제 브랜드의 전체적인 인상을 가장 직관적으로 전달하는 컬러에 대한 고민을 시작하고자 합니다.1) 브랜드 메인컬러 정하기슬라운드의 최초 브랜드 컬러는 '파랑'(or 군청) 이었습니다. 사실 색채심리효과만 봤을때는 파랑은 많은 컬러들 중 가장 '신뢰'를 줄 수 있는 컬러 중 하나라서많은 기업들이 브랜드 아이덴티티 컬러로 빈도높게 사용하고 있습니다. (특히 금융..)다만, 슬라운드는 '좋은 잠'을 제공해야한다는 미션을 가지고 있는 브랜드라는 점에서그동안 원색적인 파랑이 계속 어색하게 느껴졌고, '잠과 편안함'보다는매트리스 포인트로 적용했을때도 에너지 넘치고 스포티한 느낌?을 주고 있습니다.때문에 브랜드 메인 컬러가 매트리스 제품에 적용되었을때 부담스럽지 않고 편안한 이미지로 전달되도록 하기 위해, 가장 실내 환경에서 잘 어우러질 수 있는 색을 찾고자 했습니다.그래서 아닌밤중에 논문스터디를 시작했습니다..ㅋㅋ 실내환경 내 색채 분포 (국내위주) 통계 자료들을 살펴보니, 가장 빈도 높게 사용되고 있는 컬러는 뉴트럴 - Y (소위 말하는 베이지, 아이보리 등) 이었습니다.사실 논문으로 검증하지 않아도 알 수 있는게, 당장 우리집만 보아도천장과 벽은 늘 하얗고 바닥은 베이지나 갈색 계열이죠. (마루또는 우드 데코타일 등)가능한 천정이 높고 집이 넓어보일 수 있는 무난한 마감? 컬러의 조합법입니다. (일반적인 아파트)이렇게 메인 컬러로 뉴트럴-Y를 설정한 후 이 중에서도 가장 슬라운드에 적절한 톤을 찾아내기 위해형용사 스케일을 이용했습니다. 실내공간에서 주로 사용되는 형용사 스케일을 분석해서브랜드 철학과 가장 접정이 가깡룬 '편안한, 심플한, 세련된, 모던한, 차분한' 의 컬러들이 분포되어있는지점을 찾았고, 그 영엑에 맞게 뉴트럴-Y의 톤을 조정했습니다. 2) 포인트 컬러 정하기앞서 실내환경에서 가장 편안하고 조화로운 색으로 메인 컬러 (뉴트럴-Y)를 설정했고,이번에는 다양한 제품라인에 적용할 수 있는 포인트 컬러를 찾아보고자 합니다!메인컬러를 설정하긴 했지만 이는 슬라운드 제품군을 한눈에 각인시킬 수 있을만한  인상적인 시그니처 컬러라기보다는 편안하게 베이스로 사용될 만한 컬러였고, 앞으로 확장될 매트리스와 토퍼의 다양한 제품  라인을 좀 더 직관적으로 쉽게 구분하기 위해서는 포인트로 사용 할 수 있는 (좀 더 정체성 있는) 색상들이 필요했습니다.즉, 포인트 컬러는 제품의 정체성을 잘 보여줄 수 있는 컬러이면 좋겠다는 생각이 들었고,슬라운드의 미션에 부합 하는 '좋은 잠'을 위한 색을 찾기위한 스터디를 시작했습니다.몇해 전 컬러리스트 기사 공부를 하면서, 색채가 단순히 심리 효과외에도 신체에 직간접적으로 영향을 줄 수 있다는 점을 알고 있었기 때문에, '수면'에 좋은 영향을 줄 수 있는 컬러테라피, 크로마테라피등의 이론들을 살펴보았습니다. 편안함, 휴식, 에너지 재충전, 안정감, 자연적, 부드러운 이미지를 전달하는 Green.먼저 그린 컬러는 자연에 매우 가까운 색상이기 때문에  톤의 영향이 있긴 하지만 누구나 직관적으로 편안하고 안정을 느낄 수 있는 컬러 입니다. 심리학적으로는 휴식, 진정, 회복의 영향을 주고 시각적 편안함과 긴장을 완화하는 기능을 할 수 있는 컬러입니다. 때문에 많은 대형병원에 인테리어에 색채계획을 할때 다양한 톤으로 적용되고는 합니다. 즉, 고된 하루를 보낸 후 내일을 위해 재충전을 하가 위한 '수면'에 매우 좋은 영향을 줄 수 있는 컬러라고 판단이 되었습니다.신뢰, 단순한, 사고와 명상을 도와주는, 전문적인 의 이미지는 전달하는 Blue.블루 컬러는 앞서 다양한 예시들로 보여드렸듯이 일반적으로 '신뢰'를 상징하는 컬러여서 전문적이고 견고한 이미지를 가지고 있습니다. 초기 슬라운드가 가지고 있던 엄격한 군청 또는 파랑파랑은 딱딱하고 무거운 느낌을 주지만 그린 계열이 약간 섞이거나 채도와 명도를 조절하면, 치유와 안정의 심리효과를 가질 수 있습니다. 특히 사고와 명상을 도와주는 색으로 기능할 수있어 마음을 안정하고 호흡을 원활하게 하는데 도움이 된다고 합니다. 포인트 컬러 톤앤매너이렇게 색채 심리, 컬러 테라피, 크로마테라피 이론을 통해 포인트 컬러 2가지를 선정했습니다.아직 포인트컬러는 브랜드 이미지에서 표현되지 않았지만, 앞으로 출시될 제품들에는각 제품라인의 정체성을 잘 보여줄 수 있는 형태로 포인트 컬러들이 적용될 예정입니다.이번화를 통해  슬라운드는 3화에서 개발한 로고와 심볼을 잘 뒷받침 해줄 수 있는 브랜드 아이덴티티 컬러를 갖게 되었습니다. 나름대로 열심히 브랜드 철학부터 적용될 터치포인트들을꼼꼼히 고민을 해서 방향을 설정하고 브랜드 이미지 만드려고 노력을 해왔는데, 앞으로 슬라운드의 브랜드 철학과 진정성이 고객들에게  보다 잘 전달 되었으면 좋겠습니다.
조회수 3375

UI 텍스트: 시간 표기 방법

거의 모든 UI 중에서 빠지지 않고 들어가는 UI 텍스트가 있다면 무엇일까?아마도 그것은 '시간'일 것이다.                        (사진: 어느 서비스에서도 빠지지 않는 시간 표기)날짜와 시각으로 구성된 ‘시간’은 UI에서 뿐 아니라 우리 생활 속에서도 늘 가까이 함께하는 공기 같은 텍스트다.아침 알람 소리에 깨어나 가장 먼저 보는 스마트폰 화면에서도 볼 수 있고, 출근 준비하며 켜둔 아침 TV 프로그램의 상단 구석에서도 볼 수 있다.이 글을 읽는 여러분 곁에도 ‘시간'은 함께하고 있다. 스마트폰으로 보고 있다면 상단 Status bar에, Mac이라면 오른쪽 상단에, Windows면 오른쪽 하단에 시간이 표기되어있다.이렇게 많이 여러 곳에서 쓰이다 보니 날짜와 시간을 표기하는 형식이 다양한데, 이를 서비스에 적용할 땐 어떻게 표기해야 좋을지 고민하게 된다. 예를 들면,1. '오전 12시'란 하루가 넘어가는 시각을 말하는 것일까? 아니면 오전에서 오후로 넘어가는 정오를 말하는 것인가?2. 그리고 흔히 말하는 '저녁과 밤, 그리고 새벽의 경계'는 어디쯤일까?이런 궁금증들에 대해, 그동안 나름의 방법들을 찾았는데(이미 누군가는 잘 알고 사용하고 있던 나만 몰랐던 방법들...) 이를 비슷한 상황의사람들에게 공유하고자 한다.12시 마감 시간을 표기하는 방법예전 디캠프의 디시전 캠프 신청 때 있었던 일이다.신청서 마감일이 12시로 표기되어 있었는데, 이를 어느 분이 수요일 낮 12시까지 인 줄 알고 신청서 제출을 미처 하지 않았다가 알고 보니 화요일에서 수요일로 넘어가는 밤 12시였던 것이다. 이분처럼 헷갈려하시는 분들이 좀 있으셨던지 디캠프 측에서 날짜를 하루 더 조정해주어서 다행히 원활하게 처리 되었었으나 만약 처음부터 정확한 시간이 표기되었었다면 이런 조정 과정이 필요치 않았을 것이다.                          (사진: 디캠프 디시전 프로그램 공고 코멘트 영역)이 상황처럼 밤과 낮을 헷갈려하기도 하지만 '밤 12시’라고 표현할 경우엔 그 날의 시작인지 그날의 끝을 뜻하는지 헷갈리기도 한다.그렇다면 어떻게 표기하면 좋을까?12시 대신 그에 약간 못 미치는 시간으로 표기하면 된다. 예를 들면 3월 31일 오후 11시 30분 같은 시간으로 말이다.만약 30분이 너무 이르다면, 단 1분이라도 앞당겨 오후 11시 59분 으로 표기해도 사용자에게 명확한 날짜와 시간을 전달할 수 있다.생활 패턴을 기준으로 시간을 표기하는 방법지금 이 글을 쓰는 현재 시각은 3월 31일 오전 12:31 분이다. 하지만 오늘 있었던 일을 나에게 말하라고 한다면, 나는 아마 3월 30일을 기준으로 말하게 될 것이다. 하루를 마무리하며 잠들기 전까지 오늘은 30일 이었다고 생각할 테며, 31일의 시작은 아침 기상 이후라고 여기기 때문이다. 이처럼 대부분의 사람들은 이틀을 걸쳐 깨어있더라도 하루라고 느끼고 있다.이러한 생활 패턴에 따른 자연스러운 인지를 이용하여 표기해주는 게 때로는 정확한 시간보다도 더 정확하게 느껴지는데, 이것을 이용한 것이 바로 극장 영화 상영 시간표이다.                            (사진: CGV 강남 주토피아 상영 시간표 캡처)위 사진을 보면 하루에는 존재하지 않는 '3월 31일 25:50'이라는 이상한 시간으로 나와있다.분명 존재할 수 없고 이해하기도 어려운 시간이지만 우리는 이것을 보고 '4월 1일 01:50'이라는 정확한 표기 보다도 더 정확하게 이해할 수 있다.(28:10의 경우엔 과해 보이기도 하나 영업일을 기준으로 설정한 것 같다)영화 예매처럼 영업일과 예약 시간 등이 필요한 서비스라면 충분히 참조할만한 UI 텍스트다..낮과 밤, 그리고 새벽 등으로 시간 표기하는 방법공방을 찾는 서비스를 준비할 때 지인들에게 시간대 인지에 관한 간단한 조사를 실시한 적이 있었다. 공방들의 수업시간이 유동적이고 애매모호하게 표현되는 경우가 많아서 정확한 시간 표기보다는 낮 또는 오후나 저녁과 같이 폭넓게 사용할 수 있는 방법으로 표기하고자 했는데, 이 단어들에 대해 사람마다 어떻게 느끼는지 알아보기 위한 조사였다. 결과는 대개 비슷하게 여기고 있었으나 사람 간 꽤 큰 차이가 발생하기도 하였다.그리고 조사 후 한참이 지난 이후에 알게 된 사실인데, 내가 했던 이러한 고민들을 해결할 수 있는 공식적인 시제 표현이 있었다. 바로 기상청에서 표현하는 시제 표현 방법이며 내용은 다음과 같다.00:00~03:00 - 한밤03:00~06:00 - 새벽06:00~09:00 - 아침09:00~12:00 - 늦은 오전 (오전 늦게)12:00~15:00 - 이른 오후15:00~18:00 - 늦은 오후 (오후 늦게)18:00~21:00 - 저녁21:00~24:00 - 늦은 밤 (밤늦게)06:00~12:00 - 오전12:00~18:00 - 오후09:00~15:00 - 낮18:00~24:00 - 밤(기상청: http://web.kma.go.kr/aboutkma/biz/forecast05.jsp)참조 자료:책 서비스 글쓰기의 모든것? (죄송합니다 제목이 잘 기억나지 않아요) / 기상청 홈페이지 / 인터넷 서치팁으로, 다른 다른 언어의 시간과 날짜를 표기방법을 확인할 수 있는 라이브러리가 있습니다. 텍스트 글자수를 고려해야할때 확인하기에 유용할 것 같습니다. (http://momentjs.com)#텐시티 #UI디자인 #인사이트 #일지 #후기 #경험공유
조회수 2183

비전공자를 위한개발자 되기 5 스텝

안녕하세요. 언제 어디서나 함께하는 코딩 교실 엘리스입니다 :)아이디어만 좋다면 뭐든 실현해볼 수 있는 시대! 지금은 '프로그래밍'이라는 강력한 무기를 통해 원하는 세계를 실현할 수 있는 잠재적 가능성이 폭발적인 때입니다. 그리고 그 기회는 비단 '개발자'라는 특정 직업에 국한하지 않더라도 각계 분야에 펼쳐져 있는데요. 이미 마케터, 기획자, 디자이너, 콘텐츠 창작자, 금융업계 종사자, 지리학자, 연구원 등 다양한 분야의 많은 사람들이 프로그래밍을 통해 각자의 영역과 세계 곳곳을 새로운 곳으로 만들고 있습니다.높은 급여와 삶의 질을 보장하고 나의 꿈을 펼칠 수 있는 탁월한 수단인 프로그래밍.프로그래밍을 업으로 삼고 있는 사람들의 시작은 어땠을까요?이 글에서는 소프트웨어 엔지니어가 되고자 이제 막 마음먹은 분들을 위해 프로그래머가 되기 위한 다섯 가지 짚고 넘어가면 좋을 팁들을 알려드릴게요.STEP 1. 개발 친화적인 환경 찾아가기서당개 삼 년이면 풍월을 읊는다컴퓨터 공학 전공자와 비전공자가 가지게 되는 가장 큰 차이는 무엇일까요? 개발에 대한 이론 지식? 개발 능력?물론 모든 게 상대적인 것이겠지만 일반적으로 한 가지 큰 차이가 있다면 바로 '환경'이라고 할 수 있을 듯합니다. 내 주변에 개발과 관련된 자원이 얼마나 풍부한가 하는 점입니다.전공자가 개발을 시작하고자 마음을 먹으면 주위에서 좋은 리소스를 쉽게 찾을 수 있습니다. 한편 비전공자는 개발 공부를 시작하려고 할 때 레퍼런스로 삼을만한 좋은 예가 없으니 망망대해에 홀로 떠있는 기분이 들 수밖에 없겠죠! 그렇다고 해서 반드시 컴퓨터 공학 전공에서부터 다시 시작하거나 고액의 학원에 다닐 필요는 없습니다. 먼저 개발과 관련된 인적, 물적 자원이 풍부한 곳으로 적극적으로 다가가보세요. 작은 환경의 변화가 큰 변화의 시작점이 될 수 있습니다.엘리스가 추천하는 방법!온라인 커뮤니티 활동하기 : 코딩과 관련된 페이스북 그룹에 가입하여 많은 정보를 접하고 질문도 하면서 활동해보세요. 나와 비슷한 상황인 사람을 만나 서로 도움을 주고받을 수도 있고, 내 롤모델이 될만한 훌륭한 개발자를 만나 공부의 동력이 될지도요!개발 동아리, 스터디 등에 참여하기★ 엘리스 코딩 클래스 활용하기 : PC로도, 모바일 앱으로도 언제 어디서든 프로그래밍을 위한 환경에 접속하세요! 엘리스에 로그인하는 것만으로 공부하기 위한 모든 리소스를 얻을 수 있을 뿐만 아니라 과목별 채팅방을 통해서 함께 공부하고 있는 수강생들, 과목 튜터와의 활발한 대화에 참여할 수 있습니다. STEP 2. 강력한 동기와 조력자 만들기하늘은 스스로 돕는 자를 돕는다컴퓨터 공학 전공자라고 하면 모두 다 개발을 잘할까요? 적어도 아주 조금은 더 잘할까요? 대답은 NO!아무리 많은 이론을 배웠다고 해도 직접 개발을 하지 않는다면 아무런 소용이 없겠지요. 이해도가 다르기 때문에 배움의 속도는 조금 다를 수도 있겠지만 이런 차이보다는 개인의 학습 의지와 동기가 얼마나 분명하냐가 더 중요합니다.막연하게 '개발자'라는 너무 먼 목표만 보고 달리는 것보다는 보다 가까이에 있고 달성하기 쉬운 분명한 목표를 단계별로 설정해보세요. 그리고 '즐거움'을 느낄 수 있는 수단을 찾아 목표 달성을 위한 집중력을 높이세요. 동시에 내가 어려움에 처하거나 헤매고 있을 때 도와줄 조력자가 있다면 금상첨화!Photo by Mimi Thian on Unsplash엘리스가 추천하는 방법!동기 부여를 위한 작은 목표 설정 : 지식 습득 및 학습과 관련된 목표로 그룹 스터디 참여, 부족한 부분의 프로그래밍 강의 완강, 책 한 권 떼기 등이 있을 수 있고, 더 적극적인 형태의 개발 경험을 위해 공모전, 경진 대회 등 기간과 보상이 정해져 있는 대외 활동 참가 및 수상도 좋은 목표가 될 수 있을 거예요.★ 엘리스 코딩 튜터 활용하기 : 엘리스에는 학습을 도와주는 튜터가 있습니다. 엘리스 튜터는 답을 알려주는 사람이 아니라 답을 찾는 법을 알려주는 길잡이입니다. 공부하다가 막힐 때, 길을 잃은 것 같을 때 엘리스 튜터를 멘토로 삼아 보세요! 구독 및 트랙 이용 시 담당 튜터가 배정되어 개인 채팅방을 통해 1:1 튜터링을 받을 수 있고, 클래스 수강 시 단체 채팅방을 통해 언제든 질문할 수 있습니다.STEP 3. 원하는 개발 분야 탐색해보기  콩 심은 데 콩 나고 팥 심은 데 팥 난다개발에는 아주 숱~한 다양한 분야가 있습니다. 그리고 그 분야에 따라 특성도, 익혀야 하는 언어와 기술도 천차만별인데요. 아래 몇 개의 개발 분야와 사용 언어 및 기술에 대해서 적었으니 참고해보세요. 그리고 이보다 더 다양한 개발의 세계를 탐색해보면서 흥미가 가는 분야가 있다면 구체적으로 검색하고 공부를 시작할 계획을 세워보세요.Photo by Victoriano Izquierdo on Unsplash잘 모르겠다 or 코알못이다파이썬은 분야를 막론하고 많은 분야에서 사용되며 익히기에 쉬워 처음 코딩을 시작하는 입문자에게 가장 적합한 언어 중 하나입니다. 개발 언어부터 접해보고 싶다면 파이썬 언어 학습에서 시작해보세요!웹 개발 '콩 심은 데 콩 나고~'라는 속담을 인용했지만, 사실 다양한 개발 영역의 많은 지식들이 서로 겹치는 부분도 있고, 어느 한 분야를 잘할 수 있을 때 다른 분야로 전향하거나 옮겨가는 일은 보다 수월할 수 있습니다. 개발의 시작을 보다 쉽게 하고 싶다면 웹 개발부터 접근해보세요. 공부할 수 있는 자원이 풍부하고 추후 다른 개발 분야로의 전향도 가능하기 때문이에요.프론트엔드프론트엔드 개발은 주로 웹 환경에서 사용자와 맞닿는 가시적인 부분을 개발하는 영역입니다. 사용자가 코드를 작성하지 않고도 컴퓨터에게 명령을 내리는 등의 의사소통을 그래픽적으로 쉽게 할 수 있도록 가시적으로 만들어주는 것이 바로 프론트엔드 개발자의 역할이라고 할 수 있는데요. 예를 들어 엘리스에 로그인하고 싶을 때 '로그인 버튼을 클릭'하여 쉽게 로그인할 수 있는 인터페이스도 프론트엔드에 해당합니다. * 익혀야 하는 기본기 : HTML, CSS, JavaScript* 좀 더 나아가서 : JavaScript의 프레임 워크인 React.js 또는 Vue.js 또는 Angular.js 백엔드/서버백엔드 개발은 웹 환경에서 보통 사용자에게는 보이지 않는 서버(컴퓨터) 단의 개발을 의미하며, 사용자가 웹 상에서 활동함으로 인해 쌓이는 데이터가 모이는 DB(Data Base)를 다루는 영역을 개발합니다.* 익혀야 하는 기본기데이터베이스에 대한 지식 : MariaDB, PostgreSQL, MongoDB 등. 서버 쪽의 언어- 금융, 제약 등 전통적인 대기업 : Java의 프레임 워크인 Spring을 많이 사용- 과거 많이 쓰이던 기술 : Php(학습 속도와 개발 속도가 빠르며 무료!)를 많이 사용- 요즘 떠오르는 기술 : Python 기반 프레임 워크인 Django 또는 Flask. JavaScript의 프레임 워크인 Node.js* 좀 더 나아가서 : 클라우드 컴퓨팅 기술 Amazon AWS 또는 Azure에 대한 지식데이터 사이언스 - 데이터 분석가21세기에 가장 각광받는 직업 중 하나로 떠오른 '데이터 사이언티스트'에 대해서 모두 다 한 번쯤은 들어보셨을 거예요. 데이터 사이언스 분야에도 아주 복잡하고 다양한 영역들이 존재하는데요. 통상 데이터 사이언스라고 하면 수학 및 통계에 대한 지식, 컴퓨터 공학에 대한 지식, 인공지능 및 머신러닝과 관련된 기술을 사용하게 됩니다. 너무 많아 보이나요? 아래에는 데이터 사이언스의 많은 영역 중에서도 '데이터 분석가'로서 꼭 알아야 하는 내용을 적었습니다.* 익혀야 하는 기본기수학적 지식 : 통계, 선형대수학분석을 위한 언어 : Python, R* 좀 더 나아가서 : 머신러닝 기술임베디드 개발계산기, 에어컨, 자동차 등의 기계가 일정 기능을 컴퓨터처럼 수행할 수 있도록 기계 내부의 하드웨어 시스템을 구축하는 것이 임베디드 개발입니다. 사물 인터넷(IoT, Internet of Things)이나 하드웨어 부품과 관련된 분야에 관심이 간다면 임베디드 개발에 대해서 좀 더 알아보세요!* 익혀야 하는 기본기임베디드 개발 언어- 가장 많이 사용하는 언어 : C언어 - 국내 전통적인 대기업 : Java- 수요가 많은 언어 : Python (임베디드 분야에서도 빠지지 않고 자주 사용하는 언어! 국내 채용 사이트에서 임베디드 관련 개발 스택으로 많이 요구.)* 좀 더 나아가서 : 무선 통신 기술에 대한 지식*(공통) 개발자라면 익히고 있어야 할 기본기 : Git을 사용한 버전 관리 방법엘리스가 추천하는 실습 기반 과목HTML/CSS | JavaScript | 모바일 웹 코딩Git과 Git 버전 관리 (6월 오픈 예정)Python 기초 I | Python 기초 IIC 언어 | C++Java 기초 및 심화인공지능/머신러닝 기초 | 프로그래밍 수학데이터 분석 | Numpy, Pandas | 크롤링 | Kaggle 문제R 기초 |  R 패키지 | R 데이터 분석STEP 4. 실습, 프로젝트 기반으로 공부하고 개발 경험 쌓기구슬이 서 말이어도 꿰어야 보배다책을 사고 인강을 결제해도 직접 만들어보면서 익히지 않으면 절대 내 것이 될 수 없는 것이 또 개발!처음 언어를 익히는 단계에서부터 실습 기반으로 직접 코딩하고 그 결과를 확인해보면서 학습하는 것이 중요해요! 필요한 공부를 실습 단위로 쪼개어 직접 구현해보면서 익히고, 좀 더 나아가서는 프로젝트 단위로 구현하면서 실전 기술을 습득해보세요. 또한 실무에서는 혼자 개발하는 것이 아니라 뭐든 '협업'해야 하기 때문에 혼자 하는 프로젝트 외에도 여러 사람들과 함께하는 그룹 프로젝트의 경험이 큰 도움이 될 거예요. 자기소개서, 포트폴리오, 면접 시에도 어떤 프로젝트에서 내가 맡은 부분은 어느 부분이었고 어떻게 주도적으로 이끌었는지가 관건이 될 수 있습니다.엘리스가 추천하는 방법!★ 온라인 코딩 실습으로 기본기 다지기 : 엘리스는 별도의 코딩 환경 세팅 없이 온라인에서 바로 코딩 문제를 풀고 내가 짠 코드의 결과를 확인할 수 있어서 실습 기반으로 학습하기에 탁월한 플랫폼입니다. :) KAIST, SKT, 삼성 SDS 등에서도 활용하는 검증된 플랫폼에서 코딩 실습으로 기본기를 다지세요!프로젝트 단위로 혼자서 만들어보기 : 프로그래밍 언어의 기본에 익숙해졌다면, 직접 A to Z를 구현하는 작은 프로젝트를 통해 실제 필요한 기술이 뭔지 파악해가며 실전 기술을 익혀보세요. 그룹 프로젝트에 참여해서 협업 경험을 통해 익히기 : 취업을 위해서 중요한 것 중 하나인 '협업'능력! 그룹 프로젝트에 참여하여 비단 개발 실력뿐만 아니라 실무에 필요한 다양한 역량 또한 길러보세요.STEP 5. 포트폴리오, 시험 준비하고 개발 직군에 지원하기시작이 반, 그 이상이다!아시겠지만 개발자가 되면 끝인 그런 일은 없겠죠. (어떤 직무에서도 마찬가지일 거예요.) 끊임없는 공부, 새로운 기술 연마, 리팩토링, 문서화, 코딩 공부 코딩 공부!그러니 완벽에서 시작해야 한다는 생각은 버리고 지금까지 최선을 다해온 결과물을 가지고서 개발 직군에 지원하세요. 실제 개발자로 일하게 되면 그 속에서 배우고 성장할 수 있는 자원이 훨씬 더 많아집니다!'자리가 사람을 만든다'라는 말이 괜한 말이 아니니, 더 큰 성장과 가능성이 있는 곳으로 가기 위한 준비와 지원을 주저 없이 해보시길 바라요!Photo by Green Chameleon on Unsplash엘리스가 추천하는 방법!나를 잘 보여줄 포트폴리오 만들기 : (사용한 언어 / 프레임 워크 / 앞의 것을 적용하여 프로젝트에서 내가 한 역할) 별로 정리해두고 내가 커밋한 코드와 함께 보여주기.   블로그 쓰기 : 거창한 것이 아니어도 좋으니 공부하면서 느꼈던 것, 새로 알게 된 지식들, 프로젝트하면서 고민했던 것들을 블로그로 정리해보세요. 내가 구현한 것들을 이미지를 통해서 가시적으로 보여줄 수 있다면 금상첨화!★ 엘리스에서 알고리즘 시험 준비하기 : 이미 많은 수강생 분들이 엘리스 알고리즘 과목을 통해서 코드를 발전시키고 알고리즘 시험 및 취업에 성공하고 있습니다. :) 대기업 입사를 준비하시는 분이라면 엘리스 알고리즘 과목들을 꼭 수강해보세요.이다음의 6번째 스텝은 무엇이 될까요? 아마도 1~5 스텝을 계속 반복해나가면서 익숙해지고, 다른 역할로 각각의 스텝에 참여하게 되는 일이 아닐까요.엘리스는 누구나 프로그래밍을 통해 원하는 일을 할 수 있도록 좋은 강의 콘텐츠와 서비스, 플랫폼으로 여러분의 다섯 스텝에 함께하고자 합니다. :) 막막한 초심자 분들에게 앞으로의 방향성을 그려보는 데에 조금이라도 도움이 되길 바라며 글을 발행합니다.그럼 엘리스에서 만나요! >> 엘리스 아카데미 바로가기* 이밖에 조언, 첨언, 질문 등을 댓글로 남겨주시면 이 글의 독자분들에게 큰 도움이 됩니다.

기업문화 엿볼 때, 더팀스

로그인

/