Week 8

Pair-programming review

We’ll start off by looking at your Project 2: Spread progress. Break into smaller groups again with your people and disperse around the room (these are shuffled from last week):

• Group 1: Dhruv/Ina, Lucine/Bobby, Madhura/Hamza

• Group 2: Tanvi/Sanjana, Vasu/Jocelyn, Shanshan/Giselle

• Group 3: Sandra/Amaya, Dayna/Vidushi, Shivi/Dusha/Sushanto

• Group 4: Andre/Fahila, Caroline/Myriam, Azra/Mariia

• Group 5: Kendall/Sarah, Kinjal/Abhishek, Keren/Chi

Present your project to your group, as is custom. Each group will have about 30 minutes among themselves, and then around 15 minutes with one of us (your instructors), with 5 minutes per project/pair. You know the drill!

This week, you should be presenting/sharing from your live, in-progress pages. Let’s try using Slack huddles for this—when you find each other, start a direct message group with everyone and then screen-share in the huddle/room… “thing.” Have these up, with everyone in them, before we get to your group. Again, we want to see everyone’s work!

Let’s try and wrap this up around 10, again.

We’ll take our break here again, after we’ve made it around to all the groups.

Grid!

Building on our knowledge of flexbox, we’ll take a look its spiritual continuation in grid:

And (CSS) grid

Let’s try it out

Let’s pick up from our demo last week—but now using grid instead of flex:

• Add print media query for variables, altering sizes/colors
• Scope existing layouts by adding screen
• Set up grid-template-columns for mobile and desktop
• Start with grid-column and grid-row numbering and span
• Switch to named grid-template-areas

For next week

• You’ll be completing the last phase of your Spread projects, Print and refinement.

  Work with your partner to refine your page design/code and also to incorporate feedback from today. You’ll also be adding your print styles, as we did in the example!

• When you are done, submit a link to the repo and live URL:

  Assignment submission

• Prepare together to present these next week! Since we effectively halved the number of projects, we are going to still meet as a large group and go through them all together—we’ll meet here in the auditorium, as usual.

  The format will be similar to last time—each project/pair will have about 5 minutes to present their work. In this time, introduce us to your reading, explain how you wanted to respond to this with your design, and then show us your page. Unpack your creative, technical, and collaborative challenges. Tell us the story.

  Again, we don’t require a deck but you should use the full 5 minutes you have—without much over/under. (Practice presenting together to keep to your time.) Start with showing us your mobile layout before taking us through your desktop and print manifestations. You could show us your sketching/process, if you’d like—but keep in mind that you only have the 5 minutes and you need to show us all three forms of the final project, thoroughly. You should be presenting your page from the live URL you have submitted, and we should hear equally from both partners. Your presentation is again part of the project.

  Each presentation will be followed by a few minutes of feedback and critique from your classmates and from us. We’re looking forward to it!

Session recording

Session recording