Типографика *

На прошлой неделе мы запустили эксперимент – бесплатную дизайнерскую помощь. Все желающие помечали хэштегом #logomachine_help дизайн, который нуждается в совете или доработке, а мы выбирали, кому мы можем помочь и играли шрифтами, подбирали цвет, улучшали компоновку. Сразу скажу — это не полноценный дизайн, а скорее визуальные советы, поэтому они делаются на ходу в фотошопе и допускают неточности и упрощения. Но эти примеры помогут каждому понять проблемы в своем дизайне и улучшить его в пару кликов.

14 апреля в Екатеринбурге пройдет конференция DUMP. Программный директор секции «Дизайн» Дарья Прокуда рассказала, что интересного будет в секции и зачем на нее идти. Ей слово.



Всем привет!

Меня зовут Дарья Прокуда, я работаю арт-директором в JetStyle и второй год являюсь программным директором секции «Дизайн» на DUMP.

В этом году мы решили провести экспериментальную эволюцию секции «Веб-дизайн» —откинули приставку «веб» и расширили границы. Почему? Ответ прост — мы живем в то время, когда будущее дышит нам в спину и обещает множество революций в сфере интерфейсов и проектирования взаимодействия вообще. Пора перестать думать о дизайне как о картинках и начать осваивать и перенимать знания из соседних областей.

Это перевод статьи дизайнера-программиста Джона Голда, занимающегося системами дизайна в Airbnb, а ранее — сотрудника проекта Grid, который, как и uKit AI, делает раннюю попытку применить нейросети и машинное обучение в дизайне и редизайне веб-элементов.



Дизайн – это почти бесконечный процесс выстраивания всевозможных гипотез с дальнейшей попыткой собрать детали воедино.

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

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



Типографика — сильнейший инструмент для выражения посыла в веб-дизайне. С его помощью вы можете объединить текстовую и визуальную составляющие, что поможет вам достучаться до посетителя. Правильное использование типографики поможет избежать типичных ошибок, допускаемых дизайнерами при создании очередного шедевра. Постараемся понять, что же мы делаем не так, и как избежать ошибок в будущем.

Для начала давайте разберемся с терминологией. Наверняка большинство терминов вам знакомы, но еще разок ознакомиться с определениями не будет лишним. Возможно, это дополнит ту информацию, которой вы уже обладаете.

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

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

Итак, мы нашли в интернете бесплатные и условно-бесплатные инструменты для роста вашего бизнеса. Когда они дадут вам желаемый результат, вы можете оформить платную подписку.

Что делать, если хочется сделать для своего проекта классный логотип, а денег на это нет? Последние десять лет я занимался дизайном, поэтому всегда мог сделать лого для своих проектов самостоятельно. А как можно сделать классный логотип, если ты не дизайнер?

Мы всегда в поисках хороших статей о дизайне, чтобы потом использовать их в работе над сайтом «Я люблю ИП». Сегодня мы перевели ещё одну статью, которая рассказывает, чем отличается UI-дизайн от UX-дизайна и на каких основных принципах строится дизайн интерфейсов.

UI vs. UX

Если вы хоть немного интересовались дизайном приложений, то наверняка слышали термины «UI» и «UX». Но чем же они отличаются?

В самой простой форме, UX-дизайн — это то, что делает интерфейс полезным, а UI-дизайн — делает его красивым. Дизайн интерфейсов — это смесь визуальной иерархии и элементов интерфейса. Чтобы разобраться, чем отличается прекрасный дизайн от просто хорошего, необходимо понять, что дизайн интерфейсов — это всего лишь один из слоев целого дизайн-процесса. Возможно, именно поэтому эти два термина так часто путают. В этой статье я постараюсь рассказать, в чём же заключается разница между ними с точки зрения дизайн-процесса.

Согласно книги Дж. Гарретта «Элементы опыта взаимодействия», UX-дизайн можно определить через пять основных уровней. Давайте начнём с самого абстрактного.

Я уже презентовал свой типограф на хабре. С того момента он несколько обновился: я добавил доки, дифф типографированного результата на сайте и скромненький web api.

Здравствуй, %username%. В этой статье я хотел бы рассказать про свой небольшой проект, призванный при помощи одного велосипеда и небольшой связки костылей слегка упростить жизнь embedded-разработчику, имеющего дело с графическими дисплеями или платами OSD.

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

Эксперты выяснили, что интернет становится нечитабельным из-за тенденции эволюции в сторону «тощих» шрифтов, которые ухудшают видимость слов на экране для пожилых людей или людей с ослабленным зрением.

В то время как раньше текст был рельефным и тёмным, и хорошо контрастировал с преимущественно белым фоном, теперь многие веб-сайты переходят на светло-серые или голубые шрифты.

