UI 디자이너가 알아야 할 CSS 기초. 개발자와 협업을 위한 최소 지식
UI 디자이너를 위한 CSS: 개발자와의 최소 협업 지식
솔직히 말해보자. 디자이너로서 개발자와의 소통에서 'CSS'라는 단어를 들을 때마다 머리가 지끈거린 적, 한두 번이 아닐 거다. '이게 왜 이렇게 안 돼요?', '디자인 시안이랑 왜 달라요?' 같은 질문을 들으면, 마치 내가 코딩을 못 하는 사람 취급받는 기분까지 들 때도 있다. 나 역시 디자이너 출신 PM으로서, 코드 한 줄 써본 적 없는 입장에서 이런 상황을 수없이 겪었다. 그래서 오늘은, 우리 디자이너들이 개발자와 최소한의 '언어'를 맞추고, 더 이상 불필요한 감정 소모 없이 시너지를 낼 수 있도록, 딱 필요한 CSS 기초 지식만 짚어보려 한다.
왜 디자이너가 CSS를 알아야 하는가? (개발자로서가 아니라, PM으로서)
나는 코딩을 직접 하지는 않는다. 내 역할은 제품의 방향성을 잡고, 팀원들이 최고의 퍼포먼스를 낼 수 있도록 환경을 만드는 PM이다. 하지만 6년 간의 디자이너 경험과 현재 PM으로서의 역할은 나에게 명확한 인사이트를 줬다. 바로 '이해'가 '협업'의 시작이라는 것이다. 개발자가 어떤 어려움을 겪고, 어떤 기준으로 작업하는지 아주 조금이라도 이해하면, 디자이너로서 우리가 제안하는 것들이 얼마나 현실적인지, 혹은 어떤 부분에서 타협이 필요한지를 더 명확하게 판단할 수 있다. 이는 곧, 더 빠르고, 더 정확하며, 더 만족스러운 결과물을 만들어내는 핵심 동력이 된다.
AI 스타트업에서 일하면서, 우리는 매일같이 새로운 기능을 프로토타이핑하고 빠르게 출시해야 한다. 이 과정에서 디자이너와 개발자 간의 마찰은 치명적이다. 우리가 '개발자로서' CSS를 완벽하게 마스터할 필요는 없다. 하지만 'PM으로서', '디자인 경험을 가진 사람으로서' 이 정도는 알아야 한다. 최소한의 기술적 이해를 바탕으로, 개발자의 언어를 조금이나마 이해하고, 우리의 디자인 의도를 명확하게 전달하는 것. 이것이 오늘 이야기할 내용의 핵심이다.
CSS, 딱 이것만 알자: 개발자와의 소통을 위한 핵심
CSS는 웹 페이지의 스타일을 정의하는 언어다. 색상, 폰트, 레이아웃 등 우리가 디자인하는 모든 것이 CSS로 구현된다. 개발자와의 효율적인 협업을 위해, 다음 세 가지 핵심 개념만 기억하자. 이 정도만 알아도 '이게 왜 안 돼요?'라는 말 대신 '이런 식으로 구현하면 개발 리소스가 얼마나 더 들까요?'와 같은 생산적인 질문을 던질 수 있게 될 것이다.