NewtFire logo: a mosaic rendering of a firebelly newt
newtFire {dh}
Maintained by: Elisa E. Beshero-Bondar (eeb4 at Creative Commons License Last modified: Monday, 21-Aug-2023 18:17:30 UTC. Powered by firebellies.

Fall 2023 Syllabus (Schedule) Classes meet M W 4 - 5:15pm in Kochel 77.

Read the Course Description

This contains a detailed explanation of course policies and the basis for grades.

Jump Down to the Schedule

The button jumps to the closest day to today's date. Review the schedule as we get started to get a sense of how this course will work on a daily basis.

Tools and Resources

Download and install the following software on your own personal computer(s) as we start the course. These software tools are also available in our campus computing labs.

  1. <oXygen/>. The DIGIT program has purchased a site license for this software, which is installed in Kochel 77 and the Lilley Library computers. The license also permits students enrolled in the course to install the software on their home computers (for course-related use only). When installing this on your own computers, you will need the license key, which we have posted on our course Announcements section of Canvas.
  2. Zoom: Make sure your Zoom installation is up-to-date, and you are ready to connect. (We will use Zoom when we need it for office/project meetings.)
  3. Slack: Download and install the Slack chat client, configuring your account to use use your Penn State email address (the official address, which looks like, and not an alias based on your name that you may have set up), so you can join our Slack workspace: DIGIT-coders. When you receive an invitation to join this workspace you should accept.
  4. Be prepared to install other software as announced as we experiment with website infrastructures in this class
Resources for class:
Week 1 Class topics Do before class

M 08-21

First Day! Welcome and introduction to the course, our approach to projects this semesteer, our Open Lab arrangement with Erie Insurance this month, and project possibilities. Join the DIGIT 400 class group (link posted in Canvas) and discuss first assignment on POUR principles. Feature: Clay Shirky on Love, Internet Style on what lasts and matters in project design. ...

W 08-23

POUR and user-experience (UX) design in-class discussion. Preparation for visit from Erie Insurance. Read and annotate with WebAIM’s Constructing a POUR Website. Review a past student project and post your notes in the Canvas discussion, for a past project website (yours or anothers). This is meant to be educational! We produce semester projects in a rush and they provide good starting points for review and new development! What could be done to make a site better conform to POUR principles?
Week 2 Class topics Do before class

M 08-28

Dr. B introduces Lauren Harrington and Mary Jo Ingalls from Erie Insurance, and their design challenges for our class. Review / annotate with Erie Insurance resources

W 08-30

Project decisions/preparations for Erie Inurance. Git/GitHub review.
  • Open Lab Preparatory Milestone
  • Git/GitHub review exercise.
Week 3 Class topics Do before class

M 09-04

Labor Day Holiday: No classes. ...

W 09-06

[Dr. B is in Germany for the TEI-MEC Conference] Lauren Harrington and Mary Jo Ingalls from Erie Insurance meet / workshop with the class. Open Lab Project Milestone 1: Prepare wireframes to share on GitHub with our special guests.
Week 4 Class topics Do before class

M 09-11

Erie Insurance Open Lab Project Milestone review with Dr. B Open Lab work [TBD]

W 09-13

Open Lab design work Open Lab work [TBD]
Week 5 Class topics Do before class

M 09-18

Résumé development advice / tips. Résumé prep assignment, part 1

W 09-20

Résumé review workshop in preparation for Career Fair. Résumé prep assignment, part 2: Prepare a resumé for review: paper and digital, paper linked to digital
Week 6 Class topics Do before class

M 09-25

Workshop / review Erie Insurance project developments within the class. Prepare for presentations. Open Lab Project Milestone 2: Erie Insurance Open Lab web/animation preparation for review

W 09-27

[Behrend Fall Career and Internship Fair is today, 11am to 3pm.] Career Fair review. Open Lab work. [TBD]
Week 7 Class topics Do before class

M 10-02

[This may need to be rescheduled]: Presentation day for Erie Insurance representatives (MJ Ingalls and Lauren Harrington Open Lab Project Milestone 3: Prepare presentations of Erie Insurance Open Lab.

W 10-04

Open Lab with Erie Insurance Review. Introduce next design project unit: JavaScript. [Choose IDE: VS Code or Webstorm?] Open Lab Project Milestone 4: Complete / submit work on Open Lab projects
Week 8 Class topics Do before class

M 10-09

Orientation to vanilla JavaScript. Newtfire introductory examples: Small JS files that work with HTML and CSS to control simple user interactions. Event listeners and functions. How to associate with HTML. Install IDE for JS work (TBD: either VSCode or Webstorm)

W 10-11

Accessing HTML elements in the DOM. for and this in JavaScript. classList toggle JavaScript Exercise 1
Week 9 Class topics Do before class

M 10-16

JavaScript interactions with SVG

W 10-18

SVG, JS, and CSS. Introducing SVG Animations tutorial JavaScript Exercise 3: with SVG and CSS
Week 10 Class topics Do before class

M 10-23

Introducing Node.js and things you can do with JavaScript libraries Mia's SVG Animation Exercise: Apply SVG Animations tutorial to your own designs

W 10-25

Node orientation project: Node with Three.JS for 3D animations in the browser
Week 11 Class topics Do before class

M 10-30

Introdce React, Tic Tac Toe tutorial, options for adapting existing projects Complete Three.JS project

W 11-01

Learning to make React components. Next experiment: Add React to an existing project. Work through React.JS Quick Start and Tic-Tac-Toe tutorials
Week 12 Class topics Do before class

M 11-06

React work. Project options for organizing documents or images: Opioid Industry Documents Archive (OIDA on SciServer) [TBD: Python starter access to build on.] Milestone: Adding React to an existing project

W 11-08

[TBD] Options:
  • OIDA orientation and Python review / Jupyter. Introduce Flask
  • Or pull-processing possibiities from familiar projects
[TBD] Exercise for pulling document data
Week 13 Class topics Do before class

M 11-13

Experimental development workflow: Pulling / processing data. Packaging data for React components. Data exploration and packaging assignment

W 11-15

Project sprint development Project sprint milestone
Week 14 Class topics Do before class

Sun 11-19 to Sat 11-25

Thanksgiving Holiday Have a peaceful and productive week!
Week 15 Class topics Do before class

M 11-27

Interactivity / navigation / search features for project sites ...

W 11-29

Project sprint Project sprint milestone
Week 16 Class topics Do before class

M 12-04

Documenting your team's workflow. Accessible design considerations. Preparing to prese Project sprint

W 12-06

Last Day! Prep for DIGIT Works Presentations (slated December 9) ...
Finals Week (12/11 - 12/15) Due

W 12-13

Semester projects due by 11:59pm.

Finish developing projects, and send a post to me on GitHub and Canvas to indicate your team is finished.