인앱 메시지

인앱 메시지와 Braze SDK에 대한 설정 방법에 대해 알아보세요.

Prerequisites

이 기능을 사용하려면 먼저 Android Braze SDK를 통합해야 합니다. You’ll also need to enable in-app messages.

Message types

android

Braze offers several default in-app message types, each customizable with messages, images, Font Awesome icons, click actions, analytics, color schemes, and more.

Their basic behavior and traits are defined by the IInAppMessage interface, in a subclass called InAppMessageBase. IInAppMessage also includes a subinterface, IInAppMessageImmersive, which lets you add close, click-action, and analytics buttons to your app.

important:

Keep in mind, in-app messages containing buttons will include the clickAction message in the final payload if the click action is added prior to adding the button text.

slideup in-app messages are so-named because they “slide up” or “slide down” from the top or bottom of the screen. They cover a small portion of the screen and provide an effective and non-intrusive messaging capability.

The slideup in-app message object extends InAppMessageBase.

An in-app message sliding from the bottom of a phone screen displaying "Humans are complicated. Custom engagement shouldn't be." In the background is the same in-app message displayed in the bottom right corner of a web page.

modal in-app messages appear in the center of the screen and are framed by a translucent panel. Useful for more critical messaging, they can be equipped with two click-action and analytics-enabled buttons.

This message type is a subclass of InAppMessageImmersiveBase, an abstract class that implements IInAppMessageImmersive, giving you the option to add custom functionality to your locally generated in-app messages.

A modal in-app message in the center of a phone screen displaying "Humans are complicated. Custom engagement shouldn't be." In the background is the same in-app message displayed in the center of a web page.

full in-app messages are useful for maximizing the content and impact of your user communication. The upper half of a full in-app message contains an image, and the lower half displays text and up to two click action and analytics-enabled buttons.

This message type extends InAppMessageImmersiveBase, giving you the option to add custom functionality to your locally generated in-app messages.

A full screen in-app message shown across an entire phone screen displaying, "Humans are complicated. Custom engagement shouldn't be." In the background is the same in-app message displayed largely in the center of a web page.

HTML in-app messages are useful for creating fully customized user content. User-defined HTML in-app message content is displayed in a WebView and may optionally contain other rich content, such as images and fonts, allowing for full control over message appearance and functionality.

This message type implements IInAppMessageHtml, which is a subclass of IInAppMessage.

Android in-app messages support a JavaScript brazeBridge interface to call methods on the Braze Android SDK from within your HTML, see our JavaScript bridge page for more details.

An HTML in-app message with the a carousel of content and interactive buttons.

important:

We currently do not support the display of custom HTML in-app messages in an iFrame on the iOS and Android platforms.

tip:

You can also define custom in-app message views for your app. For a full walkthrough, see Setting custom factories.

Enabling in-app messages

Step 1: Register `BrazeInAppMessageManager`

In-app message display is managed by the BrazeInAppMessageManager class. Every activity in your app must be registered with the BrazeInAppMessageManager to allow it to add in-app message views to the view hierarchy. There are two ways to accomplish this:

automatically
manually

The activity lifecycle callback integration handles in-app message registration automatically; no extra integration is required. This is the recommended method for handling in-app message registration.

warning:

If you’re using activity lifecycle callback for automatic registration, do not complete this step.

In your Application.onCreate(), call ensureSubscribedToInAppMessageEvents():

java
kotlin

BrazeInAppMessageManager.getInstance().ensureSubscribedToInAppMessageEvents(context);

BrazeInAppMessageManager.getInstance().ensureSubscribedToInAppMessageEvents(context)

In every activity where in-app messages can be shown, call registerInAppMessageManager() in that activity’s onResume():

java
kotlin

@Override
public void onResume() {
  super.onResume();
  // Registers the BrazeInAppMessageManager for the current Activity. This Activity will now listen for
  // in-app messages from Braze.
  BrazeInAppMessageManager.getInstance().registerInAppMessageManager(activity);
}

public override fun onResume() {
  super.onResume()
  // Registers the BrazeInAppMessageManager for the current Activity. This Activity will now listen for
  // in-app messages from Braze.
  BrazeInAppMessageManager.getInstance().registerInAppMessageManager(this)
}

In every activity where registerInAppMessageManager() was called, call unregisterInAppMessageManager() in that activity’s onPause():

java
kotlin

@Override
public void onPause() {
  super.onPause();
  // Unregisters the BrazeInAppMessageManager for the current Activity.
  BrazeInAppMessageManager.getInstance().unregisterInAppMessageManager(activity);
}

