Skip to content

배지 디자이너

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

3열 배지 편집기 — 왼쪽 레일, 패널, 캔버스 — 아래에 배지 세부 정보가 함께 표시

개요

디자이너는 배지 생성 / 편집 창 안에서 바로 열립니다. 세 부분으로 구성됩니다.

  • 왼쪽 레일 — 가운데 패널을 템플릿, 업로드, 요소, 텍스트, 속성, QR 코드, 레이어 모드로 전환합니다.
  • 패널 — 선택한 레일 모드에 해당하는 도구입니다.
  • 캔버스 — 실시간으로 편집 가능한 배지 미리보기입니다. 추가하는 모든 것은 이동, 재스타일링, 재정렬, 삭제할 수 있는 실제 선택 가능한 객체입니다.

배지 세부 정보(발급자, 이름, 설명, 기준, 공유 텍스트)는 캔버스 바로 아래에 위치하므로, 디자인과 자격 정보가 하나의 창 안에 함께 있습니다 — 별도의 단계가 없습니다.

템플릿에서 시작하기

레일에서 템플릿 을 클릭하면 내장 디자인을 둘러볼 수 있습니다. Recognition 계열은 완전히 구성된 전문적인 배지 — 모양이 잡힌 프레임과 편집 가능한 자리표시자 텍스트(조직, 제목, 부제목, 인증 인장) — 를 여덟 가지 색상 팔레트(골드, 실버, 브론즈, 블루, 그린, 크림슨, 퍼플, 그라파이트)로 제공합니다. 카테고리 필터로 목록을 좁히거나 빈 캔버스 로 처음부터 시작하세요.

템플릿을 클릭하면 적용됩니다. 텍스트는 변경하거나 제거할 수 있는 일반적인 편집 가능 레이어가 됩니다 — 고정되는 것은 아무것도 없습니다.

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

요소 패널 — 선, 도형, 아이콘, 리본, 베이스, 배경 도형

요소 패널은 배지 위에 그래픽을 겹쳐 쌓습니다.

  • — 수평 / 수직 선.
  • 도형 — 채움 및 외곽선 사각형, 둥근 사각형, 원, 삼각형.
  • 아이콘 — 70개의 픽토그램 아이콘(어워드, 뇌, 증서, 코드, 왕관, 졸업장, 학사모, 메달, 로켓, 체크 방패, 별, 트로피 등 다수), 검색 가능.
  • 리본 — 28개의 장식용 리본 오버레이. Straight / Pointed / Tails / Decorative로 그룹화.
  • 베이스 — 카테고리별 80개의 다시 칠할 수 있는 베이스 도형(원, 방패, 육각형, 별, 메달, 인장, 월계관, 배너, 기하 도형).

모든 아이콘, 리본, 베이스는 현재 색상 으로 삽입되며 언제든지 다시 칠할 수 있습니다.

배경 도형

배경 도형 — 배지 배경으로 적용된 사전 디자인 프레임

요소 → 배경 도형 에는 68개의 완성된 프레임(모양 × 팔레트 라이브러리)이 있습니다. 하나를 적용하면 텍스트와 요소는 그대로 위에 두고 배지의 배경 프레임만 교체됩니다 — 구성된 템플릿 없이 특정 모양/색상 조합을 원할 때 유용합니다.

커스텀 이미지 업로드

업로드 패널로 자신의 로고, 사진, 그래픽을 추가하세요. PNG, JPEG, SVG 를 최대 5 MB 까지 사용할 수 있습니다. 이미지는 일반 전경 객체로 삽입됩니다 — 디자인 위에 쌓이며 배경을 지우지 않습니다. 배지 배경을 바꾸려면 대신 템플릿이나 배경 도형을 선택하세요.

텍스트 추가 및 스타일링

텍스트 패널 — 제목, 본문 텍스트, 완성형 조합

