Здоровий глузд

Про дизайн, міста та дизайн у містах, кодінг та автоматизацію

Новий шрифт для інтерфейсів — Road UI

Зроблений Андрієм Константиновим (Minttype) на основі дорожнього шрифту Road UA. А надихнули та ініціювали проєкт Олександр Вілінський (студія Superclear) та Стаc Говорухін, які в робочих проєктах вже використовували дорожній шрифт.

Завантажити шрифт: agentyzmin.github.io/Road-UI-Font

Основне:

  • форми літер краще адаптовані під екран і трохи тонші;
  • зроблені пропорційні стрілки та моноширинні цифри;
  • з’явилось нахилене накреслення.

330848231-c9685cb6-3ec6-4290-b64d-9528a3d9abae.png

330848224-f977edd9-892c-4f9e-8ab4-1a9b10a529f7.png

330848228-4e062d17-ae35-448d-8522-53d9b75e09f3.png

Накреслення, цифри, стрілки

Приклади:

330848235-83c3188a-852b-4756-a829-96c9fe5bca7a.png

330848240-4b39f915-ad33-436f-af9f-5e463dac4e87.png

330848243-467c8767-94f5-4fe3-9922-514a95227c1f.png

330848253-73ff4242-1b2f-41b8-aa5e-4accee47a3a0.png

330862791-c896ccdf-d64f-4cc3-99b6-01d06f8af797.png

330862837-014ba67b-4bb5-41e7-8528-893c91433337.png

Проєкт на Гітхабі. Ліцензія CC BY–ND 4.0, можна використовувати в комерційних проєктах.

Читати →

Розмір макетів під друк у Figma

Метод підійде не тільки для Фігми, але і до будь-яких екранних редакторів, які не прив’язані до фізичних розмірів (міліметрів, дюймів тощо).

Дисклеймер: винесемо за дужки передачу кольору. Для друку потрібна колірна модель CMYK, а «екранні» редактори заточені лише під роботу з екраном і працюють у RGB/HSB/HSL/Lab та інших адитивних колірних моделях. Але це не завжди буває критично: або можна перевести у CMYK картинку пізніше, або ж при використанні цифрового друку колір буде конвертувати вже сама машина/принтер або друкарі.

Читати →

Меморіальні таблички Києва

Нижче передісторія, а зараз дизайн. Перше рішення — це розділення табличок на всіх, хто ніс службу (військових, нацгвардійців тощо), та загиблих цивільних, яких теж треба вшановувати. Звідси перше рішення — розділити візуально та використати шрифт UAF Memory для військових та загальний київський Proba Nav2 для інших.

Kyiv-Memorial-Plates-Preview-v1-02.jpg

Kyiv-Memorial-Plates-Preview-v2-01.jpg

Це виключно ілюстрація, фото та імена згенеровані

Далі також хотілося додати приналежність у символах і додавати або символ роду військ, або комбатантський хрест (загальний символ для всіх), а для цивільних просто використати малий державний герб.

Читати →

Повідомлення про ремонт колій

Хочу поділитись гарним прикладом небайдужості. В каналі Urban Rail побачив картинку яка нагадувала суміш плаката метро та стилю УЗ, в якому доволі зрозуміло було написано, коли буде відбуватись ремонт колій і як зміниться розклад. Я спитав і в метро, і в УЗ, чи вони робили, але всі здивовано сказали ні.

kce-poster-redesign.png

І от в коментарях нещодавно написав автор, який самотужки просто взяв і переверстав оголошення, як пише «на телефоні». Вийшло чітко, зрозуміло і людяно, у порівнянні з оригіналом.

Читати →

Aztec code

Цікавий різновид штрих-кодів, в якому модулі навколо центрального квадрата. Назва походить від схожості на піраміди ацтеків, якщо дивитись згори. Так коди більш компактні, наприклад, на картинці обидва коди вміщають текст в 390 символів.

aztec-bar-code-2.jpg

З цікавого:

  • Код вже містить високий рівень корекції помилок 23% (якщо майже чверть даних була знищена, ці коди все ще можна зчитувати). Для порівняння звичайний QR за замовченням має 7%, а більший захист потребує більшої кількості модулів.
  • Код не потребує безпечної зони навколо.

Правда поки що для зчитування потрібна окрема програма, бо не завжди стандартні застосунки камер зчитують такі коди.

Читати →

Відстань зчитування QR кодів — 10:1

Співвідношення розміру QR та відстані зчитування рекомендують закладати мінімально 10:1, тобто якщо код розміром 10×10 см, то відстань 100 см = 1 м. Якщо кращі умови або ж камера, бо відстань може бути більшою.

Correlation-between-QR-code-size-and-scanning-distance-optimal-and-maximum.png

При цьому чим коротший текст, що закладено у код, тим відстань більше, і навпаки — довгий текст → більше потрібно модулів (квадрат) → дрібніше кожен модуль в тому ж розмірі → складніше зчитувати.

Також рекомендують для кращого зчитування лишати навколо коду безпечну зону: для коду 21×21 модуль використовувати зону в 4 модулі.

Читати →

Шрифт Proba Nav2

Навігаційний шрифт Proba Nav2 тепер доступний публічно для некомерційного використання. Його зробив Андрій Константинов (студія Mint Type) на основі свого шрифту Proba Pro, що став стандартом державних вебсайтів.

proba-nav-site.jpg

Також це неофіційний шрифт київської навігації: від схем та плакатів у метро до адресних покажчиків, розкладів та навігаційних стел, та і в цілому проєктів А3. Містить транспортні піктограми, лігатури, табличні цифри та інші opentype-фічі.

Ліцензія така сама як у RoadUA — CC BY–NC–ND 4.0, а шрифт розміщено на Github.

Читати →

МУР — Ти [Романтика]

Сьогодні рекомендую послухати та подивитись музичний альбом проєкту МУР про розстріляне відродження. Дуже чіпляє і захоплює на всі 40 хвилин.

Окремо хочеться відмітити відеоряд: дуже круто зроблено та гарно доповнює звук. А ще прекрасно метафорично літерами вдається передавати сенс.