What the hell is a PDP, I hear you ask. Well it stands for Personal Development Plan. Its a thing where you set yourself goals, give action points to achieve these goals and pick a target date to achieve them by. You also pick the evidence that means you have achieved them. Below is one of my goals.
Goal: Put more preparation into exams/in class tests.
Action: print off all available notes and read through them.
Evidence of Achievement: I am well enough prepared to answer every question.
Target Date: By next exam/test.
Monday 23 November 2009
Friday 20 November 2009
Website Part VI: Star Wars had 6 episodes, so can I!
But this is not just a random post so I can copy star wars. This is the post where I do all the mentions and thankings.
First of all thanks to Chris Saunders for teaching CSS, Javascript, other HTML and helping with the corners.
Thanks also to Jon Redwood for helping me out a fair bit.
Cannot forget to mention how useful these websites were:
http://validator.w3.org/
http://jigsaw.w3.org/css-validator/
A small mention to Simon for being up with me as we were both finishing off.
And finally a mention to Radio 1 for being the background noise to me tying up all of the loose ends.
First of all thanks to Chris Saunders for teaching CSS, Javascript, other HTML and helping with the corners.
Thanks also to Jon Redwood for helping me out a fair bit.
Cannot forget to mention how useful these websites were:
http://validator.w3.org/
http://jigsaw.w3.org/css-validator/
A small mention to Simon for being up with me as we were both finishing off.
And finally a mention to Radio 1 for being the background noise to me tying up all of the loose ends.
Website Part V: The Evaluation and Other Stuff
Well this the summary post. If you look HERE you will see my original design and if you click HERE you will see the final version. As you can see there are not many differences but I am going to outline those few differences and explaint them. The final website is a much darker green than my simple design. This is because I thought the green I used for the design was too bright for my liking. The other reason for the change is because, well, I sort of forgot what green I had originaly used but I now do prefer the green I went with.
As you can see I scrapped the "title of the page the user is on" thing going underneath the banner. This was because I figured it would be more practical to just use a title on the page to display this rather then big letters underneath a banner. Finally the curves on my corners are a lot bigger than those on the design, thats because I was able to get better curves when I got to the final website. Below is the CSS I used to create my curved corners.
Now I will go onto the rest of my CSS. For the final website I used several CSS files instead of just one. I did this because I found it was easier to style each page that way especially as the contact page is so different to the other two. The reason I did seperate ones for the index and about page is simple. In the CSS file I used "auto" and when it came to the height on the index, because there was not a lot of content, it would shorten it to a very short length. I did not want a short height for my index and I wanted it to be slightly similar to the other two, longer pages. Therefore I just duplicated my CSS file and made the small change.
Right next would be the javascript. In This Post you can see the code for my form validation. I am very proud I got this to work because validation is important and alert windows make this easier. My code works by looking at the fields one by one, starting at the beginning. For example if the "Name" box was empty an alert message would appear. If it was filled then the validation would jump down to the "Email" box to check if that is filled. If that is filled then it would then check to see if the Email Address entered is valid. It does this by checking for an @ sign beyond the first character and then a . beyond the second character. If that is all good then it finally jumps down to the "Message" box and if that is filled then the form will be submitted.
However that is not the only javascript I used on my website. There is another bit.
This makes a pop up box appear asking the user if they are sure they want to visit my blog. This works after the user has clicked the blog button and that is when the alert appears. If the user clicks OK then they proceed to my blog however, if they click Cancel, the process will be cancelled and the user will be returned to the page they were just on. Thats about it for javascript, now onto what I think about the website.
Well to say I am proud is an understatement. This is my very first website that is officially on the internet! I am very happy to see it there. First all I believe that the best designs of things are those that are kept simple and I believe my website is as simple as it gets. It is a single coloured rounded rectangle with a few links, text and images on. I would have definitely liked to make it a bit more colourful and have more going on but I am happy with the simplicity of the design, as the saying goes, I believe it is "Simple yet Effective". I am also proud of my buttons I created allowing people to link up with me on Social Networking Sites. These were done simply in Photoshop with logos gotten off the internet. Usually I would not be proud of simple buttons but this is because I made them myself. I am of course proud of my Javascript, it took ages to complete but it all works a charm now. I love the fact I got my curved corners eventually. They took a lot of time but they are done and make the site look better than it would with square ones, I think so anyway. And finally I am pleased that my CSS turned out ok and everything works.
Of course there are some things I am not so happy with and if I had left more time I would have certainly implemented on my website. I would have liked to have made a more complicated form with more than three fields but I am content with it for now. I would have liked to done something more with more images like create a small gallary that uses Javascript. Finally I also would have liked to have added more content and to make the current content a little less predictable and standard.
However at the end of the day I am very proud with what I have achieved, hope everyone likes it. All thats left to do at the end of this monster post is post a link and advertise!
CLICK HERE
Enjoy!
As you can see I scrapped the "title of the page the user is on" thing going underneath the banner. This was because I figured it would be more practical to just use a title on the page to display this rather then big letters underneath a banner. Finally the curves on my corners are a lot bigger than those on the design, thats because I was able to get better curves when I got to the final website. Below is the CSS I used to create my curved corners.
#topbar {
background-image:url(banner.gif);
width: 100%;
height: 150px;
background-repeat: no-repeat;
}
#footer {
background-image:url(bottombar.gif);
width: 100%;
height: 50px;
background-repeat: no-repeat;
text-align:center;
font-size:12px;
}Now I will go onto the rest of my CSS. For the final website I used several CSS files instead of just one. I did this because I found it was easier to style each page that way especially as the contact page is so different to the other two. The reason I did seperate ones for the index and about page is simple. In the CSS file I used "auto" and when it came to the height on the index, because there was not a lot of content, it would shorten it to a very short length. I did not want a short height for my index and I wanted it to be slightly similar to the other two, longer pages. Therefore I just duplicated my CSS file and made the small change.
Right next would be the javascript. In This Post you can see the code for my form validation. I am very proud I got this to work because validation is important and alert windows make this easier. My code works by looking at the fields one by one, starting at the beginning. For example if the "Name" box was empty an alert message would appear. If it was filled then the validation would jump down to the "Email" box to check if that is filled. If that is filled then it would then check to see if the Email Address entered is valid. It does this by checking for an @ sign beyond the first character and then a . beyond the second character. If that is all good then it finally jumps down to the "Message" box and if that is filled then the form will be submitted.
However that is not the only javascript I used on my website. There is another bit.
function leaveConfirm() {
if (confirm("Clicking this link will direct you away from my website. \n\nDo you still wish to continue to my blog?")) {
window.location.href = "http://tomsaundersmpt.blogspot.com/";
}
return false;
}This makes a pop up box appear asking the user if they are sure they want to visit my blog. This works after the user has clicked the blog button and that is when the alert appears. If the user clicks OK then they proceed to my blog however, if they click Cancel, the process will be cancelled and the user will be returned to the page they were just on. Thats about it for javascript, now onto what I think about the website.
Well to say I am proud is an understatement. This is my very first website that is officially on the internet! I am very happy to see it there. First all I believe that the best designs of things are those that are kept simple and I believe my website is as simple as it gets. It is a single coloured rounded rectangle with a few links, text and images on. I would have definitely liked to make it a bit more colourful and have more going on but I am happy with the simplicity of the design, as the saying goes, I believe it is "Simple yet Effective". I am also proud of my buttons I created allowing people to link up with me on Social Networking Sites. These were done simply in Photoshop with logos gotten off the internet. Usually I would not be proud of simple buttons but this is because I made them myself. I am of course proud of my Javascript, it took ages to complete but it all works a charm now. I love the fact I got my curved corners eventually. They took a lot of time but they are done and make the site look better than it would with square ones, I think so anyway. And finally I am pleased that my CSS turned out ok and everything works.
Of course there are some things I am not so happy with and if I had left more time I would have certainly implemented on my website. I would have liked to have made a more complicated form with more than three fields but I am content with it for now. I would have liked to done something more with more images like create a small gallary that uses Javascript. Finally I also would have liked to have added more content and to make the current content a little less predictable and standard.
However at the end of the day I am very proud with what I have achieved, hope everyone likes it. All thats left to do at the end of this monster post is post a link and advertise!
CLICK HERE
Enjoy!
Website Part IV: Well how about that, its done
Yes thats right the website is finished, completed, done and dusted. Today I polished off the content of my blog and then went through the validator websites. Everything passes with flying colours, however the only colour that matters is the green of the validator saying all is good. To show that my site passes all of this I have used the code provided to put the buttons onto my website. I wanted to put them into the footer but for some reason that was not liked so to save time and hassle I smacked them straight into the home page. This turns out to be a good thing because everyone will see them instantly as they arrive at my webpage. I am so glad to have this all finished, all the heartache of looking at the Firefox Error Console and seeing errors was worth it in the end.
Now to just do a final write-up-esque post on my blog which you will see above this one shortly.
Now to just do a final write-up-esque post on my blog which you will see above this one shortly.
Wednesday 18 November 2009
Website Part III: The Taming of the Javascript
So today was a very very happy day. I continued with javascript and after a lot of persistance it all worked. Here it is below.
This is only my validation javascript. All of these but 1 controls whether the box is empty or not and if it is a small alert box appears telling them to fill it in. The only different bit of code is the email validation one which can tell whether the email address is valid or not. It checks to see if there is an @ sign within the email and if there is a . (because there should be like.co.uk or .com). This will then hopefully make sure the email address I recieve is at least valid and possibly real (I do understand that fake email addresses can be typed in but to code that is currently out of my skill set).
Well thats all I achieved today but hopefully you understand that this is a very very big thing and it took me 6+ hours to get to work. But it now does and I am every so happy. Time for bed cheerio!
function validate_form(){
if (document.contactform.name.value == "" ){
alert ( "Please enter your Name." );
return validate_name = false;
}else{
validate_name = true;
}
if (document.contactform.email.value == ""){
alert ( "Please enter your Email Address.");
return validate_email=false;
}else{
validate_email=true;
}
if ((document.contactform.email.value.indexOf(".") > 2) && (document.contactform.email.value.indexOf("@") > 0)){
validate_validemail=true;
}else{
alert ( "Please enter a valid Email Address." );
return validate_validemail=false;
}
if (document.contactform.message.value == "" ){
alert ( "Please enter your Message." );
return validate_message = false;
}else{
validate_message = true;
}
}
This is only my validation javascript. All of these but 1 controls whether the box is empty or not and if it is a small alert box appears telling them to fill it in. The only different bit of code is the email validation one which can tell whether the email address is valid or not. It checks to see if there is an @ sign within the email and if there is a . (because there should be like.co.uk or .com). This will then hopefully make sure the email address I recieve is at least valid and possibly real (I do understand that fake email addresses can be typed in but to code that is currently out of my skill set).
Well thats all I achieved today but hopefully you understand that this is a very very big thing and it took me 6+ hours to get to work. But it now does and I am every so happy. Time for bed cheerio!
Website Part II: It has all began
I actually made a start on my website a long time ago but I am still yet to get used to this "blog everytime you do something" thing. But tonight I figured I really should blog what I have done so far and what I have achieved recently.
So a couple of weeks ago I made the basic backbone of my website. I created a menu system with mouseovers and sorted out the main colour scheme for my website. If you check the first website related post you will see my original design and I pretty much stuck to that for this first part. I also attempted curved corners but I failed pretty badly. Since, at the time of writing, I am yet to upload what I have done recently you can still see the very first steps my website has taken on the URL Here.
So on to what I have done recently. After some advice from Chris I managed to tame curved corners and they now feature on my website which pleased me greatly as I really do hate square corners, they're too sharp.
I also implemented an idea that I came up with recently which was to use javascript to make an alert box appear when someone clicked on my blog link. This alert box would warn the user that they are moving away from my webpage. This is mainly so that the user knows it is going to happen and they can stop it if they want to rather then being taken straight to the blog without any clue what is going to happen.
I also made a start on my form validation which I must say did not start well but I am hoping I will be finally completing this very soon.
The future plans for my website are to obviously put content onto it. I would also like to implement a sort of gallery for images rather then just plastering them all over a page. I do want to add some facebook stuff too however this will most likely be the most basic available because I struggled with the more complicated stuff in the practical.
Anyway time for bed, the next post will most likely be a progress update on how tomorrows work goes. Heres hoping it's all good :).
So a couple of weeks ago I made the basic backbone of my website. I created a menu system with mouseovers and sorted out the main colour scheme for my website. If you check the first website related post you will see my original design and I pretty much stuck to that for this first part. I also attempted curved corners but I failed pretty badly. Since, at the time of writing, I am yet to upload what I have done recently you can still see the very first steps my website has taken on the URL Here.
So on to what I have done recently. After some advice from Chris I managed to tame curved corners and they now feature on my website which pleased me greatly as I really do hate square corners, they're too sharp.
I also implemented an idea that I came up with recently which was to use javascript to make an alert box appear when someone clicked on my blog link. This alert box would warn the user that they are moving away from my webpage. This is mainly so that the user knows it is going to happen and they can stop it if they want to rather then being taken straight to the blog without any clue what is going to happen.
I also made a start on my form validation which I must say did not start well but I am hoping I will be finally completing this very soon.
The future plans for my website are to obviously put content onto it. I would also like to implement a sort of gallery for images rather then just plastering them all over a page. I do want to add some facebook stuff too however this will most likely be the most basic available because I struggled with the more complicated stuff in the practical.
Anyway time for bed, the next post will most likely be a progress update on how tomorrows work goes. Heres hoping it's all good :).
Tuesday 10 November 2009
Stonehouse - Yet more maps
Yes I have once again changed my map. However this one is only slightly more different than the last. I kept with the idea about activity in areas and thus created a more in depth version of my previous one and presented it better.
Again the main focus of this map are the sort of "aura-like" shapes ive drawn. The more lines in the shape the more activity goes on in that area. The main difference in this map is that there are more shapes because I have been able to make this more in depth than before. The second difference is that I have changed the shapes and the colours/thickness of the lines. I did this because the thick red lines looked awful. I changed the shape because I feel it now respresents activity better.
Please find the awful original HERE.
Again the main focus of this map are the sort of "aura-like" shapes ive drawn. The more lines in the shape the more activity goes on in that area. The main difference in this map is that there are more shapes because I have been able to make this more in depth than before. The second difference is that I have changed the shapes and the colours/thickness of the lines. I did this because the thick red lines looked awful. I changed the shape because I feel it now respresents activity better.
Please find the awful original HERE.
The Football Fan Manifesto
In IDAT101 today we were asked to write a sort of manifesto and not really knowing what to write about I fell back on something I knew well and that was football. Here is my fan manifesto below. Enjoy!
But. There is a bigger. More dangerous problem in football today. Too many times football has been bad mouthed due to poor supporters. We believe that a fan should be able travel to and from a match without the fear of being attacked. We believe that no matter what race you are you have the right to support a football team and attend the match. We believe that hooliganism has no place in today’s society.
We stand up for the good type of football fan. The one who will go to the match no matter what the weather is like, whether the match is on TV or not or whether it’s the Champions League Final or the Blue Square North relegation battle. We stand up for the fan who will not throw things at opposition players, who will not chant racist comments and will never attack a fellow supporter. These are the type of fans we salute.
Football Fan Manifesto
For too long now there have been “glory supporters”. We believe that no matter how good the team is or no matter how many competitions they win you should always pick a team and stick with them through rain or shine. We believe that everyone should attend matches and not just be an “armchair fan”. We believe that unless good reasoning is given you should always support your local team.But. There is a bigger. More dangerous problem in football today. Too many times football has been bad mouthed due to poor supporters. We believe that a fan should be able travel to and from a match without the fear of being attacked. We believe that no matter what race you are you have the right to support a football team and attend the match. We believe that hooliganism has no place in today’s society.
We stand up for the good type of football fan. The one who will go to the match no matter what the weather is like, whether the match is on TV or not or whether it’s the Champions League Final or the Blue Square North relegation battle. We stand up for the fan who will not throw things at opposition players, who will not chant racist comments and will never attack a fellow supporter. These are the type of fans we salute.
Thursday 5 November 2009
The Digital Premiere of my Digital Signiture
Yes thats right a digital signiture. I haven't mentioned this or even the module before. Thats because i'm pretty damn lazy. However here it is the final dig sig.
After uploading this to the flickr page as requested we also had to write a description of why it looks like it is. I will copy and paste this below (again with the laziness)
After coming up with several ideas this is the one I ended up choosing for my digital signiture. First of all the main vocal point of my signiture are my initials T and S. These are joined together because I believe the first and last name are just as important as eachother. I also did this because I think it looks good and catches peoples attention. As you can see my first name is a mixture of colours. I did this because I am not fond of the name Thomas and prefer to be known as Tom so I made the H,A and S lighter so the main focus is on the T,O and M. I did not change any of the colours on my surname because, unlike my first name, I like it. I alligned the first and last names like I did because it reflects my liking of everything being neat and tidy. Finally I chose that particular font because I hoped the curves on it would get across that I am a fun and jolly person .
So thats it. A pretty brief post just to keep everyone informed that I actually do work at uni. Off to cardiff at the weekend so won't be working at all, love it.
After uploading this to the flickr page as requested we also had to write a description of why it looks like it is. I will copy and paste this below (again with the laziness)
After coming up with several ideas this is the one I ended up choosing for my digital signiture. First of all the main vocal point of my signiture are my initials T and S. These are joined together because I believe the first and last name are just as important as eachother. I also did this because I think it looks good and catches peoples attention. As you can see my first name is a mixture of colours. I did this because I am not fond of the name Thomas and prefer to be known as Tom so I made the H,A and S lighter so the main focus is on the T,O and M. I did not change any of the colours on my surname because, unlike my first name, I like it. I alligned the first and last names like I did because it reflects my liking of everything being neat and tidy. Finally I chose that particular font because I hoped the curves on it would get across that I am a fun and jolly person .
So thats it. A pretty brief post just to keep everyone informed that I actually do work at uni. Off to cardiff at the weekend so won't be working at all, love it.
Monday 2 November 2009
Website Part I: The Design
So today I thought I would upload the design I have created for my website.
Here it is below, please click for a larger version.
If you haven't caught on yet my favourite colour is green hence why my website is green. I chose the colour scheme of white and green because I feel these 2 colours go well together (and they are also the colours of my beloved Argyle ;)).I also like curved corners because I think they look cool so thats why my website (and this blog) have curved edges. At the moment i'm not sure how I will make my website have curved corners but I am sure I will be able to get them to work after I mess around with the CSS.
I wanted to have a navigation bar at the top of my website because I think this is the best layout to have because the user can clearly see it and it doesn't restrict the left hand margin of my website. The buttons on my nav-bar will have a rollover because I think it looks cool and also shows off the skill I have to make rollovers work :P. To show what the buttons will look like when the mouse is over them I made one of the buttons on my design the colour the button will go. I was hoping to have a drop down menu but I had no idea what would go on each menu so I decided against it. I may go back to this at some point.
Right, the banner. I will make this in Adobe Photoshop and hopefully I will be able to display this on the website. It will be a very basic banner with probably just my name on it and featuring the chosen colour scheme of green and white. Also underneath this I want to display the name of the page the user is on so they are never lost!
So thats it, my current website design, it will no doubt change over the course of making the website but if you follow the blog you will stay up to date ;). And with that shameless promotion of my blog I will bid you good night.
Here it is below, please click for a larger version.
If you haven't caught on yet my favourite colour is green hence why my website is green. I chose the colour scheme of white and green because I feel these 2 colours go well together (and they are also the colours of my beloved Argyle ;)).I also like curved corners because I think they look cool so thats why my website (and this blog) have curved edges. At the moment i'm not sure how I will make my website have curved corners but I am sure I will be able to get them to work after I mess around with the CSS.
I wanted to have a navigation bar at the top of my website because I think this is the best layout to have because the user can clearly see it and it doesn't restrict the left hand margin of my website. The buttons on my nav-bar will have a rollover because I think it looks cool and also shows off the skill I have to make rollovers work :P. To show what the buttons will look like when the mouse is over them I made one of the buttons on my design the colour the button will go. I was hoping to have a drop down menu but I had no idea what would go on each menu so I decided against it. I may go back to this at some point.
Right, the banner. I will make this in Adobe Photoshop and hopefully I will be able to display this on the website. It will be a very basic banner with probably just my name on it and featuring the chosen colour scheme of green and white. Also underneath this I want to display the name of the page the user is on so they are never lost!
So thats it, my current website design, it will no doubt change over the course of making the website but if you follow the blog you will stay up to date ;). And with that shameless promotion of my blog I will bid you good night.
Sunday 1 November 2009
Wish you were here...
Well today was the day in which I made my final postcard for the idat106 module. I must admit I have no idea what sort of thing shaun was after so I decided that I would just make a traditional postcard with the "wish you were here..." text on (hence the title of this post). I chose the Royal William Yard as where my postcard would feature because it is the area I believe my group is focusing on.
Rather than take my own photo for it I decided it would be best to search the internet for a birds eye view of the yard because i figured that would be the best type of photo to use.
Now this would be my very first attempt at making a postcard, ever.
As you can see it is very poor indeed. I put this down to the fact the image I chose was not the best and because I hadn't used any fancy photoshop effects.
So after that attempt I sat myself down and had another go using a different image. I used the same font as before (Brush Script Std) for the text and also had a look around photoshop to see what I could do. I messed around with layers that were just a block of colour and changing the opacity and I also looked at some layer effects and filters. And this image below would be the final product.
I will start by describing the effects I used on the text. I used a layer effect called outer glow and also stroke. Stroke is where you can add an outline to something so i went for black to help it stand out better. I used outer glow to give it that sort of postcardy type look. As for the image itself all I did was mess around with a layer that was blue and changed the opacity.
So thats it, the story of the postcard. Its not quite futuristic with like neon lights and floating stuff but I think in 10/20 years time this is pretty much how the yard will look. I know its pretty much the same but I cannot see any dramatic changes being made. Also it will more than likely be maintained to keep it looking good so therefore I reckon it will look almost the same. However I must admit if I had the skill set to add floating things I definitely would have done so.
Rather than take my own photo for it I decided it would be best to search the internet for a birds eye view of the yard because i figured that would be the best type of photo to use.
Now this would be my very first attempt at making a postcard, ever.
As you can see it is very poor indeed. I put this down to the fact the image I chose was not the best and because I hadn't used any fancy photoshop effects.
So after that attempt I sat myself down and had another go using a different image. I used the same font as before (Brush Script Std) for the text and also had a look around photoshop to see what I could do. I messed around with layers that were just a block of colour and changing the opacity and I also looked at some layer effects and filters. And this image below would be the final product.
I will start by describing the effects I used on the text. I used a layer effect called outer glow and also stroke. Stroke is where you can add an outline to something so i went for black to help it stand out better. I used outer glow to give it that sort of postcardy type look. As for the image itself all I did was mess around with a layer that was blue and changed the opacity.
So thats it, the story of the postcard. Its not quite futuristic with like neon lights and floating stuff but I think in 10/20 years time this is pretty much how the yard will look. I know its pretty much the same but I cannot see any dramatic changes being made. Also it will more than likely be maintained to keep it looking good so therefore I reckon it will look almost the same. However I must admit if I had the skill set to add floating things I definitely would have done so.
Subscribe to:
Posts (Atom)