텍스트 패널이 제공하는 것:

  • 제목 / 부제목 / 일반 텍스트 추가 — 크기가 미리 설정된 텍스트 객체.
  • 조합Certificate of Achievement, Awarded to , Verify at 같은 완성형 스택 — 각 줄은 독립적으로 편집할 수 있습니다.

텍스트 객체를 선택하면 캔버스 위에 상황별 툴바 가 나타납니다.

폰트 선택기, − / + 글꼴 크기 스테퍼, 색상, 정렬이 있는 상황별 툴바

  • 폰트 — Sans, Serif, Handwriting, Mono, System으로 그룹화된 50개 폰트 라이브러리. 드롭다운에서 하나를 고르세요. 각 옵션은 해당 서체로 미리보기됩니다.
  • + 폰트 — 현재 세션에 사용할 브랜드 서체(TTF, WOFF, WOFF2, OTF)를 업로드합니다.
  • 글꼴 크기− / + 스테퍼(또는 숫자 입력)로 핸들을 끌지 않고 선택한 텍스트의 크기를 정밀하게 조정합니다.
  • 색상 — 선택한 텍스트의 채움 색(및 새 도형/아이콘의 기본 삽입 색)을 지정합니다.
  • 정렬 — 6개의 버튼으로 선택 항목을 캔버스 기준으로 왼쪽 / 가운데 / 오른쪽, 위 / 중간 / 아래 정렬합니다.

동적 속성

속성 패널 — 수령자별로 해석되는 동적 토큰

속성 패널은 동적 토큰, , , , , — 을 텍스트 객체로 삽입합니다. 각 토큰은 수여 시점에 수령자별로 해석되므로, 하나의 디자인이 발급하는 모든 사람에게 맞게 개인화됩니다. 이렇게 수령자의 이름이나 발급 날짜를 배지 자체에 넣을 수 있습니다.

QR 코드

QR 코드 패널은 에 연결된 스캔 가능한 코드를 삽입합니다. 발급된 각 수여 건에서 해당 수여의 공개 인증 페이지로 해석되므로, 누구나 인쇄된 배지를 스캔해 확인할 수 있습니다.

레이어

레이어 패널 — 모든 객체를 재정렬, 숨기기, 삭제

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

실행 취소 / 다시 실행(Ctrl+Z / Ctrl+Shift+Z)은 최근 20개의 변경을 되짚으며, 객체를 캔버스 중앙 근처로 끌면 점선 스냅 가이드 가 나타납니다.

배지 저장

완성된 배지와 함께 완성된 세부 정보 — 생성하거나 초안으로 저장할 준비 완료

별도의 "내보내기" 단계가 없습니다. 디자인과 세부 정보가 준비되면:

  • 배지 생성 은 캔버스를 PNG로 캡처해 IPFS에 업로드하고, 편집 가능한 디자인과 함께 배지를 저장합니다 — 그래서 배지를 다시 열면 개별 레이어가 복원되어 계속 편집할 수 있습니다.
  • 초안 저장 은 진행 중인 배지를 서버 측에 저장합니다(기기 간 동기화). 초안은 초안 표시와 함께 배지 목록에 나타나며, 나중에 언제든지 다시 이어서 작업할 수 있습니다.

좋은 배지 디자인을 위한 팁

  • 간결하게 유지 — 명확한 텍스트, 최소한의 복잡함. 배지는 작은 크기로 표시되는 경우가 많습니다.
  • 높은 대비 사용 — 배경 위에서 텍스트가 잘 읽히도록.
  • 자격 이름 표시 — 보는 사람이 한눈에 이해할 수 있어야 합니다.
  • 정사각형 포맷 — 배지는 정사각형으로 가장 잘 표시됩니다.
  • 브랜드 일관성 — 모든 배지에 조직의 색상과 폰트를 재사용하세요.
  • 재사용 가능한 디자인 저장 — 만드는 모든 배지는 다음에 시작점으로 쓸 수 있는 계정 템플릿으로도 저장됩니다(내 템플릿 참조).

badges.ninja Documentation