General Assembly

At GA, I started out teaching a 10-week part-time course on front-end web development whose curriculum I subsequently helped overhaul As I continued to run the class, I built up an accompanying course website over time, starting out with something very rudimentary, then rolling, rolling, rolling. Now I teach an immersive course in user experience design, which has been as demanding as it has been rewarding.

FEWD Overhaul

I developed several exercises and projects that I’m particularly proud during this process, including a box model exercise, a way to explore the basics of classes and ids, a simple and visual way to approach page layouts, an introduction to nested selectors, an old-school game of rock, paper, scissors, and a basic cash register. I also developed a series of refactored color scheme switchers which I’ve found are very effective for progressively introducing more sophisticated approaches to refactoring JS–first in pure JS, then using a body class to remove CSS from the JS, next doing the same thing with jQuery, and finally making the code more flexible by using the “this” keyword.

FEWD Projects

I made a simple About Me website, which utilizes only a very basic set of HTML elements (no ids or classes), and very lightly introduces the concept of floats. This is followed by a single-column blog, which I use to introduce a greater range of HTML elements, along with nested CSS. That has a 2-column redesign which students transition to, using floats for page layout and for the navigation. It’s fascinating to me that it is doable now, but students who take the class actually learn to code layouts to be fluid right out of the gate. From here, they are ready to tackle the more complex layouts in Startup Matchmaker, which I give them with extra pages which have not been “designed”, as an exercise for them to imagine and create those pages based on the style established on the given pages.

The About Me project gives students the opportunity to build a 2-page website using only basic HTML elements and a minimal set of CSS.
Sartre’s List pushes students further with more nested HTML and more sophisticated CSS.
The Redesign of Sartre’s List requires students to produce a 2-column layout, and also offers subtle nudges to begin exploring CSS transitions.
Startup Matchmaker gives students room to explore more sophisticated layouts, as well as opportunities to think about design systems.