Evaluation

The way that my piece meets the needs of the brief for this project is that I created a web portfolio that can showcase my work in a good light. As I used the simple viewer tool to create this I think that it has worked it a way that makes the work easily seen and a good way of going through the designs. The way that I think that my piece fails to meet the brief is that I don’t think that I planned the entire site quite as well as I could. I feel as though I did a lot of screenshots to show my development, but the initial planning I think maybe I could of done a little more, but a way that I work is just to experiment straight away rather than sketching ideas I would prefer to work straight into Photoshop. The strengths for my site I think is the design of my home page, although I made a lot of designs for the home page I think that I have chosen the right one that shows my work and style best. The weaknesses of the visual communication within my site I think might be simple viewer. It didn’t quite work out the way that I wanted it to, looks wise. I wanted it to have a white plain background but due to something that I couldn’t work out, we couldn’t find a way to change it from dark grey to white, so that doesn’t really fit in with the rest of the style of the site.  The audience that I think would be interested in my site would be he same type of audience as the research that I did, potential clients and people with a general interest in design, possibly people who are students who are looking into doing the graphic design course at Kent, they only way that I think my site could be mis-read or mis-understood is that I have put all my work into one simple viewer and is a miss match of different types of work including photography and graphic design. To improve or develop my site I think I would make more than one simple viewer gallery, so that they are separated within types of work. Another way that I would think about developing my site further is to experiment more wit typefaces, because I am comfortable with Helvetica Neue and that I think that it fits in so well with my style of work, I like to use it a lot within projects.

My time keeping for this project I think I managed really well. I made sure that I had plenty of time to do designing and then a lot of time for Dreamweaver, as it was a new programme for me I figured that I would need a bit longer than I would with illustrator or Photoshop to work out and learn about. My research helped me quite a lot as there was a lot of sites that I saw that were quite similar to my style and so I could relate well to those and this then helped me with my designing process. Throughout this project I used experimentation to create site looks in Photoshop, then went on from the home page designs to then create my other pages, this all was made in the same style to keep the continuity going.  The parts that I enjoyed the most about this project was the designing process and also learning about Dreamweaver, although Dreamweaver was the thing I enjoyed the least, I think that in the long run its better to have some knowledge and I can now expand on this. I enjoyed Dreamweaver the least at the time because there was a lot to take in, with codes and the small changes that take quite a lot of time and concentration, which is hard when there was a lot of projects and designing going on, but this is experience I need.  The times that I worked best within this project was through out designing, this is the part that I enjoy the most. To improve the parts that I found difficult I would keep trying and experimenting, after all, practice makes perfect.

Dreamweaver and Simple Viewer

I have made my final pages that I am going to put into my web portfolio.

Here are the designs:

I am going to put my simple viewer into a box of 800x500 on my gallery page. I made a slice which is exactly that size so that when it comes to putting my simple viewer gallery in it should slot on quite nicely. 

I am going to make my simple viewer gallery seperately so that I can collect all my work from personal computers. 

I have put all my site designs in to Dreamweaver and now I am going to make the roll over for the links. I have done it so that the grey words turn to a pale blue when the mouse is over the word.

This is the page of slices as an example. so all of the words to the left, I select the slice and edit slice..

When I clicked on the edit slice, this slice options box came up, I changed the name to 'OFF' or 'ON'..

OFF - when the word was black

ON - when the word is blue (once I have un viewed the original word on photoshop layers)

Save and save to Web and Devices and then this part is ready for the roll over part in Dreamweaver.

I clicked on the link that I wanted to edit and pressed backspace - deleting the word. I then went to Insert - Image Objects - Rollover Image.

That then brings up this box:

The next step I did was then to choose the original (grey word - Home_off). The second browse was then to choose the blue image, which will act as the roll over text. (Home_on)

This here is just showing a shot of what the navigation looks like when the roll over happens. I have done it so that the blue word shows when you are on that page. So this page is on home already, you can't see here but my mouse is hovering over the gallery link and it has gone blue. This works in the same way on every page with every link.

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

I am next going to put my simple viewer gallery into my website in Dreamweaver.

I am first going to just make a practice simple viewer, and then make the proper one later on once I know it works properly.

I have made the proper simple viewer, choosing the images that I wanted to include from work from this year (just a few of the ones I really liked - using photography and also graphic design work) This is where I am thinking of making two separate simple viewer galleries, for Photography and Graphic Design.

The first step I did here was to select the 800x500 box that I created by slicing on Photoshop and deleted what was inside of it (just the plain white box).

 The next step was to insert SWF from Insert > Media.

This then brings up a box, asking where you want to get this file from.

After selecting the simpleviewer.swf file I thought that this would be it and that the gallery slideshow would work. 

I saved the document and then previewed in the brower and this is what I saw:

At first it confused me and I didn't know where the files were going wrong. I wasn't sure where the files were meant to be placed so moving a few files around and choosing other places within the gallery folder and the SV File where my images and saved simple viewer file was kept.

After moving a few of the folders around - from the SV file folder, this is what I got next:

So from this, I knew that I was getting a lot closer to having the files in the correct place.

After seeking some advice from a friend who had the same problem with her simple viewer, she said she changing the coding slightly, re-directing the link to what folder the image was taken from. 

This is how I changed the coding:

 

 On the lines where it is: 

<image imageURL='image/jpeg brighton_page_1.jpg'
(as an example)

 And to make the image redirect so that the proper image gets there, to put SV File/ in between " and image/ . 

