Sign in to follow this  
Followers 0
Sarkut

Pictures Side-By-Side / "Before and After" Images

21 posts in this topic

Pictures Side-By-Side / "Before and After" Images

This question comes up in the GD&Q fairly often.

1-

Open your "Before" picture with paint.net.

Before.png

 

In the Status Bar, set the Units to Pixels

 

Status Bar.png

 

The pixel dimensions of the image are shown in the Status Bar (800x600 in the image above). Take note of the image size.

 

Click on the Image menu

 imagemenu[1].png

===================================

2-

Click on Canvas Size

canvassize[1].png

===================================

Be sure that there is no checkmark beside Maintain Aspect Ratio (tip: click the checkmark to toggle it on/off)

Double the Width (example: 800 X 2 = 1600). Type this number in to the Width value box. Note: if you want a border to appear between the two images, add the width of the border to the calculated Width value (example: 800 X 2 + border 40 = 1640)

Select Anchor - Left

Canvas size.png

 

Click OK to accept these parameters.

===================================

3-

Canvasresized.png

 

Import the "After" image, using Layers > Import From File

layersmenu[1].png

 

This will bring the "After" image in as a separate layer above the first (Before) image.

 

The "After" image will be selected and the Move Selected Pixels tool :MoveTool: activated following the import.

===================================

4-

imported After.png 

 

Use the mouse to move the "After" image to the right (click and drag it).

To make fine adjustments, or if you don't have a steady hand, use the keyboard Arrow keys to move the After image.

===================================

5-

moving after.png

 

Once the second image is positioned where you want it, use File > Save As...

Save as whatever file type you want.

 

finished.png


This tutorial shows how to place two images equal in size next to each other.

If the images are of different pixel dimensions,

you may want to resize and/or crop the larger image before starting.

 

Download the PDF version of this tutorial: Pictures Side by Side.pdf

3

Share this post


Link to post
Share on other sites

Brilliant! Thank you Sarkut. This tut will make things much easier when Newbs ask.

BOOKMARKED

0

Share this post


Link to post
Share on other sites

Just an observation... If you open the after file first, anchor right in step 2 and then import the before file, step 4 can be removed from the process.

0

Share this post


Link to post
Share on other sites

Yes, that is clearly the more efficient way of doing things.

This is targeted for beginners.

I don't want to confuse things by telling them to do

the "After" before the "Before", and the "Before" after the "After".

The tutorial as-is introduces the use of the Move Selected Pixels tool.

Your post is a worthy addition.

Edited by Sarkut
0

Share this post


Link to post
Share on other sites

Brilliant stuff dude..I have bookmarked it so that I'll check it when I'll try to place two picture of same size next to each other..!!

Thanks for the tutorial..!! :)

0

Share this post


Link to post
Share on other sites

I will tomorrow print my images in canvas (big panoramas: panoramy 360 ) . I had little problem with resize image.

It's good to see how you working with photos.

btw. sory for my english ;)

0

Share this post


Link to post
Share on other sites

Sarkut, how would I go about making 4 different pics 2 on the top and two on the bottom, side-by-side and connected top and bottom?

Also if I needed to put more than two together either horizontally or vertically, or together as I requested above but with more than two, is there a different procedure?

0

Share this post


Link to post
Share on other sites

It's the same process - repeated.

The easiest way to explain it it to perform the above side-by-side transformation on both the upper images. Repeat that to connect the two lower images.

Finally use the same technique to expand the canvas depth to allow the combined-upper and combined-lower images to be combined.

Try it.

When you get used to the technique you'll probably figure out that the whole process can be done more simply by expanding the canvas once, and importing the other three images one at a time into separate layers. Then the process is using the move tool :MoveTool: to individually position each layer relative to the others.

0

Share this post


Link to post
Share on other sites

How do I expand the canvas? From what you just said, I think I would rather try this way than the beginner way. BTW, I'm able to do this right away. Yesterday I had a family emergency so I wasn't able to get to it until now.

0

Share this post


Link to post
Share on other sites

I love this tut! I am a noob, I just got this installed like 2 days ago. This lesson got me up and running in no time. Thank you!

0

Share this post


Link to post
Share on other sites

Okay, it took a little while but I figured it out. At first I couldn't figure out how to get the pics underneath the first two side-by-side pics. Then the light-bulb went on.

You have to change the canvas height also.

Ego Eram Reputo, when you said "Finally use the same technique to expand the canvas depth to allow the combined-upper and combined-lower images to be combined." I was a little confused and had no idea exactly what that meant. I now assume when you said canvas depth that you were talking about the canvas height. Thanks for you help.

Edited by Dragoneer
0

Share this post


Link to post
Share on other sites

Canvas height or canvas depth as opposed to canvas width, you got the idea!

Glad I was able to help.

0

Share this post


Link to post
Share on other sites

Thanks anyways but I am completely unschooled technologically so I don't even understand the instructions. Way, way too complicated but I appreciate the effort.

0

Share this post


Link to post
Share on other sites

...I don't even understand the instructions. Way, way too complicated...

What problem are you having? If you don't understand what is written, the picture illustrates what is said. How is this difficult? Plus it's only 5 steps.

0

Share this post


Link to post
Share on other sites

Thank you for this.

If I may ask here - I wrote some text in BEFORE picture and then imported the AFTER picture and wrote something in it too.

If I want to modify text in the BEFORE picture later, can I do that and if so - how? For now, it seems to me that I can only edit the picture that I most lately imported.

I use images for mental mapping so I constantly put something on the pictures so I want to be able to put something in my images some time later.

---

Please excuse my ignorance, answer to my question is trivial.

Edited by Ichabod
0

Share this post


Link to post
Share on other sites

Text cannot be edited once it is committed to the canvas. This means that once you're finished with the Text tool :TextTool:, the characters become collections of pixels in the layer.

For this reason we advise placing your text on it's own layer. If the text needs to be replaced it is straightforward to delete the layer contents and retype the text in the same color and font.

You may be having another issue, that of changing the active layer, because editing operations are applied to the active layer. To change the active layer, click on the new layer name in the Layers Window - this clicked layer should receive the editing focus and display a highlight in the Layers Window.

1

Share this post


Link to post
Share on other sites

Hi Dear Paint Administrators and User!  <3

 

I have noticed that and the images are no longer available. It is possible to restore the images? Thank you.

0

Share this post


Link to post
Share on other sites

Your wish is my command Seerose :)

 

1

Share this post


Link to post
Share on other sites
On 16.10.2016 at 3:13 AM, Ego Eram Reputo said:

Your wish is my command Seerose :)

 

 

Oh.. Dear ERR!  <3

 

Thank you so much for the time to host these.  getraenk_098.gif

 

 

0

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0