My Landing Page

Landing page.



Colour's change on logo when rolled over because it is going to act as a link to the homepage.

This is the start of my website and i have decided to include a landing page with one of my photographs and the logo featuring. I think i might put some contact info on as well so that people get an instant shot of my logo and a piece of work and then they can enter to get more information. I've decided to stick to limited colour's as i do not want to over complicate my site as the work should be the main attraction. Thats a point really need to start getting some ideas going for some more work that can go on this site when i finish.

Website Intro Movie

Finally managed to export it as a movie after messing around with the settings for a while, it was more a case of me being stupid than my computer struggling. Below is a gif showing how the circles change colour to purple when the mouse hovers over them because the movie doesn't show this.



I have been struggling to make it so the whole sequence starts when the user clicks the start button, at the moment it just starts itself. But that's the beauty of flash, everything seems to be a bit more complicated than you first think.

Experimenting with flash

This is a screenshot of a very simple intro sequence that i am thinking about trying to incorporate into the beginning of my website. My computer seems to be struggling to export it as a quicktime movie so i don't know whether i will be able to post it up on here, which is annoying.

Flash is a really cool program but it can be infuriating. Everything will be going fine one minute and then you will do something that you are sure will work and then it just doesn't with no logical explanation. I'm not 100% that i will be able to incorporate this into my website because i am struggling to get the buttons to work as links properly, so i think i will need to get some help with that.

Another website

Found another website that i think is very cool. It's very simple and in my opinion very effective. The sites called memo-random and is a collective with two members Michelle Phillips and James Lunn. You first hit a landing page, which is something that i am definitely going to include in my website. I did it on the previous website i made for the first comm tech brief and is an avenue to put something creative and interesting as the first thing the visitor will see.

Landing page:



The home page is really cool as well and they've created some interesting letter rollovers that look good. I think that the menu is really simple and effect and i like the use of the grid system for the submenus. The menu also never leaves the screen so it makes navigating the site really easy.

Home page, contact page and work pages:

Planning

I did a quick plan to try and establish how many pages i will be looking to create and then what i was going to put on them. I think i have settled on having a very stripped down and streamlined page that isn't over cluttered and more or less lets my work speak for itself. This plans focuses more on the functionality of the website and how the pages are going to be linked together rather than the actual design of the pages.

Site Planning

I was in the library yesterday looking at the back issues of .net magazine and there was interesting article on how to 'plan_the_perfect_site', and i found it very interesting. In the article they are obviously referring to projects that are on a much larger scale than mine but i think the important message that i got from the article was that websites that have a good plan behind them, work better than those that don't. This may seem obvious but i was literally going to jump straight into dreamweaver and start making pages off the top of my head. I thought that i would never touch a pen and paper for this brief. So i think that the next step is to get a good plan on paper with a good idea how the website is going to connect together and i may then need to do some work in illustrator or photoshop before even touching dreamweaver.

.net/December 2008 - plan_the_perfect_site

Domain Name

I am now the proud owner of my very own domain name. Kept it simple and just used my name, so www.thomasdsmith.co.uk is where i will be located. I was thinking of going for something a bit crazier with gorilla art leading the race but i couldn't get that when i checked so i thought i'd stick with something i wouldn't get bored.

Need to start asking some questions?

I think it's about time that i start asking myself some key questions about my website and the reasons i'm creating it.

No.1 My Websites Aims?
The main aim of my website is to act as a vehicle to display some of my work to both my piers and to perspective clients. The main idea behind having my own site is to give the air of professionalism and to show that I am being proactive when it comes to getting my work out there into the real world.

I have also been weighing up incorporating a new blog into my website and this was the main thinking behind using Wordpress. I wanted a blog as this is a good way of showing the other area i am interested in and connecting with like minded practitioners. I want to be able to have more control over how my work is displayed rather than relying on sites like flickr and vimeo. With this said i may have to rely on those sites for a bit longer as my knowledge is still rather limited but my main goal is to have it all included in one site. This also means that if anyone wants to different types of work that i have done they can go to one website as opposed to different ones for my different types of practice.