public override fun onPause() {
  super.onPause()
  // Unregisters the BrazeInAppMessageManager.
  BrazeInAppMessageManager.getInstance().unregisterInAppMessageManager(this)
}

Step 2: Update the manager’s blocklist (optional)

In your integration, you may require that certain activities in your app should not show in-app messages. The activity lifecycle callback integration provides an easy way to accomplish this.

The following sample code adds two activities to the in-app message registration blocklist, SplashActivity and SettingsActivity:

java
kotlin

public class MyApplication extends Application {
  @Override
  public void onCreate() {
    super.onCreate();
    Set<Class> inAppMessageBlocklist = new HashSet<>();
    inAppMessageBlocklist.add(SplashActivity.class);
    inAppMessageBlocklist.add(SettingsActivity.class);
    registerActivityLifecycleCallbacks(new BrazeActivityLifecycleCallbackListener(inAppMessageBlocklist));
  }
}

class MyApplication : Application() {
  override fun onCreate() {
    super.onCreate()
    val inAppMessageBlocklist = HashSet<Class<*>>()
    inAppMessageBlocklist.add(SplashActivity::class.java)
    inAppMessageBlocklist.add(SettingsActivity::class.java)
    registerActivityLifecycleCallbacks(BrazeActivityLifecycleCallbackListener(inAppMessageBlocklist))
  }
}

Prerequisites

이 기능을 사용하려면 먼저 Swift Braze SDK를 통합해야 합니다. 인앱 메시지를 활성화해야 합니다.

메시지 유형

swift

각 인앱 메시지 유형은 콘텐츠, 이미지, 아이콘, 클릭 동작, 분석, 표시 및 전달 전반에 걸쳐 고도로 사용자 지정 가능합니다. 이는 모든 인앱 메시지의 기본 동작과 특성을 정의하는 Braze.InAppMessage 의 열거형 유형입니다. 인앱 메시지 속성 및 사용법에 대한 전체 목록은 InAppMessage 클래스를 참조하세요.

다음은 Braze에서 사용할 수 있는 인앱 메시지 유형과 최종 사용자에게 표시되는 방식입니다.

Slideup 인앱 메시지는 화면 상단 또는 하단에서 ‘슬라이드 업’ 또는 ‘슬라이드 다운’되기 때문에 이 이름이 붙여졌습니다. 화면의 작은 부분을 차지하며 효과적이고 방해가 되지 않는 메시징 기능을 제공합니다.

휴대폰 화면 하단과 상단에 슬라이드업 인앱 메시지가 표시됩니다.

Modal 인앱 메시지는 화면 중앙에 표시되며 반투명 패널로 둘러싸여 있습니다. 보다 중요한 메시징에 유용하며, 최대 두 개의 분석 지원 버튼을 제공할 수 있습니다.

휴대폰 화면 중앙에 표시되는 모달 인앱 메시지.

Modal Image 인앱 메시지는 화면 중앙에 표시되며 반투명 패널로 둘러싸여 있습니다. 이러한 메시지는 헤더나 메시지 텍스트가 없다는 점을 제외하면 Modal 유형과 유사합니다. 보다 중요한 메시징에 유용하며, 최대 두 개의 분석 지원 버튼을 제공할 수 있습니다.

휴대폰 화면 중앙에 표시되는 모달 이미지 인앱 메시지.

Full 인앱 메시지는 사용자 커뮤니케이션의 콘텐츠와 효과를 극대화하는 데 유용합니다. Full 인앱 메시지의 상단에는 이미지가, 하단에는 텍스트와 최대 2개의 분석 지원 버튼이 표시됩니다.

휴대폰 화면 전체에 표시되는 전체 화면 인앱 메시지.

Full Image 인앱 메시지는 헤더나 메시지 텍스트가 없다는 점을 제외하면 Full 인앱 메시지와 유사합니다. 이 메시지 유형은 사용자 커뮤니케이션의 콘텐츠와 효과를 극대화하는 데 유용합니다. Full Image 인앱 메시지에는 전체 화면에 걸친 이미지와 함께 최대 2개의 분석 지원 버튼을 표시하는 옵션이 포함되어 있습니다.

휴대폰 화면 전체에 표시되는 전체 화면 이미지 인앱 메시지.

HTML 인앱 메시지는 완전히 맞춤화된 사용자 콘텐츠를 만드는 데 유용합니다. 사용자 정의 HTML 전체 인앱 메시지 콘텐츠는 WKWebView에 표시되며, 선택적으로 이미지 및 글꼴과 같이 다양한 형식의 기타 콘텐츠를 포함할 수 있으므로 메시지 모양과 기능을 완벽하게 제어할 수 있습니다.