Отмеченный наградами блоггер Кевин Маркс, основатель Microformats и бывший вице-президент веб-сервисов в BT, решил изучить проблему после того, как заметил, что стал испытывать всё больше трудностей при чтении текста на экране.

Всем привет. Минуло пару недель с момента выхода предыдущего обзора. Увы, за это время копилка Dribbble пополнялась вяло. Хотя в целом она пополнялась стабильно, но стоящего Вашего внимания материала крайне мало. Поэтому давайте вновь отмотаем таймер назад, теперь уже на две недели и посмотрим на различные концепты UX/UI артистов со всего мира. Я, как независимый обозреватель, выбрал 10 работ и расставил их в порядке возрастания качества исполнения.

В недавнем дайджесте со свежими материалами из мира фронтенда увидел подборку способов подчеркивания в CSS.

Странно, что в такой хорошей подборке не указан простой способ с использованием псевдокласса :after.

Привет, Хабр! Сегодня мы решили поделиться с сообществом текстовой версией одного из выпусков подкаста, в котором мы рассказали о работе над проектом «Дизайн государственных систем».

Всем привет. Неделя почти закончилась и за это время копилка Dribbble пополнилась кучей работ дизайнеров со всего мира. Я предлагаю вам отмотать таймер назад и посмотреть что интересненького за эту неделю нарисовали другие UX/UI артисты. В роли независимого эксперта наблюдателя предлагаю собственный обзор лучших дизайн-макетов. В конце объявлю тройку лучших на свой взгляд, но начну с номинантов общим списком. Поэтому, если вам интересно куда двигаются тренды дизайна и гайдлайны desktop-продуктов, то…

Готовлю сейчас текстуры с буквами для нашей игрушки со словами. А у таких игр есть одна особенность: не переведешь игру на какой-то язык — не видать покупок от носителей этого языка. Поэтому релиз игры будет локализован на 42 языка. Это много-много разных букв, каждая из которых обрабатывается в фотошопе и вставляется в текстуру, место в которой — на вес золота. Приходится вникать в устройство современных алфавитов, чтобы брать только те буквы, которые действительно нужны в современных словах.

Погрузившись в этот процесс, я открыл для себя, на сколько фраза «расставить точки над и» не полна. Точки расставляют далеко не только сверху.

Генеральный директор студии lab.AG Артём Геллер, работавший над новой версией президентского сайта Kremlin.ru, дал интервью изданию Smashing Magazine — в нём он рассказал о разработке ресурса, технических аспектах работы с администрацией президента, создании адаптивного интерфейса сайта, а также раскрыл некоторые детали проекта.

Типографика — это искусство сделать текст красивым, удобным для чтения, отразив в начертании букв информационный посыл или характер издания. Это искусство привнести визуальную гармонию в любой текстовый материал. Искусство выразить смысл не только через слова, но и через их отображение. Типографика вовсе не ограничивается выбором шрифтов и отступов — это более глубокая, сложная и интересная дисциплина. И освоить её вам поможет наша подборка книг.

Мы уже писали о том, что типографика и ее подбор оказывают большое влияние на качество почтовой рассылки в частности (и жизни вообще). Разумеется, при выборе основного шрифта для письма нужно ориентироваться на его читабельность (о том, какие шрифты и их характеристики наиболее популярны у известных брендов, создающих почтовые рассылки, мы рассказывали здесь).

Однако, как и в любом качественном тексте, в рассылке важно расставлять акценты – в том числе и визуальные (почему это так важно и как это сделать, читайте в этом топике). С подобной задачей может отлично справиться курсив, о котором и пойдет речь в материале ресурса Typogrpaphy.com — мы представляем вашему вниманию его адаптированный перевод.



Курсив, возможно, является самой яркой частью любого семейства шрифтов, выделяясь на фоне своих «собратьев». Ниже мы расскажем о 12 разновидностях курсивных шрифтов вместе с описанием их культурно-исторического наследия и практического применения.

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

Вы когда-нибудь задумывались о том, почему выбранный вами шрифт для электронного письма не отображался в почтовом ящике? Вероятно, это случалось, потому что ваш шрифт не был «безопасным», и устройство, на котором открывали письмо, его не поддерживало. В этой статье мы рассмотрим понятие «веб-безопасности» шрифтов, способы использования стандартных и нестандартных шрифтов, а также лучшие примеры их использования в email-рассылках.

Кириллу и Мефодию было нелегко. Они создавали русскую азбуку на основе греческого алфавита и для обозначения звуков, которых в греческом не было, им пришлось придумывать новые буквы. Некоторые из них получились странными.

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