UXMC 2021 - Day 3. ResearchOps * 해당 글은 UXMC(UX Masterclass) 2021 마지막 날의 세션 내용을 기반으로 작성하였습니다. 최근 한국에서 쿠팡, 토스 등의 IT업계를 중심으로 UX Research(er)에 대한 관심이 점점 더 많아지고 있는데요. 해외에서는 꽤 오래 전부터 해당 직무 및 분야가 UX/디자인 프로젝트에서 중요한 부분을 차지했고, 이제는 개념이나 중요성에 대한 이야기를 넘어서 UX Research 전반의 질을 높이고, 효율적으로 리서치하는 방법에 대한 고민과 사례들이 공유되고 있습니다. 또한 그간 UX Research에서 상당 부분 차지했던 대면/현장 리서치가 펜데믹의 영향으로 디지털로 전환해 시도되기 시작하자, 비교적 간접적이지만 더 확장성 있는 ..

들어가며 아직도 css 레이아웃을 float를 사용해서 정리하고 있으신가요? 오늘은 이름도 Flexible-box!! 레이아웃을 정말 간단하게, 유연하게 정리할 수 있는 display:flex에 대해 알아보겠습니다. flexbox의 구성 flex box의 구성은 크게 2가지! flex-container와 그의 자식 요소인 flex-item으로 구성되어 있습니다. flex-container를 먼저 만들어 볼까요?? flex-container를 만드는 방법은 매우 간단합니다! 정렬하려는 요소들의 상위 요소에 display:flex 속성을 선언해 주시면 끝! /* 원하는 요소에 display:flex 속성값을 추가 */ div { display: flex; } 선언해 주시게 되면 자동으로 flex-contai..

망막의 중심부 시야와 달리 주변의 시야는 해상도가 낮기 때문에, 작은 마우스 커서가 어디에 있는지 찾으려면 눈동자를 열심히 움직이며 화면을 뒤져야 합니다. 하지만 사람들은 눈동자 대신 손을 움직여서 커서를 흔들곤 합니다. 주변시는 움직임을 감지하는 능력이 탁월하기 때문에, 움직이는 커서는 비교적 쉽게 찾을 수 있습니다. 사람들은 눈의 구조, 안구 이동, 뇌의 시각 경로가 작동하는 방식을 따로 공부하지 않아도 자연스럽게 이런 일을 해냅니다. 커서를 찾으려고 마우스를 흔드는 사람이 하도 많으니 macOS에서는 마우스를 빠르게 흔들면 커서를 크게 키워주는 기능을 구현해버렸습니다. 작았던 커서가 커지는 변화 자체가 또다른 움직임이기도 하고, 큰 물체는 주변시로도 잘 볼 수 있으니 더욱 찾기가 쉬워집니다. 생태적..

UXMC 2021: Day 2 Sustainability · circular design · social design · gender * 해당 글은 UXMC(UX Masterclass) 2021 둘째 날의 세션 내용을 기반으로 작성하였습니다. 올해 UX Masterclass 컨퍼런스는 해결이 긴급한 글로벌 도전 과제들, 그리고 강한 의식을 갖고 움직이는 현대 소비자들이 늘어남에 따라 UX 전문가들이 가져야 할 책임에 대해 탐구합니다. 디지털 서비스에서 배제되는 시민들을 위해 정부기관과 협력한 프로젝트를 소개한 지난 글에 이어, 이번 글에서도 Inclusive Design(포용 디자인)의 활용으로 고차적 변화를 만드는데 진전을 이룬 사례부터 살펴보겠습니다. The Story of Developing San..

들어가며 최근 소셜 네트워크에서의 사용자들의 움직임이 심상치가 않습니다. 텍스트 기반의 소셜 네트워크에서 이미지 그리고 비디오를 넘어 이제는 음성으로 서로의 생각을 공유하고 더욱 많은 사람들과 자유롭게 의견을 공유하고 나누고 있습니다. 이는 기술의 발전과 함께 팬데믹 상황에서 사람들이 더욱더 많은 사람들과 소통하고 싶은 니즈가 아닐까 하는 생각이 듭니다. 최근에 페이스북 CEO 마크 주커버그는 향후 페이스북을 '메타버스(Metaverse)'기업으로 전환하겠다는 비전을 공개하였습니다(이 글을 작성하는 도중에 Meta로 사명을 변경하면서 메타버스 기업으로써의 시작을 알렸습니다). 또한 마이크로소프트의 CEO 사티아 나델라도 게임이 메타버스 경제로 진화하고 있으며, 마이크로소프트의 플랫폼에서 창작물을 판매할 ..

(이 글은 pxd 구성원들에게 보내려고 작성된 글 입니다만, pxd 외부에 계신 독자들 중에도 비슷한 고민을 하는 분들이 계실 것 같아서 공개를 하게 되었습니다) pxd는 일년에 두 번 즉, 상반기와 하반기 끝나는 시점에 공식적인 면담 절차가 있습니다. 그중 하반기는 연봉협상을 포함하는 면담으로 진행합니다. 이제 곧 하반기 평가 면담 시즌이 시작될 텐데요, 평가 면담, 그것도 연봉협상과 연계된 것이라면 어떻게 준비해야 할지 고민이 됩니다. 조금이라도 잘한 것을 하나라도 더 생각해내어 최대한 포장을 해야 좋을지, 일단 무조건 높은 연봉을 불러야 할지 고민이 됩니다. 한편으론 이렇게 하는 것이 오히려 자기를 과대평가한다는 인상을 주어 불리하지 않을까 걱정도 됩니다. 무엇을 어떻게 준비해야 평가면담과 이어지는..