iOS 인앱 메시지는 HTML 내에서 Braze 웹 SDK의 메서드를 호출하기 위해 JavaScript brazeBridge 인터페이스를 지원합니다. 자세한 내용은 모범 사례를 참조하세요.

다음 예는 페이지가 지정된 HTML 전체 인앱 메시지를 보여줍니다:

콘텐츠 캐러셀과 대화형 버튼이 포함된 HTML 인앱 메시지입니다.

현재 iOS 및 Android 플랫폼에서는 iFrame에 커스텀 HTML 인앱 메시지를 표시하는 기능을 지원하지 않습니다.

Control 인앱 메시지에는 UI 구성요소가 포함되어 있지 않으며 주로 분석 목적으로 사용됩니다. 이 유형은 대조군에 전송된 인앱 메시지의 수신을 확인하는 데 사용됩니다.

지능형 선택 및 대조군에 대한 자세한 내용은 지능형 선택을 참조하세요.

인앱 메시지 활성화

1단계: `BrazeInAppMessagePresenter`의 구현을 만드세요.

Braze가 인앱 메시지를 표시할 수 있도록 하려면, BrazeInAppMessagePresenter 프로토콜의 구현을 만들고 이를 Braze 인스턴스의 선택적 inAppMessagePresenter에 할당하세요. BrazeInAppMessageUI 오브젝트를 인스턴스화하여 기본 Braze UI 프리젠터를 사용할 수도 있습니다.

BrazeInAppMessageUI 클래스에 액세스하려면 BrazeUI 라이브러리를 가져와야 합니다.

swift
objective-c

AppDelegate.braze?.inAppMessagePresenter = BrazeInAppMessageUI()

AppDelegate.braze.inAppMessagePresenter = [[BrazeInAppMessageUI alloc] init];

2단계: 일치하는 트리거가 없습니다.

관련 BrazeDelegate 클래스 내에서 BrazeDelegate.(_:noMatchingTriggerForEvent)을 구현하세요. Braze가 특정 이벤트에 대한 일치하는 트리거를 찾지 못하면, 이 메서드를 자동으로 호출합니다.

Prerequisites

Before you can use this feature, you’ll need to integrate the Web Braze SDK. 그러나 추가 설정은 필요하지 않습니다.

메시지 유형

모든 인앱 메시지는 모든 인앱 메시지의 기본 동작과 특성을 정의하는 InAppMessage에서 프로토타입을 상속하며, 이는 모든 인앱 메시지의 기본 동작과 특성을 정의합니다. 대표적인 서브클래스는 SlideUpMessage, ModalMessage, FullScreenMessage와 HtmlMessage.

각 인앱 메시지 유형은 콘텐츠, 이미지, 아이콘, 클릭 동작, 분석, 표시 및 전달 전반에 걸쳐 사용자 지정 가능합니다.

SlideUp 인앱 메시지는 전통적으로 모바일 플랫폼에서 화면 위나 아래에서 ‘슬라이드 업’ 또는 ‘슬라이드 다운’되기 때문에 그렇게 명명되었습니다. Braze 웹 SDK에서 이러한 메시지가 웹의 주요 패러다임에 맞춰 Growl 또는 Toast 스타일의 알림으로 표시됩니다. 화면의 작은 부분을 차지하며 효과적이고 방해가 되지 않는 메시징 기능을 제공합니다.

휴대폰 화면 하단에서 '인간은 복잡하다'는 인앱 메시지가 슬라이딩되는 모습. 커스텀 인게이지먼트는 안 됩니다." 백그라운드에서는 웹 페이지의 하단에 표시되는 것과 동일한 인앱 메시지가 표시됩니다.

Modal 인앱 메시지는 화면 중앙에 표시되며 반투명 패널로 둘러싸여 있습니다. 보다 중요한 메시징에 유용하며, 최대 두 개의 클릭 동작과 분석 지원 버튼을 제공할 수 있습니다.

휴대폰 화면 가운데 다음과 같은 Modal 인앱 메시지가 표시됩니다. "사람은 복잡한 존재입니다. 커스텀 인게이지먼트는 안 됩니다." 백그라운드에서는 웹 페이지의 가운데 표시되는 것과 동일한 인앱 메시지가 표시됩니다.

