Want to get Access to 800+ Premium Stream Elements?
Setup your whole Design of your live streaming + Custom Emote & Avatar Maker

How to Create Bold Stream Alerts Design within 5 minutes in 2022

How to Design Simple & Bold Stream Alerts Design in 2022
How to Design Simple & Bold Stream Alerts Design in 2022

Stream alerts are an important part to make your stream more engaging, but they don’t have to be boring. Creating stream alerts does not have to be a daunting task. With a few simple steps, you can create bold and eye-catching Twitch Stream Alerts in minutes.

In this article, I will walk you through the process of creating stream alerts, just like I have shared previously, how to make stream screens, animated discord server icon, twitch panels, facecam overlay and more.

🔥Watch the Video Tutorial of this Twitch panel Design

If you don’t want to read the article, you can watch the video as well.

Getting started with the Stream Alert Design

To get started with stream alerts design you will need Photoshop. If you dont have photoshop you can use Photopea. Photopea is absolutely free to use photoshop alternative.

In the Photshop, Create a new composition. You can set the dimension as your wish because we will be cropping it later in the video. To create a new composition, Click Create New button in the Phtoshop homepage. From there you can set your own dimensions.

To see how the stream alert will look in the real stream, I will be adding a gameplay scene. I am using a scene from valorant but you can choose any game you want. I will make it darker so it doesn’t distract. Select the image layer and press Control + L and then decrese the ligtness slider. Alternatively you can add a color overlay as well.

Download the required assets for designing the Stream Alert Design

===> Color Codes <===

Pastel Green Color: #1df8c7

Dark Purple: #6c41f6

Yellow: #ffd90d

Soft Blue: #4214d4

—-> Font Main: Click here

Creating the Base Shape for the Stream Alert

Select the rectangle tool and draw a shape. Keep the height small and disable the stroke color. We will only use the fill color. As this will be a bright and bold design, I will use a bright pastel green, soft purple color.

Give the newly created a shape Pastel green color. You can copy the color codes and other assets from below. I have created a dedicated section in the post, to grab all the assets at once.

Create another duplicate of the shape by pressing Control + J. Please give this a color and keep it slightly off the bottom layer. It will reveal the bottom color rectangle at a unique angle. Because stream alerts basically looks like this.

Now, grab the pen tool and draw a box like this. It will be the place where we will be placing our Stream Alerts Text.

ADD another rectangle shape to place the icon. If you press “A” on your keyboard, it will enable the direct selection tool. You can also get this by right-clicking the cursor icon. When you click any corner anchor point, you can freely move that part. I will be giving this shape an angular look, so it matches the text box as well. We will also keep the icon box slightly upper than the text box.

Adding the Color to the Stream Alert Design

It’s time to add some color. Double click the text box layer, and add a gradient fill. Add the same color to both ends. But make the end color a slightly darker tone, so it gives a smooth gradient. In the end, you can add a thin stroke. Make sure you choose the lightest tone of the actual color. Or go with pure white color.

Do the same thing for the icon box as well. Double click the icon box and it will reveal the layer style options. From there choose gradient overlay.

Add text to the Stream Alert

Its time to name your alerts. So people can see why the alerts ius showing. I mean, when someone SUbscribes, Donates, Cheers it will show the diffrent alerts. Having the Alerts name is very crucial.

To add the text to your alert, Select the text tool, and write your alert name. I am using a free font from google. You can use any other font as your likings that matches your branding. Then resize the text and give the text a nice Dark color. Avoid using complete black color, rather use a softer tone of the black color.

To spice up the Twitch Stream alert design, I will make the text box floating.

I will add a subtle drop shadow to the text box, so it gets a depth in the overall design. Don’t add a harsh shadow, use a very subtle drop shadow, with a darker tone of your main color.

Alert Icons for diffrent Stream Actions

