Scope Overlay (remixed & updated!)

A Tutorial for Counter-Strike: Source

Yo, buddy. We are one of the oldest mod sites on the Interwebs. Sign up and maximize your browsing experience.

  • Subscribe: Get notified of new submissions like this.
  • Say Thanks: Show your appreciation by sending Defc0n points.
  • Post: Give Defc0n your thoughts on this Tutorial.
  • Vote: Help Defc0n win the Monthly Awards.
  • Rate: Give this Tutorial a rating out of 10.
  • Flag: Alert moderators and warn members of a problem with this Tutorial.
  • Watch: Get notified when this Tutorial is updated.
Mascot

Interested?

Sign up

Already a Bananite? Login

I don't know how to get rid of the default crosshair lines (screenshot 6), if anyone knows then please PM me or post it in here and I will update the tutorial. Welcome to my remixed and updated tutorial on how to make a scope for CS:S! Before you start this, make sure you have the following: - Photoshop 7.0 or higher (I have CS2) - VTF Edit or the Photoshop plugin - An understanding on how to use Photoshop effectively
  • Open Photoshop from the desktop or Start > All Programs.
  • Go to File > New and put in these dimensions: 1280 width, 1024 height, and something around 400 DPI.
  • Use the fill tool and color the first layer black.
  • Right click on the square selection tool, go down and click on the elliptical selection tool and hold shift while dragging it to the desired size for a perfect circle (screenshot 1). For this I used the ruler lines to get it on the exact center - left click on the ruler (top or bottom) and drag into the middle, it should snap into the exact center. Screenshot 1: Free Image Hosting at www.ImageShack.us
  • Fill in the selection we just made with the color of your choice, I chose white for a clear contrast of the two colors for when we add the alpha channel later.
  • Now you have the scope "outline" and you can go into adding your own details to it to make it whatever you want (screenshot 2). Screenshot 2: Free Image Hosting at www.ImageShack.us
  • Once you are done with the details, then above your Layers tab there should be a Channels tab - click on it and you will see 4 premade channels; RGB, Red, Green, Blue. At the bottom, create a new channel and it will be called Alpha 1 (screenshot 3). Be sure to have RGB, Red, Green, and Blue all highlighted then click on the visibility box beside the Alpha layer and a red overlay should appear. Now you can click on just the Alpha layer to edit it (screenshot 4). Screenshot 3: Free Image Hosting at www.ImageShack.us Screenshot 4: Free Image Hosting at www.ImageShack.us
  • Erase the red from the Alpha channel by using the eraser tool. Set the two palette colors back to black and white (press D), now color in the areas that you want to be transparent using the brush - this will show up as red when using the brush (screenshot 5), but make sure you are working on the ACTIVE Alpha channel. Color all the areas red that you want to be TRANSPARENT. You may need to switch back and forth from your Alpha channel and your normal layers... so remember, every time you go back to normal layers, the Alpha layer is deactivated. Screenshot 5: Free Image Hosting at www.ImageShack.us A side note: - 100% opacity on the red in Alpha means 100% transparent. You can change this to make your own custom scope for a fading effect and whatnot.
  • When you are all finished, go to Image > Image Size and change the dimensions to 1024x1024 (Warning: this will appear normal in any non-widescreen size of CS:S but will stretch in widescreen. Mess around with sizes to fix it if you are using widescreen!)
  • Save the file in Photoshop as a .TGA (I use 32 bits per pixel) to keep the Alpha channel with the image and to keep as much detail as possible. Open VTF Edit and import your image (keep all the default settings!). Save it as scope_lens.vtf in: C:\program files\steam\steamapps\yourusername\counter-strike source\cstrike\materials\overlays
  • Start CSS and enjoy (screenshot 6). Screenshot 6: Free Image Hosting at www.ImageShack.us If you liked this tutorial, please subscribe to me or favorite this! If you have any questions or comments, please PM me!

