본문 바로가기
정보

상세페이지작업할때 피그마에서 생산지 강조, 고객 요청에 대응하는 지도 제작 팁

by warmmoss 2025. 6. 18.
반응형

상세페이지를 만들다 보면 농산물 생산지를 강조해야 할 일이 자주 생깁니다. 텍스트로 강조해도 되지만, 고객은 한눈에 보이는 시각적 정보를 더 신뢰합니다. 다음은 Figma를 활용해 생산지를 강조하는 지도를 만드는 실전 팁입니다.

피그마로 verctor maps플로그인을 이용해서 지도를 그린예
피그마로 verctor maps플로그인을 이용해서 지도를 그린예

✅ 1. 피그마에서 벡터 지도 불러오기

Figma에서 'VectorMax' 플러그인을 실행합니다.

검색창에 'South Korea' 를 입력한 뒤 지도를 선택해 삽입합니다.

벡터 지도는 크기 조절과 색상 변경이 자유로워 상세페이지에 적합합니다.

✅ 2. 생산지 위치 표시

 

지도 위에 동그라미 하나를 그립니다.

무료 아이콘 플러그인에서 마커 아이콘을 검색하여 추가합니다.

생산지 지역명을 텍스트로 삽입한 뒤, 실제 지도 위치에 맞게 배치합니다.

✅ 3. 시각적 포인트 추가

지도의 외곽선을 숨기고, '채우기' 옵션을 활용해 배경색을 설정합니다.

배경색은 아이콘 컬러와 통일해 브랜드 톤을 유지하면 효과적입니다.

생산지 텍스트는 볼드 처리하고 포인트 컬러를 적용해 강조하세요.

✅ 4. 광역시/도 경계 요청 대응법

고객이 "광역시랑 도 경계도 넣어 주세요"라고 요청했다면 당황하지 마세요.

벡터맥스 플러그인은 도 경계선이 포함된 버전도 제공합니다.

'Province Borders' 또는 'District Layer' 같은 레이어를 활용해 쉽게 조정할 수 있습니다.

색상별로 광역시를 구분하거나, 선만 강조해 시각 정보를 강화할 수 있습니다.

📌 요약 정리

지도 제작의 핵심은 벡터 지도 + 마커 아이콘 + 색상 포인트 조합입니다.

자주 나오는 요청은 템플릿으로 미리 준비해 두면 빠르게 대응할 수 있습니다.

지도는 정보 전달과 디자인을 동시에 충족시키는  요소입니다.

 

이제 "지도 하나 넣어 주세요"라는 말에 당황하지 않고,

준비된 템플릿으로 바로 대응해보세요.

반응형