Documentation menu

인터랙티브 블록

모든 인터랙티브 블록은 세 가지 출력 티어(키네틱, 정적, Outlook)를 갖추고 있으므로, 디자인하는 동안 호환성을 걱정할 필요가 전혀 없습니다. 이 페이지는 각 블록이 하는 일과 그 폴백이 어떤 모습인지 간단히 요약합니다. 티어 시스템 자체는 폴백 작동 방식에서 설명합니다.

각 블록에는 전체 설정 항목과 실제 예시를 담은 전용 페이지도 있으며, 아래 각 섹션 끝에 링크되어 있습니다. 차트, KPI 스코어카드, 대시보드를 찾고 계신가요? 분석 & 차트 블록을 확인해 보세요.

캐러셀

내비게이션 점과 화살표가 있는, 스와이프 가능한 이미지 갤러리입니다. 전적으로 CSS로 동작합니다.

  • 인터랙티브: 수신자는 그 자리에서 슬라이드를 넘겨 볼 수 있습니다. 각 슬라이드에는 캡션과 링크를 넣을 수 있습니다.
  • 폴백: 첫 번째 슬라이드와 함께, 호스팅된 라이브 뷰로 연결되는 "모든 N개 슬라이드 보기" 링크가 표시됩니다. 라이브 뷰에서는 모든 슬라이드를 한 번의 탭으로 볼 수 있으므로 아무것도 사라지지 않습니다.

가이드 및 예시 전체 보기

아코디언

펼치고 접을 수 있는 섹션입니다 — FAQ, 주문 상세 정보, 또는 긴 이메일을 훑어보기 쉽게 유지하는 데 이상적입니다.

  • 인터랙티브: 제목을 탭하면 해당 내용이 펼쳐집니다.
  • 폴백: 모든 항목이 펼쳐진 상태로 표시되므로 아무것도 사라지지 않습니다.

가이드 및 예시 전체 보기

투표

원탭 설문입니다. 각 선택지는 확정되는 순간 투표를 기록하는 링크입니다.

  • 인터랙티브: 수신자는 받은편지함을 벗어나지 않고 투표할 수 있으며, 블록은 그 선택을 확인해 보여줍니다.
  • 폴백: 선택지는 호스팅된 페이지를 통해 투표를 기록하는 버튼으로 표시됩니다. 일반 링크야말로 유일한 보편적 요소이기 때문에, 투표는 모든 이메일 클라이언트에서 작동합니다.

결과는 프로젝트의 분석 데이터로 실시간 반영됩니다. 인터랙션 & 분석을 참고하세요.

가이드 및 예시 전체 보기

스튜디오 안에 바로 내장된 완전한 다중 페이지 설문 빌더입니다. 필요한 만큼 다양한 질문 유형을 추가하고, 원한다면 여러 페이지로 나눌 수 있으며, 결과는 원시 데이터 그대로가 아니라 문항별 집계로 확인할 수 있습니다.

  • 질문 유형: 짧은 텍스트, 긴 텍스트, 이메일, 숫자, 전화번호, 날짜, 드롭다운, 단일 체크박스에 더해 객관식(하나 선택), 체크박스(원하는 개수만큼 선택), 선형 척도, 별점이 있습니다. 자유롭게 조합할 수 있습니다. 폼은 추가한 유형이 무엇이든 그 form-field 자식들을 담는 컨테이너일 뿐입니다. (파일 업로드 질문은 아직 지원되지 않습니다.)
  • 단일 페이지 폼은 이전과 완전히 동일하게 작동합니다. 이메일 내 폼 전송을 지원하는 클라이언트에서는 수신자가 받은편지함을 벗어나지 않고 모든 필드를 입력해 제출할 수 있습니다. 그 외의 환경에서는 폼이 호스팅된 페이지에서 같은 폼을 여는 CTA 버튼으로 표시됩니다.
  • 다중 페이지 설문: 인스펙터에서 질문에 페이지 번호를 지정하면 폼을 여러 페이지로 나눌 수 있습니다 — "3페이지 중 1페이지"와 같은 진행 표시와 뒤로 가기 내비게이션이 함께 제공됩니다. 실제 폼의 페이지 넘김은 정적 HTML/CSS로는 표현할 수 없으므로, 다중 페이지 폼은 항상 호스팅된 설문 마법사를 여는 단일 설문 시작 버튼(라벨은 변경 가능)으로 메일에 발송됩니다. 수신자는 한 번에 한 페이지씩 답변하며, 뒤로 가기를 사용한 경우를 포함해 답변은 페이지 간에 자동으로 이어집니다. 마지막 페이지가 제출되기 전까지는 아무것도 기록되지 않으므로, 도중에 중단된 설문은 부분 응답을 남기지 않습니다.