Posts

  • 7y
    RaveNuke avatar
    RaveNuke Offline
    Member Joined 8y
    Posted by Dagon

    Everything is perfect just one thing i don't understand...
    When i play with my scope In Game i got some white lines around my scope.

    Here is a screen :
    http://img684.imageshack.us/img684/8809/mascope.jpg

    Hope you can help me =/


    that's because the scope was made for anothe resolution than your screen.
    Bananite
  • 8y
    Dagon avatar
    Dagon Offline
    Member Joined 8y
    Everything is perfect just one thing i don't understand...
    When i play with my scope In Game i got some white lines around my scope.

    Here is a screen :
    http://img684.imageshack.us/img684/8809/mascope.jpg

    Hope you can help me =/
    ٭ ὼŦЋ &
  • 9y
    Anti-Hero avatar
    Anti-Hero Offline
    Member Joined 11y
    866 points Ranked 5376th
    How can i get rid of the crosshairs? I am trying to make a red dot sight, basically.
    Ageless I remain... avatar
    Mantra
    Ageless I remain...
  • 9y
    Burnfingers avatar
    Burnfingers avatar Offline
    Member Joined 10y
    128,022 points Ranked 21st
    20 medals 2 rare
    • Reached 75,000 Points Medal icon
    • 6 years a member Medal icon
    • Became a Studio Leader Medal icon
    • Reached 1,000 Points Medal icon
    • Reached 2,500 Points Medal icon
    • Reached 7,500 Points Medal icon
    Hey, i got a problem. i made a awsome overlay, but when i load it in CSS the default scope lines appear on it. how do i get rid of those?
    aka [-B-] avatar
    Mantra
    aka [-B-]
  • 9y
    |!L0N3 W0LF!| avatar
    Member Joined 10y
    734 points Ranked 6199th
    A bit of help here please. iv followed the instructions correctly but when it comes to saving the file, MY Photoshop CS2 will not allow me to save it as a .TGA file. any help here would be appreciated. don't worrie i figured it out.
    Noobie All Rounder avatar
    Mantra
    Noobie All Rounder
  • 10y
    indazone avatar
    indazone Offline
    Member Joined 10y
    To get Image Size, you have to go on Image not Edit i think ;)

    10/10

    Meh'D by meh
  • 10y
    Outbreak avatar
    Outbreak Offline
    Member Joined 10y
    Pros: Very informative, helped me make a scope!
    Cons: None
    Improvements: Might want to organize it a bit more, but other than that it's good.
    Notes: Make moar tuts!

    10/10

    Resistance is futile.
  • 10y
    oxo24 avatar
    oxo24 Offline
    Member Joined 11y
    701 points Ranked 6467th
    Hmm, would 1280x1024 make a widescreen scope aswell, or would i need to use 1440 x 900?

    good tut though, a little more HTML wouldnt go a miss though

    EDIT: it should be 1280 width, and 1024 height, not the other way round.
    Mantra
    "Ideas are bulletproof"

Share

Shareable Image:
Share banner
HTML embed code:
BB embed code:
Markdown embed code:

More embeddable images

Bookmark and Share

Credits

Key Authors
defc0n
Unknown

Submitter

Defc0n avatar
Defc0n Offline
Member Joined 11y
6,160 points Ranked 723rd
9 medals 1 rare
  • 6 years a member Medal icon
  • Reached 1,000 Points Medal icon
  • Reached 2,500 Points Medal icon
  • 1 post awarded Exemplary Feedback Medal icon
  • One month a member Medal icon
  • 6 months a member Medal icon

Defc0n
Creator
Sign up to access this!
Sign up to access this!
Sign up to access this!
Sign up to access this!

Category

Details

Difficulty Level
Advanced Difficulty

Attributes

Stats

Posts
10
Views
8,292
Date Added
10y
Date Modified
6y

Scores

90 bScore
10 Rating

2 voters

Sign up to access this!

More from Submitter

WiPs by Submitter

bcp.crwdcntrl.net tracking pixel