Web Development

This course is essentially a redesign of the Dreamweaver CS5+ course series. However, in this series the focus of the course is directed towards the coding of websites and not the application for doing so. I chose to pursue a course of this nature to move away from the dependency of Dreamweaver. There are many applications used for web development and I feel that the choice should be made by the individual instead of the instructor.

By using a flipped classroom approach, I was able to eliminate a session from its initial iteration as the Dreamweaver CS5 course which required three for a complete understanding of the topic. Prior to the first session, participants were asked to view a series of tutorials from lynda.com. I then referenced many of the topics in those tutorials during the inital session to serve as a review for the participants. This allowed me to forgo providing direct instruction in HTML and move directly to CSS principles.

The overall goal of the course suite is to develop a responsive website using HTML5 and CSS3. During the sessions, we explore CSS code structure, proper usage cases and advanced topics through a sseries of hands-on exercises. Animation, media queries and content transformation are also included in the course.

Course Handouts

Web Design

Web design can be a tricky concept to teach and this course was no exception to the rule. I struggled in figuring out the concepts and a way to teach those concepts to a large group. In the end, I was able to develop two courses which accurately expressed current web design principles. These two courses centered around the visual presentation of the site and the content structure of the site.

In the visual presentation course, I leverage collaboration as the biggest tool in web design. Anyone who has ever done any design work knows that its never a singular task. At the very least, they ask a friend "what do you think of this?" or "does this make sense?". In this course, I first run them through some stable concepts used in web design and then I have them form groups and evaluate a site using the tools that I provided. They're asked to identify positive and negative design elements of the sites they evaluated and then present these to the classroom for discussion. This is the crutch of the course. The ultimate objective is that they leave with the necessary tools, applied principles, and friends they can bounce ideas off of later.

The content structure course focuses instruction on proper ways to setup your folder structure and determine what should be retained on an existing site or what to include on a new site. As in the previous course, collaboration is a key element. I first begin the course with information about development processes currently in use. We then proceed to an exercise in determining who the key stakeholders that the site will attract and what items they will want at close reach. Using this information, we're able to determine the site navigation which, in turn, defines the folder structure. Leaving the course, they should take away the development processes and tools needed to structure their sites.

Course Handouts

Adobe Dreamweaver CS5+

Over the past two years, many iterations of this course have been taught. I intitally started three individual sessions of the course under a pedagogical approach. As time continued and the nature of education grew, the course was modified to fit the needs of the faculty and staff. The current course is being taught through a flipped classroom aproach. Attendants are asked to complete a set of tutorials prior to the in-class session. This allows me to focus on the indiviual needs of those in the course as well as the overall class itself.

Because of the complex nature of the software and the challenges of web development, I've broken the course up into three sessions in its inital state. The first course focused primary on HTML coding. The simple syntax as well as text and image modifications. In a nutshell, this course was designed for those who would simply be editing a website. The second and third courses are centered around an understanding of CSS and page structure. In these two courses, I guide the attendants through the skills necessary to produce websites from scratch and provide them with the tools to succeed in the web development realm.

Course Handouts:

Adobe Photoshop CS5+

Photoshop is probably one of the most extensive and well know applications by Adobe, next to Illustrator. Each of these classes typically have high enrollment and an unobtainable expectation to learn everything about the software in the mere two hours time-slot of the section.

After many iteration and failures, I finally developed a solution that satisfied all. It's still not the full gamut of the software but provides a good overview and the necessary resources for someone that's interested in learning and exploring more of what the software can do.

To start, we go over the basic interface and tools that are available for use. I include a handout that describes each tool and its functions, which is linked below. We then move into simple resizing and cropping before starting the more complex things. The content-aware tool, clone stamp and image mask function are a few of the tools covered in the later portion of the course. I end the course with information about the different file formats and when they should be used per project type.

Course Handouts

Percussion CM System

Percussion Rhythmyx CM System is the content management system currently used by the university; we have branded it as Ensemble. For these courses, I have a wide variety of participants. Some have a background in webdesign, others have never touched a site but the beauty of a content management system is that you don't need to understand how to code to build a site. There are four sessions of the course ranging in levels of difficulty. The first course is a simple introduction to the system. We build a page, edit text and insert images and links. The second course takes things a set further by introducing how to include multimedia and relationship items. There is also a navigation course about putting the entire site together from the homepage to the tying of items together via navigation. The final course is the most complex. In this course, we dive into the use of CSS with the system to create a unique web presence that differs from the standard templates developed by the University.

Course Handouts