|
|
| Line 54: |
Line 54: |
| On [http://scummvm.org/screenshots/ screenshots page] you may see the set of nice 'headshots' used for the games. If you are submitting screenshots for a new game, you may help with creating the icon too. | | On [http://scummvm.org/screenshots/ screenshots page] you may see the set of nice 'headshots' used for the games. If you are submitting screenshots for a new game, you may help with creating the icon too. |
|
| |
|
| You will need GIMP 2.8.x for making the icon:
| | '''Don'ts:''' |
| | # Use an image that has been scaled up with a filter |
| | # Avoid scaling down unless absolutely necessary, if you do scale down, always scale proportionally and try both Nearest Neighbor or Lancoze to see what looks better |
| | # Keep shadows. Shadows will be done dynamically in CSS. |
|
| |
|
| # Pick some distinguishable graphics from the game. In most cases, it is head of the main character or image of the main item in the game (such as the hourglass for Ween)
| | '''Dos:''' |
| # Make its background transparent by carefully painting over all unneeded pixels
| | # Start with our icon [https://www.scummvm.org/images/icons/frame.png template] to frame your icon. The image should be centered on the white dot and never flow outside the black rectangle. |
| #* Magnify the image
| | # Be creative |
| #* If the background is not solid-colored, fill it with some color unused in the image. Acid green works well in most cases :)
| | # Pick a distinguishable image from the game or series. Either a sprite of the main character, a portrait, or a recognizable item/icon from the game |
| #* With Select By Color tool select the background
| | # Scale up as needed. Only scale up in 2x increments using Nearest Neighbor to preserve pixel art |
| #* Invert the selection
| | # Have sprites and portraits face to the right |
| #* Add layer mask -> use selection as layer mask
| | # Erase necessary pixels around the object |
| #* Apply the layer mask
| |
| # Downscale image to 44x44 or less. Make sure that you're using bicubic scaling, and that features of the image are still recognizable
| |
| # Open file [https://github.com/scummvm/scummvm-media/raw/master/originals/scummvm_badges.xcf scummvm_badges.xcf] | |
| # Copy the badge and paste it into the new layer
| |
| # Select the layer with the badge | |
| # Run Filters → Light and Shadow → Drop Shadow... | |
| #* Offset X: 0
| |
| #* Offset Y: 2
| |
| #* Blur radius: 2
| |
| #* Color: black
| |
| #* Opacity: 64
| |
| #* Allow resizing: ticked
| |
| # Select the icon with the rectangle selection tool, up to 48x48 area. If the shadow is bigger, you will have to go back to step 3
| |
| # Edit → Copy Visible | |
| # Edit → Paste as → New Image | |
| # Make sure the canvas size is 58x58
| |
| # Save the result as PNG | | # Save the result as PNG |
|
| |
| You're done.
| |
|
| |
| Now consider using optipng, advpng (see the previous section), but that is optional.
| |
|
| |
| Below is the original instructions for Photoshop CS2+ for making the image shadow:
| |
|
| |
| # Open file [https://github.com/scummvm/scummvm-media/raw/master/originals/scummvm_badges.psd scummvm_badges.psd] in Photoshop. You will need at least CS2 version
| |
| # Open your icon in Photoshop
| |
| # Copy/paste icon to scummvm_icons.psd file at some free place
| |
| # Open badges layer group, first badge, right click on it and select 'Copy layer styles'
| |
| # Switch to your pasted layer with game icon
| |
| # Paste layer styles to the game icon layer
| |
| # Select the icon with the selection tool, up to 44x44 area. If the shadow is bigger, you will have to go back to previous stage
| |
| # Click on Edit → 'Copy Merged' menu item
| |
| # File → New... (it will automatically have dimensions of the image in clipboard)
| |
| # Paste the image
| |
| # Save it as PNG
| |
|
| |
|
| == How to submit screenshots == | | == How to submit screenshots == |