단일 페이지든 다중 페이지든, 모든 제출은 수신자별 응답으로 기록되며 응답 페이지에서 문항별로 집계됩니다: 설문 문항 집계를 참고하세요.

가이드 및 예시 전체 보기

카운트다운

출시, 세일, 마감을 위한 실시간으로 카운트되는 타이머입니다. 카운트다운 타이머는 서버에서 렌더링되는 애니메이션 GIF로 생성됩니다 — 주요 클라이언트 전반에서 계속 카운트를 이어갈 수 있는 유일한 방식입니다 — 정적 이미지만 표시하는 클라이언트를 위해 의미 있는 첫 프레임도 함께 제공됩니다.

가이드 및 예시 전체 보기

평점

원탭 피드백 질문입니다 — CSAT, CES, NPS 형식 설문을 지원하는 블록입니다. 투표와 마찬가지로 각 선택지는 기록되는 링크이므로, 평점은 어디서나 작동합니다: 받은편지함에서 한 번의 탭, 호스팅된 페이지에서 확인.

  • 표시 스타일: 별점(전통적인 3~10단계 별 나열), 숫자 척도(직접 지정한 낮음/높음 라벨이 있는 리커트 방식의 번호 버튼 행 — 예: "전혀 동의하지 않음" → "매우 동의함"), NPS(기본값이 "전혀 그렇지 않다" → "매우 그렇다"인 고정된 0~10단계) 중에서 선택할 수 있습니다. 세 가지 모두 동일한 rate 액션을 전송하므로, 스타일을 바꿔도 기존 응답이 깨지지 않습니다.
  • 저평점 알림 기준값: 블록에 "평점 ≤ N"을 설정하면 나쁜 응답이 도착하는 즉시 플래그를 지정할 수 있습니다 — 이는 웹훅의 lowScore 플래그앱 내 알림 이메일을 모두 구동하는 장치입니다. 1~5점 CSAT 질문과 0~10점 CES 질문은 서로 다른 기준값이 필요하므로, 각 평점 블록은 저마다 고유한 기준값을 설정합니다.
  • 후속 질문: 응답이 설정한 기준값 이하로 떨어질 때마다 "무엇이 문제였나요?"와 같은 자유 서술형 질문을 선택적으로 물을 수 있습니다. 이는 호스팅된 라이브 뷰에서만 나타나며(이메일 HTML은 분기할 수 없습니다), 평점 제출 직후 표시되고, 같은 수신자에게 연결된 일반 답변으로 응답에 기록됩니다.

응답은 평균값, 응답 분포, 해당하는 경우 NPS 점수, 그리고 시간에 따른 추이로 자동 집계됩니다 — 응답 & 웹훅을 참고하세요.

가이드 및 예시 전체 보기

스핀 투 윈

보상을 배정하는 게임화된 프로모션 룰렛입니다. 키네틱 CSS가 지원되는 환경에서는 룰렛이 이메일 안에서 애니메이션으로 동작합니다. 그렇지 않은 환경에서는 수신자가 라이브 뷰를 통해 동등한 원탭 결과 공개를 받을 수 있으므로, 모든 수신자가 당첨될 수 있습니다.

가이드 및 예시 전체 보기

퀴즈

채점되는 다문항 퀴즈입니다 — 리드 스코어링 퀴즈, 성격/지식 테스트에 대한 스튜디오의 답입니다. 퀴즈 블록을 추가한 다음, 그 안에 퀴즈 문항 자식 요소를 넣습니다. 각 문항은 자체 선택지와 정답을 가집니다.

  • 인터랙티브: 이메일 내 폼 전송을 지원하는 클라이언트에서는 수신자가 받은편지함에서 바로 모든 문항에 답하고 한 번에 제출할 수 있습니다.
  • 폴백: 그 외의 모든 곳에서는 링크가 호스팅된 라이브 뷰에서 같은 퀴즈를 엽니다 — 투표/평점처럼 답변별 링크 티어는 존재하지 않습니다. 다문항 조합은 단순한 GET 링크로 나열할 수 없기 때문입니다.
  • 채점: 정답은 블록에 설정된 정답 키를 기준으로 서버 측에서 확인되며, 클라이언트 측 값은 절대 신뢰하지 않습니다. 수신자에게는 설정한 합격 점수(정답률 백분율)를 넘겼는지에 따라 두 가지 설정 가능한 결과 메시지 중 하나가 표시됩니다. 리다이렉트를 설정하면 합격 시 쿠폰 페이지 등 특정 위치로 이후에 보낼 수 있습니다.

