— новые крутые знакомства и комьюнити увлечённых дизайном :) Присоединяйся!

/курса/

/курса/

/курса с наставником и портфолио/

Дизайн

Портфолио и резюме

Стоимость проектов

Понимание заказчика и клиентов

Понимание заказчика и клиентов

Стоимость проектов

Портфолио и резюме

Дизайн

Дизайн

Портфолио и резюме

Стоимость проектов

Понимание заказчика и клиентов

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

1. Хочу сказать, что мне очень зашло, как серебристо-голубой фон сочетается с бабочками, это смотрится очень красиво. Но бабочки заслуживают быть больше и активнее. Для контраста между ними так же делаем разницу в размерах.
2. Заголовок сейчас одинок в своем углу, хотя он может взаимодействовать с фото, в данном случае бабочки просятся сесть прямо на него, летать вокруг, подчеркивая собой его значение. Сам шрифт выбран тоже хорошо, но можно взять ещё более изящный, аналогичный по смыслу. Единственное, что в заголовке заметно выбивается это цвет. Я думаю идея была в том, чтобы взять оттенок оранжевого из бабочек (это хорошо), но он слабо смотрится на серебристом фоне. Поэтому лучше попробовать вариант темного цвета (не черный, а снова цвет из бабочки).
3. Дополнительные текстовые элементы: красота, легкость и тд. Плашки сами по себе лучше использовать реже, если можно обойтись без них, значит они не нужны. Продолжаем раскрывать второстепенные элементы через фото — и три слова хорошо лягут по краям крыльев.
4. Добавляем постеру объем с помощью блюра (добавляем бабочек на дальний план).
5. Текст на всю ширину листа так же не очень удобно читать, если он на большом постере, взгляду будет сложно каждый раз возвращаться к началу строки на другом конце постера. Поэтому пробуем разместить его в 2 колонки.

before

after

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

1. Начнем с контраста: розовый цвет в заголовках и дополнительном тексте слабо выделяется на бежево-коричневом фоне. Чтобы лучше расставить акценты — меняем фон на черный — с ним сейчас будет проще работать.
2. Фото Давида (с точкой притяжения на жвачке) по визуальному весу сопоставимо со сложным заголовком. Чтобы задать четкие «шаги» для зрителя, стоит сделать изображение крупнее, так как иллюстрация или фото — это первое, что привлекает внимание.
3. Шрифт также требует доработки: он довольно сложный для восприятия, особенно с учетом длины заголовка. Межстрочное расстояние слишком большое, а буквы расположены слишком близко друг к другу. Исправляем: выбираем более простой шрифт, корректируем интервалы и размеры для лучшей читаемости.
4. Важную информацию, сопоставимую по смыслам (галерею, вход, даты) выносим в верхнюю часть постера. Распределяем цвета так же между собой, таким образом эти две части теперь перекликаются.
5. У нас остается дополнительная информация, такая как адрес, время работы, телефон. Они сами по себе самоопределяемы, нет необходимости перегружать текст подписывая их.
6. Знаки вопроса, это хорошее решение, чтобы разнообразить макет и при этом указать на тему постера/выставки. Но чтобы они не отвлекали внимание на себя — визуально привяжем их к иллюстрации и скорректируем их вес между собой.

before

after

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

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

Но чем ниже тем идет уход немного в сторону от основного направления. Это в основном касается сложной кнопки, она кажется слишком тяжелой для фирменного стиля бренда, перегруженной эффектами неоном. Плюс так же есть вопрос к шрифту, у которого выбрано жирное начертание, в гайдбуке оно не указано и в совокупности с заголовком баннера нижняя часть макета существенно отличается по настроению. Предположим, мы так же отделяем баннер и оставляет блок с тарифами. И у нас создается вайб неонового казино). В то время как ощущение загадки, эстетики, чего-то сверх... — исчезает. У тебя так и написано при работе над макетом, неон/казино/кибер панк, но гайдлайн намного меньше про неон и намного больше про визуальные контрасты, сдержанные, но сильные акценты.

Также детали, например тени или буллиты в виде фишек, эти мелочи уводят нас немного в сторону. Фишки меняем на карточки, а тени убираем вовсе, в данном случае на пользу стилю они не идут.

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

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

before

after

Рассмотрим логические и визуальные ошибки в данном варианте дэшборда.

Логические ошибки:

1. Средний чек и воронка продаж – их стоит поменять местами и пересмотреть их визуализацию. Воронке нужно больше пространства, чтобы лучше считывались показатели. А средний чек, помимо динамики, хотелось бы видеть еще и отдельным значением на текущий момент. При этом детализированный график для него излишен, можно сильно упростить.
2. Сделки и клиенты – здесь не хватает текущих значений. Динамика – это полезно, но важно сразу видеть так же и актуальное состояние, без дополнительных действий.
3. Остаток продукции на складе – доли бытовых и промышленных товаров, скорее всего, не меняются критично относительно друг друга, так как производство и сбыт уже налажены, так что в таком виде блок малоинформативен. Плюс, чтобы увидеть точные цифры, нужно наводить курсор на каждый элемент, что неудобно. Визуализацию стоит пересмотреть.

Для дальнейшей проработки визуала:

1. Темная тема сложна в исполнении, важно сохранить читаемость и комфортное восприятие. Сейчас контраст очень сильный, плашки слишком активные. Стоит сделать их чуть менее заметными, чтобы фон выглядел визуально более глубоким и отойти от базового вида к чему то более интересному.
2. Хочется усилить общую стилистику в направлении от такого «классического» визуала, до чего то более современного. Я имею в виду типовые формы с контуром в фильтрах и периодах, немного старомодные что ли. Упростить визуализацию графиков, линии на фоне не всегда помогают, в дэшах они скорее мешают, тк вся информация так или иначе привязана автоматически к точке и сравнение по линейке пользователю не нужно, это становится лишним шумом. Тоже самое касается и осей. То сеть графики я бы пробовала сильнее облегчить.

before

after

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

Логические моменты:

1. Профили клиентов – если цвет передает число заказов (от красного к желтому), а % показывает долю клиентов, то крупный по % профиль может делать небольшие заказы и отмечаться желтым. Верно? Интересная логика, но ее нужно обсудить с аналитиками, чтобы учесть их взгляд.
2. Количество сделок и клиентов – визуально понятно, но важно разобраться, как это реализуется системно.

Визуальные моменты:

1. Логотип компании – должен быть, так как это рабочая среда клиента, выполненная в фирменном стиле.
2. Расстояния между элементами – сейчас, например, в блоках "Выручка" и "Остаток на складе" логика единая, но расстояния выглядят недоработанными. Важно, чтобы внешние отступы были больше внутренних, иначе взгляд скачет между значениями ТО.
3. Акценты и уникальность. Отдельно хотелось бы внести в дэш чуть больше решений, которые придадут ему визуальной уникальности. Не перегружая макет деталями, тем не менее каждый дэшборд можно доводить до фирменной стилистики клиента не только с помощью цвета, поэтому предлагаю поискать решения, которые могли бы дать такие возможности. Но и цветовое решение применимо.
4. В данном случае у нас есть так же проблема, как у другой студентки, с тем что некоторые части выглядят более активными, чем другие и не всегда это подкреплено логической необходимостью. Например воронка и средний чек определенно сильно влияют на внимание, которое получает виджет ТО. Рекомендую поискать решения для таких моментов, и опять же, фирменные цвета не обязательно использовать активно, есть оттенки серого, есть возможность использовать цвет не в графике или диаграмме, тут нужно выстраивать логику чтения и по ней дотягивать блоки визуально.

before

after