Course Information
Instructor
Office Hours
- Monday/Wednesday: 9:00-10:00a
- Thursday: 3:30-5:00p
- Make an Appointment: Schedule via Calendly
Course Description
CODE + DESIGN 2 continues exploration of interfaces, concepts, processes, and techniques for creating front-end web designed sites, applications, and experiences. Introduces web programming, JavaScript libraries, and a modern version control process. Establishes an intermediate understanding of HTML, SVG, CSS, JS, and the web-as-a-platform.
This course asks one question: How should things behave? In DESN 368, you learned how to make things look right. Here, you'll learn how to make things behave right — treating code as a design material with properties, behaviors, and constraints, just like paint, paper, or clay.
Throughout the quarter, you'll work with four digital materials: CSS systems (tokens, themes, user preferences), SVG (interactive, accessible graphics), animation libraries (GSAP, ScrollTrigger, choreographed motion), and creative code (finding your voice through code). All work is applied directly to your portfolio — nothing is throwaway.
Learning Objectives
Program Learning Objectives (PLO)
- PLO-2: Technical Skills — Demonstrate proficiency in relevant design skills
- PLO-3: Design Methodologies — Apply design methodologies including systems thinking, design thinking, inclusive design, and circular design
- PLO-4: Design Process — Engage in a design process that includes research, ideation, and prototyping
Course-Specific Objectives
Technical Skills
PLO-2 — Demonstrate proficiency in relevant design skills
Behavior Design
Design interactions that communicate intent and feedback. Evaluate interaction quality by feel (timing, easing, feedback), not just function.
Motion & Choreography
Choreograph animations using GSAP and ScrollTrigger. Apply timing and easing so motion enhances rather than distracts.
Technical Execution
Implement state changes with JavaScript and CSS. Work with DOM manipulation, CSS Custom Properties, and inline SVG.
Design Methodologies & Process
PLO-3 & PLO-4 — Systems thinking, inclusive design, research, ideation, prototyping
Adaptive Systems
Build interfaces that respond to user context and preferences using design tokens (CSS variables) and preference media queries (prefers-color-scheme, prefers-reduced-motion).
Inclusive Interaction
Integrate accessibility as core practice: keyboard navigation, focus states, ARIA roles, reduced-motion alternatives.
Creative Voice
Develop a signature interactive experience expressing personal design voice through code. Research, ideate, and prototype within portfolio context.
Grading Breakdown Important
Project Evaluation Rubric
Labs & Weekly Work
- Micro-assignments and exercises
- Skill-building tutorials
- Consistent practice and iteration
Participation & Engagement
- In-class activities and peer collaboration: 10%
- Attendance & presence: 10%
Final Portfolio
- All projects integrated and deployed
- Accessibility audit completed
- Professional presentation on GitHub Pages
Grade Scale
Assessment Philosophy
While not formal "gates," all work is evaluated for:
- Technical Quality: Does it work as intended?
- Understanding: Can you explain your choices?
- Problem-Solving: Can you debug and adapt?
- Communication: Is your code/documentation clear?
Attendance & Participation 30% of Grade
In DESN378 Code+Design 2, your engagement and participation are crucial components of your learning experience, accounting for 30% of your final grade. Regular attendance and active involvement in class activities are essential for mastering interactive design concepts and techniques.
Attendance Expectations
- Students are expected to attend all scheduled classes, both Tuesday lectures and Thursday practical sessions.
- Punctuality is crucial. Arriving late or leaving early disrupts everyone's learning environment.
- If you must miss a class due to illness or emergency, please notify the instructor as soon as possible.
Engagement and Participation
Your engagement level will be assessed based on:
- Punctuality and preparedness for each class
- Active participation in discussions, critiques, and in-class exercises
- Receptiveness to feedback and willingness to apply it
- Overall disposition towards peers and the course material
- Proactive translation of web design concepts into practical applications
- Commitment to establishing a disciplined web design practice
Important Notes
- There are no "free" or "excused" absences. Every class session is valuable for your learning and professional development.
- If extenuating circumstances affect your attendance or participation, please communicate with the instructor promptly to discuss your situation.
- Engagement is not just about being physically present. It's about actively contributing to the learning environment and pushing yourself to grow as a web designer.
- Your participation grade will be assessed holistically throughout the term, considering your overall engagement and growth in the course.
Course Policies Required Reading
Late Work
Assignments build on each other—you cannot proceed until previous work is complete. Late submissions delay your progress. Extensions are available for documented emergencies.
Academic Integrity
You must write your own code. While you can reference resources and get help, submitting code you don't understand or didn't write is plagiarism. When in doubt, cite your sources.
EWU expects its students to have the highest standards of academic integrity. Academic honesty is the foundation for a fair and supportive learning environment for all students. Personal responsibility for academic performance is essential for equitable assessment of student accomplishments. The university supports the faculty in setting and maintaining standards of academic integrity. Charges of academic dishonesty are reviewed through a process that allows for student learning and impartial review. EWU’s academic integrity policy is available online at:
(https://inside.ewu.edu/policies/policies-and-procedures/wac-172-90-student-academic-integrity-3/"
AI Policy
In this course, students can use AI-based tools (such as ChatGPT and GitHub Copilot) on some assignments. The instructions for each assignment will include information about whether and how you may use AI-based tools to complete the assignment. All sources, including AI tools, must be appropriately cited. The use of AI in ways inconsistent with the parameters above will be considered academic misconduct and subject to investigation.
Please note that AI results can be biased and inaccurate. You are responsible for ensuring that the information you use from AI is accurate. Additionally, pay attention to the privacy of your data. Many AI tools will incorporate and use any content you share, so be careful not to unintentionally share copyrighted materials, original work, or personal information.
Learning how to thoughtfully and strategically use AI-based tools may help you develop your skills, refine your work, and prepare for your future career. If you have any questions about citation or what constitutes academic integrity in this course or at Eastern Washington University, please contact me to discuss your concerns.
Accessibility
Students with documented disabilities should meet with me ASAP to discuss accommodations. All discussions remain confidential. Contact Disability Support Services for documentation.