Log
View Options
Disengaged Reality - Time Lapse
5/28/11
HTML5 Canvas Drawing
5/20/11
It's an Indian, it's a wolf? It was made with my latest Javascript class. I have been doing more experiments with the HTML5 canvas object. This time I have made a pretty fun drawing class. It's very basic and only offers the ability to change color, size, and brush. However a start it is!
There is still much tweeking needed to make drawing smooth. Look for updates like an actual outline as to your brush area and better brush spread. Right now drawing is based off of the mouseMove javascript event. I plan on changing this to a rapid setInterval event that should allow for a nicer flow of the brush head.
This does not work in IE and you may experiance problems in Safari, so you might want to try it in
AnimatedImg - Javascript Class
4/20/11
Some time ago I had an urge to create an animated set of .png images. Well, in the fun of experimentation I went a little over board and made a full javascript class that not only animates several different types of image files, but also offers a nice set of play control methods and event listeners!
Ok, lets go over a little of how it works, shall we? First lets create a simple animation of a ball bouncing using. There are only three basics things we need here. One, an array of image files. Two make sure my animatedImg class is included. Three, make a call to the passing in the array, so this;
Snipt.net is dead - replace code sample from: "http://snipt.net/embed/43547100f4e6b5dc03399183e335d5c2"
Makes this
Animation Type
Notice how ball one appears to be only playing half of the animation while ball two bounces smoothly up and down. The set of images we have passed to our AnimatedImg object is in fact only half a ball bounce. When creating an AnimatedImg you can dictate how it plays from the start. there are 7 types, and they are referenced through a 0 index array. The values are; 0 = "stopped", 1 = "playOnce", 2 = "repeat", 3 = "playBackwardOnce", 4 = "playBackwardRepeat", 5 = "forwardBackwardOnce", 6 = "forwardBackwardRepeat".
Methods and Events
Now for the exciting stuff adding interaction to your AnimatedImg. For this example I dug up an old favorite, Chance the original character from my old Skate-er-Guy game. Click on him and he'll do a hard flip for you. Click on him again and he'll reverse his play direction! Anyways, here is the code used to make the skater interaction.
There is some slight buggyness with mouse based events I'm trying to work out. Currently, the mouse events stand a chance of not registering from what I believe is the click happening as the image is changing frames, thus the AnimatedImg has no clickable area for that brief instance.
Well I'm not into super gigantic posts so I'll cut to the chase, if you would like to use this class for a personal project or to just play with feel free to DOWNLOAD THE EXAMPLE PACKAGE.
CyberMonkeyDev.com
3/19/11
After a little work and planning I have offically registered my own business and I have also gotten the website for it up and running. As of March 14th, 2011 CyberMonkeyDev.com is up live!
The site is all my design and programming however for the monkey mascot type character I turned to the expertice of one
Steven Burnett-Wynn
, who turned this,
into this,
If you didn't know Steven is also the same guy who illustrated about 80% of the childrens games in my games section. He is good at what he does and great to work with. I can always rely on him to give life to my concepts.
Now it's to get a phone number for the company and business cards. I also need to seek guidance in marketing. Right now I have a marketing/sales consultant who works on commission. This is good, but only a temporary plan.
Charlotte, Photography, and Penguins
3/13/11
So as mentioned previously I have moved to Charlotte NC, and in case I haven't mentioned before I started my own company called Cyber Monkey Development, but more on that later. Right before I moved to Charlotte a nice lady in my pottery lab, named Ginger, gave me an old Pentex ME Super manual camera. Now that I finally have a manual camera again I can take real pictures, capture real light, not that digital rubbish fake light.
Honestly, I have yet to get real film and take it out for some shooting. However I have been practicing and finding spots I want to shoot. Here are some pictures I have taken with my digital camera, around the city of Charlotte.
Individual image viewing dose not currently work...
I do plan on returning to where my best shots where taken with my digital camera and capture real light with my manual. Anyways, I need a lot of practice. I am still a novice when it comes to photography, though I do know the ropes.
On a completely unrelated note. I have had a couple days where I haven't been swamped with work, so I did something I haven't done in quite some time. I played a video game! Seems like over the years I have made more games then I have played. Anyways, the game that has stolen hours of my time and replaced them with enjoyment is called Freedroid RPG, and it is awesome! It is also completely free.
Freedroid RPG is developed on Linux environments but has a version for Windows systems too. It reminds me of a more live action Chrono Trigger. Your character is the Linux penguin "Tux" and you get all kinds of crazy abilities to control robots, which comes in handy, for in this world robots went crazy and started killing everyone. It's up to you to help defeat the robots! Anyways if you have some time to kill download this game and check it out.
DJ The Sypher @ Heaven and Hell
2/5/11
I have recently completed a fresh new design for DJ The Sypher. As it seems with most design work it was a bit of a rush job. I was sent the info for the design the day before the show! Don't people know I have 10,000 other things I'm trying to get done every day? Anyways, within an hour or so I churned out this not amazing but rather nice poster for the event.
Making a World... Map
12/23/10
Google Maps no longer supports this interface configuration...
At work I was given the task of making a world map that will display information in various area based on latitude and longitude. This was quite a challenge as I had no real idea how to translate latitude and longitude into (x, y) points on a map. Lucky with the help of Wikipedia and Gerben Robijn I was able to get my latitude and longitude algorithm working rather accurately. Here is my modified version of Gerben's code, I say modified because it does the same thing but uses more efficient math processing methods.
Snipt.net is dead. Replace link to "http://snipt.net/embed/7c4dddff27428f81a5d2770fb4aba3f5"
Use this map to see how well it works; you can enter points on the map using the menu at the bottom. Note this is a Mercator style world map.
If you played with the zoom you might have noticed (or not) how it maintains the center of your viewing area when you zoom in and out. This was much trickier to pull off that I had anticipated and this time the internet provided no good clues or examples.
Snipt.net is dead. Replace link to "http://snipt.net/embed/c9af775ef5963dca8ac8a7f75adbc757"
Well, I wanted to share that map and those two functions because they were both rather difficult to come across and hopefully this will help some of you out there. If you want to know more about any of the methods I am using here, send me an e-mail or something of that sort. Cheers!
TDI Site Complete
10/4/10
After some slight delay the Truck Drivers Institue web site is finally completed. I think I need to take a little break now and get back to my painting. Such is the burden of working so much, my art hangs over my should jelously taunting me to spend more time on it. Well art, now is your time again! Hopefully I can finish my next piece before I decided to take up more side work. We shall see.
This site has been redesigned by another party
AS3 vs HTML5 Drawing
7/16/10
So Cassie Lightfitz asked me about the new canvas object in HTML5 and at the time I replied that I don't know anything about it. I was aware of some of the new goodies in the future of the web but I am ecstatic with this new canvas object. The canvas object allows for scripted drawing on the fly, just like you can do in Actionscript. Now I naturally the question I had was ,"which one draws faster"?
So I made very similar scrpts using AS3 and HTML5 javascript. Going in I expected flash to be the fastest, as it natively handles vectors, however I became surprised when I finished both and realized that the HTML5 canvas object can be drawn to many, many times faster than AS3 can draw to a sprite. WOW! My attempt to capture just how fast the HTML5 drawing is processed seem to fail but at least the AS3 will return speed results, keep in mind all build time is in milliseconds (1,000 = 1sec).
Ok, what's one big difference? While AS3 draws in vectors the canvas object draws in bitmaps. My theory is that the canvas object actually caches a copy of the drawn star for reproduction while AS3 has to draw it every time. Try producing some stars for yourself. Warning, more than 100,000 might crash the HTML5 version while over 20,000 can crash the Flash version. If you would like copies of the source code to play around with, download the package HERE.
AS3 Drawing:
HTML5 Drawing:
How Many?
Poked in the Face ~ Time Lapse
7/7/10
I had actually finished the painting a couple months back, (April I think) however as it often goes, larger priorities arrose. Now after much delay I give you "Poked In The Face", a nice quick painting I did that has to do the aubserdity over anger, err, eh something along those lines. Enjoy.