This then worked!

 

This is showing where the files ended up as the final view for the simple viewer to work.

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

Next I wanted the page to centre on the page when it is opened up in a browser.

In class I was shown a way to to this in quite a complicated way, took some screen shots along doing this:

First I went to Modify > Convert > Tables to AP Divs..

Once that has been done, Select all (cmd+A) and Insert >Layout Options > Div Tags..

that then brings up this window:

In the I.D part I just wrote the word wrap and pressed New CSS Rule which is just underneath the ID text box.

With this box that comes up for this I just pressed OK and this box then comes up:

the measurements that are in there at the moment are the ones which I put in which is what was needed. After clicking apply and ok, it then brings you back to the box from before and click ok again. 

-----

Half way through doing this way of centering the page, a friend who has already done this, said to me there was a way of doing this in a way that is a lot easier.

This way is to select all the page

Then go to Format > Align > Center

This worked well, first time and was a way which I learnt and saved me a lot of time, so then after learning to do this once, I then went through my other pages and did the same process. 

After doing this, I feel as though I have finished my website. I have done all the things I wanted to do to it my site, including the links which change colour with a roll over, the simple page layout and creating my own icons for the contact page.

Ideas for my About Page - Made in Photoshop

Ideas for my Gallery Page - Made in Photoshop

Just setting up the sizing of the webpage - the same size as my welcome page (1024 x 768)

Before I started making ideas for my gallery, I designed a few ways in which I could make my navigation.

By using a forward slash to divide up my name and the page that the viewer is on, I think is good idea, because then it still keeps a bit of continuity on all the pages with my name in the corner, in the same typeface as what I have used on the homescreen.

Now I am going to do some designs on how my gallery could look, I am going to keep the same theme going on throughout.

Here I have made a way that I could have navigation. I don't know if I'm making this too cimplicated for my self as my first website, with the different sections within the gallery.
I like the idea of having a different colour for the page that the viewer will be on, here I have made it black, but to bring this further, I might make the colour into one I have on the surf boards on my homepage.

(Colour idea)
I quite like the way of using a colour to make it easier to see what page the viewer is on. I have decided to use a blue from the surfboard idea that I had for my home page, but another idea that I've had is to use a colour that is on the page at that time to link it all that little bit more perfectly.

These screen shots are an idea of a layout that I could have for my gallery page. Like I said before I may have made it slightly too confusing for myself to make with the different sections under gallery - I am going to investigate this a little more with my tutor and see whether this is something that could be done with ease.

If not, I have made a few different options for me as an easier option with the navigation.
I quite like the idea of a scroll, going to the right, or an arrow (clearly seen) to be able to just move along, as you can actually only go to the side with an Apple mouse, a normal mouse only allows you to move up and down, which for this project, it could cause hassle for the viewers.

This is the simpler version. I do prefer navigation with more to it, but because I am still quite new to Dreamweaver, I think that it would be easier for me to start off with a simpler navigation.

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

I have decided to go for this simpler navigation.
For reasons that I stated before, I think that it's the best route to go down for my site.
What else I am going to do, to make the page look more professional, I am going to use simple viewer on here to create a slideshow type page to showcase my work.

 

Developing ideas into Dreamweaver

Here I am going to show some steps of putting my Photoshop designs into Dreamweaver. 

I have decided to go for this idea for my home page :

 I have chosen this idea becasue I think that it shows my piece of work to its full potential on the home screen. I think having just the one surf board didn't really show what I needed it to and so I wanted to have the colour versions on there, I think it shows my style a lot better also.

This is the image of the home page that has been sliced:

Designing a logo

To make my page a little more exciting I thought of designing a simple logo to put onto my page, which would the represent me and my site. I am going to show my ideas here, I may not go ahead with it, but I thought that it would look a little more professional on my site to have something like this.

Shapes that I could base the logo on.

Ideas for my Welcome Page - making on Photoshop

Here I am going to document some ideas that I have for my site using Photoshop for designing. Using the same process as what I previously showed as experimentation. I am going to show my progress with screenshots. 

This is the size of web page that I have been advised to set my site at. 

This is a first idea that I've had. I have decided to use my surf board project as part of my homepage here as this was the project that I found most enjoyable and loved the outcome of and I think they go well with the simple theme that I wanted to go with. I will be experimenting more, but I quite like this first outcome that I have done for my home page.

Second idea with the surfboard project as the image on home screen.

Here I have just played around a bit with the navigation idea. I have again used the surf board project as a basis. I really like the way that I have experimented, moving my name and navigation links around the line of the board. The only problem that I think that this could have is that if this stayed like this through out the whole of the site, there could be the impression that all my work is based on surf culture.

On the other hand, I could use this as my whole home page and then when the links are clicked on, change the navigation to something more simpler.

Here I have made the previous image bigger so that it will be the whole of the welcome page. With this, I thought that by clicking home it would then take you to the next page. This would involve an extra page that usually you wouldn't need, but I think that it could be a nice extra touch to the site.

I did this experiment from the first proper idea that I had. I decided to only use three for this idea to see what it was like to simplify it slightly more.

This is another drawing that I did for a previous project, but I didn't end up using it. But I still quite like the drawing. I tried to position the text where the face would be.

Another idea I've done I have used a photograph that I took and edited for the environment project. I quite like this as my welcome page because its a lovely picture and it shows my location well. The only thing that I think that I would have to change is that make it clear on the home page that it is a graphics site instead of a photography website.