Wireframes

In this class, the objective of wireframes is to create a detailed visual representation that closely matches the intended final product. Wireframes should include consideration for "web-safe" or accessible custom fonts, as well as a color scheme that can be translated into CSS using HEX or RGB values.

For submission, you’ll need to provide both annotated and unannotated versions of your wireframe. The annotated version should include color-coded outlines representing the planned HTML structure.

Red: <h1> ... <h6> tags
Blue: <p> tags
Green: <img> tags
Black: <div> tags (especially Flexbox and Grid containers)
Yellow: all other tags

To streamline this process, it is recommended to use a drawing application with layers, allowing you to easily toggle annotations on and off before exporting.

Most projects in this class will include an assessment of how accurately the wireframe is translated into the final submission.