FloorPlan User Forum

General Category - V.16 and Earlier => V12 - V16 Tips and Tricks => Topic started by: Allan Chesney on March 28, 2012, 11:01:16 AM

Title: Using Magenta to make parts of an image transparent
Post by: Allan Chesney on March 28, 2012, 11:01:16 AM
Magenta is made to become transparent in TFP, so if you add magenta to a photo or texture if will have 'holes' in it wherever the Magenta was used.

To untilise this functionality you need a photo editing program such as, PaintShop Pro, Photoshop or even just the built-in Microsoft Paint. To find Paint on your computer go to Start / All Programs / Accessories and click Paint.

The image below should give you the basics, using Paint as the editor.

1. You would first open the image you want to edit

2. Select 'Edit Colors' and choose the bright Pink making sure the Red, Green, Blue numbers (lower right of colour dialog) are 255, 0 and 255 - if not change them to those numbers and the selected colour will change to Magenta.

3. Use the 'Select tool' to mark the areas you want to make transparent (by changing it to Magenta). Draw a line around the area and then press the Delete key on your keyboard. Now use the 'Paint Pot tool' to fill the area that you cut out of the photo with Magenta.

Anything you paint Magenta will become invisible in TFP.  You can also use the Paint Brush to turn areas to Magenta but make sure you do not use a brush that 'fades' the Magenta. It must be true magenta Red-255, Green-0, Blue-255 or it will have pink edges around the transparent section.

A typical example of how you could use this:

1.  Take a photo of a your pet cat (dog, horse, favourite shrub etc, etc, etc,).

2.  Open the photo in Paint

3.  Use the 'Select tool' to draw carefully around the cat.

4.  Use the 'Invert Selection' option so that instead of the cat being selected it selects everything Except the cat.

5.  Press the Delete key on your keyboard - everything around the cat will be deleted.

6.  Now use the 'Paint Pot' tool to fill the area around the cat with Magenta.

7.  Save this image as a BMP (256 or more colours) - only BMP will give a true magenta over the whole magenta area.

8.  Now in TFP go to Insert / Photoboard.

9.  Click on Animals in the Catalogue

10. Right click select Add Element

11. Go to the Appearance tab.

12. Click on the image (probably Cat1)

13. In the second dialog box click the image again.

14. On the 'Use Texture' line click Select and browse to your own cat image BMP file

15. When it opens you will see the Magenta has become transparent (if there is any pink showing you do not have a true magenta (225, 0, 255) in the pink areas)

16. Untick the 'Tile Vertically' and 'Tile Horizontally' boxes (You don't want your cat repeated everywhere)

17. Tick the 'Padlock' image to 'open' it  (This will allow you to have the image height and width different)

18. Change the 'Tile Height' and T'ile Width' to the real height and width of your cat (eg 1' High, 2' Wide or 300mm High, 600mm Wide) at the angle the cat is stitting in your photo.

19. Keep clicking OK until your are back to the Appearance tab.

20. On the 'Size' tab set choose 'Billboard' - this makes sure your cat faces the camera

21. On the 'Size' tab untick 'Maintain Aspect Ratio' and set the height and width so they are the same as on the previous dailog (the height and width of your cat)

22. Click OK to add your cat to the catalogue.

23. When you insert the image make sure that it is not so close to something that when you move the camera (and the cat swings to face the camera) that some of it is not hidden by a wall or some other object.

Virtually any photo can be used in TFP this way. In the second image below the house is a photo, as is the cat (in the arch at the front) the Palm tree and the hedge (and some of the other plants). All have had the background removed with magenta so they look like part of the scene.

I hope there is enough detail and that it makes sense - ask if anything is not clear.

Have fun

Allan
Title: Re: Using Magenta to make parts of an image transparent
Post by: gelagirl on March 28, 2012, 03:47:01 PM
Thank you for this tutorial... Going to play around with this the next few days...

Btw pin this to the front so we don't have to bump it..
Title: Re: Using Magenta to make parts of an image transparent
Post by: Allan Chesney on March 28, 2012, 07:35:02 PM
We are getting quite a few pinned ones there now but I am hoping to get the Frequently Asked Questions section going soon (time!) so that should make it easily findable if it works its way down.

Allan