39
типографика регби для дизайнера продолжение дмитрий карпов Monday, May 14, 12

Регби для дизайнера / Часть 2 / Typography

Embed Size (px)

DESCRIPTION

Практические рекомендации по работе с экранным текстом, на основе традиций типографики.Вспомогательные слайды презентации. Фрагмент материалов с семинара Дмитрия Карпова. http://baggage.arriba.com.ua/2012/04/12-05karpov/

Citation preview

Page 1: Регби для дизайнера / Часть 2 / Typography

типографика

регби для дизайнера

продолжение

дмитрий карпов

Monday, May 14, 12

Page 2: Регби для дизайнера / Часть 2 / Typography

ОБРАТИТЕ ВНИМАНИЯ КАК ШРИФТ И ТЕКСТ СОЗДАЮТ ЭСТЕТИЧЕСКУЮ СИСТЕМУ И ЦВЕТОВОЙ КОД НЕМНОГО НАРУШАЕТ ИНТЕРАКТИВНУЮ СИСТЕМУ

Monday, May 14, 12

Page 3: Регби для дизайнера / Часть 2 / Typography

ОБРАТИТЕ ВНИМАНИЯ НА АКЦЕНТЫ ВЫРАВНИВАНИЯ ТЕКСТА, НАБОР, КОНТРАСТЫ И СВОБОДНОЕ ПРОСТРАНСТВО КАКИЕ ДОСТОИНСТВА И НЕДОСТАТКИ ВИДИТЕ ВЫ?http://esquire.ru/wil/robert-altman

Monday, May 14, 12

Page 4: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 5: Регби для дизайнера / Часть 2 / Typography

ОБРАТИТЕ ВНИМАНИЯ НА АКЦЕНТЫ ВЫРАВНИВАНИЯ ТЕКСТА, НАБОР, КОНТРАСТЫ И СВОБОДНОЕ ПРОСТРАНСТВО КАКИЕ ДОСТОИНСТВА И НЕДОСТАТКИ ВИДИТЕ ВЫ?

Monday, May 14, 12

Page 6: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 7: Регби для дизайнера / Часть 2 / Typography

Univers / CaslonBodoni / FuturaMyriad / MinionHelvetica / GaramondBaskerville / UniversGaramond / VerdanaAkzidenz Grotesk / GaramondFrutiger / MinionFutura / BodoniGaramond / FuturaGill Sans / CaslonMinion / Gill SansAvenir / WarnockCaslon / Franklin GothicFF Din / BaskervilleTrade Gothic / ClarendonClarendon / Trade GothicFranklin Gothic / BaskervilleWarnock / Univers

Ветер и волныУспех компании зависит от умения сомневаться и мобильности. Бренды должны создавать новые миры. Они должны постоянно строить, ломать и перестраивать. Для этого своим кредо надо сделать предвосхищение. Нельзя плыть по волнам; надо ловить ветер, который эти волны рождает. Всегда нужно видеть на несколько ходов вперед.

Жирный Гил, робко прячет, тело стройное Верданы36 pt 36 pt 36 pt

ШРИФТОВЫЕ КОМБИНАЦИИ

Monday, May 14, 12

Page 8: Регби для дизайнера / Часть 2 / Typography

НЕКОТОРЫЕ ШРИФТЫ (BODONI)ОТЛИЧНО ВЫГЛЯДЯТ В БОЛЬШИХРАЗМЕРАХ, ДЕТАЛИ КОНТРАСТНЫХШТРИХОВ ОСОБЕННО ВЫГОДНЫ, НОВ МАЛЫХ РАЗМЕРАХ 6-8PT ШРИФТТЕРЯЕТ ЭСТЕТИКУ, «ЗАЛИПАЕТ»

Monday, May 14, 12

Page 9: Регби для дизайнера / Часть 2 / Typography

Ветер и волныУспех фирмы зависит от умения сомневаться и мобильности. Фирмы должны создавать новые миры. Они должны постоянно строить, ломать и перестраивать. Для этого своим кредо надо сделать предвосхищение. Нельзя плыть по волнам; надо ловить ветер, который эти волны рождает. Всегда нужно видеть на несколько ходов вперед.

56 знаков

Ветер и волныУспех фирмы зависит от умения сомневаться и мобильности. Фирмы должны создавать новые миры. Они должны постоянно строить, ломать и перестраивать. Для этого своим кредо надо сделать предвосхищение. Нельзя плыть по волнам; надо ловить ветер, который эти волны рождает. Всегда нужно видеть на несколько ходов вперед.

