Publishing Design // Task 1: Exercises

August 23, 2021

Publishing Design // Task 1: Exercises

24/08/21 - 21/09/21 (Week 1 - Week 5 )

Caitlyn Aurelia Tjandra (0339381)/BDCM

Publishing Design

Task 1 - Exercises

Lecture Notes

Week 1

Since this is our first week, Mr. Vinod briefed on MIB and what are we going to learn in this module. Furthermore, Mr Vinod shows us our project 1 which is related to making ebooks. He showed us briefly of senior's work and recommended blogs. Then Mr Vinod showed us lecture videos of exercise 1 in which we need to determine the size of or ebook.

Lecture 1: Formats

1. The book

Types of publications: newspaper, magazine, etc.
Keep in mind you’re publishing to mass audience
Book is the oldest format of publishing and most important medium to document and transmit ideas knowledge records.
Requires comprehensive understanding of typography, space an eye for details and publishing software

2. Format

“Q: in your view what factor influence and determine the format of a book?”

Size of the person who is interacting with the book
Age group
Type of paper, binding and size
Size of the content

3. Historical Formats

Different formats in different civilizations
Uniqueness and the possible reasons for the decline:

Iran-Iraq = Mesopotamian Civilization
Egypt = Ancient Egyptian Civilisation
India-Pakistan-Afghanistan = Indus Valley
China = Han Chinese
Europe = European

4. Historical Formats

innovation almost always shadows technology
New technology creates opportunities
Mesopotamia:

Denise Schmandt Basserat (1995) contends in her essay on the token system
Complex tokens -> bullae -> clay tablets
Indus River Valley:
Had complex system
Cuneiform writing- written on soft clay tablets with sharp pointed tools

Egypt:

Hieroglyphics
Special Paper – Papyrus
Tomb Walls
Papyrus- thick type of paper made from pith of papyrus plant

Chinese:

Vertical columns – thin strip bamboo
Pictogram of bamboo strips shredded together
Cai lun (105 CE) submitted a report of a new substance

First printed Book:

Diamond Sutra (868 CE)
Earliest printed book – Chinese on end of Tang Dynasty (1899)
Publishing

Chinese Publishing :

10-11th century
Printing from wood blocks
Movable type
Parchment
Invented in Turkey (197-159 BC)
Made from animal hide
Ingredients of paper changes – wood pulp (1860)
Wooden blocks -> parchments -> paper -> paper was sewn, bound and glued together

Week 2

This week we don't have class because its Malaysian Independence day. Therefore, Mr Vinod gave an optional class in which we could choose to join or not. I choose not to join and instead focusing on my work. Mr Vinod gave us to do list before class next week.

Lecture 2 : History of Prints

1. 2nd - 8th Century AD

Six main classics of Confucianism carved in stone – emperor of china (AD 175)
Confuscian scholars simply lay sheets of paper on engraved slabs and rub all over with charcoal taking away text in white letters on black ground

2. Korea and Japan: AD 750-768

Invention of printing is striking achievement of Buddhist in East Asia
Earliest printed document - sutra printed on single paper in Korea (AD 750)
Hyakumanto Darani – large scale woodblock printing in Japan

3. First Printed Book: AD 868

Earliest printed book – Chinese (end of tang dynasty)
Discovered at a cave – Dunhuang (1899)
Scroll- 16 ft formed of sheets of paper glued together
World first printed illustration

4. Movable type: 11th Century

Seperately ready made characters
Can be arranged in correct orders for a particular text or reused

Week 3

This week Mr Vinod looked at one of the student's van diagram and explain to us why do we need to do this. Then, Mr Vinod lecture us on how to determine grids with the existing book or magazine we were told to find online.

Lecture 3 : Typo Redux

Character in a typeface

Small Caps
Numerals
Fractions
Ligatures
Punctuation
Mathematical signs
Symbols
Non aligning figures

Legibility

A body text more readable
Choose typeface that are open and well proportioned
Consideration when formatting text:

Underline

Should be lower
Does not touch characters

Caps

Small caps

good for subheads
first line of a paragraph

All Caps

Short headlines / sub-headlines
Never use for long sentences / emphasis

Special Purpose Style

Footnotes
References
Mathematical Formulas
Embedded or nested within tools section

Text Scaling

Pseudo condense / pseudo extended
Distorts original design of thee font

Outline & Shadow

Outline / shadow style
Requires years of practice
Avoid outline and shadow as far as possible

Type size, line length & Line spacing

Font size -> Line length -> Line spacing
Column of type (50 > 65 Characters)
Leading : amont of space between line of type

Font used : some fons require more line spacing than others
Line length:

Longer lines require more leading
Overly long / short lines may tire reader

Type size: The larger the size, the more line spacing required.

Paragraph indent

Widow

A single line of text at the top of a page or column
Separated from its paragraph,

Orphan

Single line of text at the bottom of a page / column
Separated from its paragraph,

Week 4

This week Mr Vinod showed us how to make form and movement. After giving us a lecture on it, we were told to make 3 attempts while choose the best ne to make a gif animation in Photoshop in which we had learned how to do it in typography class semester 1.

Lecture 4: The Grid

Rester system

Grid as ordering system
Designer’s work should have clearly intelligible, objective, functional and mathematical thinking
Divides two-dimensional planes into smaller fields
Fields of compartments may be the same / different size

Purpose of grid

Solving visual problems in two / three dimension
Arranging surface and spaces -> Place to arrange text, photographs and diagram in coherent and functional matter
Sense of compact planning and clarity
Content are read more quickly and easily
Information better understood and kept

Modular

Grid is modular in nature
Allow for flexibility
Must have limit when using within a book
Depends on the content

Readability & Legibility

Grid helps make user experience seamless
Hidden framework behind a beautifully constructed architecture

Week 5

This week we completed task 1 exercises. Our last lecture for this was to include color, image and text into our chosen form and movements.

Lecture 5: Elements

Book

3 major elements:

Type
Color
Image

2. Variation