No.2 Functionality?
How do i actually go about creating my website?
What methods/programs/coding do i use?
How do i plan out my site?
How do i design my site?
What am i including on the site?
What domain name do i use?
Who do i get my hosting with?
How much is this going to cost me?

Firstly i am going to plan out my site on paper and get a rough idea of how i want it to look then create gifs in illustrator and photoshop that i can use in Dreamweaver when creating the site with CSS. Then after the session where we look at Wordpress this Friday i will have a play around with that and see how it can work with what i plan to do using CSS.

No.3 How am i going to get people to look at my site once it's up and running?
This is the section I am not immediately worried about at the moment but i think that could be a fatal area, as whats the point of building a perfectly functioning website that no one is going to look at? I think i need to look into this question further.

Crossroads?

I feel that i am very much at a crossroads in the project as i am undecided on which method i should use to produce my website. We had a session on Friday that looked into CSS and i realized that i easily know more about CSS than Wordpress and i find it a more accessible to use Dreamweaver because i have used it in the past. With this said we will be looking at Wordpress and Flash in another session this coming Friday so I'm sure this will throw up more questions. I think for the time being i am going to give as much as i can a go and see what i can incorporate or what i simply find better to use. I'm going to put Wordpress on the back burner for the time being and focus of getting something basic knocked up in Dreamweaver so that i know the basic functionality of my site and how the pages are going to work together.

Messing around with Blogger

Another avenue that i didn't really consider until i looked at Rob's blog was changing up and customizing blogger. Obviously i have a blogger blog already and i can't believe that i didn't understand how much you could customize blogger sites. I then started looking at blogs i frequently use and it started to dawn on me that loads of people do it and it's possible to create some dramatic changes.

http://fixedgearleeds.blogspot.com/



This isn't the most extreme example i could have found however it's a site that i look at everyday and I had never really taken note of the customized components. I really like the illustrated header and the animated gif, which i guess are the main two customized components.

http://freemantransport.blogspot.com/



This is another blog i look at and they have completley got rid of the standard blogger layout.



This didn't work very well in my opinion but it does show another form of customization.

They have now created their own website and moved away from using blogger. I really like this website and i think it goes to show a great progression from blogger to a more professional looking website. They have also incorporated a new blog into the website that works really well and looks a lot better when compared to blogger site.

New Site:



New blog:



http://freemantransport.com/index.php

Jonnie Craig

I think this is the polar opposite to the sort of site i classed Sophie's as. Jonnie Craig is a photographer from London and also featured in the creative30 competition but i was aware of his work prior to looking at the competition mainly through his editorial work for vice magazine. His portfolio site is very stripped down and simple is the perfect word to describe it. He has a introduction page like Sophie:



but this is where the similarities end. Unlike Sophie Kern's website where every page was customized Jonnie's is very bare with just a simple sidebar that has all the navigation for the site and never disappears. The images appear surround by a lot of white space so the viewer can take them in with little distraction.



I think the jury is still out as to which sort of style i like more or what i think will fit my style of work better. I need to go away and have a think about it.

http://www.jonniecraig.co.uk/

Sophie Kern

As a follow up to looking at the Brighton 08 showreel website i started to look through most of the students work and some of their websites. I then came across a name i was familiar with, Sophie Kern. She is an illustrator who's work is hand drawn and incorporates collage and various collections. I had seen her first through a competition called creative30 where she was a finalist and made it through to the final 'creative 30'. I thought it was an interesting selection of people from the creative spectrum that entered and i enjoyed watching the videos where they showed their work etc. But back to Sophie Kern and more specifically here portfolio website. Another aspect i like on some websites is their welcoming screens that are the frist thing you hit before going into the website itself. I think these are an interesting opportunity to play around and a chance to use some of your work in a different way. They are a chance to get creative and i think Sophies is cool.