79 знаков

Ветер и волныУспех фирмы зависит от умения сомневаться и мобильности. Фирмы должны создавать новые миры. Они должны постоянно строить, ломать и перестраивать. Для этого своим кредо надо сделать предвосхищение. Нельзя плыть по волнам; надо ловить ветер, который эти волны рождает. Всегда нужно видеть на несколько ходов вперед.

91 знак

Monday, May 14, 12

Page 10: Регби для дизайнера / Часть 2 / Typography

Ветер и большие волны ВЕТЕР И БОЛЬШИЕ ВОЛНЫ

ВЕТЕР И БОЛЬШИЕ ВОЛНЫsmall caps

ОЧЕВИДНЫЕ ПРЕИМУЩЕСТВА И НЕДОСТАТКИ РАЗЛИЧНОГО НАБОРА ДЛЯ СКОРОСТИ ВОСПРИЯТИЯ ТЕКСТА

Monday, May 14, 12

Page 11: Регби для дизайнера / Часть 2 / Typography

ТИПОГРАФИЧЕСКАЯ ПЛОТНОСТЬ ДОСТИГАЕТСЯ ИНТЕРЛИНЬЯЖЕМ, ОПТИМАЛЬНОЕ ЗНАЧЕНИЕ ОТНОШЕНИЕ РАЗМЕРА КЕГЛЯ РАВНОГО 1EM К 1.3-1.5 В ЗАВИСИМОСТИ ОТ ШРИФТА

Monday, May 14, 12

Page 12: Регби для дизайнера / Часть 2 / Typography

ВЫРАВНИВАНИЕ НАБОРА ЗАВИСИТ ОТ ФОРМАТА И ФУНКЦИИ

ТЕКСТА

Monday, May 14, 12

Page 13: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 14: Регби для дизайнера / Часть 2 / Typography

ИЕРАРХИЯ ТЕКСТА ДОСТИГАЕТСЯ РАЗЛИЧНЫМИ ПРИЕМАМИ, ИСПОЛЬЗОВАНИЕМ СИМВОЛОВ, ОТСТУПАМИ, АКЦЕНТАМИ В ВЫБОРЕ ШРИФТОВ

Monday, May 14, 12

Page 15: Регби для дизайнера / Часть 2 / Typography

SOFT HYPHEN

LEFT/RIGHT-POINTING DOUBLE ANGLE QUOTATION MARK

HORIZONTAL ELLIPSIS

EM DASH

TWO DOT LEADER

Monday, May 14, 12

Page 16: Регби для дизайнера / Часть 2 / Typography

SOFT HYPHEN

LEFT/RIGHT-POINTING DOUBLE ANGLE QUOTATION MARK

HORIZONTAL ELLIPSIS

EM DASH

TWO DOT LEADER

Monday, May 14, 12

Page 17: Регби для дизайнера / Часть 2 / Typography

ТИПОГРАФИЧЕСКИЕ ИНСТРУМЕНТЫ В CSS, ШИРИНА СТРОКИ, ПОЛОЖЕНИЕ В ПРОСТРАНСТВЕ, ОТНОСИТЕЛЬНЫЕ ЕДИНИЦЫ ИЗМЕРЕНИЙ, ПОДГРУЗКА ШРИФТОВ НА СТРАНИЦУ, ОТСТУПЫ, ИНТЕРЛИНЬЯЖ, БУКВИЦЫ, ВИЗУАЛЬНАЯ ИЕРАРХИЯ

Monday, May 14, 12

Page 18: Регби для дизайнера / Часть 2 / Typography

Максим Горький

Лев Толстой

КЕРНИНГ ПОЗВОЛЯЕТ ВЛИЯТЬ НА ОПТИЧЕСКОЕ ВОСПРИЯТИЕ ЗНАКОВ ПРИ НАБОРЕ

Monday, May 14, 12

Page 19: Регби для дизайнера / Часть 2 / Typography

ФАКТИЧЕСКИ, ИНСТРУМЕНТЫ ДЛЯ КЕРНИНГА ЕСТЬ И В CSS

Monday, May 14, 12

Page 20: Регби для дизайнера / Часть 2 / Typography

ПРИВЯЗКА ПРОПОРЦИЙ И МОДУЛЬНЫХ ПРОПОРЦИЙ К РАЗМЕРУ ШРИФТА В (EM)

