Posted by Shane
I have always been interested by flash, yet I never dove into doing it. And of course this this blog design that I have, this design would benefit from a flash header. So this series is going to be two things. Me learning flash, and designing the header. I am going to have bits of code posted on what I figure out while working on the design.
So I have many requirements for my flash header for me to have it. A sample list of these things are below for the header background portion.
- Action Script 3.0
- Header “Background” must at real time change colors based on the time of day of the zip code I provide. Total Dark, Dawn, Sunrise, Daytime (Including High Noon), Sunset, and Dusk are the periods in which I must show.
- The Sun and Moon must “rise” and “set”. With the moon showing the correct phase that it’s currently at based on the zip code I provide.
So far in my adventures today, I read up on gradients and how to automatically create boxes based of hex values I provided the system. This was a great way to start, but I wanted it to change based on the time of day. So I figured I could use the same formula and make it so the blending of the two colors in the scale change proportionately vs. having an background that would have to move over the course of 4 million flash frames – change based on the time of day. I didn’t want to go through creating 4 million frames in flash and then having problems with file size. So there has got to be another way! Eureka! There was!
First thing was first. I have to figure out the hex values I wanted to use. That was simple a matter of using Photoshop (Just so you all know.. all versions of Adobe products I use is CS4) to find all the hex values I have saved for this site.
With these values figured out I knew where I was starting from however creating the gradients was another thing. After many hours of not finding what I needed online to do it myself, I found a programmer who has already done this work, and all I had to do was implement the code. The code is from Flash Den.
After all day working on different options I have got my final result for the header background animation. Preview location here. This is not in the time frame that I will have the real header in. The real header will animate really slow. I have already emailed the author to see how to get it do that. Working on the Sun/Moon Animation will come when I finality get the animation down to a crawl.
So…. 2/3 things done! That’s not bad for a days work! More to come!