Dat 102: Processing

The target of this assignment is to create a data visualization using a program called processing.

the data will be from from an XML feed from university of Plymouth, which has several different types of information, ranging from C02 levels, to outside wind speed.

my initial idea was to have some form of animation based on a tree, whereby each time a piece of data changes, a new branch is added.

this is a quick doodle of how i see this looking

this idea is similar to something i have seen on the processing website, which has a snowflake which slowly adds parts to its points to create an intricate pattern, although it doesn't use an XML feed to influence the speed or location of the added parts.

-------------------------------------------------------

since the previous idea, i have tried to make the tree sprout branches, without using the data, just as an animation on its own, and i have so far been unable to make it work properly, as branches do not go in the right place, or do not stay on the stage, and instead flash up once and disappear.

this has lead me to another idea, still with the tree idea, but instead have lots of trees growing to make a forest, this could be done using the data from the C02 levels, as i think that is a very appropriate idea, seeing as trees use C02 to live and grow.

-------------------------------------------------------

This idea is also not a very good one it seems, for two separate reasons, one of which is that all i can get to happen is that i have a tree jitterbugging around the screen, and no matter what i do, i cannot get it to create a new tree every time the data changes, thus the forest effect is null and void.

The second reason why i will not be using this idea is that i have discovered that another student is also using trees for their visualization, and i don't want my visualization to be too similar.

-------------------------------------------------------

third time is a charm they always say, so hopefully this idea will work.

my third idea is to have a simple circle pattern, much like waves in a lake spreading out from a splash, but using the XML data to determine the size of the splash, so that in the end it will have a large number of circles in many different sizes.

this is some like what i would like it to end up looking like.

---------------------------------------------------------

oh joy, yet again, i have encountered the same problem which i have had with both of the previous visualizations, where simply get one image on the screen at once, so all i can see is a circle fluctuating wildly around.

processing truly is a tough cookie to crack

-------------------------------------------------------

my fourth idea is to use the fluctuation to my advantage, and incorporate my love of music and sound environments, and create a speaker, so that it draws in data all the time, and makes sound based on the numbers it receives, i.e the higher the number, the higher the frequency, with an animation of a speaker-box with the speakers vibrating to the sound.
i dont think i will try to choose any specific part of the data, as the speaker should have a somewhat realistic look in terms of behavior, and i want the sounds to vary quite a bit, so drawing from all feeds is the best way in my opinion, due to the fact that if i use a single feed, the numbers will not vary greatly, whereas using all the feeds i will get a constantly changing frequency.
plus i have been struggling to get processing to use a single feed, and overall this will be easier to make it work.

------------------------------------------------------

finally, it works, after four ideas, i have a functioning visualization, while it is simple, it is still a visualization regardless, and it works for what i want it to do, sadly the data doesnt change by any large amount, so the sound coming out doesnt vary a large amount, but it still varies, and thats the main thing.

here is a screen shot, its hard to see the way the speaker fluctuates in size in these images, but then the visualization runs it is much more noticable

so there is is, while its not the most exciting or pretty, it does work for what i wanted to do, and i like it's simplicity.

Dat 102: Flash game

So, here it is, the flash game.

Preliminary research
My First idea is to create a game similar to the popular "copter" game, something with a single level that is very simple, but addictive.

something side scrolling seems to be the most obvious choice, as that means i can stick to a single level game, and not have to worry about making any sort of level progression.
as for outside influence, i would love to do something either with a sound player, or with a webcam input, perhaps the player can take a picture of their face to become the character they play as, or have some sort of equaliser based on the music the player is listening to and then make a level based on the type of music they are listening to.
these seem to be very unrealistic goals however, i would much prefer to have a simple game that works well, and keeps the user entertained, long enough to play it for a while, and i feel that trying to do these things will be too complicated for what is only a laid back casual game.

a Side scrolling shooter however would be a bit more simple to make, and if made well, could be quite fun, especially if it is in a similar style to old school side scrollers like R-Type, or old mobile phone game Space Impact.












R-Type, the coolest of cool.

however, one problem with this is that its been done before, and i would prefer to have a slightly less obvious choice for my game, something that is imaginative but still easy to play and simple.

Update-Jan 12th

