Server Driven Banner for Apps

Recently, during one of the sprint meet we felt a need to create a capability that could open any page within the app or open any webpage or just a visual banner that we can use without an app release and this should all should be highly configurable with dynamic image and content and we should be able to change it on the go. We came up with a solution of displaying a banner within the app which will have the given capability and configurable from backend.

Server Driven Cards

Pros

We can control which segment of user to show this card. Segment could be based on location, a/b or a particular interest audience.

We can control at what time to display and where to display this card. Also if we want to open any page or display any message to user. It is in our control.

We can control the background, message and particular app version to display this cards on and moreover we can open any page in the app we need to open.

This gives us high confidence to release anything on the go without an app release. All the information regarding what to open or what should card looks like comes from backend keeping frontend role only to display the card.

Logic Diagram

1. Team decides that we have to land a user to particular place in the app depending upon his searches or his location or maybe we need to convey some information.
2. Backend then makes a configuration in json to send to frontend.
3. FrontEnd makes an api call to fetch this feed card/cards, Result could contain multiple cards, a single card or may be no card at all which have a time field as well to show them like a carousel.
4. All this configuration is then used to inflate the card and move the user to a particular place in the app.

Configuration Screenshot from Backend Panel

Production Snapshot

Feed Card Live in Production

Like to thanks Devansh Sampat who helped in the development of this feature in our app WorkIndia.

Happy Coding