Chat Messenger+ — Add a chat messenger page to your Bubble apps

Showcase
1

Incorporate a Chat Messenger into your Bubble apps with just a few steps and clicks. Link → Chat messenger - Component for Bubble Development | Atomic Fusion

Chat messanger+
Chat messanger+1500×800 62.4 KB

I had announced this on my socials, but this is me sharing it here on the forum. I built and uploaded a Chat Messenger page asset on Atomic Fusion (https://atomicfusion.io/). This is a full-page asset with the following key features:

  1. Slack UI Style;
  2. WhatsApp UI Style;
  3. Three (3) Chat backgrounds;
  4. A profile tab; and
  5. It is responsive across Mobile, Tablet and Desktop

There are many ways of building a Chat Messenger into your Bubble apps, and the database structure is key in achieving this. The goal is to ensure that no data is bearing 100+ list items (list of messages). That said, this is how I set up my database:

image
image800×442 38.7 KB

I built this asset in over 30 hrs, so you can just copy and paste it into your Bubble apps in just a few clicks and steps. My Chat Messenger+ asset comes along with a detailed readme and a video tutorial to help you set up.

Enjoy the asset and share your feedback in the comments below. ↓
Link to asset: Chat messenger - Component for Bubble Development | Atomic Fusion
Here is my profile: Christopher Adjei-Frimpong | Twitter | Linktree

4 Likes
2

Looks great and really well put together :clap:

Small UI feedback - It’s good practice to add some form of tooltip on hover for icon only buttons. In particular, the chat buttons at the top (archive, delete, etc).
Often icons can be ambiguous and users will be hesitant to click a button if they don’t know what it does and/or click the wrong button.

1 Like
3

Awesome feedback!
This will improve the UX of the asset. Thanks mate! :blush: