And here it is, the final product.
This time is a neon-only banner, no light-ups. As I said in the previous post, I found really interesting the way shapes are displayed with tubes in this one, so I decided to go in that direction.
Before going to the Photoshop stage, I decided to have a look at some tutorials about making the tubes to try to improve and fix my technique... I realized that most of them made the thing very similar to the way I was already making it... But it was not for nothing, I learned some things about actual tube design that I have applied to this submission.
Well, with all this in mind I tried to use a different and simplier method of making the tubes and I´m going to tell you about it. Like a sort of mini-tut...
- The tubes have been drawn on a vector-based program. Two hints about it: Make the lines thick and set the endings of the lines and the corners to Round (I forgot to make the corners round in the Original Inn, and look at it. I didn´t notice until I uploaded... I got really angry.)
The tubes also have a start and an end to them. So, if you make close shapes like circles or squares, break them with a small gap.
Also, the tubes can be quite long, but they seem to be not very short... Try to get the most of each tube.
- Now for the main part... Import the tube traces to Photoshop. Make sure there´s no background in the same layer of the tubes. Now, with the layer selected, go to Layers>Layer Styles>Bevel and Emboss.
If Inner Bevel doesn´t appear by default, set to it now. In the Shadow box, change the angle to 90º (I use 45 of Height, but try it as you like.) Change the opacity of Highlight and Shadow to 15%.
- It´s time to separate the tubes in different layers according to two criteria: Time and Color. Different color, different layer. If there are tubes of the same color but they turn on/off at a different time, you´ll have to separate them in different layers, but in this case, you can do it after making the on/off states.
- Now we have the tubes ready to turn them on. I you´re going to make animated blinking lights, you´ll have to duplicate the layers of that tubes in order to make the two states of them.If not just go on with the "On" state.
Go to the Layer Styles box (On the Layer tab or clicking twice in a previous Layer Effect on the Layer window) and enter the following settings:
>For the "On" State:
- Inner Glow: White
- Outer Glow: Similar color to the tube. I use the web-safe palette and choose a slightly brighter tone.
- Bevel and Emboss: Don´t change anything.
>For the "Off" State:
- Bevel and Emboss: Change the Shadow Opacity to 75%
- Color Overlay (Under Bevel and Emboss and Satin.): Black color. Opacity set to 55%... I change the Fusion mode to Darken, but I don´t really see much difference from Normal... Just in case.
- Parallel Shadow: If the angle by default is not the same as the one you used in Bevel and Emboss (90%) set it like that.
Well, if you don´t use animations, it´s over... If you do, just go to Imageready and make frames, switching the visibility of the "on/off" layers of the tubes you want to blink... I think 0,5 seconds is allright for a neon blink.
About optimizing... I suggest you to reduce the size of the image. Don´t make too many frames,beware with using tubes of many different colors (they are gradients, so they will use up many colors of your palette. I´ve used 7 this time, so I´m afraid it´ll look like crap.) Try to use 128 colors instead of 256 if you´re still exceeding the filesize, and if all that fails, use the Loss tab in the Optimize window (If you have to set it over 10, i´d suggest you to make major changes in your design or try harder in my other advices...)
Try to get the image as smooth as possible because when uploading, the quality will surely drop if it wasn´t very high.
Well, it´s over... These words are not carved in stone, experiment and make comments if you find something interesting (In last minute I decided to include an extra black layer with the opacity to 35% to darken the board and the tubes.). As my Photoshop is in Spanish, some terms may differ, correct them if you find something. I´m using layer styles only to keep it easy and simple, but I used Gaussian Blur before for making bigger, controlled halos and things like that. I´ve made this to encourage you to use it and post some more pictures here (Although there´s not necessary to use neon in your banners... my latest didn´t have any of them.)
Anyway... Enjoy it!
