Hello all! I recently downloaded GIMP, so from now on, I’ll be using mainly that program to create my edits. Before I switch mediums, however, I want to offer you a tutorial on Pixlr for this assignment from the Design vault for ds106! I was very happy with how my own experience with this app and assignment turned out.

Pixlr is a fun web app–meaning you don’t have to download anything to your hard drive–that does all of the same things as Photoshop or GIMP minus one or two program-exclusive-features such as Content Archive. The developer for Pixlr also wrote two more web apps to create edits similar to Instagram with filters or text, but for this tutorial, we’ll be working with their arguably most advanced photo editor, which is linked earlier in this paragraph.

Let’s begin!

 

1) Open the Pixlr photo editing app. It should load automatically on your browser without you having to download anything and look like this:

 

2) Click “Create a new image.” For my typography poster, I chose the size 382×461. You can either type in the exact numerical width and height you want or move the slider on the size scale. Also, name the image something memorable–not just “pic1,” for example.

 

3) From here, you can start to create your background. I chose to add a blue-green, linear gradient for my backdrop.

• 3a) IF YOU WANT A GRADIENT BACKDROP LIKE MINE: click gradient tool/blue square in toolbar > choose color and gradient type > start clicking and dragging around your image to experiment with how you want your gradient placed. I made my gradient go from the top of the page to the bottom by clicking at the top and dragging my cursor downward.

 

 

• 3b) You can also have fun with shapes, tons of colors, brushes, stamps, etc! Explore the toolbar and find out what each icon does. You can always create a new image or undo a step (CTRL or COMMAND on Mac + Z) if you don’t like the result.

MY RESULT:

4) Now, add a new layer. In the layer box on the right, click the tiny post-it/notepad in the lower right-hand-corner. Name your new layer something memorable instead of just Layer 1, 2, etc.

5) Next, I added some brushes. Select the paintbrush icon in the toolbar. From there, you can choose what kind of brushes you’d like by clicking Brushes > MORE. I chose Splatter and Fire and smoke. You can also choose the size of the brush; I don’t think I went over size 200-300.

• 5a) Once you choose your brush type, choose a color (I went with a violet) and have fun with the brushes; place them where you’d like for your desired effect.

 

6) After you’re happy with you background, save the image. It will automatically save as a .jpeg, which is great for the web. You can upgrade the image quality from 80 to 100 if you prefer.

 

7) Since, for some reason, Pixlr wouldn’t let me add text in the web app (this is apparently an issue with some browsers), I inserted my image into PowerPoint to quickly add text. If Pixlr text DOES work for you, go ahead and keep using the app, but if not, read on!

8) First, I dragged the file from the folder and dropped it into a white, basic PowerPoint template. Then, I added a text box. Adjust according to the size of the text/lyric.

• 8a) I chose a font I liked and played around with different sizes. I decided to go with a dark purple color to echo the color of the brushes.

9) Now, after I wrote out the lyrics, I began to mess with the typography–more specifically, leading, or the space between lines of text. I first played with line spacing and decided on 2.0-2.5 line spacing for the first part of the lyric.

10) I justified the text to the center.

11) Finally, I altered the spacing between characters or altered the tracking of the text.

12) Once I was satisfied with the look of the piece, I screen capped the image (COMMAND + SHIFT + 4 on a Mac and PrintScrnSave on a PC), which saved it as a .png—a nice web format. I titled it then uploaded it to my blog.

 

That’s it! Hope this helped, and let your creativity run wild!