Full 인앱 메시지는 사용자 커뮤니케이션의 콘텐츠와 효과를 극대화하는 데 유용합니다. 좁은 브라우저 창(예: 모바일 웹)에서는 full 인앱 메시지는 전체 브라우저 창을 차지합니다. 더 큰 브라우저 창에서는 full 인앱 메시지가 modal 인앱 메시지와 비슷하게 표시됩니다. full 인앱 메시지의 상단에는 이미지가 있고, 하단에는 최대 8줄의 텍스트와 최대 2개의 클릭 동작 및 분석 지원 버튼이 표시됩니다.

휴대폰 화면 전체에 다음과 같은 인앱 메시지가 표시됩니다. "사람은 복잡한 존재입니다. 커스텀 인게이지먼트는 안 됩니다." 백그라운드에서는 웹 페이지의 가운데 크게 표시되는 것과 동일한 인앱 메시지가 표시됩니다.

HTML 인앱 메시지는 완전히 맞춤화된 사용자 콘텐츠를 만드는 데 유용합니다. 사용자 정의 HTML은 iFrame에 표시되며, 이미지, 글꼴, 비디오와 같은 다양한 형식의 콘텐츠를 포함할 수 있으므로 메시지 모양과 기능을 완벽하게 제어할 수 있습니다. 이 기능은 HTML 내에서 Braze 웹 SDK의 메서드를 호출하기 위해 JavaScript brazeBridge 인터페이스를 지원합니다. 자세한 내용은 모범 사례를 참조하세요.

important:

웹 SDK를 통해 HTML 인앱 메시지를 활성화하려면 Braze에 allowUserSuppliedJavascript 초기화 옵션을 제공해야 합니다(예: braze.initialize('YOUR-API_KEY', {allowUserSuppliedJavascript: true})). 이는 보안상의 이유 때문입니다. HTML 인앱 메시지는 JavaScript를 실행할 수 있으므로 사이트 관리자가 이를 활성화해야 합니다.

다음 예는 페이지가 지정된 HTML 인앱 메시지를 보여줍니다:

콘텐츠 캐러셀과 대화형 버튼이 포함된 HTML 인앱 메시지입니다.

Prerequisites

이 기능을 사용하려면 먼저 Android Braze SDK를 통합해야 합니다.

About TV and OTT support

The Android Braze SDK natively supports displaying in-app messages on OTT devices like Android TV or Fire Stick. However, there’s some key differences between native Android and OTT in-app messages. For OTT devices:

In-app messages that require touch mode, such as slideup, are disabled on OTT.
The currently selected or focused item, such as a button or close button, will be highlighted.
Body clicks on the in-app message itself, such as not on a button, are not supported.

Prerequisites

Before you can use this feature, you’ll need to integrate the Cordova Braze SDK.

Braze offers several default in-app message types, each customizable with messages, images, Font Awesome icons, click actions, analytics, color schemes, and more.

important:

Keep in mind, in-app messages containing buttons will include the clickAction message in the final payload if the click action is added prior to adding the button text.

The slideup in-app message object extends InAppMessageBase.

This message type extends InAppMessageImmersiveBase, giving you the option to add custom functionality to your locally generated in-app messages.

This message type implements IInAppMessageHtml, which is a subclass of IInAppMessage.

Android in-app messages support a JavaScript brazeBridge interface to call methods on the Braze Android SDK from within your HTML, see our JavaScript bridge page for more details.

An HTML in-app message with the a carousel of content and interactive buttons.

important:

We currently do not support the display of custom HTML in-app messages in an iFrame on the iOS and Android platforms.

tip:

You can also define custom in-app message views for your app. For a full walkthrough, see Setting custom factories.

Each in-app message type is highly customizable across content, images, icons, click actions, analytics, display, and delivery. They are enumerated types of Braze.InAppMessage, which defines basic behavior and traits for all in-app messages. For the full list of in-app message properties and usage, see the InAppMessage class.

These are the available in-app message types in Braze and how they will look like for end-users.

Slideup in-app messages are given this name because they “slide up” or “slide down” from the top or bottom of the screen. They cover a small portion of the screen and provide an effective and non-intrusive messaging capability.

A slideup in-app message at the bottom and the top of a phone screen.

Modal in-app messages appear in the center of the screen and are framed by a translucent panel. Useful for more critical messaging, they can be equipped with up to two analytics-enabled buttons.

A modal in-app message in the center of a phone screen.

Modal Image in-app messages appear in the center of the screen and are framed by a translucent panel. These messages are similar to the Modal type except without header or message text. Useful for more critical messaging, they can be equipped with up to two analytics-enabled buttons.

A modal image in-app message in the center of a phone screen.

