Creating Message Alert-Style Posts for Social Media, If you’ve spent time on social media, you’ve surely noticed those eye-catching posts where brands highlight quotes by simulating phone notification alerts.
These designs are effective because notification alerts are such a familiar part of our daily digital experience—we instinctively connect with them while scrolling through our feeds. When mixed with other content types, these notification-style posts add a casual, conversational element that can make your brand feel more approachable.
Do you have a message you’d like to showcase this way? Let’s create one for your brand. Thanks to creative template designers, you can replicate this popular look in just minutes. Here are the steps to design a social media post that resembles a text message or reminder notification:
Selecting the Mobile Interface for Your Notification-Style Post
- Choose which mobile operating system interface you want to simulate. Do you want your notification to appear as if it’s from an iPhone, Android, or Windows mobile device? Fortunately, there are various GUI kits available that can reproduce most mobile operating systems:
For this tutorial, I’ll be using the iOS UI Kit created by Jérémy Paul. Make sure you have access to the application that your chosen GUI kit is compatible with. Many of these kits are designed to work with UI design applications like Figma, Adobe XD, or Sketch. In my case, Photoshop actions were the ideal solution.
After downloading the Photoshop action set (.atn) and installing any associated fonts, open Photoshop and create a new 1080x1080px document. Click on the .atn file included in the product’s folder to make it immediately available in your Actions panel.
To access this panel, click on Window > Action and open the “iPhone UI Kit” folder that now appears in the list. Clicking on the left arrow will display multiple user interface elements that you can add to your composition. Select “Alert” and click on the play button to apply the action.
Customizing Your Notification-Style Social Media Post
2. Add your own message
Edit the text fields to incorporate the message you want to share. These actions allow you to easily modify the heading, body, and button text. The iPhone interface uses San Francisco, a system font that you can download using the links provided by the seller.
3. Adapt it to match your brand’s visual identity
If you’ve established a specific visual aesthetic for your brand’s social media presence, you might want to customize the composition’s background and typography.
Finalizing Your Notification-Style Post
In this case, we’ll simply add a background texture and a small logo in the bottom right corner. Another helpful feature in this UI kit is the ability to adjust the darkness of the layer behind the notification. After placing your background image behind the Alert group, you can set a higher or lower opacity for the “Dimmer” layer to control how much of the background shows through.
Since I wanted the background graphic to remain as bright as possible, I set that opacity to 0%. Complete your design by adding a minimal version of your logo, and then it’s ready to share.
Design a cohesive Instagram grid
Get your free grid template Download this kit to quickly export Instagram shots that match your brand’s visual style. PSD and AI files are included, as well as a moodboard to display your brand’s assets.
Try something different!
Once you’ve mastered using your chosen GUI kit, the possibilities are truly endless. Experiment with different interface elements and engage your audience with the types of messages they interact with every day. File transfers, tweets, notes, and SMS conversations are just some of the formats you can use to incorporate your brand messages.
You can even take this concept further by replicating user interface elements from other popular apps like Spotify, Instagram or Facebook. These kits allow you to create authentic-looking notifications creating-message-alert-style-posts-for-social-media that will grab attention in your followers’ feeds.