Watch Code Lessons

Web design and development educational video site

image description

Overview: When I was a professor at Lewis University, I taught a popular website design and development course. In addition to teaching the course, I created a video website to aide in the learning process.

  • Problem: The website design course I taught at Lewis had students primarily from communications, computer science and art. Since the students were coming in with a different set of skills and strengths, they would not be learning at the same pace as each other. What is challenging to one group of students might be easy to another and could switch depending on the topic.
  • Solution: To keep all of the students engaged and able to review difficult content, I designed and built a video instruction site WatchCodeLessons.com.
  • Customization: I first sketched a low-fidelity mockup with pen and paper, then the site in WordPress with HTML and CSS. The site was organized into courses with short lessons to make it easier for students to learn the content.
  • Results: The site was successful. Students were able to learn the areas they struggled with faster which allowed me to cover more content in class because students were not falling behind on earlier topics.

image description

Low-fidelity mockups

image description

Top: Landing page which explains the site and links to each course. Right: HTML page layout with a course description and course list. Below: Lesson playout page with video and quick links to other lessons.

image description
image description