Intro to Web Design
- Semester: Fall 2026
- Instructor: Michael McDermott
- Location: Art and Design Building, Room 1020
- Timing: Mondays or Wednesdays from 10:30–1:10pm
- Office Hours: Scheduled here
Exercise 8
Wireframe
Description
Create a desktop sized (1440px wide) wireframe for the homepage of a monthly subscription service that delivers study, snack, and lifestyle items tailored to college students.
Header
- Logo
- Main navigation for 3 site links with account and cart
Hero
- Main headline
- Subheadline
- Primary button for students
- Secondary button for parents or gifters
Subscription Tiers
- Section header
- Three different levels of subscription tiers
- Each level includes pricing, details, and a button
School Year Timeline
- Section header
- Timeline showing important moments during semester with a sentence describing each box (orientation, midterms, finals, winter break, spring break, move out, etc.)
Item Category Spotlight
- Section header
- Categories and brief description (food items, study tools, personal care, utility gear, etc.)
- Partner brands
Reviews
- Section header
- Three reviews from students that include name, school, and review snippet
Footer
- Secondary navigation for corporate information, careers, and a help/FAQ help center
- Copyright text, privacy policies, and terms of service links
- Newsletter signup
- Social links
The above content was generated by Google's AI, whatever that one is called.
Requirements
- Above content represented on wireframe
- Wireframe created by hand
- Wireframe sketched nicely
- Desktop sized wireframe
- Image of wireframe in a Figma design file
Things to Keep in Mind
- There is no height restriction
- How does each section vary structurally?
Objectives
- Understand how to make wireframes
- understand the purpose of wireframes
Final Submission
- Turned in on time
- All requirements met
- Prototype link submitted on Canvas
- Linked on your class index