Типографіка — невід'ємна складова будь-якого проєкту, а дизайнери постійно перебувають у пошуку корисних матеріалів та ресурсів на цю тему. У цій статті ми розповімо про 7 інструментів, які допоможуть у роботі з типографікою, — тут і розширення для браузера, і програми, і навіть email-розсилки. Кожен точно знайде для себе щось цікаве та надихаюче!
Типографічна шкала
Ви колись замислювалися, чому нам так приємно читати текст на деяких вебсторінках? Весь секрет у гармонійному масштабуванні шрифту. Масштаб - це розмір одних елементів дизайну до інших розмірів. Різниця в масштабі створює візуальний контраст, рух, глибину та ієрархію.
Типографічна шкала (Type Scale) пропонує кілька популярних коефіцієнтів (велика терція/major third, збільшена кварта/augmented fourth, золотий перетин/golden ratio тощо) для створення шрифтової ієрархії. Вам залишається тільки ввести в перше поле базовий розмір (за замовчуванням він дорівнює 16px).
Ви можете відразу подивитися, як виглядатиме обране співвідношення на десктопі та мобільних пристроях, налаштувати стилі шрифтів у Figma та розпочати проєктування.
Порада: Якщо вас не влаштовують коефіцієнти зі списку, додайте потрібне значення (остання опція Enter value).
Також є плагін для Figma.
Fonts In Use
Fonts In Use – загальнодоступний архів типографіки. На ресурсі ви можете відфільтрувати роботи за темами, форматами та шрифтами. Основа колекції – приклади, запропоновані аудиторією. Команда ресурсу досліджує та документує їх, щоб якнайбільше дизайнерів змогли розібратися в тому, що таке крута типографіка, і навчилися відтворювати її у своїх проєктах.
Зазвичай до цього ресурсу звертаються, коли хочуть знайти референси, вибрати шрифт, скласти шрифтову пару або відкрити для себе нові способи креативного використання шрифтів. Мені особисто найбільше подобається пошук за темою. Також люблю вивчати постери та інші приклади друкованого дизайну.
Fonts Ninja
Уявіть: ви переходите зі сторінки на сторінку, помічаєте класний шрифт. Звичайно ж, ви можете відкрити “Інструменти розробника” у браузері та пошукати його назву у коді. Але, якщо ви не сильно знаєтеся на технічних питаннях та не розбирається у всіх цих панелях, є варіант простіше - плагін Fonts Ninja. Він допоможе визначити не тільки назву, але й отримати зображення шрифту, а також розмір, висоту рядка і колір.
Особливо корисною мені здається функція Info, де можна дізнатись детальну інформацію про шрифт, його вартість та отримати посилання на сайт, де його придбати.
Typewolf
Typewolf - мабуть, найбільш відвідуваний, модний блог про типографіку. Це чудове джерело натхнення, де я часто знаходжу красиві шрифтові пари. Я справжній фанат різних добірок, створених фундатором ресурсу. А якщо вам, як і мені, важко запам'ятати правильні поєднання клавіш для гліфів та спеціальних символів, вам сподобається докладна шпаргалка від сервісу.
Fresh Fonts
Fresh Fonts — email-розсилка, спрямована на підтримку незалежних шрифтових дизайнерів. Це не тільки чудовий спосіб дізнатися про поточні тренди типографіки, але й отримати додаткове невичерпне джерело нових шрифтів. Якщо ви оплатите передплату, то щомісяця отримуватимете нову гарнітуру з комерційною ліцензією. Також є безкоштовна версія з обмеженим функціоналом.
100 days of fonts
Сподіваюся, ви ще не втомилися надихатися? Тоді зверніть увагу на цей сайт, створений дизайнеркою Do-Hee Kim. Основна ідея автора полягала у тому, щоб навчитися креативно поєднувати безкоштовні шрифти від Google. Все починалося як 100-денний челендж. В результаті вийшло 99 креативних робіт (бо дизайнерка пропустила 95-й день).
Книга Еллен Луптон Thinking with type
У мене є кілька книг, які я перечитую щороку, щоб нічого не забути, і ця книга Еллен (її можна знайти в мережі 😜) — безперечно одна з них. Вона охоплює все, що потрібно знати про типографіку, а також розповідає про «шрифтові злочини», яких слід уникати у своїх проєктах. Це не лише чудовий довідник, а й ціла колекція цікавих історій та прикладів.
Font Reach
Font Reach — колекція розподілених за категоріями (без засічок, із засічками, рукописні тощо) шрифтів. Ви можете безкоштовно використовувати їх в особистих проєктах та купувати для комерційних.
💬 Дизайн-чат
