Week 06: Website Prep, Asset Creation, Organization and HTML Part 1

Lecture: Development

Since all of you have created your website designs we can now start preparing for development. This lecture will cover how to properly create Photoshop templates for images, list proportions and dimensions and organize your file structure. We will also start to talk about HTML and will be focusing on structure, text and links.

We will be using Glitch as a development tool.

Lecture Video
Homework Part 1

Create a document that lists all major dimensions and proportions in your design as pixels. Put together a list of all the typefaces, type sizes, and colors being used in your design. Create a Photoshop image template file and output all your images for your website. Create a file system for your images and code.

Homework Part 2

Next week we will be having our midterm presentations. For your homework put together a presentation that has a slide that covers all of the below bullet points. Add the PDF of your presentation to the Slack channel and be prepared to present it over Zoom next week.

  • Description of your website
  • Market research and competitive audits
  • Sitemap, Sketches and Wireframes
  • Logo Design
  • Homepage Designs
  • Secondary Page Designs

Presentation Example 01
Presentation Example 02
Presentation Example 03

Lecture Slides PDF