배지 디자이너

배지 디자이너는 badges.ninja에 내장된 시각적인 3열 캔버스 편집기로, 외부 디자인 도구 없이도 전문적인 배지 이미지를 만들 수 있어요.

개요

디자이너는 배지 만들기 / 편집 창 안에서 바로 열려요. 세 부분으로 구성돼요.

• 왼쪽 레일 — 가운데 패널을 템플릿, 업로드, 요소, 텍스트, 속성, QR 코드, 레이어 사이에서 전환해요.
• 패널 — 선택한 레일 모드의 도구가 있어요.
• 캔버스 — 배지를 실시간으로 편집할 수 있는 미리보기예요. 추가한 모든 것은 이동, 스타일 변경, 순서 변경, 삭제가 가능한 실제 선택 가능 객체예요.

배지 상세 정보(발급자, 이름, 설명, 기준, 공유 텍스트)는 캔버스 바로 아래에 있어서 디자인과 자격 증명 정보를 한 창에서 함께 다룰 수 있어요. 별도의 단계가 없어요.

템플릿으로 시작하기

레일에서 템플릿을 클릭해 기본 제공 디자인을 둘러보세요. 인정(Recognition) 계열은 모양이 잡힌 프레임과 편집 가능한 자리 표시 텍스트(조직, 제목, 부제, 검증 인장)로 완성된 전문적인 배지를 여덟 가지 색상 팔레트(Gold, Silver, Bronze, Blue, Green, Crimson, Purple, Graphite)로 제공해요. 카테고리 필터로 목록을 좁히거나 빈 캔버스로 처음부터 시작할 수 있어요.

템플릿을 클릭하면 적용돼요. 템플릿의 텍스트는 변경하거나 삭제할 수 있는 일반 편집 레이어가 되며, 고정된 것은 아무것도 없어요.

요소 — 도형, 아이콘, 리본, 배경

요소 패널에서는 배지 위에 그래픽을 겹쳐 올려요.

• 선 — 가로 / 세로 구분선이에요.
• 도형 — 채워진 또는 외곽선만 있는 사각형, 둥근 사각형, 원, 삼각형이에요.
• 아이콘 — 70개의 그림 아이콘(award, brain, certificate, code, crown, diploma, graduation-cap, medal, rocket, shield-check, star, trophy 외 다수)이며 검색할 수 있어요.
• 리본 — 28개의 장식 리본 오버레이이며 직선형 / 뾰족형 / 꼬리형 / 장식형으로 나뉘어 있어요.
• 베이스 — 여러 카테고리(원, 방패, 육각형, 별, 메달, 인장, 화환, 배너, 기하학)에 걸친 80개의 색상 변경 가능한 베이스 도형이에요.

모든 아이콘, 리본, 베이스는 현재 색상으로 삽입되며 언제든지 색을 바꿀 수 있어요.

배경 도형

요소 → 배경 도형에는 완성된 프레임 68개(도형 × 팔레트 라이브러리)가 있어요. 하나를 적용하면 텍스트와 요소는 그대로 위에 유지한 채 배지의 배경 프레임만 바뀌어요. 완성된 템플릿 없이 특정 도형과 색상 조합을 원할 때 편리해요.

사용자 지정 이미지 업로드

업로드 패널에서 직접 만든 로고, 사진, 그래픽을 추가하세요. PNG, JPEG, SVG를 지원하며 최대 5 MB까지 가능해요. 이미지는 일반 전경 객체로 삽입되어 디자인 위에 쌓이며 배경을 지우지 않아요. 배지 배경을 바꾸려면 템플릿이나 배경 도형을 선택하세요.

텍스트 추가 및 스타일 지정

텍스트 패널에서는 다음을 제공해요.

• 제목 / 부제목 / 일반 텍스트 추가 — 크기가 미리 정해진 텍스트 객체예요.
• 조합 — Certificate of Achievement, Awarded to , Verify at 같이 미리 만들어진 묶음이며, 각 줄은 개별적으로 편집할 수 있어요.

텍스트 객체를 선택하면 캔버스 위에 컨텍스트 도구 모음이 나타나요.

• 글꼴 — Sans, Serif, Handwriting, Mono, System으로 나뉜 50개 글꼴 라이브러리예요. 드롭다운에서 고르면 각 옵션이 자신의 서체로 미리 표시돼요.
• + 글꼴 — 브랜드 서체(TTF, WOFF, WOFF2, OTF)를 현재 세션에 업로드해요.
• 글꼴 크기 — − / + 스테퍼(또는 숫자 입력)로 핸들을 드래그하지 않고도 선택한 텍스트의 크기를 정확하게 조절해요.
• 색상 — 선택한 텍스트의 채우기 색을 설정해요 (새 도형/아이콘의 기본 삽입 색상이기도 해요).
• 정렬 — 버튼 여섯 개로 선택 항목을 캔버스 기준 왼쪽 / 가운데 / 오른쪽, 위 / 중간 / 아래로 정렬해요.

동적 속성

속성 패널은 , , , , , 같은 동적 토큰을 텍스트 객체로 삽입해요. 각 토큰은 발급 시점에 수령자별로 치환되므로, 하나의 디자인이 발급받는 모든 사람에게 맞게 개인화돼요. 이렇게 하면 수령자 이름이나 발급일을 배지 자체에 넣을 수 있어요.

QR 코드

QR 코드 패널은 에 연결된 스캔 가능한 코드를 삽입해요. 발급된 각 자격 증명에서는 해당 자격 증명의 공개 검증 페이지로 연결되므로, 누구나 인쇄된 배지를 스캔해 확인할 수 있어요.

레이어

레이어 패널에는 캔버스의 모든 객체가 나열돼요. 여기서 각 레이어를 순서 변경(앞으로 가져오기 / 뒤로 보내기), 숨기기/표시, 선택, 삭제할 수 있어요. 배경 프레임은 맨 아래에 고정되어 상호작용하지 않으므로 전경 요소가 모든 클릭을 받아요.

실행 취소 / 다시 실행(Ctrl+Z / Ctrl+Shift+Z)으로 최근 20개의 변경 사항을 오갈 수 있고, 객체를 캔버스 중앙 가까이로 드래그하면 점선 스냅 가이드가 나타나요.

배지 저장

별도의 "내보내기" 단계는 없어요. 디자인과 상세 정보가 준비되면:

• 배지 만들기는 캔버스를 PNG로 캡처해 이미지 CDN(Amazon S3, 불변의 콘텐츠 주소 기반 URL로 제공)에 업로드하고, 편집 가능한 디자인과 함께 배지를 저장해요. 그래서 배지를 다시 열면 개별 레이어가 복원되어 계속 편집할 수 있어요.
• 초안 저장은 작업 중인 배지를 서버 측에 (기기 간에) 저장해요. 초안은 배지 목록에 초안 표시와 함께 나타나며, 나중에 언제든 이어서 작업할 수 있어요.

좋은 배지 디자인을 위한 팁

• 단순하게 — 명확한 텍스트, 최소한의 장식. 배지는 작게 표시되는 경우가 많아요.
• 높은 대비 사용 — 배경 위에서 텍스트가 잘 읽히게 하세요.
• 자격 증명 이름 넣기 — 보는 사람이 한눈에 이해할 수 있어야 해요.
• 정사각형 형식 — 배지는 정사각형일 때 가장 잘 표시돼요.
• 브랜드 일관성 — 배지마다 조직의 색상과 글꼴을 재사용하세요.
• 재사용 가능한 디자인 저장 — 만든 모든 배지는 계정 템플릿으로도 저장되어 다음에 시작점으로 쓸 수 있어요 (내 템플릿 참고).