피그마 사용법

디자인 작업이 끝나고 나면, 이제 개발자에게 넘겨야 할 차례.하지만 이 과정이 막히면 전체 프로젝트 속도가 확 떨어집니다.예전엔 Zeplin 같은 툴을 통해 디자인을 전달했지만,요즘은 Figma 하나로 디자인 → 전달 → 코드 참고까지모두 가능하다는 거, 알고 계셨나요? 이번 글에서는 Zeplin 없이도 가능한개발자 친화적인 Figma 전달 방식을 정리해드립니다. Zeplin 은도 물론 아주 훌륭한 도구 입니다. 하지만 또 다른 … Read more

자자 주목 해주세요! 디자인은 끝났는데, 개발에 전달하자마자“폰트 사이즈가 이상한데요?”, “이 버튼 여백 맞나요?”, “컬러 코드가 다르네요” 같은 얘기를 들어 봤을겁니다! 디자인이 깔끔해도, 전달 방식이 정리되지 않으면 개발 단계에서 꼬이기 쉽상이죠?그래서 디자이너와 개발자가 모두 알아야 할 게 바로 Figma-to-Code 워크플로우예요.이 글에서는 디자인을 코드로 자연스럽게 넘기는 실무용 협업 루틴과 도구를 소개할게요. 1. 디자인을 ‘개발 가능한 형태’로 정리하는 … Read more

처음 Auto Layout을 접하면 “정렬이 자동으로 되는구나” 정도로만 느껴질 수 있어요. 근데 내가 컴포넌트를 만지다 보면,하지만 이 기능을 제대로 이해하고 쓰기 시작하면,버튼, 카드, 모달, 리스트, 전체 페이지까지 반응형처럼 유연하게 구성할 수 있습니다. Auto Layout은 단순한 ‘정렬 도우미’가 아니란 말입니다.반응형 UI의 핵심 도구이자, 컴포넌트 시스템의 기반 이라고 할 수 있죠.이번 글에서는 초급을 넘어서 실무에서 바로 적용할 … Read more

Figma를 쓰다 보면 가장 많이 듣는 단어 중 하나가 ‘컴포넌트’예요. 그런데 이 컴포넌트를 복사하거나 화면 곳곳에 배치하다 보면어느 순간 “이건 인스턴스라고 뜨는데 뭐가 다른 거지?”라는 의문이 생기죠. 사실 컴포넌트(Component)와 인스턴스(Instance)는디자인 시스템을 효율적으로 관리하는 핵심 구조입니다.이 두 개념을 제대로 이해하면반복 작업은 줄이고, 수정은 한 번에, 협업은 더 빠르게 할 수 있어요. 컴포넌트(Component)란? 컴포넌트는 말 그대로 원본(마스터) … Read more

클라이언트 작업을 하다 보면 꼭 듣게 되는 질문이 있어요.“이 폰트 맞아요?”, “로고 간격은 어느 정도 띄우면 되죠?”, “이 색 써도 되는 건가요?” 처음엔 친절하게 설명하지만, 이런 질문이 반복되다 보면‘이걸 한번에 정리할 수 없을까?’라는 생각이 들거에요! 그럴 때 꼭 필요한 게 바로 브랜드 스타일 가이드입니다. 이 부분 진짜 진짜 중요합니다!디자인의 방향성과 기준을 한 번에 정리해놓는 문서로,모든 … Read more

우리가 만드는 사이트의 프로덕트가 커지고, 팀원이 늘어날수록 디자인의 일관성은 점점 무너지기 쉽습니다.버튼 하나, 색상 하나에도 기준이 없으면 브랜드 신뢰도는 물론 개발 생산성까지 떨어지죠.바로 이런 문제를 해결하기 위해 필요한 것이 디자인 시스템이고,그걸 Figma에서 구축하면 생산성과 협업 효율이 눈에 띄게 향상됩니다. 이번 글에서는 실무에서 바로 적용 가능한 Figma 디자인 시스템 구축 방법을 핵심만 추려서 정리해드릴게요. 디자인 시스템이란? … Read more

디자인 툴을 배우고 싶은데, 어디서부터 시작해야 할지 모르겠죠? 유튜브도 어렵고, 책을 보면서 하는건 더 어렵죠? Figma는 설치 없이 웹에서 바로 사용 가능하고,초보자도 금방 익힐 수 있는 디자인 도구입니다.하지만 처음 접하면 용어도 생소하고, 막상 따라 해보려면 방향을 잡기 어려운 경우가 많습니다! 그래서 여러분을 위핵서 준비했습니다!하루 10분 투자로, 일주일이면 완성되는 Figma 왕초보 탈출 챌린지! 따라만 해도 UI/UX … Read more

Figma를 처음 배우다 보면 우리는 여러가지 말을 알게 됩니다. ‘프레임’, ‘컴포넌트’, ‘오토 레이아웃’이라는 용어가 자주 등장합니다.겉으로 보기엔 비슷해 보이지만, 실제로는 각각 전혀 다른 역할과 개념이 있습니다.이 세 가지 기능은 UI/UX 디자인의 뼈대를 구성하는 핵심이기 때문에 초반에 잘 이해하고 넘어가는 것이 중요해요. 이번 글에서는 디자인 경험이 없는 사람도 바로 이해할 수 있도록,Figma의 프레임(Frame), 컴포넌트(Component), 오토 레이아웃(Auto … Read more

많은 사람들이 디자인에 관심은 있지만, 처음부터 전문가용 툴을 배우기에는 부담스럽다면? 어려운걸 알지만 우리는 피그마를 시작해야 하는 이유가 뭘까? **Figma(피그마)**는 디자인을 처음 접하는 사람도 쉽게 사용할 수 있는 도구로,설치 없이 웹에서 바로 사용 가능하며, 직관적인 UI 덕분에 입문자에게 최적화된 선택입니다.이 글에서는 Figma의 회원가입부터 첫 화면 구성까지, 정말 필요한 핵심만 한눈에 정리해드릴게요. 1단계: 회원가입 – 2분이면 끝! … Read more

2025년 기준, UI/UX 디자인을 처음 접하는 사람들에게 가장 추천되는 툴 중 하나는 단연 **Figma(피그마)**입니다.무료로 시작할 수 있고, 설치 없이 웹에서 바로 사용할 수 있으며, 협업 기능까지 갖춘 Figma는 디자인 경험이 전혀 없는 사람도 5분이면 기본 구조를 이해할 수 있을 만큼 직관적인 도구입니다. Figma란? – 3줄 요약해볼게 Figma는 구글 계정만 있으면 바로 사용할 수 있으며, 별도 … Read more