New Ideas-
Some sort of blockbreaker / arkanoid style game, only without the blocks and more balls, if that makes sense, so the challenge is to keep all the balls in the air.
my first thought was to base it on final fantasy, purely because it would add an amount of novelty to the game, and also would give it a bit of an overall motif, and means that the designing aspect is easier.
the general idea for the game is that you use a paddle (or whatever) to bounce a ball back up to the top of the screen, and once you have hit it so many times (for example ten) another slightly faster ball is added, and so on until there are six balls on the screen at one time, making for some manic and quick paced gaming, with the player losing a life whenever a ball hits the bottom of the stage.
another possibility is to have a timer, which counts up, and every 30 seconds another ball is added, and the challenge is to last as long as possible.
to make it less frustrating, i will add lives for the player to use up, instead of just getting a game over whenever they make one mistake, as this would be rather frustrating, so perhaps 3 lives for the player to use up before they lose the game.

Update-Jan 18th
the graphics are all finished, but it seems that having 6 balls may make for rather complicated gaming, so perhaps it is best to stick to 3 or 4 balls tops.
i have made the "paddle" into a sword, in keeping with the final fantasy style, however, this does make it look a bit lopsided, as it is not symetrical, it also only hints at it being related to final fantasy. but as it is it looks good overall.
And i have decided that the game will have scoring system, not a timer, as a scoring system will be easier to follow than a timer.

Update-Jan 22nd
The final fantasy idea has been scrapped, but some of the graphics have been kept, as they are fairly nice to look at and are not explicitly related to final fantasy, so unless the player knew that that had been the original idea for the game, it would not be obvious to them.
The ball number has been reduced to 4, to make for an easier game, and they now all release at the same time, as it doesnt seem to be very easy to make another release once a certain score is reached, and the first attempt at doing this lead to the second ball either only moving a few pixels then stopping, or going at an over the top speed, making the entire game useless, however, now that all the balls release at the same time, it is a lot easier to make them work.

in problem is the outside input for the game, as mine is fairly simple, and i dont think there is anything that can be done via outside influence, so i think the best way to include this is to simply add the time and date (when they started playing) at the top of the screen, which will allow them to see how long they lasted , and also provide a little extra distraction to make the game a bit more difficult.

Update-Jan 29th
The game is finished, and plays fairly well, however, the main problem which i have yet to overcome is how to create some sort of play button so that the player can start the game in their own time, as on my website it will be difficult to scroll down and start the game without losing a life, so i shall have to come up with some way of making it work.
but as of now, these are the screenshots of the game











































Hopefully by the deadline i will be able to add a play button so that the game does not start instantly, but when the player is ready, this will make it a lot more user friendly and overall a better game.

Dat 102

Digital Art and Technology iDat102 website


So Far...
I don't quite know how I'm going to make it, but I have some very certain ideas for my website, I know exactly how I want it, its just transferring the ideas in my head on to the screen, one idea I have is to make the banner an animated banner with my name on it, with a static noise effect on it, this will have to be made in flash, but if I can do it properly then I think it will look great.

The website will have a overall house style, made with a CSS page, so that all of the text is one colour and that the background is one colour, I think the background will most likely be black or white, as I don't want to have an image for the background as it may cause the website to load slowly, and I don't really like standard block colours as they aren't very striking, so I feel that black and white will look the best as then the users attention is drawn to the text and it will be much easier to read, as opposed to having a rainbow background or something like that.

-------------------------

Banner
I know exactly how I want my title/banner to look, with the home page having it as an animated banner, and the other pages being just plain static images

-------------------------

Site name

I will most likely buy the domain name of markpalmer.co.uk, as it is simple and easy although it may not be very interesting, I think its probably the best name for the website, as it is a site about myself.

-------------------------
House Style

The websites house style will consist of the colour of the text, the font of the text, and the size of the text, the banner at the top could also be considered a part of the house style as it will be the same for each page, except for the home page which will have an animated banner.

-------------------------

I am going to have a home page, with the flash animated banner, and then have a page about myself, with some information regarding my skills, my interests and likes and dislikes.
A page about the site, with some information about what programs I used.
A contact page, with a form to contact me, which accesses a javascript file, so that the form can only be sent if the email field in the form has the @ character and a full stop, which all email addresses have, so at least that way it has to be a valid email address for it to be sent, or at least what could be used as a valid address.And ..
A photos page, with pictures of me and friends and pictures of what I have made during the course.
-------------------------
Colour scheme

I have decided that the overall colour scheme of the website will be black and purple, purple being my favorite colour, and also standing out well on a black background, which works with the colour blind web page test, which means that my website should be compliant with pretty much everything.
-------------------------
Font