들어가며 최근 코로나 팬데믹으로 비대면 문화가 급속히 활발해지면서, '디지털 전환(Digital Transformation)'은 더 중요한 화두가 되었습니다. 이러한 변화에 시장(Market)은 어떻게 대응해야 하는가?라는 질문에 세계적인 비즈니스 대가 필립 코틀러(Philip Kotler)는 책 을 통해 돌파구를 제시합니다. 이러한 내용은 문제로부터 기회를 발견하는 UXer에게도 필요하다고 생각되어 책 의 내용을 바탕으로, 구체적인 사례들을 책 에서 발췌하여 공유해봅니다. 필립 코틀러(Philip Kotler)는 시장의 변화를 1.0에서부터 5.0까지의 단계로 구분하여 정의했습니다. 마켓 1.0에서 3.0까지는 전통적인 마케팅 영역으로 기업과 고객, 그리고 제품에 의해 발전해온 시장입니다. 그리고 '디..

들어가며 여러분은 SEO(검색엔진 최적화 - Search Engine Optimization)에 대해 들어보신 적이 있으신가요? 저는 처음에 조금 생소하다고 느꼈는데요, 관련 글을 읽다 보니(하단 참고 문서) 그간 제가 아무 생각 없이 검색을 통해 접근했던 글들이 생각이 나면서, SEO('검색엔진 최적화(Search Engine Optimization)')의 중요성에 대해 알게 되었어요. 아무리 좋은 사이트, 글이라 해도 노출이 되지 않으면 결국 그 가치가 빛을 볼 수 없을 테니까요. 때문에 저는 늘 프로젝트를 진행하며 SEO(검색엔진 최적화 - Search Engine Optimization) 문제로 고민할 수밖에 없었고, 그 과정 속에서 Nuxt라는 프레임워크를 알게 되었습니다. 사용자 경험(UX)관..

UX리서치에 대한 수요가 증가하고 있습니다. 비즈니스 기획, 프로덕트 디자인과 개발팀의 협업에 단단한 근거를 더하는 것은 물론, 새로운 비즈니스의 기회를 사용자 관점에서 찾는 것이 중요하기 때문일 것입니다. pxd에서는 그간 다양한 스펙트럼의 리서치 과제를 진행해 왔고, 올해부터는 리서치 분야의 전문성 강화를 위한 다양한 노력을 하고 있습니다. 그간 진행했던 수 건의 리서치 프로젝트를 바탕으로 리서치의 범위, 방법, 해석 등에 대한 생각을 소개해 보려고 합니다. [지난 글] UX리서치 #1: UX리서치의 유형을 알아보자 https://story.pxd.co.kr/1580 들어가며 지난 글에서 UX리서치의 유형에 대해 알아봤습니다. 리서치의 목표와 유형을 결정했다면 보다 구체적인 방법으로 계획을 세워야 합..

들어가며 우리 그룹은 Innovation 4 Group에서 FED Group, 그리고 XE Group으로 이름이 바뀌어 왔습니다. 현재의 XE Group이라는 이름에는 어떤 의미를 담고 있을까요? 제가 생각하는 XE Group의 의미를 짧게 이야기해보려고 해요. 우리 그룹의 이름은? eXperience Engineering Group 한글로 ‘경험 개발 그룹’이라는 이름인데요. 개발에 UX를 더하자는 의지를 담았습니다. :) 지금까지 우리는 FED(Front-End Development) Group이라는 이름으로 웹 퍼블리싱, 웹 접근성, UI 개발(인터랙션, 스크립트 개발, …), Prototyping, Front-End(React, Vue…) 등의 업무를 해왔어요. 디자인과 똑같은 화면을 만들고, 기..

디자인 프로세스에서 문제를 정의하는 단계는 가장 중요한 문제를 드러내고 해법을 상상할 수 있게 해주는 중요한 과정입니다. 소위 말하는 '통찰(insight)의 순간'이 작용하는 단계이기도 합니다. 통찰을 기반으로 핵심적인 해법을 상상하고 클라이언트를 설득할 멋들어진 키워드를 뽑아내기도 합니다만, 통찰을 얻는다는 것이 그렇게 만만하지는 않습니다. 디자인 프로세스에서의 통찰이란 무엇이고 어떻게 얻을 수 있는 것일까요? 이에 대해 제 경험을 기반으로 이야기를 해보려고 합니다. 통찰(洞察, insight)이란? 통찰의 사전적 정의는 '예리한 관찰력으로 사물을 꿰뚫어 보는 것'입니다. '예리한 관찰력'까지는 어떻게 해보겠는데 '사물을 꿰뚫어 본다'는 것은 어딘가 초능력 같은 느낌이 들고 어려워 보입니다 = ) 위..

들어가며 지난 1편에서 타입스크립트가 어떤 언어이고 왜 쓰면 좋은지 알아보았다면 이번엔 이 정적인 언어를 어떻게 적용하는지 알아보도록 합시다. 타입스크립트 적용해 보기 지금부터 타입스크립트를 적용한 html 파일을 만들어 보겠습니다. 타입스크립트는 npm을 이용하거나 vscode를 통해서 설치할 수 있는데요, 이번에는 npm을 사용해서 타입스크립트를 전역으로 설치해 보겠습니다. 타입스크립트를 전역으로 설치하겠다는 npm 명령어를 작성해줍니다. npm install -g typescript 설치가 완료되면 tsc라는 타입스크립트 명령어를 실행할 수 있게 됩니다. tsc 명령어를 사용해 프로젝트 폴더에서 tsconfig.json 파일을 생성합니다. tsc --init //tsconfig.json 생성 명령 ..