Description

In this course, we are going to explore Web Typography! This is a group project based learning experience. We will be working as as a team to type set a short ✧༺:༻∞ fairy tale, myth, poem or legend ∞༺:༻✧ for the web!

Goals

• To learn about expressive typography through doing
• To put something lovely on the internet
• To have fun!

Who this course is for

• Designers and Developers on the web who want to learn just enough type to be type literate.
• More advanced type enthusiasts are more than welcome to join, but this course caters to a beginner baseline. The course is project based so it will still be fun, and we'll learn a lot by having you :)

Structure

3-5 Participants Length: 6 weeks, 6 live calls/working sessions 2 hrs each

Each call is a live working session. The calls are long but there is no required homework!

Before we begin

• Pick out 1-2 nice public domain stories you’d really like to see expressively typeset
• It's good to pick something fairly short but still vividly expressed. Something that would be easy to illustrate or interpret.

Session 1

• We introduce ourselves and share the stories we’re interested in.
• From the stories shared, we’ll do a simple vote to pick one!
• I'll help everyone get set up with figma. We’ll also go through the tech stack and get everyone on the git repository. We’ll mostly do HTML and CSS. If you don’t know any, this course might be a good way to learn!
• With the remaining time, we'll start collecting inspirations for illustrative, body, and display type.

Session 1.5

This is a totally optional call (45min) for people with zero type experience. Most the learning in this course is just from doing it yourself. But today, we'll go over some VERY BASIC core concepts, terms, and other know how.

There's also very good writing on this topic, here are a few:

• https://abookapart.com/products/on-web-typography a short primer on typography for the web, and easy read
• https://practicaltypography.com/is a pretty famous one for create readable AF text on the web
• The Elements of Typographic Style is a classic CLASSIC book about typography but is mostly about print
• http://webtypography.net/ is the book above, but adapted for the web

Session 2

• The main goal today is to pick a base font and line height.
• We'll do a 30 minute exercise to decide collectively on a mood and creative direction for our story
• We'll then collect body and display fonts from around the web, and decide on the fonts we want to pursue. This is going to be an iterative and detail oriented process
• If we have time we can also start to sketch out the layout of our webpage!

Session 3

• We will do more work around a general layout
• Once we have a good idea of layout, we can set out story in our chosen type, make tweaks,
• Now that we have solid foundations, we can begin to think about illustrative type!!

Session 4

• A working session for us to do our designing and programming.
• Start with a checkin to see how we're doing on each of our sections
• Take this time to ask questions about other people’s work, watch their technique, and apply it you own section. This is a team effort!
• Don’t forget to put all the pieces together, step back and think about everything as a whole.

Session 5

• The same as session 4. We may want to start shifting focus to getting this thing into code
• You don't need to know any HTML, CSS beforehand. This course is a really good way to learn some very basic code!
• If you don't have a coding environment set up on your computer, I'll walk you through it. It's easier than you think!
• I will provide a website pretty much all set up and running, you just need to tweak CSS! I'll be there at every step to help out!

Session 6

• Let's put finishing touches on everything, and get it on the website!
• It’s time to merge to master and push the website live to the world!!
• AND THROW A PARTY!!!!

Constraints

• We are NOT creating our own full typeface. That is another, much longer course for different people.
• The tone, feel, and flow of the story should be established by the way we manipulate the typography
• You can use as much illustrative type as you want, but there still has to be at least some body text
• It needs to be on a website by the end of Session 6
• The story or writing must be under public domain (to keep the legal stuff simple)
• This is a place for us to learn through play! Let's not worry about the final product, and instead enjoy the process :)