Making crosshairs in Unity : for N00bs

Total newbie Notes on the bare minimum Unity skills to edit a graphic bundle for EGS crosshairs to make them easier to see.
I am no artist, and no smartie at this tool, so this is my notes written from perspective of someone doing this for the first time. At the end I will upload some free samples.

Why

Because it's hard, what other reason do you need?

I find the crosshair a bit small sometimes, but what, if you are one of the 1 in 12 young boys * who have CVD? I'm not colour blind at all, although this is the aim of my notes. So I'll be sharing how to change one to suit you, and giving a few samples to try out. If you suspect you have CVD, you will want to try do an online test for it, and book a visit to your optician.

Progress

This is not a guide but a tutorial, best used by reading through, then watch the linked video. If you think I got something wrong, please leave a comment below. On youtube tutorial 35 minutes https://youtu.be/l67sClhA52U



Note, screenshots in this guide will showing actual folder layouts might not match yours because I have an SSD and my system drive and layout thus look different, but not that different. I'm sharing these because real shots of real folders are better than words even if the drive letters are different. I find it frustrating when people say copy file A to folder B, because the context gets overlooked. Watch the video if in doubt. So buckle up for a low slow ride with zoomed out shots and all the cinematics that comes with that.

I'm not going to be explaining how scenarios work, please read my other guides for help if you want to understand that in more detail, it's not necessary for this though as I'll be guiding you through the steps needed.

---

Big thanks to @Kassonnade for all the pointers to get me started.



* CVD has many forms, but affects boys 5 times more often than girls, I hope the fairer sex take note and beat the beans out of the boys.

Blank Scenario Start

The goal.

One of the things about Unity and any tool in fact, is to have one goal at a time only. Do not get distracted. If you are joining me, your mission should you choose to accept it is to learn how to create a nicer "aiming reticle" or crosshair in the Empyrion Galactic Survival game. Nothing more, nothing less. I'm assuming you have edited some computer graphics before, if not, I'll be giving a few pointers only.

Tutorials

You are welcome to view and do any online or Unity built in tutorials along the way, but this is not a Unity tutorial, you do not need prior unity experience or to watch any tutorials. I'm going to be doing the minimum number of tutorials myself, so that you don't have to. And sharing all of my newbie gotchas in this posting. I'm starting from zero, which normally means 2 weeks of following tutorials. Most of us don't have that kind of time.

Basics

• I'm going to be boiling the bare steps out from this Eleon thread [empyriononline.com] which is a jumble really about modding blocks, most of which is not relevant. For example you want to install Unity version 2020.1.13, not 2020.1.11 like it says in the guide.
  
• I'm using notes made by @Kassonade and the example crosshairs bundle [empyriononline.com]that they have shared.
  
• An original copy of the 2 files can be found on Github [github.com]in the folder called Crosshairs
  
• Original Steam thread starter forum
  
• 5 minutes : Importing assets https://learn.unity.com/tutorial/importing-assets#5d924009edbc2a130fa213d6 <= you will want to watch this tutorial for clues

Create a blank Scenario

Let's get down to the checking to see how these bundles or assets in Unity work. At this point you need to create a new Empyrion scenario, luckily there is a cool template one here. I'll walk us through this with screenshots though. If you already have a Scenario you want to edit, skip to then next Heading

1. To start, subscribe to @Ravien_ff's workshop scenario . When it finishes downloading you need to find the folder
   <my-steam-folder>/SteamLibrary/steamapps/workshop/content/383120/2122687972.
   
   
   
   
2. You will notice a file called instructions.txt inside there. I'll take you on a graphical tour of the instructions so long if this looks intimidating.
   
3. Copy this numbered folder, and go into your Empyrion - Galactic Survival/Content/Scenarios folder, paste it in there
   
   
   
   
4. Give it a new name, I called mine 'Better Aim Reticle' , and open the folder.
   
5. Make a change to the description.txt file so that you know it's your new scenario
   