Full in-app messages are useful for maximizing the content and impact of your user communication. The upper half of a Full in-app message contains an image, and the lower half displays text and up to two analytics-enabled buttons.

A fullscreen in-app message shown across an entire phone screen.

Full Image in-app messages are similar to Full in-app messages except without header or message text. This message type is useful for maximizing the content and impact of your user communication. A Full Image in-app message contains an image spanning the entire screen, with the option to display up to two analytics-enabled buttons.

A fullscreen image in-app message shown across an entire phone screen.

HTML in-app messages are useful for creating fully customized user content. User-defined HTML Full in-app message content is displayed in a WKWebViewand may optionally contain other rich content, such as images and fonts, allowing for full control over message appearance and functionality.

iOS in-app messages support a JavaScript brazeBridge interface to call methods on the Braze Web SDK from within your HTML, see our best practices for more details.

The following example shows a paginated HTML Full in-app message:

An HTML in-app message with a carousel of content and interactive buttons.

Note that we currently do not support the display of custom HTML in-app messages in an iFrame on the iOS and Android platforms.

Control in-app messages do not contain a UI component and are used primarily for analytics purposes. This type is used to verify receipt of an in-app message sent to a control group.

For further details about Intelligent Selection and control groups, refer to Intelligent Selection.

Prerequisites

이 기능을 사용하려면 먼저 Flutter Braze SDK를 통합해야 합니다.

메시지 유형

android
swift

Braze는 메시지, 이미지, 폰트 어썸 아이콘, 클릭 액션, 분석, 색 구성표 등으로 각각 사용자 지정할 수 있는 여러 가지 기본 인앱 메시지 유형을 제공합니다.

이들의 기본 동작과 특성은 서브클래스의 IInAppMessage 라는 서브클래스의 InAppMessageBaseIInAppMessage 에는 하위 인터페이스도 포함되어 있습니다, IInAppMessageImmersive라는 하위 인터페이스도 포함되어 있어 앱에 닫기, 클릭 액션 및 분석 버튼을 추가할 수 있습니다.

important:

버튼 텍스트를 추가하기 전에 클릭 동작이 추가되면 버튼이 포함된 인앱 메시지의 최종 페이로드에 clickAction 메시지가 포함됩니다.

slideup 인앱 메시지는 화면 상단 또는 하단에서 ‘슬라이드 업’ 또는 ‘슬라이드 다운’되기 때문에 그렇게 이름이 붙여졌습니다. 화면의 작은 부분을 차지하며 효과적이고 방해가 되지 않는 메시징 기능을 제공합니다.

slideup 인앱 메시지 오브젝트는 InAppMessageBase를 확장합니다.

휴대폰 화면 하단에서 '인간은 복잡하다'는 인앱 메시지가 슬라이딩되는 모습. 커스텀 인게이지먼트는 안 됩니다." 백그라운드에서는 웹 페이지의 오른쪽 하단에 표시되는 것과 동일한 인앱 메시지가 표시됩니다.

modal 인앱 메시지는 화면 중앙에 표시되며 반투명 패널로 둘러싸여 있습니다. 보다 중요한 메시징에 유용하며, 두 개의 클릭 동작과 분석 지원 버튼을 제공할 수 있습니다.

이 메시지 유형은 InAppMessageImmersiveBase의 하위 클래스이며, IInAppMessageImmersive 을 구현하는 추상 클래스로 로컬에서 생성된 인앱 메시지에 사용자 지정 기능을 추가할 수 있는 옵션을 제공합니다.

full 인앱 메시지는 사용자 커뮤니케이션의 콘텐츠와 효과를 극대화하는 데 유용합니다. full 인앱 메시지의 상단에는 이미지가, 하단에는 텍스트와 최대 2개의 클릭 동작 및 분석 지원 버튼이 표시됩니다.

이 메시지 유형은 InAppMessageImmersiveBase을 확장하여 로컬에서 생성된 인앱 메시지에 사용자 지정 기능을 추가할 수 있는 옵션을 제공합니다.

HTML 인앱 메시지는 완전히 맞춤화된 사용자 콘텐츠를 만드는 데 유용합니다. 사용자 정의 HTML 인앱 메시지 콘텐츠는 WebView에 표시되며, 선택적으로 이미지 및 글꼴과 같은 다양한 형식의 기타 콘텐츠를 포함할 수 있으므로 메시지 모양과 기능을 완벽하게 제어할 수 있습니다.

이러한 메시지 인스턴스는 InAppMessageHtml의 인스턴스이며 IInAppMessage 서브클래스를 구현합니다: IInAppMessageHtml.

