Hello Advanced Students,
Your newest assignment is to design a website using photoshop and your own creative skills, and then prepare and code the page using Dreamweaver. This website should essentially be a mirror of your previous HTML project, but graphic based instead of text based.
Workflow: You may use an original idea, or base your website design from a tutorial (links below). The style of your website should be graphically rich. Links below are provided to generate ideas, but you are allowed to follow the tutorial if you wish, or borrow elements you like.
You will design your page as Photoshop design at a set screen size. The slice tool in PSD is used to draw out boxes. PSD will export your images, presliced and converted into jpg's, along with an HTML document, ready to code in Dreamweaver. Watch the video tutorials linked below first to understand this workflow. After preparing the document in Dreamweaver you can link your buttons and insert content into each page.
1 week for page design, 1 week for coding.
Workflow Video:
PSD- Dreamweaver Website Part 1 - How to "slice" up a design to prepare for coding
PSD - Dreamweaver Website Part 2 - How to code your sliced up PSD page
Tutorial Links:
Tutorial - Grungy Paper Texture Website Design
Tutorial - Highly Textured Website Design
Tutorial - Grungy Translucent Website Design
Tutorial - Unique Colorful Website Design
- SW