Completing Website

Today I applied my imagery to my website and added the information about myself. I had to adjust the images to 500mp high in Photoshop and ensure that the picture were set to RBG mode.

 

Website Images

Today I edited the images for my website in photoshop so they are the right size for web. This is an example of the size it will be.

Web development

I worked out the real layout of my website in flash, I basically copied over my ideas from illustrator. I figured out the size the images of my work would need to be, height 500px.

Website Inspiration

http://album.alexflueras.ro/galleries/landscapes.html

http://www.sunnyshen.com/index.php?showimage=200

Website development

Today I experimented with web layouts to see what would work best for my portfolio website. This is the idea I came up with. 

This is the idea for my main page, the grey box will be a picture.

This is an idea for my photography page, I am going to have a selection of images under each title and lay them out so you scroll to the right to view them

Adjusting work for web

How to adjust illustrator and photoshop documents for my website.


Photoshop
image - image size
- resolution 72 dpi 
- save as jpeg


Illustrator 
- export as jpeg
- resolution - screen 72dpi
 - open in Photoshop to change size of image


- view all adjusted work at 100%

corporate branding sweet logos

website development

http://thedesigninspiration.com
- a website I looked at for inspiration, I particularly liked the logo designs. 


Thumbnail ideas for pages, and another idea of a photograph of a landscape of buildings with hand drawn illustrations with in it and titles on the buildings.

Website Idea

Strips of photos, top and bottom with a low opacity. 

Logo large, and sub-headings in a pale colour.

Website Progression

Scribble - box for heading 

Arrow

Template - website

Website Layout

Thumnail Designs

Thumbnail Worked Up

Websites for reference

http://rankin.co.uk/special-projects/#/fullscreen  (scroll for images)

http://www.burnmagazine.org/ (colours + simplicity)

http://www.fernandacohen.com/ (enter page)

http://www.giancarlo-fajardo.com/work.html (logo +links)
http://www.amyguip.com/ ( arrow + title page)

http://www.jessicahilltout.com/ (photos layout and type)

http://www.lillarogers.com/  (animations + links)

http://www.andrewbannecker.com/  (main page)

http://www.johnwrightphoto.com/  (large photos loading page)

1. Scroll - rankin.co.uk

2. colours and simplicity - burn magazine

3.loading page -fernandacohen

4.logo and link -giancarlo-fajardo

5.arrow and logo -amyguip

6.photos and type - jessicahilltout

7.animation and links -lillarogers

8.main page -andrewbannecker

9.large photos- johnwrightphotos