Today’s Lecture was on (Macro/Micro) Typography. Typography is a very important part of any design. It will play an key role especially within my next project which is on the Apollo program. Choosing the right typography can enhance your design. Interactive designers use typography efficently on web to make there designs/projects stand out.
Kyle has asked us this week to read the content for project which can be found on Blackboard. By doing this it will help me to increase my understanding of topic. I can then start to apply a structure and markup my content appropriately. For example deciding on the headings, paragraphs, navigation and most importantly the choice of typefaces. I begin to set up my content this week as well as contiuing my research into the topic looking for inspriation to help me.
For this project I need to consider how I can tell the story of Apollo 11.
He recommended a couple of resources to look at. There’s a particular one on the Nielsen Norman Group website called “How users read the web article” so I know how to structure my work.
Some tips to use when structuring my work:
- Web-friendly Content
- Highlight Keywords
- Use Meaningful Sub-Headings
- Embrace Lists
- Reduce Word Content
- Use Blockquotes
The aim is to try to ease the reader in, to allow them to enjoy the article or content. You want to design your article for reading.
Five Key rules of Typography
- Focus on Body Copy
- Choose a comfortable font size
- Line space
- Line Choice
- Choose an appropriate font
Scale Types
- A Typographic Scale- This will help you choose the right type scale that suits your project. Example of a typographic scale is the Newspaper
- Fibonacci Scale- This is sequence of numbers used for estimating the relative size of your type. Examples being Type.scale.com or Modular.com.
Medium is a good example of a website which lays out work appropriately.
Typography Terms
- Measure – This determines the lenght of a line.
- Leading- The space between lines of type. So it measures the space from one line to another.
- Weight- This term is used to describe the thickness of the font. For example thin, regular and bold.
- Italics- This is slanted letters used to highlight a word or phrase which you may help make it stand out
Above are the terms I will consider using with in my design.
Choosing and pairing Typefaces which work well together is important. Limit the number of Typefaces to 2 or 3. No more than 3 should be used.
Example: The Word: New York Magazine Design they efficently use 2 typefaces.
Perfect Partners:
- Titles/Headings and Subheadings-
- Sans/Serif Fonts-
- Sans Serif fonts are used as they are clear and make the content more formal and professional looking. They are good text to use when displaying information on a website/App. Example font being Arial.
- Serif Fonts- They have strokes at the end of each letter. They are commonly used in books, articles and newspapers. Example font is Times New Roman.
3. Details and Ratio
- Hyphen- Hyphes are used to link words together. (-)
- Dashes- Dashes are longer and used to range or pause information.(_)
- Primes- Primes are used to represent fleet, or mark inches. This is normally to mark numbers. (‘)
- Quotations- Quotations are used to show someone is talking in a setence or reference quatoed from a particular web article or book. (” “)
4. Inspriational and Advice
There is many websites which you can look for inspriational.
- Typewolf
- Practical Typgraphy.com
- Prowebtype.com
- Practical Typography.com
- Fontshop
- Flexible typesetting
- Jamie Clark- Penny Dreadful;
As well as websites there is plenty of books for inspiration
Designers
- Time Brown-Head of Typography
- Matthew Butternicks
External Resources
- Spotify
- Movies
For this week: I will decide what media I’m designing for. I will try to tell the story of the Apollo by using revelant content. Example where a good story is through the Apple website. I start to play about with different types and animation. I will consider using brand and Icons.
Reflection
I thought this was an interesting lecture and give me a refresher of typography. Also I learned today the importance of typography and if used approitately how they can used to enchance my own designs. Choosing the right typography is essential and once you do that you can build your strucutre and add animation. Today I discovered different sites and designers which can insprire me.