Short introduction into GUI making
& some things you should know
 
If you want to learn "how to make a CSGO GUI" you should know you are working with (SWF) flash files. You will need to use Adobe Flash CS6 to edit the Flash files.

Example of a flash file: background.swf.
You can not edit the SWF files so you need to decompile the flash files.
For decompiling the (SWF/flash files) I recommend you use the "AVCWare SWF Decompiler."
Thanks to spddl.de for this good TIP.
Information:
The decompiled flash files are FLA files.
FLA files are "Scripted Graphics."
The script is called "ActionScript."
There are versions: 1.0, 2.0 and 3.0.
Version 1.0 and 2.0 is what you need.
You don't need to learn ActionScript now.
It is only for experienced users.
And you can open and edit "FLA files" without the knowledge of ActionScript. The only thing you need is Adobe Flash CS6!
 
 

Before you start with GUI making
 
Backup your flash files for Counter-Strike: Global Offensive
Please copy the "flash folder" from:
C:\SteamApps\common\Counter-Strike Global Offensive\csgo\resource\flash
to another location, maybe your desktop.
HF&GL

 
 

____________Lets go for the good stuff!____________
 
1st Step: Install Adobe Flash CS6.

 
 

http://img22.imageshack.us/img22/2831/flash1i.png
 
Install Adobe Flash Master Collection CS6 as a free trial version, you can use it only for 30 days. Otherwise buy the product or re-install Windows every 30 days. :)
 

2nd Step: Install AVCWare SWF Decompiler.
 
 

http://img802.imageshack.us/img802/9413/avcv.png
 
After installation, open AVCWare SWF Decompiler and start decompiling.
Use it carefully, you have just a trial, you can decompile it just 1 time!
Decompile all flash files inside the "flash" folder.
You have backed it up on desktop or wherever you saved it.
Add all the flash files to the AVCWare program and click on the AVC-Ware-Button in the right corner (decompiling should be started).
AVCWare Decompiler has created some files named (.fla) to your chosen path.
*Create a folder called "Flash Decompiled" and put it into your "flash" folder on your desktop or where you saved it.
Duplicate it to have clear base files if something goes wrong with the file you're working with.
TO SKIP STEP 2 DOWNLOAD THIS BUT GO TO (STEP 2).

Read the text (marked with *).
Download CSGO decompiled flash files .
3rd Step: Get a coffee! :D
You know what to do!
4th Step: Use Adobe Flash CS6.
 

http://img22.imageshack.us/img22/2831/flash1i.png
 
Open/start Adobe Flash CS6 (red icon) from the Adobe Masters Collection.
Go to "Open" and open the decompiled flash file (.fla) you want to edit.
You can easily find out whats inside the file before you open the file.
 

http://img829.imageshack.us/img829/5537/list1a.png
 
Example:Background.fla
This is the file with the background of the main menu.
Example:Scoreboard.fla
This is the file from the CSGO original scoreboard.
Example:HudPlayerCountTime
The bar with PlayerAvatars, Roundcounter and Time (top middle position).
This is the first time you do this work and most of the flash files have many layers.
For beginners I would use a file with less layers like the .fla.
Layer-Window looks like this:
http://img5.imageshack.us/img5/1443/list1232.png
Maybe you have found the "Layer-Window(2.Timeline)" if not, proceed to Step 1 and then Step 2 from the screenshot below:
http://img22.imageshack.us/img22/3342/timelinee.png

 

I work with the "Animator Design," you can use it too, after this tutorial you can change it to the layout you want to use.
Every flash file is different from each other so it will take time to find the layers you need for your changes. Nobody can help you at this point you have to find it on your own.
Normally you have to double-click the layers to see what is in there.
There is a small trick, click @ the colored square of the layer you want to preview, and you get a wireframe preview from this layer. Its shown in the same color as your chosen layer has.
 

Example:
http://img51.imageshack.us/img51/2176/markedsquare.png
If you've found your wanted layer, double-click on it, this will open the frames inside of your chosen layer. Now you can edit your frames inside the layer. This is mostly the single components of one layer. You can edit each of them how you want it.
Try it!
You will need some time to figure it out and how to work with the layers.
At the beginning it seems to be complicated but if you want it, you will learn it, right?!
5th Step: Testing/publishing and/or releasing your edited files.
If you have made your changes you have to save your "edited FLA file"
as a working SWF file to test it in-game.
Go here to set your output location and release it.
Use the same path as I've used in this screenshot.
(.......csgo/resource/flash)
http://img585.imageshack.us/img585/1806/einstellungen.png
Some files can crash your game if you make some changes, maybe because of doing something wrong, don't worry about it. Just overwrite the crashing file with the original to reset the file (*READ THE NOTES).
Before you overwrite anything you should backup the file for prevention, anytime! ;)
6th Step: How to add animations.
You can choose from preset animations.
Choose your layer/frame/graphic you want to be animated. (1.0)
Your chosen layer is marked blue on the screen. (1.1)
Go to the animation presets. (2.0)
Choose your animation preset. (2.1)
http://img836.imageshack.us/img836/4578/anim2.png
7th Step: How to edit animations.
The animation lasts from frame 01 - frame 32 (on my screenshot).
That's about how long your animation will be animated (here it will be for 32 frames).
(30fps/sec) makes the animation effect last for ~1 second.
If you choose more frames your animation will last for a longer time.
The blue marked LayerFrames are animated frames.
You can edit your Animation on the screen.
Click on the animated graphic then the animation route appears as a dotted line.
Go to the one or the other end of the animation route to change the route of your animation.
http://img51.imageshack.us/img51/2176/markedsquare.png
You can press play to see your animation in action. ^^
8th Step: How to color text & change fonts.
Double-click your text layer and make the text visible.
Mark the text and go to properties on the right side.
http://img820.imageshack.us/img820/6959/colortext.png
Choose your color and you are done!
9th Step: How to import/export your own graphics.
If you want to import/export your self made graphics go to:
http://img94.imageshack.us/img94/5118/123123123c.png
There you can choose graphics from your computer.
I made my graphics with Adobe Photoshop CS6 and imported them into the library. Search the graphic in the Library and slide the graphic by holding down the left mouse button to the screen.
Don't orget to create a new layer!
---------------------------Notes:---------------------------
Please turn off the auto save option if Adobe asks for it.
The reason is if you make something wrong, your compiled (released) file will crash your game and there's no way to get your previous .FLA back.
Yes, auto save even saves your fails.

 

Please Insert on forum any modifications :) Thank you

GREAT tutorial thank you very much.