골든래빗은 더 탁월한 가치를 제공하는 콘텐츠 프로덕션 & 프로바이더 입니다. 골든래빗은 취미, 경제, 수험서, 만화, IT 등 다양한 분야에서 책을 제작하고 있습니다.골든래빗은 더 탁월한 가치를 제공하는 콘텐츠 프로덕션 & 프로바이더 입니다. 골든래빗은 취미, 경제, 수험서, 만화, IT 등 다양한 분야에서 책을 제작하고 있습니다.

[클래스 02] 피그마로 쿠폰 디자인 만들기

2026년 1월 25일조회 31

이 글은 《콘텐츠 디자인은 피그마 with AI》에서 발췌했습니다.

콘텐츠 디자인은 피그마 with AI

콘텐츠 디자인은 피그마 with AI

ISBN 9791194383390지은이 리디드로우(김선영)26,000
교보문고예스24알라딘

쿠폰 디자인으로 피그마 기초 마스터하기

쿠폰 디자인을 만들면서 패스파인더 기능으로 쿠폰 도형을 만들고 적당한 문자와 아이콘을 배치한 후 완성된 디자인을 추출하는 과정을 배워봅시다. 소개한 과정을 기반으로 여러분이 만들고 싶은 다양한 쿠폰으로 응용해보세요.

쿠폰 모양 만들기

01 [Rectangle] 도구로 360x330, 210x330 크기의 사각형 두 개를 그립니다.

02 [Ellipse] 도구로 20x20 크기의 원을 한 개 그립니다. ➊ [Alt + Shift]를 누른 상태로 아래로 드래그해 일렬로 복사합니다. ➋ 그리고 [Ctrl + D]를 눌러 원이 총 10개가 되도록 복사합니다.

[Ctrl + D]는 직전에 복사한 간격과 방향을 그대로 반복해 요소를 복제합니다.

03 원 사이 간격을 맞추기 위해 모든 원을 선택하고 Layout 메뉴의 간격을 12px로 지정합니다. 원을 모두 선택하고 패스파인더의 [Flatten selection] 또는 오른쪽 마우스를 눌러 [Flatten]을 클릭해 하나로 합쳐줍니다.

04 ➊ 왼쪽 사각형의 왼쪽 선 끝에 원의 반이 걸칠 수 있도록 정렬합니다. 빨간색 지시선을 확인하며 중앙을 맞춰주세요. ➋ 나열한 원을 복사하여 오른쪽 사각형 오른쪽 끝에도 붙여줍니다.

05 왼쪽의 나열한 원과 사각형을 선택하고 패스파인더의 [ Subtract Selection]을 클릭합니다. 오른쪽도 똑같이 하여 쿠폰 모양을 만듭니다. 이때 원 레이어가 사각형 레이어보다 위에 있어야 합니다.