6. Open preview.jpg in any graphics editor and write or scribble something obvious on it so we can spot it later.
   
7. Note: resize preview.jpg down to 800x450 now to save yourself pain later. If the file exceeds 1GB, the scenario will not publish to workshop and the error message will merely confuse you.
   
   
   
   
8. Open a new Explorer window and go into the Empyrion main folder again, find Content/RandomPresets, and grab all the .YAML files in there.
   
   
   Copy those files over into our own scenario's RandomPresets folder.
   
9. Start a new game using the scenario and check that it's loading at all.
   
10. Exit the game (you do not need to exit Empyrion)
    
11. Every time we make a change, just load your savegame and check that it still works.

Copy the example file

We need to copy the example Bundle files next

1. Inside your scenario, create a folder called /SharedData/content/Bundles like so and then Unzip the files from https://empyriononline.com/threads/crosshair-configuration.94506/page-3#post-427461 into it.
   
   
   
   
2. Do not publish or upload your scenario yet! (for reasons)
   
3. Load the saved game and check the new aiming reticule is shown. Comment below if it does not so I can fix these instructions for the next person. You could read the instructions.txt file that @ravien_ff left for us in the Template scenario.

Next up we need to Edit/Create/Compile a crosshair graphics bundle and replace this one with our own one.

Installing Tools

Right now I'm low on coffee, so if you like what is happening here, send me encouragement.

in your browser type "unity download", and you will get loads of adverts, or a page that asks confusing subscription questions. Instead go here Download Unity hub[unity3d.com]
and click the button on the right to get unity hub.



Unity is a subscription platform, but we are going to go in as a Student/Learner on the Free tier, so we just need to be careful so that we don't ever have to give credit card details.

When you install, it will ask you to create an account, you can use Google federation, or create a new account using email, I chose to use email. Be sure to use a strong unique password, hackers will sell on and use your password if it's exposed in a data breach.
After a while you get this in you inbox, follow it. You will get to login and complete setting up your profile, at this point there may be pages with loads of T's&C's to skip over.



While that's happening, the installer completes launch the program for the first time, and you get a lego tutorial.

Note: The Web pages will sometimes ask you to "open or launch via a link", that's OK, this lets the website pass your app registration details to the locally installed program.

Updates

Now that you have the 'supported' release version of unity, it's time to update. If you installed the "Hub" tool, then this gets easy. Go to https://unity3d.com/get-unity/download/archive and download version "Unity 2020.1.13", by clicking on "Hub"



Your hub will now look like this if you installed via "Hub".


[/list]

Graphics editors

You need some basic editor then can create transparent (PNG) images. Microsoft paint does not support transparency so you will probably find it easy to learn to use https://www.getpaint.net/download.html, or

• Try Gimp, download it here. https://www.gimp.org/downloads/
  
• The export layer plugin for gimp is super useful too https://github.com/khalim19/gimp-plugin-export-layers
  
• I'm mainly using paint.net https://www.getpaint.net/download.html as a preference mostly, Gimp is overly complex for most editing work. But you may want to set up Gimp anyway as it has special support for textures and so on.
  
• Krita, is an awesome and a very powerful editor https://krita.org/en/download/krita-desktop/

---

We are pretty much done with this bit now.

PNG files Editing

Editing the crosshair:

Editing and the basic editing tools. I'm using paint.net here . The images need to be white and 32x32

• The image must have completely transparent background. Many transparent .pngs you get off the web from random sources will have slightly transparent backgrounds. Be sure to remove the background at regular intervals while editing to be sure you don't end up with blurriness or other effect.
  
• Make image backups, mistakes happen
  
• The best starting images will be 64x64, simply because they are easier to create, I suggest you start with a 64x64 set and then change to 32x32 size later.
  