각 제출은 인터랙션 & 분석에 일반 이벤트로 기록되며, 계산된 점수와 문항별 답변이 그 값이 됩니다.

가이드 및 예시 전체 보기

스크래치

긁어서 확인하는 경품 카드입니다 — 게임화된 프로모션 공개 이면의 동일한 메커니즘으로, 아코디언 및 스핀 투 윈 블록과 같은 :checked CSS 기법 위에 구축됩니다.

  • 인터랙티브: 긁는 표면을 탭하면 받은편지함 안에서 바로 아래의 경품이 공개됩니다.
  • 폴백: 공개 제스처가 지원되지 않는 환경에서는 경품이 기본적으로 가려지지 않은 채 표시됩니다 — 아코디언이 사용하는 것과 동일한 "안전한 기본값" 패턴입니다 — 그래서 누구도 긁을 수 없는 카드만 바라보고 마는 일이 없습니다.

가이드 및 예시 전체 보기

상품

이메일에서 바로 판매할 수 있습니다: 지금 구매 버튼이 있는 상품 카드입니다. 체크아웃 필드가 탭했을 때 이동할 곳을 결정합니다. **MailInApp 체크아웃(Stripe)**은 별도의 스토어프론트 없이 실제 결제를 처리합니다 — 먼저 설정 → 결제에서 자신의 Stripe 계정을 연결하세요. 대금은 그곳으로 직접 정산되며, MailInApp은 대금을 보유하거나 카드 정보를 확인하지 않습니다. 외부 스토어 체크아웃으로 연결을 선택하면 대신 구매자를 연결된 자신의 Shopify/WooCommerce 스토어의 상품 페이지로 바로 보냅니다.

MailInApp 체크아웃 모드에서는:

  • 풀필먼트: 디지털(블록에 입력한 다운로드 링크/코드가 결제가 완료되는 즉시 자동으로 이메일 발송됩니다) 또는 물리적(Stripe Checkout이 배송 주소를 수집합니다. 응답 대시보드의 주문 테이블에서 주문을 발송 완료로 표시합니다 — MailInApp 자체가 배송을 처리하지는 않지만, 발송 완료로 표시하는 즉시 구매자에게 이메일을 보냅니다).
  • 재고: 선택적으로 상한을 설정할 수 있습니다. 결제 완료된 주문이 그 상한에 도달하면, 호스팅된 라이브 뷰에서 블록이 지금 구매 대신 품절을 표시합니다. 발송된 이메일 자체도 최신 상태를 유지합니다: 상한이 설정된 상품의 재고 표시("3개 남음" / "품절")는 열람할 때마다 새로고침되는 작은 서버 렌더링 이미지입니다 — 카운트다운 블록이 사용하는 것과 같은 방식입니다 — 그래서 발송 후 며칠이 지나도 오래된 재고 상태가 표시되는 일이 없습니다. 구매 자체는 배지에 표시되는 내용을 신뢰하는 것이 아니라, 구매자가 클릭하는 시점에 다시 한번 권위 있게 확인됩니다 — 마지막 재고가 팔리는 순간 결제가 완료되면, 구매자는 조용히 초과 판매되는 대신 자동으로 환불 및 통지를 받습니다.
  • 인터랙티브: 투표나 평점과 달리, 구매는 오직 Stripe 자체의 보안 페이지에서만 완료될 수 있으므로 이메일 내 키네틱 티어는 존재하지 않습니다 — 지금 구매는 항상 먼저 호스팅된 라이브 뷰를 열어 확인한 뒤 Stripe로 리다이렉트합니다.
  • 폴백: 동일한 상품 카드와 지금 구매 링크는 모든 이메일 클라이언트에서 작동합니다. 정적 티어의 다른 요소와 마찬가지로 단순 링크이기 때문입니다.

