Session 1

Introductions

Welcome to Core Interaction! Let’s get to know each other a bit better:

• Your name
• Where you’re from (city and country)
• An interest of yours outside of design
• The last thing you searched on Wikipedia and why

Syllabus

We’re going to go over the syllabus for this course. Please stop me if you have questions! You can download it here or find it in Canvas.

Harmonic collection

All sections of this class have the same project – the Harmonic Collection. It is a collection of ten entries that will together create a website.

GitHub

GitHub is a platform that allows us to create, store, manage, and share code. We will host our projects on it. GitHub Pages is a service offered by GitHub that enables the hosting of a website, from the code that you have in your repository.

This part of the class is often frustrating for those new to code. I will try to make it as easy as possible, by using a template.

Here’s what we’re going to do, in order to be set up for the semester:

• Sign up for an account here: https://github.com/
• Make a copy of the template repository: https://github.com/jackrieger/harmonic-collection
  • Look for “Use this template” in upper right corner
  • Create a new repository
  • For the repository name (exactly the same, with no change in capitalization, spaces, or other): harmonic-collection
  • Public setting
  • Create Repository
• Create a Codespace on your copy of the repository
• Enable settings for live site hosting
  • Settings > Pages > Branch: main > Save
  • Go back to repository > About > Website > Check “Use your GitHub Pages website”
• Come up to me and show me that the site is live and working

Figma

Figma is the standard tool used for designing anything web- or app-based. It has both an in-browser and app version, and both are fine. We will very briefly touch on how to use it, but if you want to learn more they have great tutorials on their YouTube account.

Next class

Come to class with three ideas for your Harmonic Collection’s theme. This can be created in Figma, InDesign, or Google Slides. Export a PDF and be ready to be share at the start of next class.

Your presentation should include (for each idea):

• 1 slide that explains the idea generally and visually
• 1 slide that explains why you’re interested in the idea
• 2 or 3 additional slides that highlight some visual examples of sketches, inspiration, ideas, or other websites you like