Monday, May 14, 12

Page 21: Регби для дизайнера / Часть 2 / Typography

ПРИВЯЗКА ПРОПОРЦИЙ И МОДУЛЬНЫХ ПРОПОРЦИЙ К РАЗМЕРУ ШРИФТА В (EM)

Monday, May 14, 12

Page 22: Регби для дизайнера / Часть 2 / Typography

регби для

ПОЛЕЗНОЕ ЧТЕНИЕ ДЛЯ ИЗУЧЕНИЯ ОСНОВ, ПРОСТАЯ, ПОНЯТНАЯ, ПРАКТИЧНАЯ

Monday, May 14, 12

Page 23: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 24: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 25: Регби для дизайнера / Часть 2 / Typography

http://gnosh.co.uk/

ЭКСПРЕССИЯ УНИКАЛЬНОГО ШРИФТА ПОМОГАЕТ ЗРИТЕЛЬНОЙ ИДЕНТИФИКАЦИИ БРЕНДА И СОЗДАЕТ ИНДИВИДУАЛЬНЫЙ ХАРАКТЕР

Monday, May 14, 12

Page 26: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 27: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 28: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 29: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 30: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 31: Регби для дизайнера / Часть 2 / Typography

не надо бояться типографики, возьмите текст и сверстайте его тридцатью

различными способами, в три колонки, в две, в двенадцать, в один шрифт и размер, в три в четыре размера, с переносами и без, с висячей

пунктуацией и без, флаговым набором и альтернативами... не бойтесь идите вперед, ошибайтесь, лучше не знать терминов, не читать книг, но много раз попробовать понять на собственном опыте, на попытках, через анализ работ,

самому.

Monday, May 14, 12

Page 32: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 33: Регби для дизайнера / Часть 2 / Typography

СОХРАНЕНИЕ ПРОПОРЦИЙ ВЕРТИКАЛЬНОГО РИТМА И ГОРИЗОНТАЛЬНЫХ ПРОПОРЦИЙ ПРОДИКТОВАНО ФУНКЦИОНАЛЬНЫМИ ОСОБЕННОСТЯМИ ИНТЕРАКТИВНОГО ВЗАИМОДЕЙСТВИЯ

Monday, May 14, 12

Page 34: Регби для дизайнера / Часть 2 / Typography

ТИПОГРАФИКА И ИНТЕРАКТИВНОСТЬ ДОЛЖНЫ ИСПОЛЬЗОВАТЬ ЕДИНЫЕ СИГНАЛЫ ПОЛЬЗОВАТЕЛЮ, НАПРИМЕР ЦВЕТОВОЙ КОД

Monday, May 14, 12

Page 35: Регби для дизайнера / Часть 2 / Typography

digital материал ничего не стоит, это не значит, что пиксели надо переводить на плохо разработанную структуру оформления текста, пользователь тратит долю секунды на знакомство с содержанием, тяжело вникать в грубо оформленный текст и он теряет интерес, а если все круто, то он его порекомендует прочитать сотне своих друзей, главный эквивалент стоимости сегодня, это внимание человека, его

настоящий интерес

Monday, May 14, 12

Page 36: Регби для дизайнера / Часть 2 / Typography

ИСТОРИЧЕСКИЙ ПРИМЕР, ПЕРЕПИСЧИК ПРОПУСКАЕТ СТРОКУ, ДЛЯ ИСПРАВЛЕНИЯ РИСУЮТ ЦЕЛЫЙ СЮЖЕТ НА СТРАНИЦЕ С ВНОСИМОЙ КОРРЕКТИРОВКОЙ, ЧЕМ ЦЕННЕЕ МАТЕРИАЛ, ТЕМ ТОЧНЕЕ ИНСТРУМЕНТЫ И КОНТРОЛЬ

Monday, May 14, 12

Page 37: Регби для дизайнера / Часть 2 / Typography

http://www.adobe.com/products/indesign/features._sl_id-contentfilter_sl_featuredisplaytypes_sl_new.html

Фишечки нового InDesign

Monday, May 14, 12

Page 38: Регби для дизайнера / Часть 2 / Typography

Monday, May 14, 12

Page 39: Регби для дизайнера / Часть 2 / Typography

дополнительно по теме геометрических построений модулей

дмитрий карпов тренер по креативному многоборью / [email protected]

Monday, May 14, 12