Шрифтовой дизайн – Паратайп
on
Поделиться Facebook Twitter Pinterest по почте
База знаний языков на основе кириллицы содержит не только знаки, составляющие официальные алфавиты, но и другие важные знаки почти для 80 языков. База будет полезна дизайнерам при разработке и локализации шрифтов.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Если у проекта небольшой бюджет и отдельные деньги на покупку лицензии на шрифт в нём не предусмотрены, это уже давно не значит, что выбирать придётся только из Arial, Times New Roman и Roboto. Если мы говорим о проекте, активно использующем кириллицу, то выбор всё равно есть — из нескольких десятков, а то и сотен шрифтов.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Читатели прекрасно помнят серию книг «Великие шрифты». Из задуманных пяти томов вышло только два, а вся серия была посвящена наборным шрифтам, оказавшим серьёзное влияние на типографическую среду. Планировался третий том, посвящённый гротескам, часть статей была написана, но осталась неопубликованной. Мы подготовили очерк Анны Шмелёвой и Владимира Ефимова о знаменитом гротеске Эрика Гилла — о том, как он был задуман и выпущен, как его использовали в XX веке и используют сегодня.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Шрифт — это не только дизайн. Современный шрифт — это сложный цифровой продукт, который объединяет данные разных типов. Это и математика описания кривых, и программный код, и инструкции по настройке отображения знаков на экране.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Сейчас все уже привыкли к тому, что в печати и на экране используются одни и те же шрифты, выглядят они примерно одинаково, а иногда у экранных шрифтов даже больше возможностей.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Компьютер — всего лишь инструмент, и оператор или дизайнер, даже при самой совершенной машине, но без ясного понимания своей задачи, без профессиональных знаний, не сможет работать на требуемом уровне. Современные средства обработки текста и иллюстраций, самые лучшие издательские пакеты в наших условиях тоже не гарантируют автоматического успеха. В статье описаны методы и правила набора и вёрстки.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Владимир Ефимов (1949–2012) создавал новые шрифтовые гарнитуры и восстанавливал уцелевшее наследие Отдела наборных шрифтов НИИ Полиграфического машиностроения, а также писал статьи, выступал на профессиональных конференциях (и принимал участие в их организации), устраивал с коллегами международные шрифтовые конкурсы, обучал студентов, переводил и редактировал книги.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Английский каллиграф, резчик по камню, издатель, изобретатель и дизайнер шрифта Джон Баскервиль родился в 1706 году в Уолверли (Wolverley) в графстве Уорчестершир и в 1725 году в возрасте 19 лет перебрался в Бирмингем, где начал работать как каллиграф и резчик по камню. В 1750 году Баскервиль открыл в Бирмингеме собственную типографию, словолитню и бумажную мельницу, и последующие 25 лет он потратил все свое состояние на издательскую деятельность.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Шрифт Futura – одно из самых ярких и типичных порождений своего времени. Вдохновленные голландским движением De Stijl, русским конструктивизмом и школой дизайна Bauhaus в Германии с ее девизом «форма определяется функцией», европейские дизайнеры на всем протяжении 1920-х годов эксплуатировали элементарные геометрические формы, такие, как квадрат, треугольник, круг.
Подробнее
Поделиться Facebook Twitter Pinterest по почте
Мы не знаем точно, кто был изобретателем этого шрифта и когда он был создан впервые, но впервые наборный шрифт без засечек, или гротеск, появился в Англии в начале XIX века.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Шрифт назван в честь своего создателя, французского пуансониста и издателя Клода Гарамона. Этот шрифт скорее признак эпохи, нежели дизайнерский артефакт. Известно, что Гарамон за 30 лет своей работы нарезал немало шрифтов, но до нас они почти не дошли. В музее печати Плантен-Моретус в Антверпене (Бельгия) хранятся подлинные пуансоны и матрицы, достоверно изготовленные самим мастером. Сохранилось много книг, набранных его шрифтами, и несколько печатных каталогов этих шрифтов.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Times New Roman — один из немногих текстовых шрифтов, который не несет в себе никаких исторических ассоциаций, а всецело принадлежит современности. Это связано с тем, что история его популярности, начавшаяся еще в 30-х годах прошлого столетия, по-настоящему никогда не прерывалась.
Подробнее
on
Поделиться Facebook Twitter Pinterest по почте
Как сделать удобную дизайн-систему. Шрифты. Часть 2 / Хабр
Продолжаю рассказывать об организации дизайн-систем. На очереди типографика. Начнем с небольшой теории, затем перейдем к систематизации стилей в Figma и закончим парочкой ресурсов с классными шрифтами.
Кстати, я сделал свой телеграм канал — https://t.me/artemsuslovv. Буду рад видеть вас там!
Хорошая типографика
Типографика это один из основополагающих элементов в дизайне интерфейсов. Если пользователь не может прочитать текст — вы можете с ним сразу же попрощаться. Поэтому элементарное знание типографики поможет вам определить лучший шрифт для дизайна интерфейса.
Плохую типографику всегда легко заметить даже людям, которые не сильно разбираются в дизайне. А хорошему шрифту не придают должное значение, так как кажется, что это само собой полагающееся.
С помощью типографики можно вызывать эмоции, задавать направление и выражать индивидуальность.
И важное напоминание: работа с типографикой — это не точная наука. Поэтому тут вы предоставлены сами себе, вашим ощущениям и насмотренности.
Базовый размер шрифта
Определение базового размера шрифта — важный шаг для отзывчивого дизайна. Базовый размер шрифта — это размер шрифта который используется чаще всего на сайте или в приложении. Базовый шрифт обычно применяется для большинства абзацев, меню, списков.
Большинство современных пользовательских интерфейсов и веб-сайтов используют базовый размер шрифта 16px. Это всегда хорошее значение по умолчанию для начала, так как оно удобно для чтения текста на экране. Что касается дашбордов, то там базовый шрифт лучше принимать 14px, так как обычно в таких системах нужно уместить большое количество элементов и при этом сохранить достаточно свободного пространства.
Межстрочный интервал (Интерлиньяж)
Для лучшей читаемости ваших текстов важно правильно выбрать межстрочный интервал.
Определение правильного интервала может отличаться для разных шрифтов и размеров, поэтому важно корректировать и экспериментировать до тех пор, пока это не будет выглядеть и «чувствоваться» правильно.
Обычно, межстрочный интервал для базового текста должен быть в 1,5-2 раза больше кегля. Например, если базовый текст имеет 16-ый кегль, то межстрочный интервал будет в диапазоне 24-32.
Для заголовков ситуация обратная. Начиная с заголовков размером 28-32px, межстрочный интервал нужно умножать на 1,2-1,0. Это правило работает почти всегда.
Оптимизация межбуквенного интервала (Трэкинг)
Большинство шрифтов изначально имеют значение трэкинга 0% и его практически не имеет смысла менять. Но, например, в хедерах иногда все же стоит это делать и в меньшую сторону, но в пределах 5%.
Систематизация и нейминг
Начнем с основного правила:
Как же понять, когда добавлять новое начертание в дизайн-систему? Когда ни один существующий стиль в дизайн-системе не подходит, например, для кнопки, это означает, что нужно внедрять новый стиль.
Нейминг состоит из следующих параметров:
Где используется шрифт. Это может быть Подпись (Caption), Основной текст (Body), Подзаголовок (Subheader), Заголовок (Header).
Далее идет обозначение размера, но не в формате пикселей, а в формате “размеров одежды” (у меня такая ассоциация). То есть: XS, S, M, L, XL. Например, 16px=M, тогда 18px=L и так далее. С какого размера начинать? Логичнее начинать с М, так как если нужно будет добавить другой размер такого же шрифта, то вы можете прыгнуть либо на градацию вверх либо вниз, чего не сделаешь, начиная с XS или XL.
Последним параметром идет начертание: Light, Book/Regular, Medium, SemiBold, Bold и так далее. Также, каждому начертанию можно зарезервировать свое числовое значение как в статье про цветовые стили. То есть, Light — 300, Book — 400, Medium — 500, SemiBold — 600, Bold — 800 и так далее. Этот вариант подходит для лучшей синхронизации с разработчиками.
Итого, мы получаем следующий формат нейминга: Body/M/Book или Subheader/L/700.
Вот так будет выглядеть иерархия в Figma.
Ресурсы с шрифтами
https://www.fontshare.com/ — один из лучших сайтов с бесплатными шрифтами.
https://pangrampangram.com/ — фул паки платные, но некоторые начертания можно скачать бесплатно.
Итог
Очень важно как правильно подобрать шрифт, так и грамотно его видоизменять.
Хотел бы напомнить еще раз: работа с типографикой — это не точная наука. Поэтому тут вы предоставлены сами себе, вашим ощущениям и насмотренности.
Успехов!
***
Telegram | Instagram | Dribbble | Behance
Лучшие редакторы шрифтов и программное обеспечение
Приступить к разработке и созданию вашего первого «печатаемого» шрифта — это захватывающая перспектива: результат изучения новых методов работы и изучения того, что делает ваш собственный дизайн шрифта личным для вас.
Выбор хорошего редактора шрифтов является ключевой частью этого процесса, и эти цифровые инструменты играют немаловажную роль, влияя на ваши дизайнерские решения. Приток новых инструментов породил более широкий энтузиазм дизайнеров всех уровней подготовки к созданию шрифтов, что делает разработку шрифтов настолько простой или сложной, насколько вам хотелось бы.
В начале важно прочитать и узнать о ключевых принципах дизайна шрифта в отношении пропорций букв и интервалов выбранного вами шрифта. Начните с рисования ключевых форм «n», «o», «H» и «O», чтобы установить пропорции, затем просмотрите другие шрифты, чтобы распознать ключевые различия в толщине штриха, а также оптические эффекты различных штрихов по вертикали и горизонтали. Распознавайте историческое происхождение ваших писем; и изучить их общие пропорции. Помните, что белое пространство формы так же важно, как и черное.
Когда вы изложите свою идею с помощью некоторых основных форм букв, вы можете перейти к редактору шрифтов — миру волшебных серых прямоугольников, непонятных кнопок инструментов и панелей кодирования.
Ниже приведен краткий обзор наиболее широко используемых инструментов, помогающих воплотить ваши идеи в жизнь в цифровом формате. Вы никогда не забудете, как впервые набираете собственные буквы на клавиатуре…
Редакторы шрифтов начального уровня
Fontographer 310 фунтов стерлингов (400 долларов США)
Для многих дизайнеров Fontographer считается первым редактором цифровых шрифтов, и это еще очень жив. Сегодня это привлекательно простое приложение, которое позволяет вам изучить основы дизайна цифровых шрифтов — написание букв, интервалы и кернинг — и в то же время ознакомиться с распространенными инструментами рисования шрифтов. Вы можете настроить исходный файл дизайна в простом или расширенном режиме, что означает, что вам не нужно беспокоиться о сложных функциях OpenType, высокоуровневых подсказках или обработке большого семейного пространства дизайна, поскольку ни одна из этих вещей не доступна непосредственно в Fontographer. . Это приложение поможет вам создать свой первый файл шрифта без излишеств и изучить ключевые принципы дизайна шрифтов.
TypeTool 37 фунтов стерлингов (48 долларов США)
TypeTool, предназначенный для «студентов и типографов-любителей», является фаворитом на курсах бакалавриата по графическому дизайну. Как и Fontographer, он имеет урезанную функциональность, но с более совершенным профессиональным пользовательским интерфейсом Fontlab Studio. Я никогда не пользовался TypeTool, но знаю авторитетные дизайн-студии, которые используют его для передачи шрифтов крупным торговым посредникам. У меня сложилось впечатление, что это инструмент для тех, кто хочет повозиться или создать разовые личные проекты. Имея это в виду, будьте очень осторожны при открытии, адаптации или изменении любых существующих шрифтов. Всегда читайте лицензионное соглашение шрифта, так как очень немногие литейщики разрешают модифицировать свои данные шрифта, защищенные авторским правом. Изменение существующих шрифтов — опасная юридическая территория.
Glyphs Mini 38 фунтов стерлингов (50 долларов США)
Glyphs Mini, предназначенная как для любителей, так и для тех, кто хочет исследовать немного глубже, представляет собой начальную версию чрезвычайно интуитивно понятного и широко популярного приложения Glyphs, которое мы теперь используем в Fontsmith каждый раз. день как для рисования, так и для производства (подробнее об этом ниже). В Glyphs Mini есть все инструменты, которые вам понадобятся для создания серьезных шрифтов с высокой степенью автоматизации, и, в отличие от Fontographer или TypeTool, он позволяет экспортировать форматы веб-шрифтов, поэтому, если вы разработали экранный шрифт специально для использования на веб-сайте, это огромный бонус.
Fontself £43
Fontself — самый простой из всех производителей шрифтов. Это не отдельное приложение, а подключаемый модуль Adobe Illustrator и Photoshop, который легко встраивается в панели документов. Это приложение отлично подходит, если вы ищете быстрое исправление шрифта, но вам будет сложно использовать его в качестве инструмента обучения дизайну шрифтов или делать какие-либо серьезные лица для чтения текста. Я нахожу аспекты интервалов и кернинга немного неудобными, а их интегрированный характер удерживает вас на расстоянии от мельчайших деталей процесса создания шрифта. Кроме того, вы можете экспортировать только шрифты в формате OpenType, поэтому для поддержки более широких платформ с файлами TrueType, WOFF или EOT по-прежнему потребуются другие приложения, веб-сайты или сценарии.
Редакторы шрифтов профессионального уровня
Fontlab Studio 5 500 фунтов стерлингов (649 долларов США), Fontlab VI 360 фунтов стерлингов (459 долларов США)
Fontlab Studio 5 был приложение для использования в течение добрых десяти лет, и до сих пор используется многими ведущими литейщиками и инженерами шрифтов из-за его надежных инструментов проектирования и проектирования. В Fontsmith мы работали с Fontlab 4 и Studio около десяти лет до 2015 года, и большая часть нашей библиотеки действительно разработана в Fontlab Studio. Тем не менее, разработка приложений какое-то время была бездействующей, и начали проявляться трещины — стабильность в различных средах Mac OS была проблемой для многих производителей. Это приложение также имеет крутую кривую обучения для новичка, так как здесь есть мощный набор инструментов, с которыми можно справиться в том, что кажется устаревшим пользовательским интерфейсом. В последний раз, когда я проверял, руководство пользователя в формате PDF было около 900 страниц! Однако полезные инструменты, которые делают это шагом вперед по сравнению с инструментами начального уровня, включают кернинг классов для экономичного развертывания значений кернинга; Инструменты подсказок TrueType для улучшения рендеринга на экране; встроенная панель кодирования функций OpenType; гораздо более совершенные инструменты смешивания шрифтов (процесс, известный как интерполяция) и значительно улучшенные инструменты рисования и масштабирования. Создание шрифтов здесь дает дизайнеру больше инженерной свободы. Вы можете создать таблицу имен каждого шрифта (и изменить ее), сгруппировать шрифты в семейство, указать вертикальные метрики, добавить данные-подсказки, указать кодовые страницы Unicode и так далее. Вам, несомненно, потребуется изучить многие аспекты процесса разработки шрифтов, чтобы создать достойный и надежный файл шрифта.
Glyphs 192 фунта стерлингов (249,90 евро / 299,90 долларов США)
Glyphs — это основной инструмент Fontsmith для разработки шрифтов как для дизайна, так и для производства. Он предлагает комплексный рабочий процесс с широким набором инструментов и возможностью создания полного семейства весов и стилей в одном исходном файле, что является огромным бонусом. Он построен на знакомых принципах пользовательского интерфейса, при этом многие сочетания клавиш для инструментов являются теми же сочетаниями клавиш, которые вы использовали бы в Adobe CC. Glyphs позволяет сделать сложные задачи и инструменты интуитивно понятными с самого начала, и у вас есть возможность погрузиться в это приложение так глубоко, как вы хотите. Это, вероятно, самое автоматизированное приложение на рынке, но вы также можете контролировать и определять свои собственные предпочтения с помощью пользовательских параметров. Это хорошо поддерживаемое приложение с еженедельными новейшими обновлениями, а также онлайн-учебниками и сообществом на форуме, чтобы помочь с любыми вопросами. Приложение также включает менеджер подключаемых модулей, где вы можете добавлять новые инструменты в пользовательский интерфейс одним щелчком мыши. Поищите на GitHub, и вы найдете множество Python-скриптов, которые могут создавать всевозможные преобразования для вашего шрифтового дизайна. Glyphs может экспортировать файлы UFO (для сторонних приложений), а также все основные форматы файлов для рабочего стола, Интернета и вариативных шрифтов.
Robofont 370 фунтов стерлингов (400 евро)
Robofont был создан с учетом масштабируемости и, возможно, является главным конкурентом Glyphs. Построенный на Python, Robofont поощряет некоторые сценарии, и знание Python, несомненно, полезно, но ни в коем случае не обязательно. Важно отметить, что вам нужно будет инвестировать в дополнительные инструменты для выполнения других важных задач, таких как кернинг, и при создании семейства шрифтов из более чем двух начертаний вам понадобится инструмент для интерполяции. В рабочем процессе Robofont используется интегрированный процесс исходного файла UFO, благодаря которому вы можете переключаться между различными вспомогательными приложениями, одновременно работая с одним и тем же исходным файлом UFO, поскольку каждый инструмент изменяет очень специфические аспекты данных вашего дизайна шрифта. Например, вы можете рисовать и размещать шрифт в Robofont, а также одновременно кернить его в Metrics Machine, не закрывая тот же исходный файл. Существует также сильное сообщество разработчиков, где плагины и функции сценариев могут быть добавлены в приложение через платформу Mechanic Robofont. В конечном счете, Robofont дает вам полный контроль над вашим проектом, вплоть до мельчайших деталей.
FontForge (бесплатно)
Приложение, которое приобрело популярность за последние несколько лет, особенно среди тех, кто работает над совместными проектами с открытым исходным кодом. FontForge сам по себе является проектом с открытым исходным кодом, разрабатываемым небольшой группой дизайнеров шрифтов. FontForge — это приложение для UNIX, поэтому для его запуска вам необходимо установить XQuartz в системе Mac. Одно из преимуществ использования системы X-Window заключается в том, что интерфейс выглядит одинаково на всех платформах и сразу становится знакомым. Недостатком FontForge является его ограниченная документация и меньшее сообщество, поэтому может быть сложно найти ответы на ваши вопросы. Раньше это приложение было очень удобным, если вы хотели опубликовать шрифт в старом формате SVG, поскольку ни один другой редактор не смог бы этого сделать. В FontForge это глубина и годы совместной разработки, а также двусмысленность и устаревший пользовательский интерфейс. Fontforge, безусловно, стоит попробовать, если у вас нет бюджета, вы хотите учиться и хотите использовать инструменты профессионального уровня для редактирования.
TruFont (бесплатно)
Проект межплатформенного редактора, инициированный и возглавляемый студентом бакалавриата Адриеном Тетаром. Запущенный в конце 2015 года, TruFont получил некоторую влиятельную поддержку в мире шрифтов, но как приложение он находится в зачаточном состоянии. В настоящее время функциональность и инструменты ограничены, но, безусловно, за ними стоит следить в будущем.
FontCreator 60 фунтов стерлингов (79 долларов США)
Родное приложение Windows для ПК, которое, похоже, также набирает обороты на рынке. Как и у Glyphs, у него есть собственный форум, и, как и все другие приложения, его можно загрузить в виде бесплатной пробной версии.
ПРОТИВ Fontographer, TypeTool и Fontlab Studio
- Требуются другие инструменты, так как нет параметров экспорта файлов веб-шрифтов. Код функции
- OpenType должен быть написан вручную, поэтому требуются дополнительные знания.
- Они предлагают редактирование только одного стиля шрифта, и нет возможности редактировать все семейство в одном исходном файле дизайна.
- Разработка приложения прекращена, поэтому поддержка в будущих версиях ОС будет ограничена.
Специализированные инструменты и плагины
Рисование
Speed Punk 18 фунтов стерлингов (20 евро)
Графическое изображение, помогающее оценить плавность кривых. Совместимы только с глифами и Robofont.
Super Tool 46 фунтов стерлингов (50 евро)
Набор инструментов, которые помогают изменять и оценивать контуры векторных фигур. Совместимы только глифы.
Гармонизатор RMX 92 фунта стерлингов (99 евро)
Набор инструментов для согласования узлов и ручек. Совместимы только с глифами и шрифтами.
Интерполяция:
Интерполяция — это концепция слияния или смешивания шрифтов разного веса или стиля. Это чрезвычайно полезная концепция в современном процессе шрифтового дизайна при расширении семейства шрифтов или изучении новой оси стиля. Следующие инструменты помогают процессам интерполяции:
Преполятор 193 фунта стерлингов (250 долларов США)
Помогает определить любые несовместимые контуры между файлами НЛО. Исправление этих контуров и обеспечение их совместимости позволит создавать новые веса и стили. Обратите внимание, что приложение Glyphs имеет собственную встроенную проверку совместимости.
Суперполятор 278 фунтов стерлингов (300 евро)
Мощный интерполятор пространства дизайна всех данных шрифтов. Можно расширить как минимум два файла UFO в гораздо большее семейство шрифтов. Это программное обеспечение является обязательным при создании семей с помощью Robofont.
Масштабирование глифов:
RMX Scaler 92 фунта стерлингов (99 евро)
Инструменты для масштабирования и повторного взвешивания глифов с сохранением веса основы. Требуются два совместимых мастера контурных шрифтов. Совместимы только с глифами и шрифтами.
UFO Stretch 185 фунтов стерлингов (200 евро)
Специальный скалер для НЛО, который отлично подходит для изготовления небольших крышек при сохранении веса стержня. Полезно в рабочем процессе Robofont.
Кернинг:
Metrics Machine 387 фунтов стерлингов (500 долларов США)
Специальное приложение для кернинга на основе НЛО, которое позволяет создавать группы, парные списки, а также масштабировать и преобразовывать данные кернинга по всему шрифту. Полезен как в рабочем процессе Glyphs, так и в Robofont.
Намек:
Microsoft Visual TrueType (бесплатно)
Инструмент для применения подсказок TrueType непосредственно к исходному файлу шрифта TrueType. Для этого приложения требуется высокий уровень исследований и занудства.
TTFAutohint (бесплатно)
TTFAutohint — это встроенный инструмент AutoHint, используемый в приложении Glyphs. Если вы используете другое программное обеспечение, вы также можете воспользоваться подсказками TTFAuto, запустив это приложение независимо в командной строке.
Функции OpenType:
Microsoft VOLT (бесплатно)
Инструмент компоновки объектов OpenType с графическим интерфейсом, обеспечивающий более четкое и наглядное построение функций OpenType.