In week 1 the front-end, backend, and design classes were all together to cover basics, but in week we finally broke out and settled into the design nest. Now that we’d covered the basics of responsive CSS using media queries (check out my week 1 weekend project here!), it was time to dive into some advanced CSS topics like specificity, positioning, placeholders, and mixins.


Panels, Parties, Awesomeness

I’m one of the few Austinites that freakin’ loves sxsw. All of these beautiful intelligent people come into our city and impart their knowledge and learn from each other.

Feeling like a badass

I met so many people and told them about what I was doing, it felt really great to be able to say what I’ve done. And it’s only been two weeks. It gave me a lot of hope for having this network after graduation.


SXSW Traffic & AirBnB stress

I mean yeah. Don’t get me wrong, SXSW isn’t without its cost of disrupting my every day routine. I haven’t been biking which sucks. And I’ve also been eating tacos for every meal which sucks / doesn’t suck?


I missed panels this Sunday, Monday & Tuesday to work on my project and that was a huge bummer. But I did learn a lot during my assignment and in class.

What I learned

CSS Grids

I thought grids would be super tough, but it actually wasn’t. We started with a metaphor about farming & plots, and came up with a sort of “proof” for the formula that we use. Then we watched as Abby live-coded a mixin using that formula, and styled it to her liking.

I followed along here! Grid Mixin by Amalie Barras (@amaliebarras) on CodePen.

Our weekend assignment was to make a grid for the Iron Yard page on It was left up to us to decide what number of columns to use. This was the most challenging part, because has a few rows that expand the width of the whole page, but the “meat” of the side has some padding in between divs. at first I used this to try to put everything in one grid, but I realized I didn’t need that extra outer layer on the two left hand divs, so I actually re-gridded in the middle of the assignment. I didn’t end up finishing this one because of SXSW, but I may still if I have some time. Abby encouraged me to just move on and work on this week’s stuff first, so that’s what I’m focusing on.

Gestalt Principles

Emergence, reification, invariance, and multistability. These are overarching principles that have applications way beyond web design. [This article] ( does a great job of illustrating practical examples of these.


We started the typography lesson with this video which I freakin’ loved because it was adorable. But it’s living proof that engaging content works for helping me remember.

The history definitely adds context for where typefaces came from and why they look the way they do.. but my main takeaway was realizing why they’re called “faces”… because they define the personality for a site.

Wow, very cool...

For example, courier. When a person is being effectively sarcastic, they kind of squint and use a more monitone voice with pregnant punctuation. That’s what courier is! It’s wider than it is tall, like a squint. But the ascenders don’t ascent very much which makes it look “monitone”. Lastly, the spacing between the period and the beginning of the next sentence is super far. Also, it’s very machine, not humanist, which gives it sort of a cold distance from the reader. Courier is totally rude.

Final thoughts

This weekend we’re re-designing a website for a restaurant, and I’m working on Dominican Joe! Looking forward to putting some love into that.