### Agenda: 12:00: Welcome: <a href='../../lab/website/why.html' target="_self">Why learn digital fabrication? </a><br> 12:30: <!-- <a href='./overview.html'> -->Introduction, Course Overview<!-- </a> -->, <a href='../about.html'>Syllabus</a> <br> 12:45: Final project examples <br> 1:15: Final project brainstorm <br> 1:30: Final project discussion <br> 1:45: Break. Assign lab sections. <br> 2:00: <a href='../../lab/website/github.html' target="_self">GitHub, GH Pages</a> <br> 2:30: <a href='../../lab/website/htmlcss.html' target="_self">HTML, CSS</a>, <a href='../../lab/website/video.html' target="_self">Images and Video in HTML (and code tags)</a> <ol> <li> <p> <b>Training:</b> For lab access, please complete the <b>Machine Shop and Makerspace Safety-Soldering Required</b> course from the Harvard Training Portal, and send us your certificate and HUID# when you’re finished. </p></li> <li> <p> <b>Communication:</b> The main communication channels for this class will be this website as well as a Slack workspace, for which you should have received an invite. If not, try searching for "Science Center Makerspace" on the <a href='https://huit.harvard.edu/slack'>Harvard Slack Grid</a>. We will not need Canvas. </p> </li> <li> <p> <b>Software:</b> (this seems like a lot, but it's just about everything you'll need for the semester)</p> <ul> <li> Please download and install a text editor if you don't have one already (e.g., <a href ="https://www.sublimetext.com/">Sublime Text</a>). </li> <li> Everyone will also need a <a href ="http://github.com">GitHub account</a>. You'll also need to download the <a href ="https://desktop.github.com/">GitHub Desktop</a> application, open it, and link it to your account. </li> <li> You'll need to install the <a href='https://www.arduino.cc/en/Main/Software'>Arduino IDE</a>.</li> <li> Finally, you'll need a 3D modelling program. We'll default to <a href='https://www.autodesk.com/products/fusion-360/students-teachers-educators'>Fusion 360 </a> for workshops and tutorials, but you're more than welcome to use other software if you're already accustomed to it. In particular, this year we're encouraging Blender. </li> </ul> </li> </ol> <h3> Readings:</h3> <p> Read about <a href='../../lab/website/github.html' target="_self">GitHub & GH Pages</a>, <a href='../../lab/website/htmlcss.html' target="_self">HTML & CSS</a>, <a href='../../lab/website/markdown.html' target="_self">Markdown & Strapdown</a>, <a href='../../lab/website/staticsites.html' target="_self">Static Site Generators</a> (if you're already comfortable with command line), <a href='../../lab/website/video.html' target="_self">Images & Video in HTML</a>, <a href='../../lab/website/codetags.html' target="_self">Code Tags</a>. <br> </p> <h3> Assignment:</h3> <p> 1. Create a website and make a page with a proposal for a possible final project. Send a link with your website to your section TA. <br> 2. Download and install the software listed above. <br> </p> <p> You will use this website to document your work for the rest of the semester. You are welcome to use any tools you'd like to accomplish this, but if you don't have any previous web development experience, you may want to stick with one of the templates. If you're new to writing HTML, you may find it helpful to start with an online HTML converter. You're encouraged to use the HTML and CSS techniques we covered in class to cutomize your site -- even better if you research new techniques and make a novel website. You can also continue to update your website styling/layout for the rest of the semester. The goal for this week is to make the site functional, i.e., that you're able to use it to host your assignments in a way that others are able to find them. Please make sure your website is up and running, including your final project idea by Thursday. </p> <p> Your website should include: <ul> <li> An index.html page that contains links to each assignment page </li> <li> An "About" page, including a short paragraph about yourself </li> <li> Some customization using HTML and CSS </li> <li> A final project proposal </li> </ul> </p> <p> Feel free to discuss final project ideas with the teaching staff and with each other. The projects we showed at the beginning of class might give you an idea of the range of possibilities. It's okay to propose something ambitious; the teaching staff will work with you to scale your idea to a tractable amount of work for the course. Take a look through all of the topics we'll cover. Final projects should integrate most of the skills covered over the semester, including at a minimum: <ul> <li> 3D design and fabrication (either mold/cast, 3D print, lasercut, etc.)</li> <li> Electronics (input and output)</li> <li> Microcontroller programming</li> </ul> </p> <h3> Resources: </h3> <p> <a href='https://www.w3schools.com/html/default.asp' >W3 Schools - HTML</a> <br> <a href='https://www.w3schools.com/css/default.asp' >W3 Schools - CSS</a> <br> <a href='https://www.w3schools.com/bootstrap/default.asp' >W3 Schools - Bootstrap</a> <br> <br> </p> <p> Final Projects: <br> <ul> <li> Playlists from previous semesters <a href='https://www.youtube.com/playlist?list=PL4fKo3qhGqtp8Co99vPx46yHWH1GRD6Yk'> Spring 2020</a>, <a href='https://www.youtube.com/playlist?list=PLd9o4UNRhyQ3KzGIc-SDQtaYdr95KHms4' >Summer 2020</a></li> <li> <a href='http://fab.cba.mit.edu/classes/863.20/' >HTMAA course website and student pages.</a> </li> </ul> </p> <br> <br> <p> </p>