Як визначити шрифт (розпізнати гарнітуру) по картинці

14.09.2015

Я передумав писати коментар / Як визначити шрифт (розпізнати гарнітуру) по картинці

Постійно натикаюся на мессаги типу «Що це за шрифт?», «Допоможіть знайти гарнітуру» і т. п. Проблема дуже поширена, т. к. айчынным дизайнерам частенько доводиться перетворювати «логотипи» та інші написи з jpeg-картинок, гифок або взагалі з паперових візиток :)

І хоча всі більш-менш розумні люди знають про сервіс What the Font («Че за шрифт?». назва до речі класне, натякає на «What the fuck?!» ), навіть вони часто не знаходять там потрібну гарнітуру. Між тим, приблизно в 80 % випадків це робиться на ура, якщо користуватися сервісом уміючи. Ща розповім, у чому фішка)

Приклад візьмемо реальний, з питання заданого сьогодні в групі рекламників в ВК.

Як визначити шрифт (розпізнати гарнітуру) по картинці
Тільки тру, тільки хардкор :)
5-7 хвилин на відповідь, поїхали.

Готуємо «зразкову» напис

Перш ніж сунути в сервіс цю картинку, її бажано обробити. Як бачите, якийсь дятел вигнув текст на манер турецького прапора, покорежив літери. Але оскільки вони великі, працювати все одно можна.

Першим ділом чистимо фон. Потрібен максимальний контраст — більше шансів знайти потрібну гарнітуру. Тим більше, що в даному випадку фотошоп робить це в два кліка. «Виділити» -> «Колірний діапазон» (чорний колір, чутливість 50-100). Виділили. Натиснули Ctrl+J, отримали чистий шар з текстом. Нижню частину напису видаляємо, щоб не заважала (всі ключові символи є і у верхній). Сміттєвий вихідний шар вбиваємо, кидаємо текст на білий фон.

Як визначити шрифт (розпізнати гарнітуру) по картинці

Напис явно нахилена вгору. Це погано. Намагаємося відновити: Ctrl+T, правий клік, «нахил», тягнемо мишкою правий край вниз. Отримуємо щось типу:

Як визначити шрифт (розпізнати гарнітуру) по картинці
Вже нормально. В принципі, можна було б шукати і так. Але для наочності прикладу ми ще трошки пошаманим.

Вибираємо найбільш характерні символи

У будь гарнітури (сімейства шрифтів) є особливості. І найпомітніше вони на деяких окремо взятих символах (гліфах). Наприклад, за графеме рядкової букви «а» майже завжди можна знайти відмінності між двома схожими гарнітурами.

Як визначити шрифт (розпізнати гарнітуру) по картинці
У нашому випадку я вибрав літери «A», «B», «R», т. к. вони мені здалися найбільш незвичайними. Заодно збільшив відстань між ними, щоб сервісу було простіше читати :)

Як визначити шрифт (розпізнати гарнітуру) по картинці

У більш важкій ситуації варто було б висмикнути букви акуратніше, з більшою чутливістю, і спробувати вирівняти горизонтальні штрихи, т. к. центр вихідної написи аффтором явно деформований. Але тут і так зійде, бо гарнітура має специфічні пропорції — проблем з її визначенням бути не повинно.

Розпізнаємо картинку, визначаємо гарнітуру

Йдемо на сайт сервісу і заливаємо нашу картинку з текстом. Система намагається розпізнати символи і видає гіпотези про те, що за буква на картинці. В моєму випадку «B» визначилося як «D», тому довелося підкоригувати. Саме для цього передбачені поля внизу.

Як визначити шрифт (розпізнати гарнітуру) по картинці

Клацаємо Continue, отримуємо список стіна, схожих на шуканий з розпізнаним символів. Ось чому я раджу брати не всю напис, а лише окремі гліфи — за рахунок цього різко знижується ймовірність випадкових збігів. І, о диво, перший же результат виглядає дуже схожим.

Як визначити шрифт (розпізнати гарнітуру) по картинці

Визначаємо шрифт

Перш ніж плескати в долоньки, потрібно переконатися, що гарнітура дійсно адекватна, а не просто приблизно схожа. В даному випадку, наприклад, другий варіант палить буква «R», а третій очевидно відрізняється. А перший начебто підходить, але ми поки бачимо тільки три символу і, до того ж, в жирному накресленні (bold). Може знайтися і щось більш підходяще — треба уточнити. Беремо назва гарнітури і шукаємо по сайту:

Як визначити шрифт (розпізнати гарнітуру) по картинці

На сторінці знайдених результатів вбиваємо як «Приклад» текст вихідної написи, щоб бачити всі потрібні символи поруч. Може статися так, що ісходник набраний капітеллю або, наприклад, надстрочным індексом — при бажанні можна погратися з галочками у налаштуваннях типографіки, щоб знайти найбільш точне збіг.

Як визначити шрифт (розпізнати гарнітуру) по картинці

Отже, що ми маємо в результаті. Кілька шрифтів з нашої гарнітури «Pacific» плюс випадково-залетное збіг «Pacific Clipper». На перший погляд, все схоже. Але варто лише придивитися уважніше, як знаходиться маса нюансів: на смак і колір всі пацифики різні :)
У «Standard» товстий горизонтальний штрих. У «Classic» все б добре, але — ап! — літера «C» спалилась, не ті хвости :)
«Serif» теж не годиться, зрозуміло справа: це шрифт з засічками, а у нас в исходнике — без.

Як визначити шрифт (розпізнати гарнітуру) по картинці

Залишається Pacific Sans. Причому при найближчому розгляді з’ясовується, що ісходник більше схожий на нормальне накреслення, ніж на жирне. Все, тепер ми знаємо, що це за звір і можемо його де-небудь спиздить запропонувати замовнику покупку шрифту потрібно накресленні :)

P. S. Незважаючи на довжину посту, процес пошуку займає від сили 5 хвилин.

Постпостскриптум про кирилиці

Сервіс, природно, краще працює з латиницею. З кириличними написами варіанти наступні:

  • вибрати «універсальні» символи і пошукати за ним, тому що левова частка кириличних шрифтів, особливо ніяких, являє собою копію латиниці з «домальованими хвостиками». Це «A, M, H, T» і т. п. Тільки при розпізнанні краще вказувати символи латинської розкладки.
  • якщо не знайшлося, піти на сайт Паратайпа і пошукати там :)
    Нормальних кириличних гарнітур, які не мають латинських аналогів, зовсім небагато, так що при бажанні можна навчитися на око розпізнавати :-)
  • якщо нічого не допомогло, або забити, або спробувати спочатку класифікувати шрифт: визначити тип, стиль, стиль і шукати за каталогами з відповідною рубрикацією)

Короткий опис статті: пошук шрифту по картинці

Джерело: Як визначити шрифт (розпізнати гарнітуру) по картинці

Також ви можете прочитати