Project One: Benguait Ampersand Analysis
Plain HTML
Color Block Wireframe
Final Site
Project 2: Drag-and-Drop Garden Game
Garden Questions - Running List
Style Tiles
Style Tile 1: Photo-Realistic
Style Tile 2: Cartoon-ish
Style Tile 3: Brambly Hedge
Updated Style Tile
Further Updated Style Tile
Final Style Tile
Colors and Assets
Color Palette
Digital Assets
Wireframes
Build-a-Garden Wireframes: Static
Build-a-Garden Wireframes: Animated and Interactive
Build-a-Garden Animated Site: First Draft
Build-a-Garden Animated Site: Second Draft
Build-a-Garden Animated Site: Third Draft
Build-a-Garden Animated Site: Final
Project Three: Long-Form Journalism Article
Final Style Tile
Wireframe sketches:
One,
Two,
Three,
Four
Rough Wireframe: Mobile
Rough Wireframe: Tablet
Rough Wireframe: Desktop
Final Wireframe: Mobile
Final Wireframe: Tablet
Final Wireframe: Desktop
Plain HTML Code
Final Site
Stand-Alone Exercises
Exercise 3: Froggie's CodeLand
Exercise 4: Responsive Welcome Weekend
Exercise 5: Responsive Resume, Adobe XD Wireframe, Desktop Variation
Exercise 5: Responsive Resume, Adobe XD Wireframe, Mobile Variation
Exercise 5: Responsive Resume, Desktop Div Structure
Exercise 5: Responsive Resume, Mobile Div Structure
Exercise 5: Coded Responsive Resume
"INTERNETING IS HARD" Tutorials
Basic Web Pages
.
Hello, Atom! Part 1
Hello, Atom! Part 2
Hello, CSS! Part 1
Hello, CSS! Part 2
Links and Images: Links
Links and Images: Images
Links and Images: Random Bits
Semantic HTML
Responsive Web Design