무료 디자인툴 피그마에 대해서 들어보셨나요? 어려운 프로그램으로 알고 계신 분들도 많은데요. 오히려 포토샵보다 더 다루기 쉽고 편리하면서도 무료로 사용 가능하기 때문에 블로거분들에게는 매우 추천하는 디자인 프로그램입니다. 오늘은 이 피그마로 간단하게 썸네일을 제작하는 방법을 알려드리겠습니다. 그리고 상업적 제한 없이 무료로 사용할 수 있는 디자인 템플릿도 공유해드릴 테니 글 하단에서 파일도 받아가시길 바랍니다.
1. 피그마 설치하기
피그마는 무료 디자인 프로그램으로 피그마 대표 홈페이지에서 다운로드가 가능합니다. 하단 url을 클릭해서 들어가시면 다운로드가 가능합니다. 가장 왼쪽의 데스크톱 앱을 본인 컴퓨터 OS에 맞는 버전으로 설치하시면 됩니다. 웹브라우저로도 사용이 가능하지만 프로그램을 설치해야 컴퓨터에 깔려있는 글꼴을 사용할 수 있기 때문에 꼭 프로그램을 설치해서 사용하시는 걸 추천합니다.
https://www.figma.com/ko-kr/downloads/
Figma 다운로드 | 데스크톱 및 모바일용 웹 디자인 앱
macOS 또는 Windows용 데스크톱에 Figma 웹 디자인 앱을 설치하세요. 그리고 글꼴 설치 프로그램과 디바이스 미리보기 앱도 다운로드하세요.
www.figma.com
2. 피그마 사용하기
피그마 프로그램을 다운받고 실행하면 이렇게 첫 화면이 뜹니다. 이제 디자인을 시작하려면 새 파일을 만들어야 하는데요. 왼쪽 사이드 메뉴의 초안에 플러스 버튼을 클릭하고 Design을 누르면 새 디자인 파일이 생성됩니다.
이제 이 안에서 자유롭게 디자인을 할 수 있는데요 여기서 여러분이 쓰게 되는 몇가지 주요 기능을 간단하게 알려드리겠습니다.
3. 피그마로 썸네일 디자인하기
01) 프레임 만들기
프레임은 PPT에서는 슬라이드, 포토샵에서는 아트보드와 같은 개념입니다. 내가 어떤 사이즈의 이미지를 제작할 건지 정할 때 이 프레임 도구로 모양과 크기를 결정하게 됩니다. 하단 도구중에 우물정자 모양의 도구를 클릭한 후 화면에 드래그를 해주거나 혹은 오른쪽에 레이아웃 메뉴에서 크기를 입력해서 원하는 모양의 프레임을 제작할 수 있습니다. 블로그 썸네일은 보통 정사각형으로 제작하기 때문에 저는 600x600사이즈를 추천합니다.
02) 배경 색상 넣어주기
썸네일을 제작할 때는 눈에 띄는 배경으로 색상을 선택해줘야 글 선택 확률을 높일 수 있습니다. 배경색상은 오른쪽 메뉴의 채우기 메뉴의 FFFFFF 왼쪽 흰색 네모를 클릭하면 색상 선택 표가 나와서 원하는 색상을 선택할 수 있습니다. 혹은 직접 색상코드를 입력해서 배경색상을 바꾸는 것도 가능합니다. 사용자 지정 하단 아이콘을 클릭하면, 단색이 아니라 그라데이션이나 이미지를 배경으로도 넣을수 있습니다.
03) 모양과 텍스트로 썸네일 디자인하기
이제 배경에 색상도 넣었으니 여러 모양과 텍스트를 조합해서 썸네일을 디자인해야합니다. 모양 도구는 하단 메뉴 중에 세번째 아이콘 옆 드롭다운을 클릭해서 여러 모양을 추가할 수 있습니다. 만든 네모를 가운데 정렬하거나 혹은 오른쪽 정렬을 해서 위치를 맞추고 싶을 때는 왼쪽 메뉴의 위치 아래에 있는 6개 아이콘을 눌러서 위치를 맞춰주시면 됩니다.
텍스트는 하단 메뉴 중에 5번째 아이콘 T 모양을 눌러서 원하는 곳에 클릭하면 추가가 가능합니다. 왼쪽 메뉴의 글씨체 메뉴와 채우기 메뉴를 활용해서 폰트, 크기, 색상을 자유롭게 바꿀 수 있습니다.
04) 썸네일 복사해서 사용하기
썸네일을 완성했다면 앞으로도 동일한 디자인을 활용하기 위해 복사해서 사용해야합니다. 프레임 왼쪽 위의 Frame 1 텍스트를 클릭한 상태에서 Ctrl+C (맥에서는 Cmd+C)를 누르고, Ctrl+V(맥에서는Cmd+V)를 눌러주면 자동으로 프레임 오른쪽에 복사가 됩니다. 혹은 Frame 1텍스트를 클릭한 상태에서 Alt키를 누르고 옆으로 드래그해도 복사가 가능합니다. 이렇게 복사한 썸네일의 텍스트 내용만 교체하면서 블로그 썸네일을 활용할 수 있습니다.
06) 썸네일 이미지 파일로 다운로드 받기
디자인을 완성했으니 이미지 파일로 다운로드 받아야 블로그에 올릴 수 있습니다. 프레임을 클릭한 상태에서 왼쪽 메뉴의 내보내기 옆 + 버튼을 클릭하면 파일이 생성되는데, 1x 드롭다운 하단의 프레임 이름 박스를 클릭하면 다운로드를 받을 수 있습니다. 1x 드롭다운은 원본 사이즈로 받을 건지 혹은 더 큰 사이즈로 받을건지 결정하는 버튼이고, 그 옆에 PNG 드롭다운은 어떤 이미지 유형으로 받을건지 선택하는 버튼입니다. 기본적으로는 해당 드롭다운을 조절할 필요 없이 그대로 받아주시면 됩니다.
07) 기본 기능만을 활용한 썸네일 디자인 예시
제가 앞부분에 설명드린 내용을 활용해서 디자인한 썸네일입니다. 모양을 조합하고 텍스트에 그라데이션을 추가하는 것 만으로도 깔끔하고 멋진 썸네일 디자인이 완성됩니다.
3. 무료 썸네일 디자인 공유
제가 만든 디자인을 무료로 사용할 수 있도록 피그마 링크를 공유드립니다. 해당 디자인은 피그마의 자동 레이아웃 기능까지 추가해서 텍스트 내용만 수정해도 알아서 관련 요소의 크기가 바뀌지 않도록 제작하였습니다. 해당 링크로 들어가면 프레임을 클릭한뒤 복한 후 새파일을 만들어서 사용하시면 됩니다.
01) 무료 썸네일 디자인 피그마 파일 링크
Figma
Created with Figma
www.figma.com
수정 및 재배포는 금지하며 개인적으로나 상업적으로 무제한 활용 가능하니 편하게 사용해주실 바랍니다.
02) 무료 썸네일 디자인 폰트 다운로드 링크
해당 디자인에 사용한 폰트는 모두 무료 상업적 이용이 가능한 무료 폰트입니다. 다운로드를 받아야 디자인을 그대로 활용할 수 있으니 해당 폰트를 다운로드 받은 후 컴퓨터에 설치해주시길 바립니다.
- 페이퍼로지 폰트
https://freesentation.blog/paperlogyfont
PAPERLOGY FONT
페이퍼로지가 선택한 폰트! 지마켓산스의 한글과 Montserrat의 영문을 결합한 '페이퍼로지체'를 사용해보세요!
freesentation.blog
- SB 어그로 폰트
SANDBOX
sandbox.co.kr
피그마는 포토샵처럼 기능이 다양하면서도 다양한 웹분야 디자인을 만들 수 있는 무료 디자인 프로그램입니다. 블로그 썸네일 제작시에도 다양하게 활용이 가능하며 앞으로도 피그마로 무료 디자인 템플릿을 공유해드릴 예정입니다. 해당 프로그램 다운로드 받으셔서 꼭 블로그 활동에 활용해보시는 걸 추천드립니다.
'자료 공유' 카테고리의 다른 글
| 무료 디자인툴 피그마로 블로그 사진에 워터마크 넣기 (0) | 2026.03.25 |
|---|
