{"id":35,"date":"2026-02-12T07:55:10","date_gmt":"2026-02-12T15:55:10","guid":{"rendered":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/?p=35"},"modified":"2026-02-12T11:52:38","modified_gmt":"2026-02-12T19:52:38","slug":"class-4","status":"publish","type":"post","link":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/class-4\/","title":{"rendered":"Class 4"},"content":{"rendered":"<h2>In Class<\/h2>\n<p>Github: We will point subdomain to your repository.<\/p>\n<p>I will lecture about CSS Selectors, and we will have an in-class exercise.<\/p>\n<p>Then you will continue working on the Project 2.<\/p>\n<h2>Lectures<\/h2>\n<p><a href=\"https:\/\/www.dropbox.com\/scl\/fi\/xc1ndkc94fw4qe7ijxpac\/CSS-Selectors.pdf?rlkey=y1q472hn6hnikvara7fydb3n1&amp;dl=0\"><strong>CSS selectors<\/strong><\/a><\/p>\n<h2>Project 2 Demo<\/h2>\n<ul>\n<li><strong><a href=\"https:\/\/www.youtube.com\/watch?v=WYbmiE7v_VM\">Mobile CSS<\/a> <\/strong>(59 min)<\/li>\n<\/ul>\n<h2>Due Next Week (Feb 20)<\/h2>\n<h3>Reading<\/h3>\n<p><a href=\"https:\/\/alistapart.com\/article\/responsive-web-design\/\"><strong>Responsive Web Design<\/strong><\/a> by Ethan Marcotte (May 2010)<\/p>\n<p>This piece represents important web history: it&#8217;s the blog post where the term &#8216;responsive design&#8217; was coined. Read it for some historical context, but <em>do not <\/em>take any of the code examples at face-value. Most of them are outdated. In fact, you can stop reading before the section &#8216;<em>Adapt, respond, and overcome<\/em>.&#8217;<\/p>\n<h3>Project 2<\/h3>\n<ul>\n<li>After watching all demo lectures, revise your mobile CSS code <em>from scratch <\/em><a href=\"https:\/\/www.dropbox.com\/scl\/fo\/zademtdxh2msa03p79x3f\/AKE5fxRpu4aJT1ZCo4qhtaU?rlkey=qa10rgfyp0zc18ocuq842hqxk&amp;dl=0\"><strong>starting with these files<\/strong><\/a>.<\/li>\n<li>Also code the desktop view. Note that you&#8217;re jumping ahead here again. Next class, I will show how I would code the desktop view. You will need to employ media queries, like so:<br \/>\n<code>@media screen and (min-width: 850px) {<br \/>\n\/* desktop css here *\/<br \/>\n}<\/code><\/li>\n<\/ul>\n<h3>In Preparation for Project 3<\/h3>\n<p>Project 3 (starting in a few week 6) will require you to interview an IxD ArtCenter student who are in their 7th or 8th term. For now I want you to do two things:<\/p>\n<ul>\n<li>Contact a student who you want to interview. Schedule an a time with them from now until the end of week 6. Interview them. You will need their answers in a written format.<\/li>\n<li>Come up with 10 questions to ask them. A few to get you started:\n<ul>\n<li>Why did you decide to study at Art Center?<\/li>\n<li>What\u2019s your favorite gallery\/museum in Los Angeles?<\/li>\n<li>What was the most important class you took at Art Center so far?<\/li>\n<li>What projects are you working on right now?<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h3>Show &amp; Tell<\/h3>\n<p>Share a web discovery in the <a href=\"https:\/\/artcenterixp2-fni5190.slack.com\/archives\/C0AA3JQJPGD\"><strong>#show-and-tell<\/strong><\/a> Slack channel and give a short presentation in the beginning of class. This could be an article, a tool, or a coding technique you just discovered, or an inspiring website.<\/p>\n<p>Next week: <strong>Younhee <\/strong>&amp; <strong>Gloria<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"<p>In Class Github: We will point subdomain to your repository. I will lecture about CSS Selectors, and we will have an in-class exercise. Then you will continue working on the Project 2. Lectures CSS selectors Project 2 Demo Mobile CSS (59 min) Due Next Week (Feb 20) Reading Responsive Web Design by Ethan Marcotte (May [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-35","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"acf":[],"_links":{"self":[{"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/posts\/35","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/comments?post=35"}],"version-history":[{"count":3,"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/posts\/35\/revisions"}],"predecessor-version":[{"id":38,"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/posts\/35\/revisions\/38"}],"wp:attachment":[{"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/media?parent=35"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/categories?post=35"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/teaching.romanjaster.net\/artcenterspring2026\/wp-json\/wp\/v2\/tags?post=35"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}