The index page:



About Sophie page:



Work page:



Examples of work (more thumbnails):



Sophie's website is an example where a lot of hand drawn elements are used and this is very similar to what i did for the first website i made for the love/hate technology brief for comm tech 1. It's a technique that i may look into using but it does require more work in terms of creating the images and hand drawn text etc. I think the benefits are obvious because you come out with a more personalized website that is catered to you and that people wont have seen before. The only thing i need to consider is that it would go against my initial decision to go with a clean and simple design, but maybe there is a middle ground.

http://www.sophiekern.co.uk/

Thumbnails?

I think i have a thing for thumbnails. When it comes to displaying work on a website i think that a collection of work that is put into thumbnails visually looks really interesting and the viewer can get a quick impression of the sort of work you do. It also creates a larger image out of the smaller thumbnails. It's something that i can play around with on my site. Its demonstrated well on the University of Brighton's 08 graduation showcase website for Graphics and Illustration.



http://www.gdi08.co.uk/

Examples of Wordpress

After looking into Wordpress I started trying to find examples of sites that have been created through Wordpress. So here are some of my favorites.

http://www.yarikka.com/

I love the simplicity of this page and the drop down effect of the menu at the top is really effective, also the clean lines and subtle use of colour really work. The site acts as a link page to various other blogs etc on different sites, so the simplicity helps this function well.

http://beaumitchell.com/

This is an example of a more photography orientated blog, which is mainly the sort of work that i would be displaying and also commenting on in my blog. I really like how the gallery is laid out very simply with a collection of small thumbnails that you click on to expand.

http://staydecent.ca/

This is a good example of the sort of thing i want to come out of this project with. It's very clean and simple and is very much a work in progress as this quote from the creator states:
'Staydecent.ca is a project all on its own: with constant experimenting and remixes to further learn and evolve my knowledge. The current form based on a tight grid inspired by varying typographic posters.'

I already know that my site isn't going to be as grand as the image i have in my head because my knowledge isn't at that level yet. However the more i think about it i dont want a website that is too over the top because i want the most important thing to be the content that is on the website. I think i am going to stick to a clean and simple design that is highly functional and easy to use and one that displays my work in the best way possible. Then if i want to get more advanced further down the line i will atleast have a foundation to build on.

2nd Option, Wordpress

Wordpress is:

'a state-of-the-art publishing platform with a focus on aesthetics, web standards, and usability. WordPress is both free and priceless at the same time.

This is taken off the wordpress website and so far it sounds right up my street. I think it could be down to the use of the words FREE and PRICELESS but with that aside, it is a program I am very interested in try to use and incorporate into my brief to create a portfolio website.

'WordPress has a templating system, which includes widgets that can be rearranged without editing PHP or HTML code, as well as themes that can be installed and switched between. The PHP and HTML code in themes can also be edited for more advanced customizations. WordPress also features integrated link management; a search engine-friendly, clean permalink structure; the ability to assign nested, multiple categories to articles; multiple author capability; and support for tagging of posts and articles. Automatic filters that provide for proper formatting and styling of text in articles (for example, converting regular quotes to smart quotes) are also included. WordPress also supports the Trackback and Pingback standards for displaying links to other sites that have themselves linked to a post or article. Finally, WordPress has a rich plugin architecture which allows users and developers to extend its functionality beyond the features that come as part of the base install.' (Wikipedia)

I've said that i want to try and create a portfolio site that also includes a blog. Instead of using an already existing blogging site such as blogger i could have a lot more control over the how the blog visual looks and interacts. I am not sure whether I will create my whole portfolio site in Wordpress or just have a blog that runs using Wordpress and then create another site to house examples of my work etc. I think that it will be good to get to grips with it and see what it is possible to create with it. Wordpress uses PHP so this could be a chance to try and get my head around it by incorporating some PHP coding into the blog.