완료된 모든 주문은 인터랙션 & 분석purchase 이벤트로 표시되며, 프로젝트의 응답 페이지에 전용 주문 테이블로도 표시됩니다. 각 단계에서 무슨 일이 일어나는지 — 그리고 구매자에게 어떤 이메일이 발송되는지 — 그리고 수동 환불 방법은 주문, 풀필먼트, 환불을 참고하세요. 구매자에게 직접 무언가 물어봐야 하나요? 주문 테이블에서 바로 문의하기를 이용하세요.

외부 스토어 체크아웃으로 연결 모드는 이 모든 것을 건너뜁니다: 지금 구매는 자신의 스토어에 있는 상품 페이지로 바로 향하는 단순한 클릭 추적 링크(버튼 블록과 마찬가지로 클릭 히트맵에 집계됩니다)가 됩니다. MailInApp이 그 결제에 전혀 관여하지 않으므로 주문도, 재고 추적도, MailInApp 측 풀필먼트 단계도 없습니다. Shopify나 WooCommerce 스토어를 연결했다면, 동기화된 상품을 가져오기만 해도 이 항목이 자동으로 채워집니다.

가이드 및 예시 전체 보기

과제

마감일이 있는 숙제나 학습 과제입니다 — 제목, 안내, 선택적 배점, 원하는 만큼의 참고 자료 링크를 추가할 수 있습니다.

  • 마감일: 발송된 이메일에서는 실시간으로 카운트되는 카운트다운 이미지(카운트다운 블록이 사용하는 것과 같은 서버 렌더링 GIF 기법)와 함께 일반 텍스트 마감일 문구가 표시되므로, 클라이언트가 이미지를 렌더링하든 안 하든 마감일은 정확합니다.
  • 제출: 완료로 표시(투표 선택지처럼 원탭 체크박스), 짧은 텍스트 답변, 또는 링크 답변(예: 공유 문서 URL) 중에서 선택합니다. 완료 표시는 투표/평점 선택지와 같은 방식으로 링크 우선 티어 2 액션입니다. 텍스트 답변과 링크 답변은 답을 입력하기 위해 호스팅된 라이브 뷰를 엽니다. 이는 단순한 링크로는 전달할 수 없는 내용에 대해 퀴즈 블록이 사용하는 것과 같은 패턴입니다.
  • 폴백: 그 외의 모든 곳에서는 정적인 마감일 문구와 참고 자료 링크 목록이 항상 함께 표시됩니다.

완료 또는 제출은 모두 일반 이벤트로 기록됩니다 — 인터랙션 & 분석을 참고하세요 — 그리고 응답 페이지의 성적부(학생×과제 테이블로, 지연 제출에는 플래그가 표시됩니다)로 집계됩니다: 숙제 & 성적부를 참고하세요.

가이드 및 예시 전체 보기

플래시카드 덱

어휘나 지식 암기를 위한 뒤집기 카드입니다. 플래시카드 덱을 추가한 다음, 그 안에 플래시카드 자식 요소를 넣습니다. 각 카드는 자체 앞면(질문)과 뒷면(답) 텍스트를 가지며, 양면 모두 선택적으로 이미지를 넣을 수 있습니다.

  • 인터랙티브: 카드를 탭하면 그 자리에서 뒤집히며, 덱 안의 다른 카드와는 독립적으로 동작합니다.
  • 폴백: 그 외의 모든 곳에서는 앞면과 뒷면이 "Q:" / "A:" 라벨과 함께 정적으로 세로로 쌓여 표시됩니다 — 지원되지 않는 제스처 뒤에 무언가 숨겨지는 일은 절대 없습니다.

플래시카드 덱은 질문이 아니라 학습 보조 도구이므로 아무것도 기록하지 않으며, 응답 대시보드, CSV 내보내기, 분석에는 절대 표시되지 않습니다.

가이드 및 예시 전체 보기

미팅 링크

