Tools & Dev

디자인 핸드오프를 개발자가 좋아하는 파일로 만드는 법. 상태 표시, 페이지 구조, 컴포넌트와 변수 정리까지 정리했다.

“Designers should code” is an argument that’s been running for two decades. What’s changed is the terms of that argument, not the argument itself. Here’s what designers learning code in 2026 actually means — practical guidance, not another round of the old debate. 01. The New Argument for Code Literacy AI code generation has changed … 더 읽기

피그마 플러그인 중 실무에서 정말 쓸모 있는 카테고리와 활용법을 정리했다. 설치보다 실행 습관이 먼저다.

피그마 프로토타이핑을 클릭 더미 수준에서 벗어나 실전에서 쓰는 법. 흐름, 변수, 오버레이 활용까지 정리했다.

피그마 변수로 디자인 토큰과 다크모드를 관리하는 법. 컬렉션과 모드 개념부터 프로토타입 활용까지 정리했다.

피그마 오토레이아웃으로 반응형 프레임을 만드는 법. 방향, 정렬, 리사이징 속성과 중첩 구조까지 실무 기준으로 정리했다.

피그마 컴포넌트를 변형과 프로퍼티로 설계하는 실무 가이드. 중첩 컴포넌트 관리와 라이브러리 배포 체크리스트까지 정리했다.

“Figma를 쓰는데 Illustrator도 알아야 하나요?” 2026년에도 자주 나오는 질문이다. Adobe Illustrator vs Figma는 경쟁 관계가 아니다. 용도가 다른 도구들이다. 하나는 인쇄와 벡터 일러스트레이션을 위해 태어난 범용 드로잉 툴이고, 다른 하나는 화면 디자인과 팀 협업을 목적으로 클라우드 기반으로 처음부터 설계된 툴이다. 이 출발점의 차이를 이해하면 언제 무엇을 써야 할지 헷갈릴 일이 훨씬 줄어든다. 1. Illustrator가 여전히 … 더 읽기

피그마 단축키를 완전히 익히면 실무 속도가 체감될 정도로 달라진다. 마우스로 메뉴를 찾는 습관 하나가 하루에 수십 분을 낭비시킨다. 손이 키보드 위에서 움직이는 동안 시선은 캔버스를 떠나지 않아도 되고, 그 차이가 쌓여 하루 작업량 전체의 흐름을 바꾼다. 가장 중요한 것부터 순서대로 정리한다. 1. 기본기부터: 선택과 오브젝트 단축키 가장 자주 쓰는 피그마 단축키 TOP 10부터 시작한다. 다섯 … 더 읽기

좋은 디자인을 위해 비싼 에셋을 살 필요가 없다. 무료 디자인 리소스 2026 중에도 상업적 사용이 가능하고 품질이 높은 것들이 많다. 카테고리별로 정리한 실용 목록이다. 폰트 Google Fonts·Fontshare·Bunny Fonts 아이콘 Heroicons·Lucide·Phosphor Icons 이미지 Unsplash·Undraw·Storyset 무료 디자인 리소스 2026, 카테고리별 핵심 목록 무료 리소스의 품질이 이렇게 좋아진 데는 이유가 있다. Tailwind CSS 팀이 Heroicons를, Freepik이 Storyset을 직접 … 더 읽기