The websites font will be Lucida Console as I like this font and I think it looks quite good on a purple background, it is also simple and easy to read, which I really like.-------------------------
Pictures

I plan to have about ten pictures which I will change once every week or so, so than anyone who views my website wont have to see the same pictures for ages, and I will also update my pictures from the course as they are made.

-------------------------

Update: 9Th Nov

Working slowly but surely on the website, so far the pages have been made and there is bits and bobs of content here and there, not much though really and nothing particularly special, but I have got the bones of the website down now all the pages are made and the CSS page is complete, despite being really simple, it does what I want it to so I'm happy with it

-------------------------

Update: 11Th Nov

I have now bought a domain name, and instead of buying the plain and boring markpalmer.co.uk, I spontaneously went for simplymarcus.co.uk, which was inspired by the website enjoyincubus.com, which I think is a really cool name, and I also think that its a little bit different from the standard website name, so I'm really happy with my site name, and I shall be uploading the first draft pages today or tomorrow.

Update: 12Th Nov

I have decided to make my buttons in flash, as I feel that they will be easier to contain than if I make each button as a rollover button with three images to make on button, as having the buttons self contained in a flash file will keep things a lot simpler. However it does make the HTML code look a bit less tidy as it inserts a large amount of javascript which will give a user a alert and link to the adobe website, if their version of flash player isn't up to date or they don't have flash player.
-------------------------

Update: 13Th Nov



The buttons are made and the pages with these buttons are uploaded to the web space, and it all seems to work fine, just need to add the content and complete the form on the contact page and all will be finished, however there are a few things that need validating before I upload the final versions to the web space, as none of the pages pass compliancy as of yet, they all seem to have little errors which I cant figure out annoyingly

-------------------------

update: 17Th Nov

I have had to change my banner as the original didn't seem to work with the colour blindness test, so i feel it would be better to have the banner as a plain and simple black background, which will work with the colour blindness test.
-------------------------

This is the new banner-






comparison with the old banner-





I prefer the new one, although I really did like the old one, but it did have certain things which annoyed me, like for instance the fact that the static noise isn't perfect and the fact that the old banner doesn't have the website name, so i think that the new one, as well as being easier to see through the colour blindness test it is also more accurate to the site and professional looking.



-------------------------



Update: 18Th Nov

The website is now complete, although I have not yet got the form to work properly, it still sends to the Sam-i-am website regardless or what is or isn't written in the form, although i have managed to get it to not validate if it hasn't got an @ in it, although if there is anything else along with the @ it wont validate either, which is a problem. Another problem is that i wanted to have the images as rollover images which get bigger when the mouse is put over it, and i did get it to work, although it didn't work fully and the images shook and wouldn't work properly going from one image to the other, so I have decided to just have standard image which are slightly bigger and viewable as they are as a static image.

-------------------------


Update: 19Th Nov


That's it, everything is done, the JavaScript now works, and only validates the web form if the email field has a full stop and an @ sign, and all of the pages validate fully, so the home page now has the icon from the Validator page to show that the website is valid. and the CSS is compliant to level 2.1 CSS so I'm really pleased with my site over all and very relieved that its all working hunky dory.


http://www.simplymarcus.co.uk/

-------------------------



Analysis of the site

Overall I think that my website is really good, I really like it, and although it is very simple, I think that its nice and easy to use and most of all it works properly, which I'm glad about, and no, it isn't that amazing and doesn't look the most exciting, but I am honestly proud of my website, and I really feel like I have achieved something in making it.


-------------------------


Next time...


If I were to go back and start again, I think I would maybe change the motif of the website so that everything looks a bit brighter, and make sure that the buttons match the rest of the website, because they look a bit odd being green when everything else is purple, although when i made them the green was much more visible that the purple was, so I used green to avoid the issue of people not being able to see what page it linked to, but I don't think the colour is really a big problem. I would also make sure that I had the images as rollover images so that they are made bigger when the mouse is put over them, but it simply wouldn't work for me, so this time I gave up. I would also make the web form reference the javascript page so that it would only work if all of the fields were filled, thus making it less likely to be abused. However I think that the main problem with my site is probably the fact that some things look slightly crowded but I don't really think that is that bad a problem anyway, and overall I still think the website looks pretty good and I'm very happy with what I have made.

-------------------------

Just a quick screen shot of the pages of the completed website!