UX Design — Interactive HTML Portfolio
ABCD- Key Concept
- Communication
- Related Concepts
- Aesthetics, Function
- Global Context
- Personal and Cultural Expression
- Statement of Inquiry
- User-centered design aligns aesthetics, function, and identity to serve a defined audience.
- Inquiry Questions
- Factual: What is UX vs UI? What is a user flow? Conceptual: How does a design reveal assumptions about its users? Debatable: Is accessible design always good design?
- Skills / Tools
- Analyze existing portfolios and define an audience. Plan a clear journey from Home to Projects to a project detail view and back. Develop an interactive HTML portfolio with AI, test navigation without coaching the user, and use feedback to revise it. Improve hierarchy, apply consistent design rules, and explain changes with before-and-after evidence.
- AI Integration
- Students direct AI to implement their portfolio in HTML, CSS, and JavaScript. They specify the structure, content, and useful interactions, then inspect and test the result. Design decisions stay with the student: real user observations guide revisions, and students explain what they kept, changed, or removed and why.
- Summative Assessment
- Working interactive HTML portfolio and completed portfolio handouts, including user testing and evidence of revisions. Design folder emphasis on A (portfolio analysis, audience research, and brief) and B (requirements, user journey, and justified design choices), with a record of AI use.
- Budget Note
- 0 RMB.