Android 인앱 메시지는 HTML 내에서 Braze 웹 SDK의 메서드를 호출하기 위해 JavaScript brazeBridge 인터페이스를 지원합니다. 자세한 내용은 모범 사례를 참조하세요.

콘텐츠 캐러셀과 대화형 버튼이 포함된 HTML 인앱 메시지입니다.

important:

현재 iOS 및 Android 플랫폼에서는 iFrame에 커스텀 HTML 인앱 메시지를 표시하는 기능을 지원하지 않습니다.

tip:

앱에 대한 사용자 지정 인앱 메시지 보기를 정의할 수도 있습니다. 전체 안내는 사용자 지정 공장 설정을 참조하세요.

다음은 Braze에서 사용할 수 있는 인앱 메시지 유형과 최종 사용자에게 표시되는 방식입니다.

휴대폰 화면 하단과 상단에 슬라이드업 인앱 메시지가 표시됩니다.

휴대폰 화면 중앙에 표시되는 모달 인앱 메시지.

휴대폰 화면 중앙에 표시되는 모달 이미지 인앱 메시지.

휴대폰 화면 전체에 표시되는 전체 화면 인앱 메시지.

휴대폰 화면 전체에 표시되는 전체 화면 이미지 인앱 메시지.

다음 예는 페이지가 지정된 HTML 전체 인앱 메시지를 보여줍니다:

콘텐츠 캐러셀과 대화형 버튼이 포함된 HTML 인앱 메시지입니다.

현재 iOS 및 Android 플랫폼에서는 iFrame에 커스텀 HTML 인앱 메시지를 표시하는 기능을 지원하지 않습니다.

지능형 선택 및 대조군에 대한 자세한 내용은 지능형 선택을 참조하세요.

Prerequisites

Before you can use this feature, you’ll need to integrate the React Native Braze SDK.

메시지 유형

android
swift

important:

버튼 텍스트를 추가하기 전에 클릭 동작이 추가되면 버튼이 포함된 인앱 메시지의 최종 페이로드에 clickAction 메시지가 포함됩니다.

slideup 인앱 메시지 오브젝트는 InAppMessageBase를 확장합니다.

이 메시지 유형은 InAppMessageImmersiveBase을 확장하여 로컬에서 생성된 인앱 메시지에 사용자 지정 기능을 추가할 수 있는 옵션을 제공합니다.

이러한 메시지 인스턴스는 InAppMessageHtml의 인스턴스이며 IInAppMessage 서브클래스를 구현합니다: IInAppMessageHtml.

콘텐츠 캐러셀과 대화형 버튼이 포함된 HTML 인앱 메시지입니다.

important:

현재 iOS 및 Android 플랫폼에서는 iFrame에 커스텀 HTML 인앱 메시지를 표시하는 기능을 지원하지 않습니다.

tip:

앱에 대한 사용자 지정 인앱 메시지 보기를 정의할 수도 있습니다. 전체 안내는 사용자 지정 공장 설정을 참조하세요.

다음은 Braze에서 사용할 수 있는 인앱 메시지 유형과 최종 사용자에게 표시되는 방식입니다.

휴대폰 화면 하단과 상단에 슬라이드업 인앱 메시지가 표시됩니다.

휴대폰 화면 중앙에 표시되는 모달 인앱 메시지.

휴대폰 화면 중앙에 표시되는 모달 이미지 인앱 메시지.

휴대폰 화면 전체에 표시되는 전체 화면 인앱 메시지.

휴대폰 화면 전체에 표시되는 전체 화면 이미지 인앱 메시지.

다음 예는 페이지가 지정된 HTML 전체 인앱 메시지를 보여줍니다:

콘텐츠 캐러셀과 대화형 버튼이 포함된 HTML 인앱 메시지입니다.

현재 iOS 및 Android 플랫폼에서는 iFrame에 커스텀 HTML 인앱 메시지를 표시하는 기능을 지원하지 않습니다.

지능형 선택 및 대조군에 대한 자세한 내용은 지능형 선택을 참조하세요.

데이터 모델

인앱 메시지 모델은 React Native SDK에서 사용할 수 있습니다. Braze에는 동일한 데이터 모델을 공유하는 네 가지 인앱 메시지 유형( 슬라이드업, 모달, 전체 및 HTML 전체)이 있습니다.

메시지

인앱 메시지 모델은 모든 인앱 메시지의 기본을 제공합니다.

등록정보 설명

inAppMessageJsonString 메시지 JSON 표현입니다.

