For this assignment we are going to do a version of a Style Tile for your midterm site. To complete the assignment you can either Option 1: Download the Style Tile PSD file and complete it. This option is best if you are already comfortable with Photoshop. If you aren’t […]
Christopher Stein
Class on 10.23.19 Quizlet We will start with the quizlet live games How to get on: Download the app and put in the code I will show on the board. Search for Quizlet in your App Store Go to quizlet.live and enter the code I will show on the board […]
Class on 10.21.19 Assignment 6 Q&A We are going to start the day answering questions about assignment 6 and making sure that everyone understands the Midterm content. Then we are going to move on to the Gestalt Principles. Gestalt Principles Today I will briefly introduce you to the Gestalt principles. […]
A big part of graphic design in general and the web design we do in this class is communicating a message to a particular group of people (audience). The Gestalt Principles were created to help explain how people make sense of what they see. They are particularly useful for web […]
There are times when you need to save or send an entire folder of files. Also, sometimes you need to make a file smaller in file size. Compressing or zipping the file is a way to be able to do both. In this class you may be asked to submit […]
For this assignment you will continue the work we did in class in Class 12 and create the HTML for the three pages of the midterm project. You will also submit the basic wireframes from the Midterm Page Outlines (there will be a later assignment to submit more detailed wireframes. […]
The content for the midterm version of the web site can be found in the Word files in the Dropbox folder linked below. You will download the files and then convert them to HTML. We will cover this in Class 12 and Class 13 and the initial conversion is part […]
Class on 10.16.2019 Today in class we are going to get everyone started on the midterm project by completing what would have been Assignment 6 and moving forward from that to start to put content on the page. Basic Wireframes and HTML formerly Assignment 6 We will start by looking […]
Before completing this assignment you must first complete assignment 4 because this assignment builds on that one. The general goal for this assignment is for you to add images to the typographic hierarchy from assignment 4. One difference is that assignment 4 was on CodePen and for this assignment I […]
Today we are going to start out going over adding images to a page. Then we will start to talk about planning and preparation for the mid-term project. Images We will spend about 20-30 minutes at the start of the class going over what we have done and what is […]
The information here is the outline of content for the three pages that will be on the midterm project. The purpose of the outline is to summarize what content areas will be on the page. I’m having you start with these so you can get an overall page structure set […]
Class on Wednesday, October 2, 2019 (we had no class on Monday 9/3/19 due to school holiday) Note: We believe that those of you experiencing login issues related to the OpenLab should now be able to log in. Please try and let me know if you are able to or […]
Class on Wednesday, September 25 Today we will work in roughly two parts. Part 1: Review of Assignment 3: CSS Grid and Assignment 4: Typographic Hierarchy Part 2: Adding images and Grid to Assignment 4. Part 1: Review of Assignment 3: CSS Grid and Assignment 4: Typographic Hierarchy We will […]
Today we are going to go over adding images to the page. This will inlcude not just the basic image element but also CSS to make images responsive, placeholder images and the figure element. Typographic Hierarchy and Assignment Review Before we get into the new material of the images we […]
Sometimes you know that you want an image on your site but haven’t yet found the right image. To keep that place and let you continue with building the site, you can use a placeholder image. They all work on the same basic idea: they provide the value for the […]
Images are by default inline elements that are a certain size and will take up that space on your web site. For responsive web design we need our images to be able to shrink in size if the container they are in is smaller than the image. For example: The […]
For this assignment you will start with the CodePen we worked on in class about Typographic Hierarchy: https://codepen.io/profstein/pen/oPKzML That is the link to the page without any CSS. If you want to continue CSS you worked on in class you are welcome to do so. Just make sure you forked […]
Today were are going to go deeper into typographic hierarchy. PART 1 What is Typographic Hierarchy We will look at and discuss my (updated) post on Typographic Hierarchy: https://openlab.bmcc.cuny.edu/mmp-240-fall-19-stein/2019/09/16/typographic-hierarchy/ PART 2: Examples and Inspiration Next we will look at the following for examples and inspiration related to typography and hierarchy: […]
CLASS 6 on Monday 9/16/2019 Today we are going to look into typography and how to implement it on the web using CSS. Typography Basics We will start with looking at typography basics. This post covers that and more. Don’t worry if you don’t pick it all up right away. […]
This post presents the basics of typography through a set of rules to follow. Like all rules they are made to be broken, but you should learn them first before you start breaking them. If you follow these rules your web typography won’t suck. It will most likely be pretty […]