• to resize your image in paint.net and NOT have the resized image Anti-Aliased, choose the bicubic resize method. (Actually just turn off anti-aliasing everywhere you see it as an option when working with per-pixel art like this.)
  
  
  
  
• Draw your crosshair in black, the game inverts your graphics at runtime, so that means we need to save it in white.
  
• All white pixels in the crosshair will become black - for the in-range crosshair, the black turns red. Basically your white pixels will be red when close enough to shoot.
  
• All black pixels will become, you guessed it white. Add black pixels to a crosshair to make it stand out a bit more
  
• Make all lines 2 pixels wide as often as possible, for a large 64x64 image, you can even go for 3 pixel wide lines.
  
• I don't think anything is stopping you from using 20x20 or 40x40 for example as an image size.
  
• Save your image as PNG. And close the image file now.
  
• Once we import the image into Unity, remember you either need to update the file in the Unity project directory each time you make graphic changes, or just edit the copy in the Unity project directly.
  
  
  
  
• To make life easy if you want something to compare with, here are the images from the Valentines day Tutorial recording.
  
  

Unity 101

Download Example Project

According to the Instructions thread you need to

1. Download the example project from https://1drv.ms/u/s%21Aor_hm7kE_BvjvU4wIDghBDb-tms5Q?e=IjF9TU and use the password eleon-ca .
   
2. Next we then unzip this into our MyDocuments folder or any other convenient spot. (Make sure that you saved to the same drive letter that you installed Unity onto when you installed Unity.)
   
   
3. Open Unity Hub, choose Add project.
   
4. Browse to the location in step 2 and you should eventually see this
   
   
   
   
5. 
   If you get this error, try changing to install Unity on your C: drive not the D: drive. I had to edit my windows default setting in registry HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\ProgramFilesDir Microsoft do not support changing this setting, so beware!! Editing the registry can brick your O/S.
   
   
6. Under Assets, create a folder called 'Crosshairs' (Spelling is not really important here)
   
7. inside there create another folder called 'Example' (or give it a better name), this is where we are going to drag and drop our 4 graphics files. So jump to the editing chapter and create these now if you have not already done so. If you want to get going quickly here is an example set of files. https://github.com/zaphodikus/game_trainers/tree/main/Crosshairs
   There are 4 files here:
   default.png = the normal crosshair
   default_aiming.png = The aim down sights right-click crosshair
   default_focus.png = the use/open icon for containers, cockpits and doors etc
   default_ship.png = actually unused, but you have to have this file or else nothing works
   
   
8. For some reason unity will replace the "d" in one of the files you drag in with an "_" underscore I don't know why it does this, so tap on it, press F2 and rename it.
   
9. If you cannot see the properties panel on the right for each graphic, try to press ALT+P
   
10. If you cannot see the properties panel on the right for each graphic, try press the play buttoin in the menu twice.. or close Unity and start it again (it will autosave)
    
11. Next we have to assign each file to a bundle, tap the 1st file, and then type in the bundle output path under properties like so Example/crosshairs
    
12. The bit after the / slash must say crosshairs, it will reduce pain later to type that bit in exactly as shown
    
13. Either group select or individually select the remaining images, and use the bundle menu to set their bundle names to that same bundle path.
    
    
    
    
14. Finally we hit the build button
    
15. Result files are here now, these 2 files must get copied into your scenario we created or found earlier the /SharedData/Content/Bundles folder.
    
16. copy the 2 files into there now
    
    

Publish and finishing off

Now that you can load your game and test the crosshairs, if they look great, go ahead and publish the scenario to the workshop. If not, lets get to step 2 Editing the crosshair

1. Before publishing the scenario make sure you have not got any open files or Explorer Windows in the scenario sub-folder open, the publish will fail if you do!
   
2. Publishing will fail if your preview.jpeg file is too big > 1GB
   
3. After publishing the folder will get renamed with 2 underscores and a number added to it. That number is the workshop item id.

Updating the game files.