06 도형을 원하는 색상(#F954D5)으로 변경한 후 두 도형을 선택해 간격을 0으로 변경하여 붙입니다.

07 쿠폰에 들어갈 문자를 입력한 후 ➊ 각 위치별 레이어를 그룹화하고 이름을 붙여줍니다. 레이어 그룹화는 원하는 레이어를 모두 선택하고 오른쪽 마우스 [Group selection]을 클릭하면 됩니다. 작업 후 레이어 정리는 꼭 해주세요.

<1분 꿀팁> 다운로드 아이콘도 그려야 하나요?

이 실습에서는 도형에 익숙해지기 위해 직접 패스파인더를 이용해 도형을 처음부터 만들었지만 디자인에 익숙해지면 이미 만들어진 벡터 도형을 가져다 쓰는 일이 더 많을 겁니다. 플러그인을 활용하면 이미 만들어진 아이콘을 가져다 사용할 수 있습니다. 쿠폰에 사용한 다운로드 아이콘은 구글 머티리얼 아이콘Goole Material icons 플러그인을 사용했습니다.


08 마지막으로 ➊ ‘오른쪽’, ‘왼쪽’ 두 그룹을 모두 드래그해 선택한 후 ➋ 오른쪽 마우스 클릭 후 [Frame selection]을 클릭해 하나의 프레임으로 묶어줍니다. ➌ Export 메뉴에서 프레임을 PNG로 추출하면 여러분만의 쿠폰 이미지가 완성됩니다!

《콘텐츠 디자인은 피그마 with AI》에서 피그마를 활용한 기초부터 응용 심화까지 만나보세요!

교보문고: https://bit.ly/46qQn6t

예스24: https://bit.ly/3TW0Zmm

알라딘: https://bit.ly/3U0uTG1

📚 더 읽기

저자 소개

리디드로우

4년 전, 온라인 셀러로 활동을 시작하면서 디자인 프로젝트에만 사용하던 피그마라는 도구가 새롭게 보이기 시작했습니다. 디자이너가 아니어도 상세페이지나 배너 제작에 충분히 활용할 수 있다는 가능성에 매료되어 누구나 다룰 수 있는 피그마 활용법을 소개하는 유튜브 채널을 운영하고 있습니다. 강의를 통해 셀러 실전 경험이 담긴 상세페이지와 마케팅 소재 만들기 노하우를 나누고 있습니다. 강의 - 러닝아넥스 〈1인 셀러를 위한 상세페이지 30분 제작 비법〉 SNS - YouTube _ youtube.com/@rddraw

📚콘텐츠 디자인은 피그마 with AI》 자주 묻는 질문

Q.피그마(Figma)가 정확히 뭔가요? 디자인 경험이 전혀 없는데 시작할 수 있을까요?

피그마는 웹 기반의 디자인 협업 도구입니다. 설치 없이 브라우저에서 바로 사용할 수 있으며, 디자인 초보자도 쉽게 접근할 수 있도록 직관적인 인터페이스를 제공합니다. 무료로도 핵심 기능들을 충분히 활용할 수 있다는 장점이 있죠. 실시간 협업 기능 덕분에 팀원들과 함께 디자인 작업을 효율적으로 진행할 수 있습니다. 디자인 경험이 없더라도 걱정 마세요. 피그마는 다양한 템플릿과 플러그인을 제공하여 디자인 작업을 훨씬 수월하게 만들어줍니다. 기본적인 도형 그리기부터 시작해서 텍스트 편집, 이미지 활용, 컴포넌트 생성 등 다양한 기능을 익히면서 점차 디자인 실력을 향상시킬 수 있습니다. 특히 피그마 버즈(Buzz), 드로우(Draw) 기능과 같은 최신 업데이트는 디자인 작업에 더욱 재미와 효율성을 더해줍니다. 처음 시작이 어렵게 느껴진다면, 《콘텐츠 디자인은 피그마 with AI》를 통해 피그마의 기본 메뉴부터 실전 예제까지 차근차근 따라해보세요. 디자인 초보자도 쉽게 이해할 수 있도록 구성되어 있어, 금방 피그마의 매력에 빠져들게 될 것입니다.

Q.피그마를 활용해서 어떤 디자인 작업들을 할 수 있나요? 구체적인 예시가 궁금합니다.

피그마는 활용 범위가 매우 넓은 디자인 도구입니다. 웹사이트나 앱의 UI/UX 디자인은 물론, 소셜 미디어 콘텐츠, 프레젠테이션 자료, 배너 광고, 인쇄물 등 다양한 디자인 작업에 활용할 수 있습니다. 예를 들어, 카드 뉴스를 제작하거나 상세 페이지를 디자인하고, 이벤트 배너를 만들거나 브로셔와 같은 인쇄물을 디자인하는 데 사용할 수 있습니다. 또한 피그마는 컴포넌트와 변수 기능을 제공하여 디자인 시스템을 구축하고 유지 관리하는 데 매우 유용합니다. 반복적으로 사용되는 요소들을 컴포넌트로 만들어 재사용하고, 변수를 활용하여 디자인의 일관성을 유지할 수 있습니다. 최근 업데이트된 피그마 버즈(Buzz) 기능을 이용하면 템플릿 디자인도 더욱 쉽게 만들 수 있습니다. 더 나아가 구글 시트와 연동하여 디자인 요소들을 자동화하는 것도 가능합니다. 이러한 다양한 기능들을 활용하여 디자인 작업 시간을 단축하고 효율성을 높일 수 있습니다. 다양한 실전 예제를 통해 피그마 활용법을 익히고 싶다면, 《콘텐츠 디자인은 피그마 with AI》를 통해 카드 뉴스, 상세 페이지, 배너, 인쇄물 제작 과정을 직접 따라해보세요.

Q.피그마의 '오토 레이아웃' 기능이 뭔가요? 사용법이 어렵게 느껴지는데 쉽게 배울 수 있는 방법이 있을까요?

피그마의 오토 레이아웃은 요소들을 자동으로 정렬하고 간격을 조절해주는 매우 강력한 기능입니다. 텍스트나 이미지의 크기가 변경되더라도 자동으로 레이아웃을 조정해주기 때문에 디자인 수정 시간을 크게 단축할 수 있습니다. 오토 레이아웃을 사용하면 요소들을 수평 또는 수직으로 정렬하고, 요소 간의 간격, 패딩 등을 쉽게 설정할 수 있습니다. 또한 요소들의 정렬 방식(가운데 정렬, 왼쪽 정렬 등)도 자유롭게 지정할 수 있습니다. 처음에는 오토 레이아웃 사용법이 다소 어렵게 느껴질 수 있지만, 꾸준히 연습하면 금방 익숙해질 수 있습니다. 오토 레이아웃을 효과적으로 사용하려면 레이아웃의 기본 원리를 이해하고, 다양한 옵션들을 직접 사용해보는 것이 중요합니다. 《콘텐츠 디자인은 피그마 with AI》에서는 오토 레이아웃의 기본 개념부터 활용법까지 상세하게 설명하고 있습니다. 책에 제시된 예제들을 따라하면서 오토 레이아웃 기능을 익히면 디자인 작업 속도를 크게 향상시킬 수 있을 것입니다.

Q.피그마 플러그인은 무엇이고, 어떤 플러그인을 사용하면 디자인 작업에 도움이 될까요?

피그마 플러그인은 피그마의 기능을 확장해주는 도구입니다. 다양한 플러그인들이 존재하며, 이를 활용하면 디자인 작업 효율성을 크게 높일 수 있습니다. 예를 들어, 무료 이미지 소스를 제공하는 플러그인, 아이콘을 쉽게 삽입할 수 있는 플러그인, 색상 팔레트를 생성해주는 플러그인, 텍스트를 자동으로 번역해주는 플러그인 등이 있습니다. 어떤 플러그인을 사용해야 할지는 디자인 작업의 종류와 목적에 따라 달라집니다. 예를 들어, 웹사이트 디자인을 할 때는 반응형 디자인을 지원하는 플러그인이나, 그리드 시스템을 쉽게 설정할 수 있는 플러그인이 유용할 수 있습니다. 소셜 미디어 콘텐츠를 디자인할 때는 텍스트 효과를 쉽게 적용할 수 있는 플러그인이나, 이미지 편집 기능을 제공하는 플러그인이 도움이 될 수 있습니다. 플러그인을 사용하기 전에 사용자 리뷰를 참고하고, 무료 플러그인부터 사용해보는 것이 좋습니다. 《콘텐츠 디자인은 피그마 with AI》에서는 디자인 작업에 유용한 다양한 플러그인들을 소개하고, 사용법을 자세하게 설명하고 있습니다. 플러그인을 활용하여 디자인 작업 효율성을 높이고 싶다면, 이 책을 참고하여 자신에게 맞는 플러그인을 찾아보세요.

Q.피그마와 AI를 함께 사용하면 어떤 장점이 있나요? AI 기능은 어떻게 활용할 수 있는지 궁금합니다.

피그마는 AI 기술과 결합하여 디자인 작업의 효율성을 극대화할 수 있습니다. 예를 들어, AI 기반의 플러그인을 사용하면 이미지 해상도를 자동으로 높이거나, 텍스트를 자동으로 요약하거나, 디자인 요소들의 색상과 스타일을 자동으로 맞춰줄 수 있습니다. 또한 AI는 사용자 데이터를 분석하여 디자인 개선에 필요한 인사이트를 제공할 수도 있습니다. 피그마의 AI 기능은 디자인 아이디어를 빠르게 시각화하고, 반복적인 작업을 자동화하며, 사용자 경험을 개선하는 데 도움이 됩니다. 《콘텐츠 디자인은 피그마 with AI》에서는 피그마의 AI 기능들을 활용하는 방법을 구체적인 예시와 함께 설명하고 있습니다. AI를 활용하여 디자인 작업 시간을 단축하고 창의적인 디자인을 구현하고 싶다면, 이 책을 통해 AI 기능들을 익혀보세요.

Q.피그마 버즈(Buzz) 기능은 무엇인가요? 어떻게 활용할 수 있나요?

피그마 버즈(Buzz)는 피그마의 최신 업데이트 기능 중 하나로, 팀원들과 디자인에 대한 피드백을 더욱 효율적으로 주고받을 수 있도록 도와줍니다. 기존에는 댓글 기능을 통해 피드백을 주고받았다면, 버즈 기능을 사용하면 특정 디자인 요소에 대한 의견을 명확하게 표현하고 관리할 수 있습니다. 예를 들어, 특정 버튼의 색상 변경에 대한 의견, 텍스트의 수정 제안, 이미지 변경 요청 등을 버즈를 통해 전달할 수 있습니다. 버즈는 댓글과 달리 특정 요소에 직접 연결되어 있기 때문에, 어떤 부분에 대한 피드백인지 명확하게 파악할 수 있습니다. 또한 버즈는 상태 관리를 통해 해결된 피드백과 미해결된 피드백을 구분할 수 있어, 피드백 누락을 방지하고 작업 진행 상황을 효율적으로 관리할 수 있습니다. 《콘텐츠 디자인은 피그마 with AI》에서는 피그마 버즈 기능을 활용하여 템플릿을 디자인하는 방법까지 자세하게 다루고 있습니다. 팀 협업을 통해 디자인 효율을 높이고 싶다면, 이 책에서 버즈 기능 활용법을 배워보세요.

Q.피그마를 배우고 나서 디자인 실력을 향상시키려면 어떻게 해야 할까요?

피그마를 배우는 것은 디자인 실력 향상을 위한 첫걸음입니다. 피그마를 익힌 후에는 꾸준한 연습과 실전 경험을 통해 실력을 키워나가야 합니다. 먼저 다양한 디자인 튜토리얼을 따라하고, 자신만의 디자인 프로젝트를 진행해보세요. 온라인 디자인 커뮤니티에 참여하여 다른 디자이너들과 교류하고, 피드백을 주고받는 것도 좋은 방법입니다. 디자인 트렌드를 꾸준히 학습하고, 다양한 디자인 스타일을 접해보는 것도 중요합니다. 디자인 관련 서적이나 블로그를 읽고, 디자인 컨퍼런스나 워크숍에 참여하는 것도 도움이 될 수 있습니다. 또한, 자신이 만든 디자인을 포트폴리오로 정리하고, 온라인에 공개하여 다른 사람들의 평가를 받아보는 것도 좋습니다. 중요한 것은 꾸준함입니다. 매일 조금씩이라도 디자인 연습을 하고, 새로운 기술을 배우려는 노력을 게을리하지 않으면 디자인 실력은 꾸준히 향상될 것입니다. 《콘텐츠 디자인은 피그마 with AI》를 통해 피그마의 기본기를 다지고, 다양한 디자인 프로젝트에 도전해보세요. 이 책은 여러분의 디자인 여정에 든든한 길잡이가 되어줄 것입니다.