이원국
Product Engineer · Former Industrial Designer
- 복잡하고 자주 바뀌는 규칙을 사람이 오해 없이 다룰 수 있는 시스템으로 옮깁니다. 규칙이 어려울수록 예외를 운영으로 버티기보다 설계로 흡수합니다.
- 프론트엔드에 뿌리를 두지만, 제 일의 중심은 화면이 아니라 문제의 정의와 해결에 있습니다. 원인이 서버나 데이터 모델에 있다면 그 안까지 들어가 매듭짓습니다.
- 산업 디자이너로 시작해 지금은 코드를 씁니다. 무엇을 만들지 정하는 일과 어떻게 만들지 정하는 일을 나눠본 적이 없어, 필요하면 PRD와 데이터 모델, 화면을 직접 그립니다.
- 맡은 영역은 문제 정의에서 설계와 구현, 배포와 운영까지 한 호흡으로 끌고 갑니다. 요청받지 않은 문제라도 필요하다면 스스로 정의합니다.
- 감이 아닌 데이터로 판단하며, 판단할 데이터가 없다면 그것을 모을 환경부터 만듭니다. 그럴듯해 보이는 개선일수록 실측을 거쳐 남깁니다.
누군가 제 일의 본질을 물으면 저는 '계면(interface)'이라는 말을 꺼냅니다. 계(系)는 서로 맞물린 것들이 이루는 체계이고, 계면은 그 체계들이 맞닿는 경계입니다. 기계와 기계가 만나면 통신이 되고, 기계와 사람이 만나면 제어가 되며, 사람과 사람이 만나면 소통이 됩니다.
오래 들여다보니 이 셋은 양편에 무엇이 놓였느냐로 갈리는 분류가 아니었습니다. 같은 경계라도 그 사이를 어떻게 설계했느냐에 따라 닿는 층위가 달랐습니다. 설계가 얕으면 값이 오가는 데서 그치고, 한 걸음 나아가면 한쪽이 다른 쪽을 다룰 수 있게 되며, 끝까지 다듬으면 서로가 서로를 이해하는 자리에 이릅니다. 사람과 사람 사이에서도 인터페이스가 허술하면 소통은 통신에서 그칩니다.
그렇게 보면 계면은 화면에만 놓이지 않습니다. 두 시스템이 주고받기로 한 약속도, 제도의 언어를 사람의 말로 옮기는 층도, 팀이 함께 지키기로 한 규칙과 남겨둔 문서도 모두 서로 다른 체계가 맞닿는 자리입니다. 직군의 경계 역시 그중 하나이며, 문제는 대개 그 경계 위에 걸쳐 있습니다. 그래서 저는 화면에 머무르지 않고 필요한 깊이만큼 내려갑니다.
세상은 경계로 이루어져 있고, 무엇이 어디까지 오갈 수 있는지는 그 경계를 어떻게 놓았느냐가 정합니다. 제 일의 자리는 그 사이에 있습니다. 제가 인터페이스를 다루는 이유는 그 층위를 한 단계씩 끌어올리는 데 있습니다.
오래 들여다보니 이 셋은 양편에 무엇이 놓였느냐로 갈리는 분류가 아니었습니다. 같은 경계라도 그 사이를 어떻게 설계했느냐에 따라 닿는 층위가 달랐습니다. 설계가 얕으면 값이 오가는 데서 그치고, 한 걸음 나아가면 한쪽이 다른 쪽을 다룰 수 있게 되며, 끝까지 다듬으면 서로가 서로를 이해하는 자리에 이릅니다. 사람과 사람 사이에서도 인터페이스가 허술하면 소통은 통신에서 그칩니다.
그렇게 보면 계면은 화면에만 놓이지 않습니다. 두 시스템이 주고받기로 한 약속도, 제도의 언어를 사람의 말로 옮기는 층도, 팀이 함께 지키기로 한 규칙과 남겨둔 문서도 모두 서로 다른 체계가 맞닿는 자리입니다. 직군의 경계 역시 그중 하나이며, 문제는 대개 그 경계 위에 걸쳐 있습니다. 그래서 저는 화면에 머무르지 않고 필요한 깊이만큼 내려갑니다.
세상은 경계로 이루어져 있고, 무엇이 어디까지 오갈 수 있는지는 그 경계를 어떻게 놓았느냐가 정합니다. 제 일의 자리는 그 사이에 있습니다. 제가 인터페이스를 다루는 이유는 그 층위를 한 단계씩 끌어올리는 데 있습니다.
주요 아티클
배운 것과 그 길에서의 시행착오를 기록하고 나눕니다. 동료와 커뮤니티 사이로 지식이 오가는 순간을 아낍니다.
개인 기술블로그
- 🔗 WAI-ARIA란 무엇인가요?
- 🔗 왜 Authorization "Bearer"인가요?
- 🔗 npm install시 —force와 —legacy-peer-deps은 왜 사용할까?
- 🔗 웹 환경에서 SVG 더 잘 이해하고 사용하기
- 🔗 TypeScript가 JSX를 변환하는 방법들과 JSX Transform에 대해
- 🔗 프론트엔드 개발자를 위한 Docker로 React 개발 및 배포하기
- 🔗 프론트엔드 개발자라면 반드시 알아두어야 할 32가지의 UI 요소 (번역)
- 🔗 썸네일 메이커(Thumbnail Maker) 만들기 | Toy Project
기업 기술블로그
좋은 사람들 곁에서 즐거운 일을 오래 하고 싶습니다.