Forum Discussion

ET98's avatar
ET98
Active Member
2 days ago

Swipe to reveal

Hi community, 

I recently saw a "Swipe to reveal" app messaging done by an industry leader using Braze. I'm not 100% sure the function/feature they used to achieve this - since I received it on the app, most likely it's an In-app or a push or a content card. I'm hoping to get some answers/info here.

Basically the message contains 2 images - the first one says "Swipe to reveal the offer". You swipe the screen of your phone with your fingers, the first image is erased off, then you can see the second image that contain info about the offer. You then can tap on the link and are directed to the offer in the app. 

I'm wondering if it's done using the Custom Code type in In-app messaging. 

Really keen to figure this one out since the message was fun and engaging! Looking forward to answers and thank you!

Erika

  • To add to rayelkhoreply, this could be achieved with custom code. Since IAMs can handle HTML, CSS and JS which are the same languages most of the web runs on, if doing a swipe message is possible on a website, there is a very high chance you could do it in an IAM using CSS animations.

    Some CSS example:
    30+ CSS Reveal Animations

  • ET98's avatar
    ET98
    Active Member

    Thank you all so much. I'll give it a go using custom IAM. Will come back if I have more questions. 

    • TedScott's avatar
      TedScott
      Practitioner III

      Check out the repository for some code examples, the survey is an example with two screens.
      https://github.com/braze-inc/in-app-message-templates/tree/master/braze-templates

  • DavidO's avatar
    DavidO
    Strategist II

    To add to rayelkhoreply, this could be achieved with custom code. Since IAMs can handle HTML, CSS and JS which are the same languages most of the web runs on, if doing a swipe message is possible on a website, there is a very high chance you could do it in an IAM using CSS animations.

    Some CSS example:
    30+ CSS Reveal Animations

  • It is a custom HTML that encodes binary data (first image) and allows users to interact with the image. We can also replace the swipe action with a tap-to-reveal feature. The second image is static with buttons to navigate the user to offer page. 

  • rayelkho's avatar
    rayelkho
    Practitioner III

    This could be either one of these 2: 

    - Custom IAM: https://www.braze.com/docs/user_guide/message_building_by_channel/in-app_messages/traditional/customize
    - MultiPage IAM: https://www.braze.com/docs/user_guide/message_building_by_channel/in-app_messages/drag_and_drop/create/#multi-page

     

    Without seeing the functionality, it would be hard to tell you how it can be done but I have worked on something similar and depending on how up to date your Braze SDK is, data and logic required, it is very possible with Braze's In App feature. I do not believe this is a content card function but it could be.