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

Людям оказался нужен хаос, а дизайну — пространство для экспрессии, драматизма и продуктового роста.

История отечественных дизай-систем

Рост интереса к дизайн-системам на нашем рынке начался где-то с середины десятых. Точкой отсчета, наверное, можно считать выступление Антона Виноградова на PiterCSS с рассказом об архитектуре дизайн-системы Альфа-Банка в марте 2016. Хотя корни, конечно, стоит искать раньше.

В 2013 Бред Фрост презентует Atomic Design (книга будет опубликована в 2016) и впервые целостно описывает концепцию…


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

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

Основы дизайна

1. Мобильный дизайн

Самый простой путь попасть в продуктовый дизайн — через дизайн мобильных приложений. Так как это востребовано, а Эппл и Гугл уже всё за всех придумали.

Более того, благодаря тренду последних лет не делать различные версии дизайна под разные мобильные платформы, все становится еще проще — собираем дизайн под iOS, а…


Чем отличается опытный автомобилист от новичка? — Новичок заблаговременно начинает искать, где припарковаться. И чем ближе он к месту назначение, тем сильнее его тревога, что места не будет, придется кружить и искать куда втиснуться, создавая неудобства другим (самое страшное). В итоге, всякий раз, он бросает машину за несколько кварталов и долго топает пешком.

Опытный автомобилист не рефлексирует и сначала вплотную подъезжает к месту назначения, а уже от него начинает искать место для машины. Потому что знает, что в 7 из 10 случаев свободное парковочное место окажется рядом. А в остальных трех, скорее всего, тоже, где-то неподалёку.

Так и в дизайне…


Выделяем объекты → объединяем как Union → скругляем углы.


Привет, меня зовут Серёжа. Я дизайнер. И в прошлом году я много учился.

Курсы были разные: и очень полезные, и сторазужеэтослышал, но объединяло их одно — немаленькая цена. Тратить деньги и время, разочаровываться и терять надежду — неприятно. Поэтому делюсь с вами списком курсов, которые оказались самыми полезными.

Топ-3

Основы композиции (офлайн)

Дима Барбанель
campus.designworkout.ru/composition

Длится три дня. Много заданий и много практики. И сам Дима очень хороший и заряжает своей добротой. С курса возвращаешься новым человеком и с увесистой папкой выполненных заданий.


Если спросить любого дизайнера: «Что такое оптическая компенсация?» — он ответит, что это когда круг делают больше, чем квадрат, чтобы выглядело так, будто они одинакового размера.

Оптическая компенсация круга

Это базовое знание, с него начинается любой курс для начинающих.

И на практике чаще всего этот принцип применяют так, как он был описан, когда в макет нужно поместить что-то круглое вместе с чем-то некруглым: иконку добавить в начало строки или, например, аватарку выровнять относительно блока с описанием. В таких случаях круглый элемент делают чуть больше и сдвигают на пару пикселей влево и вверх, чтобы компенсировать оптическую потерю веса.

Но что если этот принцип применить…


Чтобы твоими файлами могли пользоваться и другие.

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

Прошло время. Появились новые инструменты. Любой объект на макете теперь легко выбирается мышкой. На структуру слоев перестали смотреть. Можно не заморачиваться, если не мучает чувство прекрасного. Главное — следить за глубиной вложенности.

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


Никогда не видел Артема улыбающимся. На помощь пришло FaceApp.

Текст как базовый элемент

Якорные объекты

Точка, линия, прямоугольник

Внутреннее и внешнее

Отступы

Чередование ритма

Гомогенезация

Модульность

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

Далеко ходить не надо. Открываешь Дипломные проекты Школы бюро и видишь, что все работы как будто сделаны одним человеком и очень напоминают сайт самого Бюро. …


Шесть лет назад я решил, что не хочу быть кодером, а хочу быть дизайнером. А чтобы стать кем угодно, в том числе дизайнером, для начала хорошо бы что-нибудь почитать. Я загуглил и слегка прихуел от количества рекомендуемой литературы. Мне понадобилось еще несколько месяцев, чтобы пройти все стадии принятия и начать хоть что-то читать.

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

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

Серёжа Плащинский

Ведущий дизайнер Авито | t.me/planktonchallenge

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store