Web Design I


Queens College
Web Design I

Fridays 10:00 AM - 1:50PM
Blackboard and Zoom (connection info in Blackboard0

Course Description

When designing in general, and especially when it comes to web or interaction design, these four steps are key when it comes to developing a website from start to finish: Discover, Define, Design and Develop. Over the next few months in this class we will go over the four D’s in detail. ”Discover” really focuses on the research that must not be overlooked when starting to design for a website, whether it is competitive audits, current client brand understanding or market research. You must “define” the user experience and figure out the structure of the website by creating sitemaps and wireframes. Then comes the “design” process, which includes static designs based on the wireframes that have already been created. These designs are normally created in Photoshop. Finally comes website “development” which is usually created using front-end programming languages like HTML, CSS and JavaScript. Occasionally designers will also program templates for a content management system (CMS) like Drupal, WordPress or any other common CMS platforms but this requires more advanced programming skills like PHP, Python and Ruby. (We will not have time to cover these languages in this class.)


HTML & CSS by Jon Duckett

Course Repo


Course Requirements

Your participation in the class labs and activities will ensure your success. However, with COVID and online learning, this course is designed to be flexible. Lectures will be recorded, and supplimental videos might also be provided. These videos will be posted weekly in Blackboard. While the class is flexible due to COVID, you are expected to produce work that is full of energy and completed and presented to the best of your ability.

It is your responsibility to turn in work on time, to make up any missed assignments, and to catch up with the class in the event of an absence.

  • Practice activities can be made up at any point.
  • Assignments can be made up with partial credit.
  • Mid Term and Final Project will lose a point a day for being late.

Contact the professor by email in advance if you will be late with the Mid Term or Final. For the most up-to-date information (including what is due next class) visit the class website.

Visual assignments and projects will be graded based on: one for technical merit, concept and your demonstrated ability to understand the material. You are expected to spend as much time working outside the classroom as you work inside the classroom. Schedule your time accordingly.

It is strongly suggested that you bring your own laptop. This course will be hands-on activities driven, and some activities will include installing of software. You should have a 4gb or larger thumbdrive to transfer digital files. The class will include a lesson on using Github as a file hosting space. You will use Github to submit assignments. Emailed files will not be acceptable.

Professor Information

Name: Barbra Masters
Email: bamasters@bmcc.cuny.edu or masters.redux [at] gmail.com
Office Hours: This class is structured to include ample lab time to work through technical aspects of the course and to receive assistance. If you have questions outside of the class time, contact me via email to schedule a remote meeting.



Practice Activities 40%

  • Market Analysis(due week 3)
  • Project Design Document (due week 3)
  • Site Map and Sketches (due week 4)
  • 3 Grid Layouts(due week 4)
  • Logo (due week 5)
  • Home Page Wireframes (due week 5)
  • Site Structure and Links (due week 9)
  • Typography and Color (due week 10)
  • Images and Media (due week 11)
  • Grid Layout Exercise (due week 12)
Project 60%


Your participation in the class labs and activities will ensure your success. However, with COVID and online learning, this course is designed to be flexible. For this reason, the practice activities will be used as the measure of your participation and attendance.


  • To earn an A
    All class work and homework is excellent. Projects have been completed when assigned. The work shows a development and understanding of the principles discussed in class and exceeds expectaions. It is presented immaculately. There is regular and prompt attendance and participation during critiques and an enthusiasm toward the material being presented throughout the semester. This is exceptional work.
  • To earn a B
    All assigned work completed in a thorough manner. An understanding of the principles and lessons covered in class is evident. The student comes to class regularly and on time and participates in critiques and discussions. This is better than average work.
  • To earn a C
    Most class assignments and homework have been completed. Regular attendance but minimal or negative class participation. There is at least some understanding of what’s being presented in class. This student shows some interest in the course content. This is average work.
  • To earn a D
    Most class assignments and homework have not been completed. Marginal effort made to understand the course objectives and very little or negative participation on behalf of the student. Spotty attendance. This means below average work.
  • To earn an F
    Student has not completed 1⁄3 of the course work and has missed too many classes. This student doesn’t participate or has a bad attitude and shows no interest. It means not enough work, attendance, and/or effort to pass the class.

If our artists are not versed in technology, who will imagine what we will become, who will ask what we should not be?