온라인 또는 하이브리드 행사의 참여 정보입니다: 제공업체 라벨(Zoom, Meet, Teams, 또는 사용자 지정), 참여 URL, 시작 시간, 그리고 전화 참여를 위한 선택적 전화 접속 정보를 설정합니다. 라벨은 표시 전용입니다 — 이들 제공업체와의 계정 연동은 전혀 없으며, 그저 붙여넣는 URL일 뿐입니다 — 그리고 시작 몇 분 전부터 참여 링크를 라이브 상태로 표시할지도 설정할 수 있습니다.

  • 메일에서는 항상 라이브: 발송된 이메일의 참여 버튼은 항상 실제로 클릭 가능한 링크입니다 — 카운트다운 및 상품 블록과 같은 "발송 시점에 정적" 관례를 따릅니다 — 카운트다운 블록이 사용하는 것과 같은 서버 생성 GIF 기법으로 표시되는 "시작까지" / "지금 라이브" 배지도 함께 표시됩니다.
  • 호스팅된 라이브 뷰에서는 제한됨: 라이브 뷰는 매번 새로 가져오므로, 그곳에서는 참여 버튼이 동적입니다 — 설정한 시간대가 열리기 전까지는 클릭할 수 없는 "시작 N분 전 열림" 칩을 표시하다가, 이후 실제 링크로 전환됩니다.
  • 전화 접속 정보를 설정한 경우, 참여 버튼 옆에 일반 텍스트로 표시됩니다.

가이드 및 예시 전체 보기

장소

오프라인 행사 장소 정보입니다: 장소명, 주소, 선택적 사진, 그리고 "길 찾기" 버튼입니다.

  • 길 찾기는 Google 지도를 엽니다 — API 키도, 지도 썸네일 연동도 필요 없이 단순한 링크입니다. 입력한 정보 중 가장 정확한 것을 사용합니다: 우선 붙여넣은 Google 지도 링크(Google 지도에서 장소를 공유하고 URL을 붙여넣으면 되며, maps.app.goo.gl/... 같은 단축 링크도 작동합니다), 그다음 위도/경도를 입력했다면 그것을 사용하고, 둘 다 설정되지 않은 경우에만 일반 주소 텍스트의 지오코딩으로 대체합니다.
  • 이미지나 텍스트처럼 순수한 콘텐츠입니다 — 응답할 것이 없으므로 응답 대시보드나 CSV 내보내기에는 절대 표시되지 않습니다. 길 찾기 링크는 다른 모든 링크와 마찬가지로 블록 단위 클릭 히트맵에서 추적됩니다.
  • 주소, 지도 링크, 좌표를 모두 비워 두어도 블록에는 여전히 장소명과 사진이 표시되며, 작동하지 않는 길 찾기 링크가 생기지는 않습니다.

가이드 및 예시 전체 보기

캘린더에 추가

원탭으로 "이것을 내 캘린더에 추가"하는 블록으로, 시간대가 서로 다른 초대장 문제에 대한 실용적인 해결책입니다. 발송된 이메일은 수신자 자신의 시간대를 감지할 수 없으므로(이메일에는 자바스크립트가 없습니다), 이 블록은 행사의 시작과 종료를 미리 계산된 현지 시간 문자열이 아니라 절대적인 시점으로 인코딩합니다. 그러면 각 참석자의 캘린더 앱이 자동으로 자신의 현지 시간에 맞게 올바르게 표시합니다.

  • 제목, 선택적 설명, 시작 시간, 종료 시간(비워 두면 시작 1시간 후로 기본 설정됩니다), 그리고 자유 서술형 위치를 입력받습니다 — 위치는 장소 블록이나 미팅 링크 블록의 텍스트를 참고해 직접 입력하세요. 두 블록은 자동으로 연동되지 않습니다.
  • 같은 정보로부터 세 개의 링크를 표시합니다: .ics 다운로드(데스크톱 및 모바일 캘린더 앱에서 바로 열립니다), Google 캘린더에 추가, Outlook.com에 추가입니다. 뒤의 두 가지는 발송 시점에 생성되는 단순한 딥링크로, 서버 왕복 통신이 없습니다.

가이드 및 예시 전체 보기

RSVP

참석 인원 제한과 대기자 명단 기능을 갖춘 무료 "참석하시겠습니까?" 질문입니다 — 결제가 아니라 인원 파악만 필요한 행사를 위한, 상품 블록의 유료 티켓 재고 상한에 해당하는 무료 RSVP 버전입니다.

  • 인터랙티브: 예/아니오 칩은 원탭 링크이며, 투표의 단일 선택 투표와 정확히 같은 형태입니다. 동반자 허용을 켜면 "예" 응답에 동반자 수 선택기가 추가됩니다 — 동반자 수를 선택하려면 호스팅된 라이브 뷰가 필요합니다. 이는 과제 블록의 텍스트/링크 답변이 이미 따르고 있는 "고정된 링크는 선택지를 제공할 수 없다"는 논리와 같습니다. 동반자가 없는 "예"(동반자 0명)는 여전히 단순한 원탭 링크로 작동합니다.
  • 인원 제한과 대기자 명단: 선택적으로 상한을 설정할 수 있습니다(0 = 무제한). 확정된 RSVP 수(동반자 포함)가 이를 초과하게 되면, 이후의 "예" 응답은 확정이 아니라 대기로 기록되며, 수신자에게는 일반적인 감사 메시지 대신 직접 설정한 대기자 명단 메시지가 표시됩니다.
  • 폴백: 그 외의 모든 곳에서는 호스팅된 라이브 뷰로 연결되는 정적인 "여기서 RSVP" 링크가 표시됩니다.

