New Courier Inbox: Add a full-featured notification center to your app in minutes
Published: 2023-03-15 17:18:49

Email and SMS are becoming increasingly busy channels. Sometimes, there’s no better way to reach a user than by sending a message to a notification center right inside of your app. However, building an inbox experience like this, from scratch, was a significant engineering effort.

Today, we are announcing a major update to [Courier Inbox](https://www.courier.com/docs/inbox/ "Introduction to Courier Inbox"), a solution for developers to add an in-app notification center to their web application in a matter of minutes.

If you’re using the previous version of Inbox, we’ll cover the upgrade steps later in this post.

> *"With Courier, we added a beautiful inbox and in-app push notifications in a matter of weeks. We used the great looking pre-built component to save even more time. Notifications are not our core competency, so it made complete sense to integrate rather than build out and support our own implementation."*  
__James Pipe__, VP of Product, [DroneDeploy](https://www.dronedeploy.com/)

## What is Inbox?
Courier Inbox is an in-app notification center for web applications (and [mobile inbox coming soon](https://updates.courier.com/board "Courier Product Roadmap")). Inbox acts as a convenient in-app notification feed with a clean interface where users can view notifications in real time  directly inside your web app. It also lets them view their message history of all past notifications that you’ve sent to them.

Using in-app notifications allows you to get users’ attention when they are in the application.  This makes your communication with your users more timely and convenient: instead of interrupting them with an email on their phone when they are busy doing something else, you can use an in-app notification to provide information that is relevant to what your users are trying to do right now. Showing notifications within your web application increases user engagement — and provides a more seamless experience, as you can link users directly to relevant parts of the web app within these notifications.

While many companies are considering building notifications into their web app, not everyone has the time or resources to build a full-fledged notification center. We first implemented Inbox two years ago together with the [web-based pop-up notification](https://www.courier.com/blog/react-toast-inbox-notifications/ "Courier Push, React Toast and Inbox for notifications that don't suck") functionality, and customers loved it exactly because it takes so little time to start using it.

The notifications that customers send via Inbox may include application activity such as discussions, new events, comments, alerts, and reminders, as well as news about feature updates.

Based on customer feedback, we’re excited to announce improvements to the Inbox functionality. Meet the new Inbox.

## Introducing the new Inbox
The new Inbox has all the benefits of the original Inbox: it’s fast to implement via pre-built [Courier JavaScript components](https://github.com/trycourier/courier-react/tree/main/packages/react-inbox "Courier Inbox React components"), it offers an intuitive user experience, the design is customizable to your needs, and it natively integrates with the rest of the Courier platform. On top of that, Inbox includes a number of improvements, in terms of both design and functionality.

On the design side, we took customer feedback on board and simplified how the inbox looks and feels. Specifically, here’s what changed:

1. Visually, the inbox now looks more modern so that it fits better into customer apps.
2. There are no more separate tabs for read and unread messages — this separation into tabs previously led to confusion. Now everything is displayed more clearly in a single feed.
3. Hovering over a message now shows a check mark or cross to mark a message as read or unread, instead of a vertical three-dot menu taking up screen real estate.
4. Unread messages are identified by a colorful logo (vs. gray for unread), and the colors are customizable. A colored dot appears at the top showing how many unread messages there are in the inbox.
5. Hovering over a message makes the background of that message change color if it is clickable. Short messages where all the text can be viewed at a glance are not clickable and don't change color on hover.
![New Courier Inbox UI](//images.ctfassets.net/z7iqk1q8njt4/6BJa4hWUJjED61Kdt0CEAR/965e76e0a0ec92213e7fde2402e68683/Courier_-_Inbox_2.0_-_UI_Screenshot.png)

Notification state is now synchronized between the inbox and other channels. For example, if a notification was sent as in-app and email, reading the email will mark the in-app notification as read.

Another new feature is message expiration. It’s now possible to set a timeline for the message to expire, say 7 days, and after that time the message will be removed from the inbox. This feature can help avoid a mess of older notifications for users that rarely sign into the web app.

The advanced branding options, including applying brand settings (we cover this below) and removing the Courier logo, as well as message retention are available on our Developer and Business tiers.