Surprise reader every page turn (Don't be predictable)
Create variation within the layout = maintaining consistency
Keeping certain area fixed :

Hang Line
Typeface
Color
Image style

Variation with consistency
Grid is used in modular fashion

Elements positioned logically

Instruction

Excercises

Text Formatting (Week 1) :

We were told to write around 3000 words of any topics and it doesn't had to be written by yourself. This context will be used for our ebook later on. Therefore, I decided to write it by myself that way I could connect with my story more rather than taking story from the internet.

Mockup-making (Week 2) :

A4 Paper (24/08/21)

On the first week of lecture we were told to watch the lecture for excercise 1 and Mr Vinod gave us list of items we are required to prepare for the task which includes:

A4 (16 sheets) /A3 (8 sheets) paper
Large rubber band / thread with needle
Adhesive Tape (masking, tape, scotch)
Steel ruler (16" if you have)
Cutter
Pencil

After watching the lecture video we were told to make our own at home using A4 / A3 paper to determine the size we want for our e book. Since I didn’t have A3 lying around my house, I used A4 instead. I taped two A4 paper to make an A3 size paper then we fold it in half to create a spread.

Fig 1.0 2 of A4 paper taped together to form a spread (24/08/21)

Determining Sizes

Firstly, we need to create a guideline of the requirement from the brief which was bigger than A5 and smaller than A4. Since my paper is already A4, I created a guide for my minimum size of A5. Then from there on, I could play around with the remaining size to make the perfect custom size I wanted for my book.

Size choices :

170 x 245 mm
175 x 233 mm
153 x 225 mm
160 x 222 mm
148 x 210 mm

Fig 1.1 Trying out the different sizes

Spread Drafts

After looking at my choices, I choose both size 175 x 233 mm and 160 x 222 mm to be cut as a draft for me to see the result. After cutting size 175 x 233 mm however, it was too big for my liking. I really like the size of A5 and I didn't want to go too far from there. On the other hand, the size 160 x 222 mm was the perfect size I wanted. It's near to A5 but still fits the prerequisite of the brief.

Fig 1.2 Comparison of the first two chosen size (25/10/21)

Fig 1.3 This mockup paper size 160 x 222

Fig 1.4 This mockup paper size 175 x 233

Final chosen size

Therefore, after consideration and trying out the size on my palm. The size 160 x 222 mm was the perfect size for my book.

Fig 1.3 Final chosen book size

Book Mock Up

After finding out our sizes, we need to make 16 pages in total, which means, I would need to have 8 of A4 paper that has been taped together and act according to my size.

Fig 1.4 final book mockup

Fig 1.5 Standing Book

Binding and Flat Lay

Fig 1.7 Flat Lay

Fig 1.8 Bindings

Fig 1.8.1 Binding Standing

Classical Grid Structure (Week 2) :

Since this week is a holiday, we were told to watch the lecture on how to create a Van De Graaf on paper manually and digitally on InDesign. Below is the results

Paper

Firstly, we need to do the diagram on our chosen paper size. I did this exercise using only with ruler and pencils. At first I was a little bit confused on what it was I am doing. But at the end the visualisation I finally understood.

Fig 1.9 Van de Graff on paper (04/09/21)

InDesign

After doin the excercise on the paper, we went ahead and do it on indesign. The process is the same only it was easier as it only requires the app indesign.

fig 2.0 Van de graaf on indesign

Fig 2.1 text on margin made from the Van de Graff 2 column

Fig 2.2 text on margin made from the Van de Graff 1 column

Signature Folding System (Week 2) :

Folding system

After the van de graff I watched Mr. Vinods lecture on a folding system in which from A1 to be folded into a small A6 paper. Then we numbered all the pages in order to see the placement of the page.

fig 2.3 Paper folded folded

fig 2.4 Paper folded opened

Determining Grid System (Week 3) :

The first task of this exercise we need to find 3 page spread from any publishing sources such as magazine or book that we like or that we think is interesting. Then, we place it into in design and start determining the grids that the editor of the magazine use. We line up all the text using the grid to see the structure used in the magazine's layout. From this exercise we could also see several text and images from opposite page are lined up together with each other to create balance and connection.

Case study

Fig 2.6 Case study grid

Determine Margin

based on our book size, we play around up to 4 margins. Then, we determine margin that we think is unique and we further analyze the choosen margin by adding collumns and rows.

Fig 2.7 determine page margin

Baseline Grid

After determining all the necessary guides, we move onto baseline grid in which we are able to set guide for inputing our text that we had done.

Fig 2.8 Baseline grid

Text Flow

After inputting the baseline grid, we transfer the text from our stories to the margin baseline that we had and experiment with them. I use the subtext and quote to create an impact on the text.

Fig 2.9 Text flow with grid (12/09/21)

Fig 3.0 Text flow without grid.

Form and Movement (Week 4 - 5) :

This week Mr Vinod showed us how to do a form and movement. This was my first trial in class and we were told to do 2 more by ourselves. On my first try I didn’t get the picture on what Mr Vinod was expecting. He told me that everything needs to flow from top to bottom and create movement. I was confused but the moment he said that I need to connect each of every shape from previous spread. I finally understood.

BnW (Week4)

Fig 3.1 First Attempts

Fig 3.2 Form 1 Gif

This was my second form, however, I didn't find a uniqueness in this. I am not fond of this one as It doesnt have that impact that I was hoping to achieve.

Fig 3.3 Second Attempts

Fig 3.4 Second Attempts gif

This was my final and last-minute attempts, which turns out quite good. I really like the movement in here and there is also an impact on the changes of the shapes. The flow is smooth and its not too complicated.

Fig 3.5 Third Attempts

Fig 3.6 Final Chosen Form Gif

Color (Week 5)

After choosing our movement and flow, we introduce color. I choose the color orange which is one of my book theme color. We were told to include only 30% of color in our spreads.

Fig 3.7 Chosen Form color jpeg

Fig 3.8 Chosen Form color PDF

Image (Week 5)

After introducing color, we were told to put in a simple image and make sure to highlight different parts of the image in different spread so it wont be boring.

Fig 3.9 Chosen Form color & Image PDF

Fig 4.0 Form with text

Feedback

Week 1

It was still the first week, therefore we don't have any feedbacks yet.

Week 2

Today is a holiday, therefore, there was no class.

Week 3

General Feedback:

- margin space is important
- Van De Graff is mathematical geometry
- you must be clear of your margin space
- you must be conscious of your text
- beauty of the margin comes out if you feel the text field
- tension plays important part in layout
- what creates tension?
- the closer you put object on the edge of the page or border increase uneasiness
- however, it must be balanced (propositional)
- not equal balanced because design needs to have movement
- you need to have line 0,5 stroke width in the middle and sides.
- to create cross alignment, you need to have leading, point size and space, after all coordinated

Week 4

Specific Feedback:

- I need to correlate all the forms and create movements

- Remember to create alignment

- Make sure the last point of the shape are in the same place in the next spread

Reflection

Experience

This was our first publishing type module, which was quite overwhelming for me. I am not totally fond of formatting since typography, in which in this module we are focusing on that matter. Therefore, I was quite concern on how I was able to go through this. Thankfully, Mr Vinod was able to guide and explain detailedly on what we are supposed to do. The step-by-step tutorial and examples really helped me get a picture on what I was supposed to do.

Observation

I observe there are a lot of different margin type and layout that was able to be experimented on a book which then gives a lot of unique results. It was quite amusing to see what others had done using different margin and spacing than mine. I could observe how people are using their space to play around with their text and shapes in form and movement.

Findings

I find myself learn a lot of new things. Especially my skills in adobe Indesign improved much further because of these exercises. I find I could look at spaces in different ways and how a single spread could do much more than anyone can think. There are a lot of things that I hadn't explored which I hope I would have time to in other projects.

Search This Blog

Caitlyn Aurelia Tjandra (0339381)