모든 RSVP는 응답 페이지에서 확정/거절/대기 인원수와 동반자 총합으로 집계되며, 다른 모든 블록의 요약과 함께 표시됩니다.

가이드 및 예시 전체 보기

웨비나 신청

자신의 라이브 세션 중 하나로 연결되는, 디자인된 등록 카드입니다 — 인스펙터에서 세션을 선택하면 제목/날짜가 스냅샷으로 반영되며, 이후에도 완전히 편집할 수 있습니다.

  • 등록 버튼은 항상 세션의 ID만으로 생성된 해당 세션의 현재 /webinar/<liveSessionId> 페이지를 가리킵니다 — 발송 시점에 조회하지 않으므로, 이메일이 발송된 후 세션 정보가 바뀌더라도 링크는 계속 올바르게 유지됩니다.
  • 선택기에는 공개 등록으로 설정된 세션만 표시됩니다 — 구독자 전용 세션은 연결할 공개 페이지가 없습니다.
  • 폴백: 필요 없습니다 — 메일, 라이브 뷰, 캔버스 모두 동일한 카드를 표시합니다. 여기서는 수신자나 현재 시간에 의존하는 요소가 전혀 없기 때문입니다.

가이드 및 예시 전체 보기

순위표

스포츠 팀이나 클럽을 위한 순위가 매겨진 시즌 성적표입니다: 팀명, 경기 수/승/무/패, 득점/실점, 승점을 승점 순으로 정렬하고 상위 3위에 표시를 남깁니다. 분석 & 차트 블록 페이지의 다른 모든 블록과 달리, 이 블록은 절대 이미지로 렌더링되지 않습니다. 정렬된 표 형식 데이터는 테이블 마크업이 이미 잘 처리하는 영역이므로, Outlook을 포함한 모든 이메일 클라이언트에서 실제 HTML 테이블 자체가 블록 전체를 이룹니다.

  • 행은 팀당 한 줄씩 직접 입력합니다 — 아직 실시간 데이터 소스 연동은 지원되지 않으므로, 각 경기가 끝난 뒤 블록을 수동으로 업데이트하세요(데이터 소스에 연동되기 전 KPI 스코어카드의 수동 값을 업데이트하는 것과 같은 방식입니다).
  • 무승부가 없는 종목(농구, 테니스 리그 등)에서는 무승부 열 표시를 끕니다. 승점은 승/무/패로부터 계산되지 않고 항상 직접 입력하는 필드입니다 — 리그마다 승점 부여 방식이 다르기 때문입니다(3점 승리, 보너스 점수 등).
  • 팀 강조 표시를 설정하면 정확한 팀명을 기준으로 해당 팀의 행이 굵게 표시되고 색이 입혀집니다 — 학부모용 다이제스트에서 가족이 자녀의 팀을 한눈에 찾아볼 수 있어 유용합니다.
  • 장소나 캘린더에 추가와 마찬가지로 순수한 콘텐츠입니다 — 응답할 것이 없으므로 응답 대시보드나 CSV 내보내기에는 절대 표시되지 않습니다.

가이드 및 예시 전체 보기

입력 요소