message 메시지 텍스트입니다.

header 메시지 헤더입니다.

uri 버튼 클릭 액션과 연결된 URI입니다.

imageUrl 메시지 이미지 URL입니다.

zippedAssetsUrl HTML 콘텐츠를 표시하도록 준비된 압축된 에셋입니다.

useWebView 버튼 클릭 동작이 웹 보기를 사용하여 리디렉션할지 여부를 나타냅니다.

duration 메시지 표시 기간입니다.

clickAction 버튼 클릭 액션 유형입니다. 세 가지 유형(NEWS_FEED, URI, NONE)이 있습니다.

dismissType 메시지 닫기 유형. 두 가지 유형(SWIPE 및 AUTO_DISMISS)이 있습니다.

messageType SDK에서 지원하는 인앱 메시지 유형입니다. 네 가지 유형(SLIDEUP, MODAL, FULL, HTML_FULL)이 있습니다.

extras 메시지 추가 항목 사전. 기본값: [:].

buttons 인앱 메시지의 버튼 목록입니다.

toString() 문자열 표현으로서의 메시지입니다.

인앱 메시지 모델에 대한 전체 참조는 안드로이드 및 iOS 설명서를 참조하십시오.

버튼

인앱 메시지에 버튼을 추가하여 작업 및 로그 분석을 수행할 수 있습니다. 버튼 모델은 모든 인앱 메시지 버튼의 기본을 제공합니다.

등록정보 설명

text 버튼의 텍스트입니다.

uri 버튼 클릭 액션과 연결된 URI입니다.

useWebView 버튼 클릭 동작이 웹 보기를 사용하여 리디렉션할지 여부를 나타냅니다.

clickAction 사용자가 버튼을 클릭할 때 처리되는 클릭 동작 유형입니다. 세 가지 유형(NEWS_FEED, URI, NONE)이 있습니다.

id 메시지의 버튼 ID.

toString() 문자열 표현으로서의 버튼입니다.

버튼 모델에 대한 전체 참조는 Android 및 iOS 설명서를 참조하십시오.

Prerequisites

Before you can use this feature, you’ll need to integrate the Roku Braze SDK. 또한 인앱 메시지는 지원되는 최소 SDK 버전을 실행하는 Roku 디바이스로만 전송됩니다:

Roku: 0.1.2+

메시지 유형

android
swift

important:

버튼 텍스트를 추가하기 전에 클릭 동작이 추가되면 버튼이 포함된 인앱 메시지의 최종 페이로드에 clickAction 메시지가 포함됩니다.

slideup 인앱 메시지 오브젝트는 InAppMessageBase를 확장합니다.

이 메시지 유형은 InAppMessageImmersiveBase을 확장하여 로컬에서 생성된 인앱 메시지에 사용자 지정 기능을 추가할 수 있는 옵션을 제공합니다.

이러한 메시지 인스턴스는 InAppMessageHtml의 인스턴스이며 IInAppMessage 서브클래스를 구현합니다: IInAppMessageHtml.

콘텐츠 캐러셀과 대화형 버튼이 포함된 HTML 인앱 메시지입니다.

important:

현재 iOS 및 Android 플랫폼에서는 iFrame에 커스텀 HTML 인앱 메시지를 표시하는 기능을 지원하지 않습니다.

tip:

앱에 대한 사용자 지정 인앱 메시지 보기를 정의할 수도 있습니다. 전체 안내는 사용자 지정 공장 설정을 참조하세요.

다음은 Braze에서 사용할 수 있는 인앱 메시지 유형과 최종 사용자에게 표시되는 방식입니다.

휴대폰 화면 하단과 상단에 슬라이드업 인앱 메시지가 표시됩니다.

휴대폰 화면 중앙에 표시되는 모달 인앱 메시지.

휴대폰 화면 중앙에 표시되는 모달 이미지 인앱 메시지.

휴대폰 화면 전체에 표시되는 전체 화면 인앱 메시지.

휴대폰 화면 전체에 표시되는 전체 화면 이미지 인앱 메시지.

다음 예는 페이지가 지정된 HTML 전체 인앱 메시지를 보여줍니다:

콘텐츠 캐러셀과 대화형 버튼이 포함된 HTML 인앱 메시지입니다.

현재 iOS 및 Android 플랫폼에서는 iFrame에 커스텀 HTML 인앱 메시지를 표시하는 기능을 지원하지 않습니다.

지능형 선택 및 대조군에 대한 자세한 내용은 지능형 선택을 참조하세요.

인앱 메시지 활성화

1단계: 참관인 추가

