By Carl Heaton on

Laura from Web Courses Bangkok is here again this week to show you how to create a very easy Sticky-Post it. You can use on your website, or on your graphics.


Those of you who have never used a post-it in his life…raise up your hand! In this very easy tutorial I will show you how to create a digital sticky note. You can use it everywhere: on you website, on your graphics. So cute!

This is what we’re going to do:

Here is how to make it:

1. Open a new file on Photoshop 400 x 400 px, 72 dpi.

2. Create a new layer in the layers window and named it “Post-it”.

3. Choose the Yellow color from the Swatches window, then select the Rectangle Tool from the tool bar on your left-hand side and drow a rectangle in the Post-it layer.

4. Now click on Edit in the menu bar, then Transform Path > Warp. A grid appears on your shape. Click any one of the black circle and on the squares on the corners, and deform your shape as I’ve done.

5. Right-click on the layer “Post-it” and Duplicate it. Double click on the layer Thumbnail and choose black color.

6. Drag the copied layer below the original Post-it layer, and press Ctrl+T or go to menu Edit > Free Transform to transform this layer. Hold down Ctrl and click and drag the top-left control point right under the Post-it margin. Drag the others control points as shown and click Enter:

7. Reduce the opacity of the copy layer to 40%. Select the Gaussian Blur filter from the Filter menu and set 2,7 pixel Radius.

8. Right-click on the Post-it layer and select Blending Options. Apply the Gradient overlay with the following settings:

  • Opacity: 100% – Normal
  • Gradient: from #f4db42 in location 0% to #ffec69 in location 100%;
  • Style: Linear (Align with Layer – checked)
  • Angle: 72º
  • Scale: 100%

9. The Post-it is done! Now, if you want to add a note, just select the Text Tool and type the text you want. And if you want to make it more realistic, add any background picture.

Weel done!

carl68

About The Author

Carl

He is our senior instructor and originally from Manchester UK. Carl teaches our Web Design and Online Marketing Courses.

Do you have ideas you want to grow?

We run design courses and here in Bangkok that will
bring life to your ideas.

tick

20+ courses taught by industry experts trainers. Learn how to create a website from scratch, a full branding guideline or how to master SEO.

tick

Now you can learn online and all our courses with come with fantastic worksheets, video tutorials and you get as much support as you need.

tick

We are a fully accredited school by the Ministry of Education and soon we will offer a full Education Visa allowing you stay in Thailand.