Lessons

Lesson Info

Typography

if you've never really thought about typography, Maybe it was just me. But before I started really studying this stuff and just having my mind blown by how cool it all is, I just took typography and fonts and typefaces and things. I just took it for granted. Rightly, we sort of just think, Well, these fonts came on my computer, and we forget that a human crafted those every single letter, like a designer, sat in a studio somewhere in their office and drew every lower case F every comma, every period, every capital, G, whatever, all of the things in every font. Someone designed and created and labored and sweated and obsessed over and worried about every stroke of every letter. And the senders and D senders encounters the weight of the strokes. I mean, that's the whole profession, Right? To be a type designer is a whole profession, and I just think it's so fascinating and we take it for granted. We've got all these funds everywhere, and it's ubiquitous. They're just all over the place. ...

But when you start studying it and you learn more about typography and how to manipulate the text and really control it and shape it and play with it. You can build all kinds of things, and this is another shout out to my husband. When we did our bicycle trip, the UN tour, he built this amazing camera graphic out of text that says, because cameras don't take great photos, people dio. And that sort of became our tagline for the trip. And I love how he created this. I just think it's so brilliant so you can have a lot of fun with typography. And of course, fonts are really exciting, and we just want to make sure that we use them responsibly, just like we use our design powers and our photo powers and everything responsibly. So when it comes to fonts, it's nice to learn about them. There's different categories of fonts, you know, whether they're Script E or they are hand drawn fonds or ding bat fonds or Sarah Font san serif font slab Sarah. I mean, there's all different categories of type, and each different category generally tends to serve a different purpose. Some are best designed for headlines. Some are best made for body copies. Summer designed specifically for use on the Web so they all kind of a different purpose. Obviously, you probably wouldn't set a whole paragraph like an article in something scripted like this. This is what script een ours are that fino or something? You wouldn't do that because it be really hard to read, right? So ah, lot of that stuff you probably sort of intuitively get. But it's always interesting to learn how choosing the right typeface can complement your work and help you communicate your message and your brand and all of that and whether it's actually the typeface itself or the color. All of those things can make a huge difference if you want to learn some more about typography. Specifically guess what? Robin has another amazing book, another simple, easy read called the Non Designers Type book on. There is a link to that in The Resource Guide as well, and that's fabulous. She just she keeps it really light, easy read. She's actually quite funny as well. She's a brilliant woman, so it's a great book, and I recommend checking that out. So really, for pretty on the cheap. If you got both of Robin's books and the before and after how to design great stuff. You could get three books for less, probably less than 75 bucks. There may be even less than 50. I don't remember pricing right now, but you can get a pretty kick butt design Foundation education for pretty cheap and they're easy reads. We're not talking textbooks stuff if they're easy, great, beautiful things to read. Where do you find fonts If you're interested in learning more about them? Some sites that are great to check out fonts. Squirrel dot com What I really specifically like about front squirrel is there free funds? But they are pre selected because they come with the commercial license. So a lot of fun designers might design a freebie that they let people use commercially, and they put it on front squirrel. And then they reserve some of their other things, you know, for purchase eso font squirrels. Great. Like that different dot com also has free fonts, so these the top to our freebies but defunct is not necessarily available for commercial use, So every fonts you just have to look. So check the license on anything you would get from defiant should check on front squirrel to just to be safe but undefined. You really have to look, they're more geared towards personal youth. And just as we as artists, of course, expect our copyrights to be respected and our work to be respected, we want to make sure we respect the design work of all the type designers because it's I just think it's so amazing. What they dio some sites with some professionally designed fonts for purchase would include veer dot com and I just I Love. I love these sites and hopefully I will get to show you some. My funds dot com is another site with some wonderful professional funds, and my funds has another sub domain over there called Are some folder called What The Font. So if you're ever out in the world and you see a typeface in use someplace in a menu on a sign wherever and you're like, I love this typeface, what is it? You can actually snap a photo of it, upload it to my funds dot com slash what the front and they'll read the image, and you can answer some questions, and it will tell you what fun it is. And if their little winter widget thing doesn't arrive at an answer for you. Someone in the Forum will like. People are font maniacs, and it's just magical, so that's neat. If you really want to geek out, there's a movie called Helvetica. I don't know who has all seen this, but it's a documentary. It's available on Netflix streaming, I highly recommend. And, um, it's all about the typeface Helvetica. And if you've never given any thought to typefaces or how they're made or why anyone would even care. I highly recommend the movies. I don't even think it's an hour and 1/2 long, so it's pretty short. But they really talk about Helvetica, which is also exist sort of as Ariel, right? A lot of people know it as Ariel, and it's on the computer, and it's It's the most used font in the whole world, so you will find it on signs in airports around the world and subways and logo's. It's just everywhere. So they talk about what inspired it, how it was created, why people care what it means. And I just think it's fascinating. So from Liberty Edwards, she, Liberty liberty, who happens to be so Liberty. Edwards is asking eso again font for commercial use. Does that mean that you can't put them in wedding albums? If you're using the font to design things that you profit from, then you need to have a commercial license from them. Yeah, so a lot of times when you download the fonts, they will include some sort of read me file or license text something, and the designer will usually spell out exactly what the rights are just like when using songs for your your slide shows. Yeah, that's, you know, like from triple stupor. What have you Yeah, Cool. Super. All right, well, let's check out. Hopefully they're still preloaded. I wanted to show you some of these websites because they're so fun. So let's see, this is font squirrels of font squirrel dot com. And here's just some examples. But over here, for example, you can choose different types of, um, type. That's fun. But for example, ding bat is what I've been spending a lot of time with lately. Look at all of these cool border design things and little design elements and pictures, and I'll show you how we how we find this stuff in in design because it can be kind of tricky. So these would just load in your like with your keyboard. So, like the lower case T might make this fund snowflake or something like that. So I'll show you what that looks like. But there's ding bats all over the place over here at front squirrel, and that's really great. Another one I really like is Veer, as I mentioned. And it's super because I love these little examples they have where they really show how they use the type. If you purchase a certain typeface, they always have these great examples of how it looks in use in a piece somewhere. And I just think that's really cool. So that's fun. Andan Other thing. That's great. If we look at some of the fonds, let's see, like, Here's one we're gonna work with in another example momentarily but way want to see our text as our own example. We can and will see it right here so we can actually test drive the type the typography before we we downloaded, and we can look at all the different characters that it might have, and I just think this is still mind blowing. There is one type face in here. Let me see if I can find it. I think it's called audio script. If we click the about tab this typeface, just to give you an idea of how amazing these these designers are. This font has 1470 characters. Isn't it amazing? If we look at their character pallet, we can see one of them. They're saying they have so many different versions of even just the lower case each. I think it waas and no, look how many D's they have you can see, like highlighted versions. Some of them are really swirly. Some of them are less clearly, it's just amazing. So you have all kinds of control, and I'll show you how you can utilize that in in design. And then this is my fonts. And here is their what the fund. So if you need to look up a fund to see what it is that is right over there so cool a little preview of that. Oh, I was gonna tell you to how to download them. It's really simple. Um, for example, will pop over toe fronts world and getting them is as simple as clicking. Download fonts come in different types. There's true type fonts, and there's open typefaces and stuff and that there's just different formats that it can be in. And there's some advantages to different ones, but they're essentially still just fonts, and so you would just click to download it. It usually comes as a ZIP file, so you'd have to unzip it, and it can be as easy is then, dragging the text file they've filed dragging it into your front folder or actually, a lot of the funds. Now we'll let you just double click if you open the front click on the font itself and they'll be uninstall button and it'll install for you. So just kind of depends how you like to manage your funds. But that's pretty okay, once you get it dragged into your proper folder, it would then load here. So one of the other things I was gonna show you and talk about is in photo shop quickly. I just want to compare contrast a little bit about photo shop and in design for this particular reason here in photo shop, if I click on the type tool. We noticed that there's four different kinds of type tools Horizontal type, tool, vertical type, tool. And then we have the horizontal and vertical type mask tools, which are the same things. But it makes your text as marching ants, Right? If you've ever played with, it can be kind of fun. But I'm just going to create a new document. I didn't even know what this will be. Well, just do like a little five by five. Something to play on here really quick. And I'm just going to draw a text box. Oh, let's do actually the vertical type first. So here's just a little interesting readability lesson for you in case you've never given this a whole lot of thoughts. Oh, let's not right. Ending bats, that is tricky. Will just pick this. So I'm gonna type difficult to read, and let's size it so we can actually fit it on the screen. All right, so here I typed out difficult to read, and I used the vertical type tool, and this is this is a tool that I have to say, Um, be careful when you use, because, ah, lot of times people like to have text and they like to run it vertically because it could be interesting. Teoh, you know, make use of a vertical space with type, and it can be, you know, graphically interesting and helpful for all kinds of things. But the problem is that then they may come in and reach for the vertical type tool, and what that does is obviously it makes the text stacked. But the letters themselves are still upright. No, I'm saying so everything is still upright, but they're stacked on top of each other, and the result is that it's very difficult to read if I take the same text. But I put it here and I type difficult to read. It's actually quite easy to read, right and the reason that this happens. There's a lot of studies that have been done on this. Is that the way that we actually recognise type is we recognize words by the relationship of letters compared to the other letters and that relationship in this culture here in the US, as we read, left to right, and so we're used to looking at that relationship of letters like this. So when we take those letters and we stack them vertically even though they're right side up. We've changed the relationship. They're no longer like this there now like this, and it's much more difficult to read. In fact, it's even more difficult to read than if I took this type player and rotated it and drag it down here. Even though the letters are now sideways, we would think that that might be more difficult to read because the letters aren't even right side up. But because we recognize words by there side by side relationship, it's actually easier to read letters that are still side by side but sideways. It's actually easier to read, then right side up letters that are stacked like that. Be careful. That's my big like my soapbox about the type tools in voting Job is there. I think they enable you to be a little bit dangerous with your design because you can really mess up the readability of what you're doing. So if you're designing something and you want this like really cool, maybe you want really great contrast with some big, thick, chunky typeface and you want it vertically running on the side someplace. Put the type in there using the horizontal, you know, are in design, really being in design. Um, and you can put your type out there and then just if you click our or grab the rotate tool right here, you can just rotate that text and use it like that, and it's a lot easier to read question, totally random question. But I noticed both times you moved it so that the beginning of the sentence starts at the top. Is that purposeful? I think that since we read left to right, do we read top to bottom as well? No. Yeah, that's interesting. I've never considered it. But let's see what? Let's see. Let's try this. You know what? I might do it this way. If it was on this side on the right hand side, I might do it that way. If it's finishing something, I think because we do tend to read top to bottom and left to right. So we would start over here probably at the top, and as we make our way across, we might finish it off this way. That's a really good point. So are you looking at this thing? You check it out this fine because I never I think I would always do it the opposite way. And it turns out that well, this one is top down is top down. But I never until you started to explain that I never really thought about why. Yeah, you look at any of the spine of your book on the because of fascinating they're not gonna have stacked. I would be hard pressed. I would expect to find one with letters that are stacked vertically because it's hard to read. So there's actual studies on this, just making it up their size on that. So you think that's fascinating on That's why you'll notice that in design, they don't give you a vertical type tool because they know that if you're designing and in design, you probably wouldn't do that, so they just don't even give it to you, could still create it if that was. You know, if your two thing to break the rules that way, for whatever reason, you could still do it that way. Um, get out of wonderful mood. You would just have Teoh. You would just have to hit a return between every letter. Um, you know to to pull the hat off, which takes a long time to type. Turns out. So that's why you know, just watch out for the vertical time. But you've seen this yourself that you've ever seen. Those emails that go around where they show you, you know, like a paragraph of text. And they say, like, isn't it amazing that you can read this text? But like every third letter is erased or wrong or something, they mess up the letters or backwards, and you still read it. You may not even notice that the letters are reversed or missing or wrong, because we'd are recognizing the words as a whole in there, side by side spatial relationship. So I just think that's super fascinating. You talked about forint management organization programs. Is that correct? Kind of. I don't really touch on any like 78 suggestion. There's all kinds of different, like font suitcase and different management programs actually manage your funds so that you know you're not having 5000 active bonds at a time. Think slow down your computer, so if you're interested in that, you can just google around for some different management. Yeah, everyone has a different preference, so but there isn't tool that there for sure. Okay. Do you guys have any questions? Was question so much, but I'm I believe it was on your Facebook. Paige, you said you were gonna that. I guess you would You like to use Helvetica and you were gonna buy Oh, finding I know her fonts. And I was like, you and your like, wouldn't that your rights? Are you buying? And I'm sitting here going. Wait a minute. Why are we 10 minutes short? And it's because I forgot to show you the example. Thank you. So that is under do not in this folder. It's right here. Okay, So I was going to show you this super awesome thing. Thank you, Michelle. All right, so what, we're gonna dio let me. You know what? Let's just not have 100 panels open. Can we just do that? We'll put bridge back because I like, All right, So here's a little document that I created, so, Yeah, I love professionally designed fonts. There's quite actually a bit of difference between a freebie fonts and something that really that you would pay a lot of money for and a lot of times those things. They'll come as open type fonts, and they have a lot of extra sort of bonus material. And they have, like, intelligent lettering that as you type and different letter combinations are appearing, the actual different letters will change. So as you're typing, you might see a lower case D, and when you follow it with a different letter, the lower case D might morph into a different D. That better fits the letter that follow that something like type designers think of everything is so genius. So what? Those things are often called sometimes will happen automatically, depending on the font and whether it's open type or a different type, something's those will happen automatically. Then there are things called ligatures. So, for example, a lower case F might do this backwards. A lower case F might reach across and become the dot oven I that follows it, or something like that, or the lower case F might come across and cross the T that that follows it. So when letters connect like that and sort of become parts of another, it's called ligatures. And then there are things called washes, so let me just show you. I'm gonna show you how we return. Turn this design into that. Yeah, So just a little before and after do This is the same front. And this is not me being crazy with the pen tool and like, adjusting path and warping the font all around myself because no. So what we would actually dio is you want to find a fund that has options like that? So you want to look at the characters in the fund within In design, there is a panel called Cliffs. It's under the type menu and it's called lifts and you just click on it and you can see the cliffs for any given fonts. So because I don't have it selected here, it's pulling up Minion Pro. But this is called Hiatus, so I'm gonna open that. And now I can see they're really tiny, and I think we can make thes bigger. There we go. I can see the different characters available in hiatus. So, for example, if I highlight the A Capital A, it's going to show me the capital a in the fun. And I could change this A If I just double click here. I changed it to that. A Do you see the difference If I undo that? So there's the A If you're just typing generically and you never open your cliffs your front may not be so magical. I mean, it would be nice, but when you see, like, those typography samples and you're like just drooling because the letters are so beautiful. I mean, if you think about it, all of those letters are art pieces, those air like sculptured creations that somebody made. And they look really great, of course, in the samples. But then you get the fine and you type something and you're like that doesn't look the same. That's why you gotta open your glyphs panel. Okay, so that's again. That's under type glitz and then choose the right typeface on. I've got the a highlighted here. So look at this. We can choose this A. I just double click it and it will replace it. I can highlight the w and see what do we have her choices and some of them if you they have, you know, the little arrows I can click and hold, and it's gonna show me. But I also have it extended here. So there is a new different W I can take this d and maybe I want it to be Let's see like this What I'm saying. So this deacon swirl around and reach over here. But this d can just stay like that. Or I could reverse it and keep that d like that. And I could make this de the boat device. Miss my D's now highlighted back. I could make that d the swirly d How fun. Right? And the G, That's really great. Look at this. You can have it swooped down like this, But now it's going to be running into this. So maybe we have it switched across the top. And then, oh, now we're going to change this back. Maybe this should be the swirly be on will make this one the less swirly de maybe like that. So you get to play with it. That's fun. That's super cool, Kara. My, my mom is a very talented calligrapher on seeing you do that. The flourishes and the senders and the D sender. Looking you? I just went I have no idea what the Oh, so if you read Robin's book. You'll learn all about different parts, and it's so amazing. If you watch Helvetica, one of the designers talks about how he approaches designing a type face and he'll say, you know well, usually will start with a lower case D or something. And if you figure out this and that, then you can flip it around and you have a P and you have a B and you. Then I might go to the H and they I mean, it's it's a whole other world and I just think it's fascinating. So cool. We can. I mean, you can just kind of go through it and see maybe, you know, whatever Fanciful I this a little bit. Maybe an endless. See if there's any cool. Maybe not. Maybe there's no alternatives there. T you know, you're gonna, you know, choose responsibly. Don't make a mess, but but have some fun with it and then let's see, Maybe I'll draw maybe in, um, we could We could do it down here. We should probably do that. So all put the type, put the cursor down there, and then I know that in this Oh, here's an example of um, ligatures here where? Oh, all those will come to in a minute here where, like a lower case T is swooping into the H or here's a double T where one crosses going across there so the other what ligatures are and depending how the type was built, it may automatically do that. So people who are designing books and laying out body copy or working on logos I mean, these are the things that they really strategically do with a lot of careful thought and consideration. I just think it's it's beautiful. When you when you learn more about it, here's some more ligatures. All right, so at the bottom down here, this typeface also includes some fun little sua. She design elements and so you can just bring that in there. Um, you could put that in a separate, you know, tight box if you wanted to, but there you have it. So we just took a really plain text and didn't get a new fund. Just actually took advantage of the characters and the things that existed in that fund. Ah, lot of times, this is what you pay for with the professional funds is all the attention to detail in all the different letters, all the possible letter combinations, a lot of attention to the letter spacing. There's a big I should show you guys this to the difference in spacing between a W and an E, for example, you might want to tighten that up and, um, adjust some of this, not the tracking Sorry we want to do occurring up here. We might want to Kern this. Do you see how the spacing is tightening up between the W and the E? That's called Kern Ing the space between letters and as a person who may really come to appreciate typography. Those are the things that you really look for, especially if you're building a logo or a sign or something. But really, the spacing between the letters becomes something to pay attention to, and you can really find tune it and tweak it in design and very used to sell this fabulous sweatshirt. And I didn't buy it in time and the store closed. They fear the fund website used to have a merchandise store, and they had this brilliant sweatshirt with the zipper down the middle, and it said Kern, across the front, but the zipper divided the E in the arm, and it was a funny, little clever, geeky typography thing, and I always been to buy it, and now they closed the shop and it's gone. But it was It was very clever. So if you really geek out into that stuff, there's so many fun things out there, but that's what turning it.