인앱 메시지를 처리하려면 BrazeTask.BrazeInAppMessage 에서 옵저버를 추가할 수 있습니다:

m.BrazeTask.observeField("BrazeInAppMessage", "onInAppMessageReceived")

2단계: 트리거된 메시지에 액세스

그런 다음, 핸들러 내에서 캠페인이 트리거하는 최상위 인앱 메시지에 액세스할 수 있습니다.

sub onInAppMessageReceived()
  in_app_message = m.BrazeTask.BrazeInAppMessage
  ...
end sub

메시지 필드

처리

다음은 인앱 메시지를 처리하는 데 필요한 필드 목록입니다:

필드 설명

buttons 버튼 목록(빈 목록일 수 있음).

click_action "URI" 또는 "NONE". 이 필드를 사용하여 인앱 메시지를 클릭할 때 URI 링크로 열 것인지 아니면 메시지를 닫을 것인지 표시합니다. 버튼이 없는 경우, 인앱 메시지가 표시될 때 사용자가 ‘확인’을 클릭하면 이 작업이 수행됩니다.

dismiss_type "AUTO_DISMISS" 또는 "SWIPE". 이 필드를 사용하여 인앱 메시지를 자동으로 해제할지 아니면 밀어서 해제할지 표합니다.

display_delay 인앱 메시지를 표시할 때까지 기다리는 시간(초).

duration dismiss_type이 "AUTO_DISMISS"로 설정된 경우 메시지가 표시되는 기간(밀리초).

extras 키-값 쌍.

header 헤더 텍스트입니다.

id 노출 횟수 또는 클릭을 기록하는 데 사용되는 ID.

image_url 인앱 메시지 이미지 URL.

message 메시지 본문 텍스트.

uri URI 사용자는 click_action에 따라 전송됩니다. 이 필드는 click_action 가 "URI" 일 때 반드시 포함되어야 합니다.

important:

버튼이 포함된 인앱 메시지의 경우 버튼 텍스트를 추가하기 전에 클릭 동작이 추가되면 click_action 메시지도 최종 페이로드에 포함됩니다.

스타일링

대시보드에서 사용할 수 있는 다양한 스타일 필드도 있습니다.

필드 설명

bg_color 배경색.

close_button_color 닫기 버튼 색상.

frame_color 배경 화면 오버레이의 색상입니다.

header_text_color 헤더 텍스트 색상.

message_text_color 메시지 텍스트 색상.

text_align ‘START’, ‘CENTER’ 또는 ‘END’. 선택한 텍스트 정렬.

또는 인앱 메시지를 구현하고 표준 팔레트를 사용하여 Roku 애플리케이션 내에서 스타일을 지정할 수 있습니다:

버튼

필드 설명

click_action "URI" 또는 "NONE". 이 필드를 사용하여 인앱 메시지를 클릭할 때 URI 링크로 열 것인지 아니면 메시지를 닫을 것인지 표시합니다.

id 버튼 자체의 ID 값입니다.

text 버튼에 표시할 텍스트입니다.

uri URI 사용자는 click_action에 따라 전송됩니다. 이 필드는 click_action 가 "URI" 일 때 반드시 포함되어야 합니다.

important:

Keep in mind, you’ll need to implement your own custom UI since in-app messaging is supported via headless UI using the Swift SDK—which does not include any default UI or views for tvOS.

Prerequisites

이 기능을 사용하려면 먼저 Swift Braze SDK를 통합해야 합니다.

Enabling in-app messages

Step 1: Create a new iOS app

In Braze, select Settings > App Settings, then select Add App. Enter a name for your tvOS app, select iOS—not tvOS—then select Add App.

ALT_TEXT.

warning:

If you select the tvOS checkbox, you will not be able to customize in-app messages for tvOS.

Step 2: Get your app’s API key

In your app settings, select your new tvOS app then take note of your app’s API key. You’ll use this key to configure your app in Xcode.

ALT_TEXT

Step 3: Integrate BrazeKit

Use your app’s API key to integrate the Braze Swift SDK into your tvOS project in Xcode. You only need to integrate BrazeKit from the Braze Swift SDK.

Step 4: Create your custom UI

Because Braze doesn’t provide a default UI for in-app messages on tvOS, you’ll need to customize it yourself. For a full walkthrough, see our step-by-step tutorial: Customizing in-app messages for tvOS. For a sample project, see Braze Swift SDK samples.

Prerequisites

이 기능을 사용하려면 먼저 Unity Braze SDK를 통합해야 합니다.

Message types

android
swift