팔레트의 입력 섹션에는 텍스트, 이메일, 긴 텍스트, 드롭다운, 체크박스, 숫자, 전화번호, 날짜 선택기, 객관식, 체크박스, 선형 척도, 별점과 같은 입력 요소가 모여 있습니다. 폼 안에 놓으면 그 폼의 필드 중 하나가 됩니다. 그 외의 위치에 놓으면 새로운 폼으로 감싸진 채 배치됩니다 — 이메일에서는 입력 요소가 폼의 일부로만 제출될 수 있습니다. 같은 유형들은 드래그하지 않고도 사용할 수 있습니다: 트리 패널에 있는 폼의 + 버튼이나 폼의 빈 캔버스 자리 표시자를 클릭하면 직접 검색해서 삽입할 수 있습니다.

  • 드롭다운, 객관식, 체크박스는 모두 선택지 목록을 가지며, 인스펙터에서 행으로 추가하거나 순서를 바꿀 수 있습니다. 단일 체크박스는 선택하면 yes를 전송합니다. 체크박스 필드는 선택지 중 원하는 개수만큼 선택할 수 있으며, 결과에서는 각각이 별도로 집계됩니다.
  • 선형 척도는 최댓값과 선택적인 낮음/높음 끝 라벨(예: "그렇지 않다" → "매우 그렇다")을 입력받습니다. 별점은 별의 최대 개수를 입력받습니다.
  • 어떤 필드든 인스펙터에서 페이지 번호를 지정하면 다중 페이지 설문의 해당 페이지에 배치할 수 있습니다.

유형과 관계없이, 답변은 필드명을 키로 하여 프로젝트의 분석 데이터에 도착합니다 — 어떻게 요약되는지는 설문 문항 집계를 참고하세요.

레이아웃 & 콘텐츠 블록

인터랙티브 블록 세트와 더불어, 스튜디오에는 모든 이메일에 필요한 구조 블록도 포함되어 있습니다: 섹션, 칼럼, 제목, 텍스트, 이미지, 버튼, 목록, 구분선, 여백, 소셜 링크입니다. 연결된 데이터 소스의 행마다 템플릿을 한 번씩 렌더링하는 반복 블록도 있어, 상품 그리드나 다이제스트에 유용합니다. 칼럼은 칼럼별 너비, 여백, 세로 정렬을 지정할 수 있는 나란히 배치 레이아웃으로, 테이블을 기반으로 만들어져 Outlook에서도 제대로 표시됩니다.

텍스트를 담는 모든 블록은 병합 태그를 사용할 수 있습니다. 이미 만들어 둔 것을 새로운 것과 나란히 배치하고 싶으신가요? 새 칼럼 블록 안에 직접 다시 만드는 대신, 그것을 선택하고 인스펙터의 ⧉ 감싸기…(참고: 워크스페이스)를 사용하세요.

버튼

버튼은 단순한 CTA를 위한 범용 블록입니다: 라벨, 색상, 링크 URL을 설정합니다. 클릭하면 항상 그 URL로 이동할 뿐입니다 — 프로젝트의 블록 단위 클릭 히트맵에 기록됩니다(참고: 인터랙션 & 분석)만, 그 이상은 아무것도 하지 않습니다. 버튼은 링크의 반대편에 무엇이 있는지 알지 못하므로, 그 자체로는 카드에 결제를 청구하거나, 투표를 기록하거나, 답변을 저장할 수 없습니다.

그렇기 때문에 실제 액션이 다른 어딘가에서 일어나는 경우에 알맞은 선택입니다 — "이 게시글 읽기", "사이트 방문하기" 등, 목적지가 MailInApp에 이미 전용 블록이 마련되어 있는 대상이 아닌 경우입니다. 자신이 호스팅하는 웨비나의 등록 페이지라면 대신 웨비나 신청을 사용하세요 — "신청을 받는 페이지로 연결한다"는 같은 개념이지만, 세션에 연결되어 있어 링크가 오래되어 못 쓰게 될 수 없습니다.

클릭 자체가 액션이 되기를 원한다면 잘못된 선택입니다. 그런 경우에는 버튼 대신 아래의 전용 블록을 사용하세요 — 각 블록은 이미 자체 CTA를 표시하며 알맞은 엔드포인트에 직접 연결되어 있고, 추가 설정 없이 결과가 자동으로 응답 페이지에 집계됩니다:

| 이 작업을 하려면... | 버튼 대신 이 블록을 사용하세요 | | --- | --- | | 무언가를 판매하고 카드에 결제를 청구 | 상품 — 지금 구매 버튼, 실제 Stripe 체크아웃(또는 Shopify/WooCommerce 체크아웃으로 바로 연결), 재고 추적 | | 이메일 신청, 자유 서술 답변, 또는 모든 설문 답변 수집 | | | 원탭 객관식 또는 예/아니오 질문하기 | 투표 | | 인원 제한/대기자 명단이 있는 무료 행사의 참석 인원 파악 | RSVP | | 자신이 호스팅하는 웨비나 홍보 | 웨비나 신청 — 이후 세션 정보가 바뀌어도 링크는 계속 올바르게 유지됩니다 | | 원탭 CSAT/NPS/CES 형식 평점 수집 | 평점 | | 프로모션 룰렛 돌리기 또는 스크래치 경품 공개 | 스핀 투 윈 또는 스크래치 |