Note: You have to always update the PNG images in the Unity project folders, Unity keeps it's own copy of the images, you need to edit those copies, not the source images you dragged into Unity, Unity does not know about those files.
Clever people may want to symlink the files at this point. I'd advise against that.

Secrets

A few things I have noticed.

• My display is 1920x1080, and the game resizes a 64x64 crosshair to 62x62 for me.
  
  
• The 'in range' cursor effect is always shaded red (0,0,255) using a HSV V value *2.25 (0=black 100=white) so that darker "values" get almost no RED added, but lighter values (HSV =100) get 255 R channel added
  
  
  
  Not in range on left, in range on right. Regardless of their colour, ligher pixels get red added, which is not always that helpful.
  
  
• See for example what is done when the original cursor was drawn with various colours
  
  
  
  It's more of a dirty mess to me, which is a pity. But I'm guessing that a very simple filter to convert V to an R value is being used, keeping things simpler.
  
  
• The action/open default_focus.png icon is always rendered in Yellow.
  
  
• 32x32 is a preferred crosshair size for most people.
  
  
• 2 pixel wide artwork often works better than 1 pixel wide

---

Examples

If you have been following until now, I will have showed you how to copy these files into an existing Empyrion Galactic Scenario.

Kassonade Example

Example bundle as shared by Kassonade on the official forums [empyriononline.com]

Valentines Scenario

https://steamcommunity.com/sharedfiles/filedetails/?id=2395390036

Better Aim Reticle

A workshop that shows off all of the crosshairs I have created. Subscribe and then copy the crosshair file (and the .manifest) you prefer, into your fave game scenario
https://steamcommunity.com/sharedfiles/filedetails/?id=2396973341

Eden Project

Ravien_ff has started and added some of the crosshair files into the Eden scenario, which is even easier to just view and change since they are in there with a README.txt file I believe
https://steamcommunity.com/sharedfiles/filedetails/?id=2154284616

Sprite sheets

You will need to invert the colour of these sheets to use them. (Remember the 4th icon here is arbitrary as it is not used.)

---

Links

A few prominent links perhaps not highlighted elsewhere.
Vote on best crosshairs steam poll : includes more previews (closed now) https://steamcommunity.com/app/383120/discussions/0/5750503966477729422/
Sprite sheets created using https://draeton.github.io/stitches/

Video Tutorial 35 minutes : https://youtu.be/l67sClhA52U

[zaphodikus]

No they are not bad @goose - I just wish it was easier to install mods in the platform, then people could see the difference quickly and then decide to go or not. The basic reason and I'm repeating myself here, is that these are an experiment to help the huge number of folk with a CVD (Colour Vision Deficiency) issue, there is more about this in the posting.

[Goose]

thank you but, the crosshairs arent that bad, are they?

[Tsnonak]

good stuff... muchos Gracias for your time and effort!

[zaphodikus]

I'm still hacking at making a new set of cursors thanks to some help from community members, but I'm playing a lot of Fallout4 now as a way to chill out, this game has kinda munched up my life. If you like what I have made, do send me some upvotes and some points, I love handing out points too. I'm still experimenting with crosshairs, so this will not be the last update, the files themselves need a cleanup, but I'm in the process of pushing things into github where I might post some of the original image files so people can grab them.

[zaphodikus]

Guide updated with some 'secrets' and a few example sprite sheets.

[zaphodikus]

Humblest apologies for the small gaps in here, I tried to make a video tutorial of the steps, but in reality they take 30 minutes in total. Which might seem like a lot, but is not that hard. Lost a lot of gaming time to the video which is just too long. I also type painfully slowly, so still need to add lots of the screenshots, glad this effort is making the game more fun for people.

Spoiler alert, I'm looking at a Fallout themed set as well now, lots of experimenting still needed.

[ravien_ff]

Excellent guide!

[zaphodikus]

To vote on the first set of crosshairs you would like to see in a subscribeable scenario click on https://steamcommunity.com/app/383120/discussions/0/5750503966477729422/