Import your icon. Press Control plus T, to enable the transform tool. Resize the icon. Now, again double click the icon and add a Gradient Overlay. Also, add a thin stroke as well.

Once done, create 2 duplicates of the icon. Hold ALT and drag the icon. It will make the duplicate icon. Now, decrease the opacity gradually, for the duplicated icons.

It will give the icon an echo effect. Overall the stream alerts will look more professional.

Add Noise effect, to make the alert design for trendy

Let’s wrap the design with some additional effects. Select the base layer, and go to Filter. Then choose Add noise. Give a small amount of 3.44%. Choose gaussian as distribution. And At last check the Monochromatic option.

Create a new layer on top of the base. Then press  to enable the brush tool. Then right-click the screen and make the brush size smaller. Choose a white color.

Right-click the new layer, and choose clipping mask. Now draw some highlights. Make sure you have set the blend mode to “Soft Light.”

Doing this will give the simple base a trendy look.

Additional designs to make the Stream alert design more pop

Alternatively, you can add some random designs to the stream alerts design. I am using the Polygonal lasso tool, to draw the thunder icons. You can also use the Pen tool to do the same things.

To make it glow, I am adding both Inner and outer glow. So, it looks like thunder. I mean kind of.

Now, press “C” to enable the crop tool. Then draw the area the alert is covering. You can make further adjustments as well by dragging the line pointers.

At last, hide the background and move to the exporting option.

Exporting the Stream Alert in the correct way.

Once you are happy with your stream alerts design. It’s time to export you stream alert design, so you can use them in your live steram. It’s a very simple task to do.

First of all, make sure you have hidden the background layer. You can press the eye icon, to hide the layer. Then please follow the steps, to export the stream alerts in the best way.

  1. Go to file from the top left menu
  2. Select Export
  3. Under Export options > Choose Save for Web
  4. In the popup, Choose PNG 24, rom the dropdown
  5. Make sure the transparency option is checked. It will make the Alert transparent.
  6. At last Hit Save.

Now, you can go to your destination folder to see the stream alerts.

Final Verdict

Ther you go. We have successfully created a simple yet bold-looking, Static Stream Alert design. In conclusion, stream alerts in 2022 can be designed simply by following the steps mentioned in this article. By doing so, you can ensure that your viewers remain informed and up-to-date on the latest news and events.

Remember to keep your audience in mind when creating your alerts, and make sure that the design is clear and concise.

FAQ on “How to design bold & simple Stream Alert in 2022“

What is a stream alert?

Stream alert is a graphics elements that pops when a viewer to certain actions. If a viewrt Subscribe or like your stream, the alert will automatically trigger to your live stream with the name of that viewer.

What is the best way to design a live stream alert design?

There are many ways to design an alert, but some designs are more effective than others. One common mistake is using too much text. When designing an alert, it’s important to keep in mind that viewers will be watching the stream while also trying to read the alert. This can be difficult and can lead to alerts that are hard to read or understand.

Which type of live stream alert design should I use?

You can use both Static or Animated Alerts. But to make it consistent I suggest to use only one type of stream alerts. If tyou PC and Internet can hadnle Animated alerts, then it will be the best to choose.
But if your PC cant handle animation while streaming then Satic will be the choice to go.

What are the benefits of live stream alert?

It helps your vieweres to stay enagged with you stream and encourages them perform the actions.

How long should my live stream alert design be?

There is no idle time for this. But the shorter it is the better. I usually use 5-7 seconds for every Stream Alerts.

Disclosure: This post may contain affiliate links. This means when you purchase via our link we will get a small commission but no extra cost to you. This helps us to maintain our bills.

💜 Share your love
Farhan Mubin
Farhan Mubin

Farhan Mubin is sharing design, WordPress website, youtube, & Entrepreneurship-related content here at Enstant Man. Besides writing content here, he is also a YouTuber and the Founder of 11hrs Creator.

Articles: 14

Leave a Reply

Your email address will not be published.