기본 원칙: 클릭이 자신의 쪽에서 무언가를 변경해야 한다면 — 결제, 투표, 저장되는 답변 등 — 위의 해당 블록을 사용하세요. 단지 누군가를 어딘가로 보내기만 하면 된다면, 단순한 버튼이 정확히 알맞은 선택이며 그 이상 설정할 것은 없습니다.

수식

수학 및 과학 표기 — 분수, 지수, 아래첨자, 그리스 문자, 이름 있는 함수(\sin, \lim, \log, ...), 집합/논리 기호(\forall, \in, \cup, \neg, ...), 일반적인 연산자 — 를 작은 LaTeX 유사 문법(예: \frac{-b \pm \sqrt{b^2-4ac}}{2a})으로 작성합니다. 어떤 이메일 클라이언트도 실제 수식을 조판할 수 없기 때문입니다. \left(/\right)는 자동으로 크기가 조절되지 않고 일반 크기로 인식되며(이는 실제 TeX 엔진이 아니라 작은 비트맵 렌더러입니다), \text{...}는 수식 중간에서도 일반 텍스트로 되돌아갑니다.

화학식에는 전용 \ce{...} 매크로가 있으며, mhchem과 유사한 소규모 서브셋입니다: \ce{H3O+} 또는 \ce{2H2 + O2 -> 2H2O}처럼 작성합니다. 원소 개수는 자동으로 아래첨자가 되고, 뒤에 붙는 이온 전하(+, 2-, SO4^2- 등)는 자동으로 위첨자가 되며, ->는 반응 화살표로 렌더링되므로, 원자 개수와 전하마다 ^/_를 직접 입력할 필요가 없습니다.

서버 측에서 이미지로 렌더링되며, 인라인(작게, 텍스트 줄 안에 위치) 또는 블록(크게, 독립된 줄) 표시 모드가 있습니다. 인식하지 못하는 문법 — 전체 LaTeX 문서, 패키지, 행렬, 표 등 — 은 발송을 망가뜨리지 않고 그대로 텍스트로 렌더링됩니다. 이미지의 alt 텍스트에는 항상 원본 표기가 담겨 있으므로, 수식이 텍스트 대응물 없이 이미지 안에 갇히는 일은 없습니다.

가이드 및 예시 전체 보기

동영상 및 오디오

이메일 클라이언트는 미디어 재생을 실행할 수 없으므로, 동영상 또는 오디오 블록은 항상 정적 미리보기 이미지(설정했다면 포스터/커버 이미지, 아니라면 단순한 자리 표시자)로 발송되며, 탭하면 파일이 열립니다. 받은편지함이 아닌 실제 페이지인 호스팅된 라이브 뷰에서는 같은 블록이 대신 실제로 동작하는 네이티브 플레이어로 표시됩니다: 포스터 이미지가 있는 <video>, 또는 설정했다면 컨트롤 위에 커버 아트가 쌓인 <audio>입니다. 동영상/오디오 파일 자체는 여전히 다른 곳에서 호스팅하는 단순한 URL이며, 그 링크를 붙여넣으면 됩니다. 다만 포스터/커버 이미지는 직접 입력하는 대신 미디어 라이브러리에서 선택합니다: **이미지 선택…**을 클릭하면 이미 업로드한 모든 이미지의 그리드가 열리며, 새 이미지를 업로드하는 버튼도 바로 그곳에 있습니다.

동영상: 가이드 및 예시 전체 보기 · 오디오: 가이드 및 예시 전체 보기

프리빌트 컴포넌트

팔레트의 프리빌트 섹션에는 바로 사용할 수 있는 완성된 구성이 모여 있습니다 — 헤더, 히어로, 카드, 상품 행, 기능 칼럼, 고객 후기, 쿠폰, 푸터입니다. 하나를 배치하면 미리 정렬된 일반 블록들이 삽입됩니다. 배치 이후에는 특별한 점이 전혀 없으므로 자유롭게 스타일이나 구조를 바꿀 수 있습니다.