To start off, I used the Pattern Stamp tool in Photoshop to create this simple shape background and set it to a dark grey so that the rest of the colours on my website would stand out and the background would't be too distracting. I then decided that since the background was a tile-shaped pattern, I could cut out individual squares and animate them to spin every few seconds:
 |
| The red arrow shows one of the tiles mid-spin |
Once I had the background in place, I then started work on the cartoon version of myself. I'd done quite a few in the past so the only way this one had to be approached differently was that this one had to be suitable for slight animation and it had to look a lot more professional than my previous works. I used a few pictures and a mirror for reference to try and get all my main features and make the image look at least recognisable to people viewing it. After completely finishing the graphic and coding the necessary actions so that the eyes and head would follow the mouse wherever it goes on-screen in a natural way. I also added some colourful buttons and floating title text, which were all also animated:
With this fully-animated page, it gives the website a fun vibe, which I think is essential when getting people to stay on your website and wanting to see more.
I then started work on the 'About' page. This page had to contain all of the necessary information about me that would be the norm for personal websites. I included my interests, program experience and of course, my course name. This is all with the background and text animations of the front page, to keep the site consistent:
Next up was my Portfolio page. This was to also include my showreel, which I had already completed using Adobe After Effects. I created some small thumbnails to use as preview buttons which, when clicked, would enlarge the corresponding image. I also included a Showreel button so that my showreel could be played the same place as the rest of my work.
Moving on, I got to my Games page. Now, since I only have one game behind my belt at the moment, it's all I was able to put on there. I unfortunately had some problems with embedding the .swf file into the Website file, but since I'm handing the game in at the same time as this website I think it's something I can hold off trying to fix for now.
Finally, I got to my Contact page. This just had to contain a simple box that could be filled out and used as a form so that people could send me messages directly. I thought I could spice it up a bit by adding a character from one of my previous projects - Basil the Bookworm.
I also did a video run-through of my website so that you can see all of the animations and my showreel.
And that's my website! I had a lot of fun building this, even if it was a lot of work. I'll definitely be tweaking it and adding more in the near future, but for now I think I've achieved what I set out to do.
