Sunday, August 19, 2012

Football Manager Screenshots Tutorial

http://www.fmscout.com/a-football-manager-screenshots-tutorial.html


Football Manager Screenshots Tutorial

How to capture a screenshot, how to optimize it for web use, where to upload it and how to embed in the forums

By  | Updated on 2011-07-28 00:37 | 12963 views
Football Manager Screenshots TutorialScreenshots of players and club rosters, scout reports, inbox messages... screens from the game we all like to take a picture from, either to show them off to our Football Manager friends or for personal reference.
I'm sure most of you should already know how to take a screenshot from FM, but there's a problem with the pictures generated from the game; they are really big, size wise.

Ways to capture a screenshot


For Windows

You can use the Alt + F9 key combo to have a screenshot taken from the current FM screen.
Once you use this once, the screenshots folder should be generated including all screenshots created using this method. You can find it at 'My Documents/Sports Interactive/Football Manager 2011/screenshots/'
I think the combo for some laptops could be Fn + Alt + F9.

You can also use print screen, in case you want to paste the captured image into a graphics editing program in order to save as JPG from there and/or if you wish to crop part of the captured image instead of saving it all.
Pressing Prt Sc will capture the entire screen (good when playing FM at full screen), while pressing the Alt + Prt Sc will capture the currently selected window (good when playing FM in windowed mode).

You can the paste (Edit > Paste, from the menu or press Ctrl + V) the captured image into Paint for example. If the image is larger then the default bitmap size, you will be asked if you want the bitmap enlarged. Answer "Yes". Then you can save the picture by selecting File > Save As, from the menu or press Ctrl + S. A popup window will appear where you need to select the folder you want to be saved at, input a filename (it's recommended to use latin characters) and choose image type (JPG is the recommended type), before hitting the 'Save' button.

For Mac

You can press Shift + Cmd +4, then press the space bar once. You will see the mouse cursor change to a camera, and you can use the camera to select which application window to screen capture. Once done, the picture should appear on your desktop. This is good when playing FM in windowed mode.
When playing FM at full screen, press Shift + Cmd + 3 and then click on the screen once. Again, picture should be stored on your desktop.

The problem with size


All screenshots generated from the game are plain ridiculous, to be fair. The developers have to realize that taking screenshots serves online sharing of them. Generating those bloody PNG that on certain skins can be close to 1.5Mb, it gets irritating for both the uploaders and the readers due to long waiting times loading unnecessary data.
This is no different for Mac either, as the default image format for any screenshot generated is also PNG.

Image format comparison: PNG vs JPG and the web


In a nutshell, PNG means better image quality and JPG means lower file size. The difference to the eye will be minimal and almost impossible to distinguish when you use high quality JPG.
For me JPG are for photographs and realistic images, PNG are for line art, text-based images, and images with few colors.

When it comes to saving pictures for the web, they should be optimized for that reason. And especially for FM screenshots, I see no point in PNG. So, how to turn those PNG into JPG before uploading them online? We'll dive into this next...

Changing images from PNG to JPG


For Windows

Browse to the folder you have the generated screenshots (My Documents/Sports Interactive/Football Manager 2011/screenshots/) and from the top menu, go to Tools > Folder Options > View (tab). Uncheck the option 'Hide extensions for known file types'.
If you can see a top menu, press Alt once and you should see it.

Now you will need to rename the extension for your screenshots from .png to .jpg - once done, you will need to download and install a Windows PowerToy called 'image resizer'.
Download Image Resizer for Win XP
Download Image Resizer for Windows Vista/7

OPTIMIZING SCREENSHOTS WITH IMAGE RESIZER

Once you've installed Image Resizer and renamed your screenshots from .png to .jpg you are ready to optimize them.
Check out the pictures below that showcase how image resizer works.

  

Choose what best fits your fancy, and then hit OK.
Keep in mind you can do that for multiple images, so select as many images you want and use 'Resize Pictures' from the context menu that pops up on right-click (on any selected image).

For Mac

All you need to do is change the default format of screenshots Mac generate. But it's not recommended because you may want PNG for taking screenshots in general.
In earlier versions of Mac OS X, open up a Terminal and type:
defaults write NSGlobalDomain AppleScreenShotFormat JPEG
In Mac OS X 10.6 o newer, type:
defaults write com.apple.screencapture type jpg
Now you need to type killall SystemUIServer for changes to take effect. You won't receive any confirmation but it does work.

If you don't want to change that, you can always open the PNG screenshots in some image editing app and save it as JPG.

Where to upload your screenshots


Right! So you have your screenshots optimized now and ready to share with the world.
You could upload them on your fmscout member account, but this account has a small limit in Kb that you would easily exceed after a few screenshots, so what can you do? You can upload them to a free image hosting site of your choice, and this is the recommended option too.

WHICH FREE IMAGE HOSTING SITE TO CHOOSE

Most people use Imageshack or imgur. You can upload as a guest, but it's recommended to sign up for a free account in order to be able and manage your uploads.

How to use Imageshack to upload your screenshots.


  

On 'Media Upload' tab, Hit the 'Browse' button and select your screenshots on the popup window, then hit 'Open'.
At the 'Image Resize' option, select either 'Do not resize' or 'Optimize without resize'.
Hit 'Upload Now'.
Wait a bit and then you'll see your uploaded screenshots in thumbnail mode. If you selected only one screenshot, click on 'My Images' tab to find all of your uploaded images.

How to embed a screenshot in the FMScout forums


While you are at the 'My Images' tab on Imageshack, you can see all of your uploaded images sorted by date of upload.
Each image thumbnail has some little icons next to it.
Hit the first one, the 'i' icon. A popup/modal window will appear.
Click once on the text field next to the 'Direct' label, which is the URL path to the full size screenshot. Copy it by hitting Ctrl + C or right-click > Copy.

Now go to your forum post text area and click on the picture icon button (8th button from the left). A popup window will show up, paste your screenshot's URL path there and hit OK. You will see the code appearing where you had left your mouse cursor on the text area. It should be like this:
[img]http://blablahblah/somepic.jpg[/img]
This will output the full size picture directly on your forum post, and this code should actually work in most forums (not just ours).



But there is a better and more efficient way to output screenshots that will make your posts load faster. The trick is touse thumbnails that will open the full size version on demand (click). How to do it? Easy.
Imageshack image paths are like this:
Full size ->
http://blablahblah/somepic.jpg
Thumbnail size ->
http://blablahblah/somepic.th.jpg
You can spot the difference, right? It's an added '.th' before the file extension.

So how does this thumbnail to full size thing works on FMScout posts?
The code for that works like this:
Full size ->
[img]http://blablahblah/somepic.jpg[/img]
Thumbnail to Full size ->
[img=http://blablahblah/somepic.jpg]http://blablahblah/somepic.th.jpg[/img]
Please study the code to understand it.

Tutorial Updates

I'll try to list the readers' suggestions for this tutorial here.

"To create screenshots you can also use Gadwin PrintScreen (freeware utility), is possible to configure to capture the entire screen, current windows or client window, select the type of image, quality and size. The program starts at Windows start up and you just push the print screen key and automatically a window is open with the image and you press continue output to save it."
~ by Nelson Costa Inácio

Conclusion


We reached the end of the screenshots tutorial. I hope you are now ready to capture, optimize, upload and embed your Football Manager screenshots on FMScout.
If you spot any mistakes or think there's something I've missed, please use the comments below to let me know and I will update the tutorial accordingly.

Have fun screenshoting :)