0: Так, всем привет, ребят, рада вас видеть. Давайте классическую перекличку. Видно ли, слышно, все ли хорошо. И я вас ещё раз поприветствую. Напоминаю, что мы находимся на канале тильды, которая проводит потрясающие вебинары.

1: Практически каждую неделю. И это на самом деле очень классно, поэтому вы можете посмотреть какие-то разные другие темы, интересные вам и проходить на каждый вебинар, который проводится и на YouTube и вконтакте, что тоже очень важно. Давайте

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

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

4: Любого дизайнера.

5: Так, привет, Дарья. Все видно, все слышно. Супер класс. Вроде бы все хорошо. Так, ну давайте тогда плавно перейдём к тому, что мы будем сегодня делать. Я подготовила для нас такую

6: Тему, которая может быть вариативна в разных видах стилей. Это будет бренд от selena gomes. Может быть кто-то знаком. Поставьте плюсики, все ли нравится, все ли круто, вот, и мы с вами попробуем задизайнить.

7: Один и тот же текст, один и тот же фото, контент, все те же продукты, но в разных стилях этот эфир позволит вам вообще в целом понимать и представлять о том, что мы можем с вами абсолютно по разному, диза.

8: Один и тот же продукт, в зависимости от того, какое настроение мы хотим передать, какая стилистика, какой посыл у этого бренда. Это тоже все очень важно. Вообще стили на самом деле подбираются индивидуально под запрос каждого проекта. Например, если

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

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

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

12: Общаться с клиентом по прилагательным. Вот, и описывать так свой сайт. Давайте вообще обсудим, какие мы будем сегодня с вами стили изучать. Самый 1 это будет бента стиль это самый популярный стиль, мне кажется, вообще у дизайне.

13: Потому что он вариативный, он гибкий, его можно использовать абсолютно по разному, если что все эти сайты я взяла с подборки сайтов на тильде и даже если мы сейчас зайдём в mod, мы увидим, что практически каждый 2 сайт сделан в этом стиле что

14: Такое бенто, стиль бента. Стиль вообще пришёл нам из Японии, да, такое, типа выражение, они так ели в контейнерах, у них была еда, и в каждый контейнер было условно, там по какой-то закуске, по блюду.

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

16: Меньше хаотичных линий, да, стиль может использовать себе разные приёмы. Например, заимствуя какой-то приём из другого стиля. Об этом мы тоже с вами поговорим. Но если мы говорим о том, как стиль первоначально родился и вообще

17: Какой у него формат то? Это только плашки, это только геометрия. Все должно быть структурно, все должно быть на своём месте и не более. Например, давайте на основе этого мы с вами начнём делать дизайн первых 2 блоков и

18: Обсуждать детально, что такое бента стиль, как мы можем работать с ним в коммерции и вообще, какие варианты у нас есть. А пока вы можете, например, ответить мне в комментариях, какой стиль ваш любимый может быть вы часто

19: Используйте, не знаю, тот же бента стиль вообще, как вам он. И я потихоньку буду делать наш дизайн. Для этого мне необходимо создать фрейм 1200 пикселей. Я

20: Обычно использую высоту экрана 670, но стараюсь важный контент располагать на 645 высоты экрана для того, чтобы в автоскейлер, если, например, я буду его подключать в тильде, у меня не обрезался нижний слой.

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

22: Пообсуждать, в чем их отличие. Поэтому мы с вами супер кратко пройдёмся по этим пунктам. Вас попрошу задавать вопросы. Если они будут в конце эфира, мы обязательно на все ответим. Вот, поэтому не стесняйтесь. Просыпаемся. Пи.

23: Чатик, и общаемся так, что мне нужно для бента стиля. Вообще. В целом, для любого стиля. 1, что мы делаем, это включаем сетку. Сетку я всегда беру колонками. По базе. Можно взять 12 колонок. Это

24: Классическое значение для колонок. И мы потом можем уже из 12 вырабатывать определённое количество, которое мы хотим заимствовать. То есть понятно, что мы не будем работать со всей сеткой, мы возьмём только определённые колонки микс колонок.

25: И выставим какие-то направляющие. Вот на основе чего у нас с вами и выявятся наши отдельные, скажем так, колонки, по которым мы будем работать. Так, значит, отступ между колонками я сделаю по бокам 20

26: Пикселей между колонками тоже 20 пикселей и оставлю значение 12. Это то, что я использую по базе всегда в каждом проекте. Теперь давайте перейдём к пониманию бента стиля. Да, если мы с вами сейчас пройдёмся и посмотрим, как выглядят эти

27: Сайты пооткрываем. Мы видим, что у нас все структурно. То, что я говорила ранее, мы увидим, что в целом у нас всегда есть место для контента, и это очень важно. Поэтому что мы будем делать на 1 экране, коне.

28: Конечно же, постараемся укомплектовать весь вот этот вот контент, который у нас здесь есть, что мы имеем по структуре, мы имеем заголовок, описание, кнопка, ну и меню без меню, конечно же, мы никуда, я пока базово просто нарису.

29: Шейпы, то есть примерно чтобы понимать, что бы я хотела использовать классический бента стиль, чаще всего дизайнеры используют, например, 2 шейпа, в них в какой-то части располагают фотографию, а в другой

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

31: У нас есть, скажем так, хиты, которые точно хочется использовать. Также я подобрала себе цвета плюс минус, которые мне близки, с которыми я бы хотела поработать. Посмотрим, как мы можем их интегрировать. Может быть, мы их

32: Немножко заменим, а может быть, будем использовать все оттенки, которые здесь присутствуют. Так вот, возвращаемся. Значит, у нас есть хит, который я бы хотела разместить 100% на главную страницу. Для этого, наверное, 1, что я сделаю.

33: Это вырежу фон для того, чтобы не вырезать это сейчас все вручную. Мы с вами зайдём в плагин. Я открою плагин фотоопе. Это карманный фотошоп в фигме и выберу ластик, который мне автоматически прикли.

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

35: Фотографию. Я думаю, вот над этими 2 фотками. Мне кажется, что прикольно было бы использовать селену. Но единственный момент, что у нас здесь уже используется непосредственно их хит и дублирование, наверное, не очень.

36: Логично. Так, давайте пробежимся по квадратикам, включим сетку и что я вижу? Я вижу, что я могу разместить, например, вот такую вот композицию.

37: То есть у меня есть 3 квадратика в каком-то из будет текст в каком-то фото. И судя по маленькому размеру, предлагаю сюда добавить сразу же этот хит для того, чтобы напомнить пользователю, что это за бренд, да, его лицо, скажем так.

38: И давайте попробуем разместить вот эту девушку.

39: Зайдём сюда, Фил, и тем самым также покажем, что у нас ещё есть вариативность продуктов, да, что у нас не только бальзам, точнее румяна, вот, и

40: Получается, что у нас остаётся место для текста. Давайте возьмём заголовок и описание. Конечно же, мы все это дело разделяем и располагаем уже.

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

42: Физически, да, как бы, когда мы смотрим на экран, ощущение, как будто бы есть вот эта вот форма, которая вырисовывается за счёт 2 рядом стоящих форм. То есть в целом у нас в бенто стиле всегда чётко используется сетка. Это важно вообще, как я говорил,

43: Ранее в каждом стиле сетка важна, но здесь она важна наибольшим образом. Давайте немножко, наверное, сделаем мягче форму. Все-таки этот бренд такой более плавный. Хочется его сделать.

44: Таким же воздушным. Думаю, что мне хочется прям очень сильно скруглить, поэтому я возьму 40 и размещу контент. Значит, как бы я хотела его разместить. Так.

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

46: Давайте попробуем тоже классический вариант вёрстки. Это непосредственно у нас, допустим, по центру. То есть часто так делают дизайнеры, берут какой-то шейп и по центру располагают контент. Это удобно, потому что это занимает пропорционально место.

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

48: А кнопочка, поэтому мы с вами сейчас её сюда и добавим, сделаем сначала давайте полностью уберём вот эту вот обводку и добавим автолад, который позволит нам добавить

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

50: С равными отступами размещу внутри моей 1 плашки. Если у меня снизу 10 пикселей, то, значит, и слева, и справа у меня тоже будет 10 пикселей таким образом.

51: Образом у нас вырисовывается аккуратная Ровная композиция. Давайте попробуем сделать больше акцента на тексте. Может быть, сделаем его прям крупнее?

52: Допустим, сделаем здесь 30 и давайте тут тоже 30 попробуем. Здесь, соответственно, хочется сделать меньше кегали как будто бы.

53: Так и я думаю, что можно попробовать покрасить то, что у нас получилось.

54: В наши, соответственно, цвета. Давайте чуть чуть, наверное, сделаем цвет фона менее таким контрастным и на

55: Фиолетовым хочется убрать вот этот чёрный цвет, он очень сильно давит и сделаем его светлым. Ну допустим, рассмотрим такой вариант.

56: Нашего дизайна. Так, так, из контакта, значит, юзаю минимализм швейцарский и бента. По крайней мере, мне так хочется.

57: Думать. Вообще, кстати, сейчас очень такой забавный будет момент. Почти все стили, которые мы видим, это не чистые стили, то есть даже бента, стиль, который я показывала первоначально. И потом я покажу вам ещё другой стиль, мы будем работать в минимализме. Это все на самом деле, смеша.

58: Варианты, то есть где-то при преобладает та же швейцарская вёрстка, да, чересчур там гигантизм в тексте, где-то в venta мы можем добавить и минимализм. То есть это супер вариативные штуки, которые мы можем адаптировать с учётом нашего запроса.

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

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

61: Какой дизайн вы можете предложить? Поэтому, когда говорят, что хороший дизайнер это тот, который работает в 1 стиле. Может быть, это так и есть. Но чтобы прийти к своему стилю, нужно обязательно пробовать множество.

62: Разных, пока вы не попробуете разные стили, вы не поймёте, какой стиль ваш. Вот это, к сожалению, правда. И это на самом деле интересно. Мне кажется, что дизайн в этом плане и прикольный, потому что

63: Можно помимо того, что, например, работать только в минимализме, можно, например, использовать разные стили в какой-то своей личной работе и экспериментировать, а может быть даже позже привлечь на этот стиль клиентов вот у меня так было с creative.

64: Стилем. Я его делала далеко не для коммерции, просто для души. И так совпало. Пожалуйста, что это оказалось очень интересным для клиентов. Поэтому так, давайте ещё

65: Здесь сделаем направляющую, потому что текст тут у нас немножко

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

67: Давайте сделаем по бокам и сверху 20 пикселей и у нас уже, пожалуйста, вырисовывается какой-то экранчик прикольный. Вот так вопросов пока.

68: Нет.

69: Так как же цвета решают? Да, это, кстати, правда. И вот у меня есть палитра, и, возможно, кто-то спросит, а как вообще в целом искать те или иные цвета? Как понимать, какой оттенок подойдёт? Я, например, если

70: И понимаю, что я хочу какие-то супер интересные решения. Я просто захожу в pinterest и вбиваю калор Палей. Как там по-английски? Вот, в общем, палетка цветов.

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

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

73: Понимать, что какой цвет будет преобладать активнее, какой цвет будет добавочный. И тем самым вы сможете точечно аккуратно внедрять те или иные приёмы, которые вам близки по цвету. Давайте попробуем сейчас уйти от

74: Привычного понимания пента, стиля. То есть, например, что я должна сделать в классическом, наверное, таком варианте, да, это растянуть по логике.

75: Вот такой вот шейп, который будет отвечать как за подложку нашего будущего контента 2 блока теоретически я могу так сделать. Хочу ли я делать этот shape? Не знаю я бы, возможно.

76: И без него сделала, потому что опять-таки, повторюсь, в penta стиле мы можем с вами использовать разные приёмы, необязательно делать все в плашках, даже если вы посмотрите, проанализируете сайты, которые есть в майден тильде, вы

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

78: Ваш сайт вот этими плашками. Если вы видите, что у вас много текста, что у вас много графики, поверьте, этот сайт будет невозможно читать, потому что за счёт вот этих вот плашек у нас мало.

79: Друг между контентом, да, друг между другом. Соответственно, за счёт чего у нас такой визуальный шум? Мы не можем понять, на что обратить внимание. Поэтому если у вас много какой-то декоративки, много каких-то иллюстраций, моделей в формате 3 д, старайтесь

80: Рисовать, например, 1 экран я делаю динамичным, он должен привлечь пользователя. Здесь используются яркие оттенки, они привлекают внимание, в то время как последующий экран я буду стараться делать минималистично, используя направляющую, которая у меня уже

81: Вырисовывается. То есть, например, вот у меня раз колонка, 2 колонка и, соответственно, 3. То есть, по сути, я поделила мои 12 колонок на 3.

82: 1, 2, 3, 4. Колонки, 2. И, соответственно, остаток 6. Вот. Поэтому вы тоже можете использовать вот такую вот активную часть вашей сетки под ваш запрос. Так, давайте.

83: Допустим, мы сделаем вот таким образом соберём, будем использовать такой немножко гигантизм в тексте. Хочется использовать какие-то контрасты, возьмём какую-нибудь фотку, я думаю, что здесь будет хорошо смотреться. Вот

84: Это девушка, потому что selena тоже у них одинаковый тип. То есть они обе что-то держат, обе как-то привлекают внимание к продукту, здесь хочется просто на остановиться на лице. Вот и давай.

85: Покажем здесь непосредственно ещё продукты. И у нас тут есть аж 2 абзаца текста, что немало. То есть вот так вот разместить ну, можно, но будет ли это выглядеть?

86: Легко и свободно. Нет. Будет ли тут место для большого варианта использования? Там продуктов нет. Поэтому что мы должны сделать по хорошему, мы можем с вами разбить.

87: Нашу сетку на ещё под колонки. То есть вот у нас есть наши, получается 6 колонок, и мы их сейчас разбьет. Так, 20, 20. Очень важно в таком

88: Или использовать отступы. Это очень важно. Если вы будете делать все просто интуитивно, не используя систему ваш бенто стиль будет выглядеть грязно и неуместно, поэтому отступы внутри

89: Плашки отступы снаружи, плашки должны быть пропорциональны. Вот так. Ну давайте, допустим, мы сделаем вот так вот. То есть теоретически мы можем сюда подогнать какой-то контент.

90: Можем даже её сделать подлинше. Вот мы можем подогнать сюда какой-то контент и при этом

91: И при этом, и при этом.

92: Разместить побольше текста давайте.

93: Я сделаю вот так вот.

94: Водный знак у нас, чтобы его не было видно. Так

95: И давайте растянем вот эти плашки. Как видите, в целом нам вот эта вот история с тем, что мы делаем подложку под наш контент, не очень как бы уместно можем в целом от неё отказаться. А последующий, например, уже 3 блок, я бы сде,

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

97: Уменьшим текст и возьмём здесь маленький формат текста. Ну, допустим, 18. Возьмём этот контейнер текстовый и разместим сюда и разместим вот таким образом.

98: Допустим, так, может быть, мы его чуть чуть растянем, у нас буква и не обрезалась. И здесь тоже обязательно добавляем скругление.

99: Проверяем отступы и между блоками тоже давайте сделаем 100. И что мы можем разместить здесь. Мы можем с вами как сыграть? Мы можем с вами разместить, например,

100: По бокам продукты, а вот эти 2 карточки убрать, либо наоборот вот так.

101: И, например, сюда разместить текст. Вот как раз-таки покрупнее в этом стиле.

102: Так, если что, пишите комментарии, не забываем о том, что мы с вами здесь пришли делиться опытом, общаться.

103: Так, не тот текст скопировала, вот он и таким образом мы с вами сделали акцент контраст, да, то есть у нас с вами есть и заголовок, и описание, и подзаголовок, который тоже привлекает к себе внимание.

104: При этом композиция не тяжёлая, она Лёгкая, она воздушная, при этом используется бенто стиль и давайте попробуем доработать, да, что мы можем сюда добавить? У нас есть с вами румяна, давайте их возьмём тоже.

105: Вырежем как вариант, пока почитаю ваши вопросики или просто ваши рассуждения. Так Игорь поставил лайк каналу. Обязательно ставьте лайк каналу тильды. Это супер. Так.

106: Так, так, так, так, Андрей, приветики. Может есть смысл подсобрать межбукв заголовках чуть поджать?

107: А ещё у блоков согласовать скругление, у кнопок хороший комментарий. Сейчас подождите, мы сейчас придём ко всему, что нам нужно. Так сохраняем мы.

108: 2 продукта, 2 продукта. Давайте их подуменьшить. Так, Андрей нам предлагает сделать меньше межбуквенное расстояние. Ну, давайте послушаем Андрея, но без фанатизма где?

109: Где-нибудь - 0 5. Я бы поставила - 5, но не более. Здесь тоже, да, можно чуть поджать здесь скругление.

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

111: Ещё сильнее, что в целом как будто не очень хочется, потому что сверху тогда поджимает контент, либо делать квадратную кнопку, что в целом можно. Но, ну, давайте ставим квадратную кнопку, но мн.

112: В целом и так тоже было. Ок, так хорошо. Значит, идём дальше. Медиум давайте здесь, может поставим регуляр обычный и здесь расположим наши вот эти вот хит.

113: И давайте их сделаем, наверное, как-то подинамичнее. Может быть мы с вами расположим их даже как-то так. Давайте представим, что здесь 2 разных цвета, чтобы я лишний раз не вырезала композиционно.

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

115: Собственно, а здесь давайте мы просто будем использовать вот этот вот Светлый оттенок, чтобы было комфортненько. И вот тут я предлагаю добавить кнопку каталог.

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

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

118: Посвежее, скажем так так.

119: Как вам результат? Давайте делиться мнением и переходить уже к следующему стилю. Есть ли у вас вопросы по бенто стилю?

120: Какие-нибудь, может быть, моменты, которые хочется

121: Спросить может какие-то затыки?

122: Так.

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

124: Эфира, прийти домой или если вы уже дома сделать тоже дизайн 1 продукта в 3 разных стилях. Вот. И, соответственно, на основе этого будет вам

125: Такая практика.

126: Так, у нас не будет слишком флетовый дизайн. А может быть я хотела, чтобы он был флетовый. Понимаете, это же все дело вкуса. Здесь наша задача именно, знаете, вот ощутить, вот понять, насколько может быть вариативный бента стиль, насколько он может быть.

127: Разный. Вот мы здесь не гарантируем на самый лучший дизайн. Все-таки не забывайте, что это все создаётся за буквально 20, 30 минут нашего времени. Итак, переходим к следующему стилю. Как вы думаете, что это за стиль?

128: Сейчас вам покажу сайт. Ну, хотя я вам уже говорила в самом начале, что это минимализм. В общем, проговорилась. Минимализм, значит, тоже классика, тоже редко где можно встретить чистый минимализм, очень много вариантов, которые используются в smash.

129: С швейцарской вёрстки, да, то есть очень много, ну, отсутствия вот этого понимания, как вообще, какие принципы у минимализма основное, на что мы должны делать акцент, это на воздухе, это работа с пространством, это сетка, это

130: Чаще всего отсутствие какого-то яркого контраста, например, в типографике если швейцарская вёрстка строится у нас вот сугубо по сетке и мы можем буквально взять реально линейку, провести по экрану, и у нас все должно совпадать.

131: Швейцарской вёрстке у нас чаще всего крупная типографика, болтовые шрифты, много динамики, то в минимализме мы немножечко вот плаваем, мы расслабляемся. При этом минимализм очень богат на вариативность вёрстки текста, например.

132: Даже в этом сайте вы можете увидеть, что здесь практически ничего нет, но насколько он выглядит доработано, насколько он выглядит круто, потому что здесь классная иерархия, классная сетка, она динамичная, она добавляет вот как раз-таки вот вот этого ощущения

133: Доработанности дизайна. Вот поэтому мы с вами сейчас попробуем сделать, ну, в таком лайтовом варианте минимализм, да, что мы можем предложить значит, что мы можем сделать? Давайте сначала

134: Сделаем более таким холодным цветом бэкграунд и вытащим наши

135: Text добавим им цвет.

136: Так.

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

138: Уйти в минимализм. Знаете, такого типа варианта, где у нас буквально все очень маленькое, но при этом по бокам у нас будет много воздуха и мы будем акцентировать внимание вот на эти вот акценты за счёт вот этой контрастной типографии.

139: На белом фоне будет внимание на фокус, да, то есть мы будем смотреть на этот контент, вот. И будем его, собственно, по блокам потреблять. Либо мы можем, наоборот, уйти в вариант какой-то крупной

140: Графики на 1 экране возможно даже сделать его каким-то более тонким начертанием.

141: Так, допустим, да, там добавить где-то текст кнопочка, она соответственно, будет мягче и легче. Можно сделать её точно также в скруглениях но давайте попробуем сделать другой приём.

142: И сделаем ей тоже какой-нибудь небольшой формат.

143: И, допустим, мы могли бы с вами разместить это таким образом, допустим,

144: Как-нибудь куда-нибудь добавить текст. Я вот думаю что его даже можно сюда. И здесь например, будет фотография. Но давайте попробуем тоже сделать что-то что то прикольное. Попробуем раскидать сначала объект.

145: Ты по сетке?

146: Так, ну допустим, попробуем. И вот смотрите, как только я сделала вот эти вот 2 квадрата, сейчас мы их выделим, чтобы вам было видно, как только я

147: Сделала вот эти 2 шейпа у нас уже как будто бы вырисовывается и просится разместить какой-то контент вот в этот угол, за счёт чего мы с вами можем уже использовать какие-то приёмы на сайте и интегрировать их.

148: Уже в дизайн. Давайте тут тоже сделаем 20 пикселей отступ. Так.

149: Угу. Читаю комменты.

150: Так.

151: Угу. И давайте попробуем разместить вот этот вот контент. Таким образом возьмём наш, нашу часть меню.

152: И расположим его вот так вот, чтобы поддержать угол здесь и угол здесь, соответственно, у нас вырисовывается вот здесь пространство, и мы в целом можем сюда интегрировать наш

153: Content. Так давайте возьмём пожирнее и вот можем сделать, например, вот в эти 3 колонки его собственно, разместить а можем увеличить эту фотографию.

154: Что в целом нам позволяет пространство и сделать вот таким образом и разместить контент, грубо говоря, вот в эти 4 колонки.

155: Так, посмотреть коллекцию давайте разместим здесь, как говорила ранее, это хорошо, здесь сочетается и красота твоей, твоей естественности. Может, типа как-то так.

156: Это дело выглядеть, допустим.

157: Можем попробовать так выровнять и посмотреть. Давайте загрузим фотки, попробуем какие-то варианты разные. Давайте попробуем селену подкрутить.

158: У нас тут все сплющено. Давайте сделаем её крупнее. Хочется прям какой-то макрокадр использовать.

159: И можно в целом добавить.

160: Сюда вот таким образом.

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

162: Давайте, давайте почитаю комменты вконтакте. Так напомни, как называется плагин фотошопа.

163: Плагин называется фотоопе. Можете скринить и записать, пока я отвечаю на вопросы, а не длинная ли обложка? А что подразумевается под длинной обложкой? Вот это вот нет, в целом, это будет скроллиться, то ест.

164: Условно 1 экран у нас попадает и потом мы вот таким образом проскролила сайт, если вопрос про этот дизайн и в целом вот эта часть попадает на всю ширину и высоту экрана выглядит вкусно, обязательно, вертикально, горизонтально.

165: Можно плашками между плашками должны быть равны. Ну, нет, не обязательно условно. Если, допустим, ну вот как бы объяснить то, какой пример бы показать. Ну, даже если, например, вот такой брать.

166: Вариант здесь неравное, ну как неравное, то есть просто тут ничего нет, здесь буквально дыра, но, например, могла бы быть такая история, да, допустим, вот так, пожалуйста. То есть здесь расстояние явно больше. То есть здесь поместится ещё 1 такой шей.

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

168: Не знаю, вот так в бенто стиле это выглядит странно. Во первых, здесь, да, отступы у нас разные. Давайте вот так сделаем. Здесь отступ у нас 37. Здесь почему-то 20, здесь тоже, да, там 14, если включим сетку, вообще не

169: Сетки, то есть в целом все может быть, но важно, чтобы это было структурно. И вы потом этот приём повторяли по направляющим, располагая какой-то контент, либо ещё что-то. Вот, собственно, минимализм. Да, вернёмся. Мне в целом нравится

170: То, что сейчас вырисовывается скромно, не имеет какого-то, я не знаю, пёстрого характера, нам это и не надо. Хочется сделать максимально контрастный вариант нашего сайта, чтобы он полностью

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

172: Здесь текст и что мы можем сделать? Можем сделать? Давайте тоже попробуем поработать с шейпами, включим сетку и вставим сюда.

173: Какие-нибудь картинки.

174: Так, у нас 3 помады. Да, давайте здесь разместим только 3 помады. Не будем размещать румяна. Возьмём эти 3.

175: Так, поделим. Сейчас возьмём сначала 3 равные и давайте растянем их.

176: Здесь у нас сетка не получится именно 12 колоночная. То есть тут можно было бы добавить, например, 6 колонок там, я не знаю, добавить какие-то колоночки, но наша задача просто чтобы у нас

177: Было 3 в ряду карточки, и это не будет резать глаза.

178: Если мы ещё и повторим вот этот ритм, сделаем вот так вот. Ну, сейчас подумаем, как мы это сделаем.

179: Хотя, конечно, хотелось бы, чтобы они были вот такие, давайте просто они будут маленькие и мы будем использовать сетку. Так точно мы подчеркнём вот этот вот вариант верхней части.

180: Так создано, чтобы ты чувствовала себя собой так?

181: Вы там че то общаетесь? Давайте попробуем сделать его тоже покрупнее.

182: Так, и расположить контент. Так, вот так будет перегруз. Согласны со мной? То есть так у нас здесь очень много места будет.

183: Лежать что хочется, хочется, наверное, как-нибудь вот так отыграть композиционно, но, может быть, даже попробовать.

184: Менять местами акценты.

185: Как вариант, можно вообще попробовать сделать только 2 колонки, да, допустим, только вот таким образом, но так как будто скучновато. То есть здесь тогда нужен какой-то ритм, что-то такое более интересное. Можем попробовать, например,

186: Поднять текст вообще как-нибудь вот так, например. То есть привязать этот текст к этому блоку. А здесь пусть будет какой-то воздух тоже как вариант можем растянуть было бы

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

188: Повторить приём, так сказать, направляющей. То есть, видите, все в рамках 1 направляющей, так как мы дизайним только 2 экрана. Соответственно, последующие ритмы, например, вот этот момент он мог бы повториться и на 3, на четверто.

189: Блоке тоже не проблема, а этот контент, например, может быть здесь.

190: Так у нас там.

191: Текст создан, то чувствовал собой вот так. Ну, допустим, можно попробовать такой вариант как вариант, либо даже сюда. Вот я бы даже

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

193: И сделать. Сделаем его вот так.

194: Обязательно добавим 1 цвет всему нашему сайту, так, как будто хочется использовать более холодный оттенок.

195: Давайте вот так вот сделаем. А сюда мы добавим, ну, можем добавить девушку вот эту, да? А? Или мы можем взять что-то отсюда?

196: Делала заготовочки, тоже сюда подойдёт. И давайте возьмём блеск, поставим его ровненько и продублируем.

197: Собственно, минимализм полностью отвечает по логике его значения чем меньше вы делаете телодвижений, чем меньше вы делаете акцентов, тем

198: Больше это будет похоже на этот стиль, на воздух. Циркуляция должна быть обязательно. Никаких нагромождений, больше воздуха, даже если вы сделаете условно экран, где будет буквально

199: Вот так вот, вот.

200: Все центруете?

201: Это тоже можно посчитать как минимализм. То есть здесь потом будет добивка снизу по бокам. Возможно какая-то просто часть линейности, чтобы экран выглядел не так плоско, но открываю секрет, который вы прекрасно знаете, если

202: Использовать более глубокие оттенки. Например, если я сделаю более такой глубокий серый, этот экран уже не будет выглядеть плоским, он уже будет выглядеть более таким самодостаточным просто за счёт оттенков и точно также это работает и с заголов.

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

204: Нашего сайта и его качество. Вот, поэтому минимализм может быть разный, он может быть как чуть чуть дополненный. Тем более что мы, конечно же, не забываем, что мы работаем в коммерции, да, и в коммерции у нас есть много правил, у нас есть много текста.

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

206: Вот. И, соответственно, здесь мы можем ещё с вами сделать такие стрелочки, можем использовать как символ, например, стрелочки. Ну давайте попробуем, ну, че-нибудь такое, переведём его.

207: Вектор отзеркалим.

208: И расположим сюда, а можем его нарисовать самостоятельно эту стрелочку взять квадрат, взять его грани и расположить либо так с длинным хвостиком стрелка, либо

209: Сделать её покороче. Мне больше нравится вариант вот такой. Я ещё думаю сделать ему только обводку.

210: Как вариант, и даже теоретически можно подумать о том, чтобы

211: Как-то, может быть его даже закастомить, сделать его каким-то необычным, как как 1 из идей. Ну давайте возьмём однёрочку и возьмём цвет, нужный нам.

212: Так пишите свои вопросы.

213: Все ли понятно, все ли хорошо делитесь своими фаворитами по стилям.

214: Какой плагин это который иконочки это я не знаю, если честно, есть ли такая история у windows на mac ios есть символы, если вы зажимаете ctrl команд и пробел.

215: Выходит вот такая вот плашечка с эмодзи и символами контрол команд пробел.

216: Давайте я напишу контрол, че там, как там пишется. В общем, вы меня поняли, команд и пробел вот эти.

217: Сочетание этих клавиш, соответственно, даёт вызов этого окошка. Ну и теоретически мы можем сказать, что мы с минимализмом тоже закончили.

218: Таким вот образом и обратите внимание, как по разному выглядят эти сайты. Можно немножко подредактировать, например, оттенки сделать понасыщеннее фиолетовый.

219: Здесь я бы по центру расположила менюшку.

220: И как будто бы вот он чересчур персиковый. Может, конечно, мне так уже кажется, но я бы, наверное, его

221: Чуть чуть сделала бы грязнее.

222: Че-нибудь вот такое, но тоже хотелось бы сделать более его мягким. Так, а здесь, здесь, здесь нам важно, чтобы они не перекликались по оттенку.

223: Ну, допустим, вот так вот.

224: Так, минимализм не равно монохром. Нет, не всегда минимализм может быть абсолютно разным в зависимости от того, какой эффект вы хотите.

225: Получить. Так че то у меня поломалось.

226: Так непорядок.

227: Monochrome прекрасно вписывается в минимализм, прекрасно работает в этом стиле например, даже сейчас мы с вами можем убрать, например, там, не знаю, какой-нибудь чёрный использовать, пожалуйста, даже, наверное, какой-то.

228: Розовый нам бы подошёл, тоже выглядит хорошо, но если бы, например, вы использовали здесь 1 цвет у заголовков, а у описания другой и при этом подкрепляли бы это ещё какими-то стилевыми решениями. Например, кнопка либо какой

229: Предмет там декоративный, то это вполне тоже хорошо выглядит. Здесь просто важно понимать, что все супер гибко, в зависимости от того, как вы будете использовать основные правила минимализма. Если у вас вообще ничего не будет и он будет цветной, это

230: Тоже минимализм. Почему бы и нет? Даже если вы зайдёте на какие-то зарубежные, например, платформы, посмотрите, как делают дизайны. Обратите внимание, что используют часто минимализм, то есть это буквально там 3, 4 слова, но при этом куча каких

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

232: Так.

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

234: Но перед этим давайте подытожим очень важный момент знание разных стилей позволяет нам искать тот самый стиль, который нам комфортен. Например, попробуйте вы поработать в бента стиле и попробуйте поработать в минимализме с уче.

235: Этой базы и понимания, как выстраивается структура, как выстраивается композиция и как должен выглядеть текст и вообще другие элементы на этом сайте, вы, уже перейдя в более какой-то креативный сайт, будете чувствовать себя комфортнее.

236: И с пониманием того, как управлять этим дизайном. Часто такое бывает, когда мы переходим к какому-то креативному дизайну. И это не всегда коллаж, это не всегда что-то такое супер декоративное, это может быть какой-то антидизайн, где мы используем много графики.

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

238: Да, то есть это такой цикличный вариант изучения дизайна. Мой совет открыть стили в графическом дизайне, потому что все мы знаем, что веб дизайн это новое направление, и все, что было в графике, в графическом дизайне, все перешло на

239: Частично. И посмотрите, какие стили были в графическом дизайне. Ардеко, гранж, модерн, что угодно. Посмотрите, изучите, выявите какие-то интересные, не знаю значения, да, то, что цепануло ваш глаз.

240: И попробуйте с учётом этих знаний сделать экран. Давайте мы попробуем сейчас с вами сделать какой-нибудь, ну прям гранжевый вариант без правил каких-либо. Здесь просто на моё усмотрение хочется Немно.

241: Побунтовать, сделать его каким-нибудь, не знаю, сочным, ярким, контрастным. Давайте попробуем по базе, да, набрасываем, да, то есть хочется начать с типографики, наверное, все варианты у нас были.

242: Или достаточно минималистичны в варианте типографики заголовки. Они у нас все достаточно маленькие. Здесь хочется как будто какой-то броский формат. Прям вот хочется разгуляться здесь же я

243: Я не постесняюсь и сужу намного сильнее буквы.

244: Хочется прям, прям без правил пойти. Далее у нас с вами тут идут пункты меню, мы их не будем чересчур делать. Как-то непонятно пусть они по классике у нас располагаются.

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

246: Что диктует нам коллекция Вселенной, не то что у нас в целом по цвету их фотосессии попробуем уйти в какое-то

247: Не знаю, в другой вайб у неё есть ещё коллекция Духов и здесь чуть чуть другая. Другой вариант стилей фотосессии. Давайте зайдём в фотоопе здесь мы с вами сейчас

248: Будем экспериментировать, я захожу в фильтр галерея фильтров, и здесь мы с вами можем посмотреть разные фильтры под нашу картинку.

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

250: Чем разные варианты? Смотрите, очень прикольно. Почему-то в красный цвет окрасилась. Видимо у меня там был красный оттенок, но в целом

251: Очень даже прикольно и очень важно экспериментировать. Очень важно заходить и смотреть разные варианты, даже те, которые вам не близки. Вот все вот эти вот какие-то креативные постеры, креативные сайты, они рождаются с учётом мето.

252: Да, проб и ошибок. То есть вы случайно открываете какой-то прикольный фильтр, который был вам неизвестен. Давайте попробуем вот с этой картинкой поработать. Мне кажется, что это прикольно, потому что главное, что сам флакончик остаётся, но при этом по очертанию понятно, что мы

253: Делаем. Не знаю, насколько вам искажает.

254: В зуме, ой, в зуме, в общем, в эфирчик. Но давайте попробуем сохранить так комментики очень круто получилось, эффектно, чётко.

255: Я рада так, файл сохраняем и давайте попробуем как-то это интегрировать. Уберём скругления, они нам пока не нужны. Поработаем немножко, че-нибудь такое.

256: Забабахаем. Можно сделать так, можно покрасить полностью в красный какой-то цвет, чтобы это было вот прям неестественно. Можем зайти в эффекты наложения и попробовать.

257: Что-нибудь здесь как-то вот кстати в чёрный тоже выглядит прикольно и я бы попробовала сделать, ну наверное как-то так подувеличить этот флакончик, чтобы он точно был

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

259: Я помню, но хочется, знаете, наверное, как-то вот даже не так, а вот зайти в эффект дроп и вот здесь вот, наверное, скорее сделать вот такой.

260: Формат и ну естественно сделать цвет наш, который хочется немножко прям

261: Сделать его.

262: Таким размазы тым и давайте сверху добавим текст, уберём ему фильтры.

263: И и и попробуем, не знаю, может быть даже как-то так, то есть такой эффект.

264: Тоже как вариант, ну такой нам не подходит. Ну да, в общем, какой-то, наверное, темнее цвет подходит нам больше такой, как будто бы вышивка какая-то, не знаю, супер размытая. Мы можем даже здесь ещё раз зайти.

265: В Лаер блюр и сделать его, ну, менее чётким. Вот, чтобы было немножко такое.

266: Так.

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

268: Решение. То есть очень важно не останавливаться на 1 решении. Если вы хотите поэкспериментировать, вы можете сделать более

269: Больше вариантов. Это вообще, кстати, во всех креативных сайтах очень важно не зацикливаться на 1 решении. Вот я вот сейчас как-то даже растерялась, я вот думаю, что лучше

270: Ну, давайте пока так оставим, потом, если что, вернёмся. В любом случае, у нас ещё есть чуть чуть время, но мы сейчас быстренько с вами накидаем че-нибудь прикольное, жирно, жирно, жирно, есте.

271: Конечно же, куда без этого нам нужно сделать это контрастнее.

272: Либо даже, знаете, пусть она будет поменьше, но, типа, сверху че-нибудь такое. Так.

273: Давайте тоже посмотрим какие-то варианты. Кстати, с текстом прикольно это легло. Опа.

274: Опа опа, что мы нашли какой-то бриллиант.

275: Так, давайте остановимся на этом варианте. Пусть не читается. Нас это не волнует. Наша задача выйти из зоны комфорта. Кстати, очень важный приём. Не бойтесь в своих каких-то личных проектах делать какую-то прям дичь.

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

277: В целом сделать? Ну какой-то прям вообще гранж жёсткий. Так давайте знаете че сделаем немножко поменяем цвет как красный, он чересчур бьёт по глазам че-нибудь помягче.

278: Че-нибудь помягче. Давайте попробуем какой-то из слоёв может быть подубрать, а может быть этот оставить, но сделать его может быть даже добавим строк контрастного цвета.

279: Так че у нас не работает?

280: Так, а потому что он в эффекте. Все, я понял. Давайте попробуем так, сейчас мы его подшаманим.

281: Может быть даже что-нибудь такое замутить, ну просто чтобы хотя бы чуть чуть было хоть какое-то очертание того, что мы делаем.

282: Ну давайте базо, в общем, так поставим, потом ничего страшного, мы с вами просто балуемся и хочется какой-то декоративки. Я вот думаю, что ещё мы можем сюда добавить. Давайте попробуем тоже девушку зайдём.

283: Фильтр.

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

285: Индивидуально подыщем нам нужный фильтр, который нам подходит.

286: Галерея фильтров.

287: Кстати, прикольно. Вот этот вот вариант, о, вот этот прикольный, сейчас вот этот запоминаем. Значит, плотная бумага это то, что у нас было первоначально.

288: Но я бы попробовала, наверное. Хотя, ладно, давайте попробуем такой, потому что там очень много тёмного цвета, и если мы будем смешивать что-то, это будет.

289: Плохо видно. Можем сделать с таким форматом поделить прям экран.

290: Что-нибудь такое можем её тоже смешать.

291: Кстати вот так тоже прикольно выглядит как вариант да, на любителя да, продать мы это селеночки не можем, но кто нам мешает рубрику экспериментов подключать ну вот что-нибудь такое xray эффект.

292: Типа прикольно. И в целом, знаете, че бы я ещё добавила кринж, давайте добавим Роза png контур, как будто вот у меня такой, знаете, вайб, я не знаю татушек.

293: Хочется что-то та тушное сделать.

294: Поудаляем сейчас везде phone.

295: Ненужный нам.

296: И что мы сделаем? Конечно же, мы сделаем с вами маску для того, чтобы мы могли с вами его изменять. Сейчас мы с вами работаем в стиле, назовём его обобщённо креатив, да, то есть брутализм.

297: Можно назвать, но сейчас уже вот это понятие, то есть это просто вот знаете, такой типа креативный сайт под creative может подходить абсолютно любое значение абсолютно. То есть это может быть и коллаж, и в целом вот что-то такое вандальное.

298: В дизайне можно даже как-то так. Ну, вай бок как будто бы мы делаем для очень такой готической косметики. Давайте представим, что у selena коллекция

299: Не знаю чёрных помад, и сейчас мне пришла в голову мысль, что если мы с вами сделаем крупнее текст и разместим

300: Его ниже. Что если

301: В целом и так, и так норм. Я давайте пока так оставлю. Мне кажется так тоже прикольно.

302: По остальному.

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

304: Не то чтобы меня прям это волнует, конечно, но давайте сделаем вид, что нам это важно и сделаем его пожирнее таким образом.

305: Ну и последующий контент у нас там получается.

306: Текст. Ну, я думаю, что мы можем прям его взять отсюда.

307: Таким образом, просто немножко разбить. Я думаю, что здесь хорошо подойдёт вариант, когда много текста и меньше контраста. То есть чем

308: Мельче текст, тем лучше будет выглядеть эта композиция.

309: Напишите мне, пожалуйста, любите ли вы работать в таком стиле наедине с собой вообще, делали ли вы какие-то похожие там, не знаю, гранжевые варианты для клиентов? Может быть кому-то нравится такое. То есть я думаю, что если какой-то такой современ,

310: Магазинчик то вообще почему бы и нет? И давайте чуть чуть подвинем формат, не будем долго разглагольствовать, да, по дизайну, потому что можно придумать лучше 100%, если у нас на это время

311: Думаю нет. Поэтому просто довольствуемся тем, что у нас есть и можно даже как-то экспериментировать. Тоже как-то так наложить несколько вариантов. Вот тут самое главное у нас закрыло.

312: Так, и давайте тоже попробуем какой-нибудь эффектик, что-нибудь дичь полную добавим она не смешивается. Можно попробовать сделать красный и как вариант как будто

313: Теснение визуально выглядит.

314: Ну, в общем то, розочки прикольно. Так, и давайте представим, что у нас что черно белые помады, если они черно белые, точнее не черно белые, а просто чёрные, значит, мы можем сделать их такими в таком тюбике, да, как будто бы это чёрное.

315: Помада разные эти. И можем с вами сделать много, много их и вот так вот расположить. Типа выбирай че хочешь.

316: Ну и здесь давайте тоже сделаем че-нибудь такое неприятно большое, крупное.

317: 65, 65 норм. Ну, здесь можно прям оторваться, а здесь наоборот, можно сделать его поменьше.

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

319: Не чёрный, а вот как такой угольный графитовый копипаст. Copy, png, тын, тын, тын берём, вставляем у нас сейчас

320: Появилось изображение. Давайте я сделаю вот так вот оно почему мы сейчас его перевели в изображение потому что плагин фотоопе работает только с расовыми изображениями. Заходим в фильтр галерея фильтров.

321: И выбираем.

322: Нет, не тут изображение, сейчас мне бы вспомнить. Я уже 500 лет это не делала.

323: А, господи, фильтр, шум добавить, шум, так.

324: И че, и где?

325: Где настройки?

326: В общем, сегодня какая-то у нас

327: Почему-то он не открывает нам давайте ещё раз попробуем вот хотела показать вам поделиться ну что это такое? Во все интенсивность я ставлю, ну где-то восьмёрочка и

328: Однотонный подтвердить, сохранить. Не знаю, видно ли вам. Давайте я приближу. Видите, такие прям текстурки появляются вкрапления. Давайте нанесём сюда.

329: Растянем и добавим шума. И у нас такой аля сайт аля постер, называйте его как хотите, но в целом, почему бы и нет? Я думаю, что если бы это был бы какой-то вайбо.

330: Магазинчик в такой стилистике, то клиентам очень бы даже зашло. Ну давайте остановимся.

331: Давайте вот так, не особо важно. Итак, дорогие мои друзья, товарищи, я была рада с вами разделить эти полтора часа. Давайте подытожим.

332: Подытожим с вами вопросиков. Во первых, пожалуйста, поставьте мне какие-то реакции. Все ли окей, все ли понравилось, что-то, может быть новое узнали, может быть все знали, но подкрепили какие-то старые.

333: Навыки. С чем вы согласны? Какие у вас вообще понимания о стилях? Да, хотели ли бы вы работать в разных стилях? Можете пообщаться. Вот. А я пока в это время почитаю ваши вопросы, начну с

334: Такта. Итак.

335: Как понять, что цвета из выбранной палитры достаточно цвета. Допустим, блок фиолетовый. Стоит ли использовать ещё этот цвет? Допустим, в тексте все зависит от того, какой контра.

336: Вы хотите вот с помощью этого цвета использовать на сайте? Если это просто яркое пятно, которое вы используете на плашках, то я вам советую не использовать этот цвет в заголовках и в описании оттенять этот

337: Фиолетовый, другим цветом, который относится только к тексту, чтобы понимать вообще в целом, как работают цвета. Я вам советую зайти в подборки хороших сайтов. Да, это может быть что угодно. Любая

338: Классная подборка. Посмотреть, как дизайнер использует те или иные цвета. Прям выпишите себе по процентам, сколько раз вы видели там фиолетового, допустим, цвета, если это цветной сайт, сколько раз какого-то другого и как

339: Дизайнер использует оттенки в типографике. Я советую использовать акценты только на плашках. Если вы будете добавлять это ещё и в заголовки, то это превратится уже в такую сборную солянку. Это будет, во первых, по контрасту.

340: Не равносильно, потому что чёрный всегда контрастнее, но делать все, допустим, таким цветом. Это нарушает читабельность. Вот. Поэтому здесь мой совет, все контрасты яркие, сочные цвета.

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

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

343: Так, расскажи, пожалуйста, про особенности вёрстки каждого стиля. Можешь, пожалуйста, расшифровать, что именно ты подразумеваешь под вёрсткой, то есть именно вёрстку на тильде. Здесь как таковых особенностей нет. То есть все стили вообще комфортно, удобно верстать на

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

345: Шейпы, загрузить фотку все буквально точно такой же сайт готов. Точно также в тильде настраивается и сетка, и направляющие. Все это имеется. Просто копипаст вставляем и радуемся жизни. Что касается креативного сайта, здесь чаще бывает сложнее.

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

347: Вот эту картинку.

348: Phone и группирую и экспортирую это собственно на сайт вот таким образом и если у меня был сверху шум, то соответственно на эту фотку шум тоже добавляю в остальном

349: Все тоже самое, все легко, все просто. Если именно про тип вёрстки в плане автоскейл, либо резиновая минимализм, если вы умеете работать с резиновой вёрсткой, можно верстать там, но чаще всего это либо просто

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

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

352: Так, посоветуйте литературу по стилям. Я вам знаете, что посоветую? Называется книга 100 икон дизайна, че то такое можно даже загуглить.

353: Пам пам.

354: Вот иконы дизайна, 100 икон, в общем, иконы графического дизайна. У меня есть эта книжка, я её люблю, я её периодически перечитываю, все чётко, все понятно, вся история графического дизайна, ну, скажем так, начало, да, от того,

355: То, что у нас имеется, и то, к чему мы пришли, цифровизация. Вот это прикольно. Советую. Можете почитать, очень полезно. А как понять, какой именно стиль подойдёт для сайта заказчика? Какие ориентиры, подскажите, я это говорила в самом начале нужно, во первых,

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

357: Это 1 ассоциация, то есть то, что вы чувствуете, смотря на фотоконтент бренда, читая описание, смотря продукт бренда, то, чем он занимается. Это 1 касание вы можете записать для себя, как вы описываете прилагательными.

358: Тот или иной продукт. Помимо этого, в брифе обязательно указывайте раздел для клиента, чтобы он сам описал сайт прилагательными продукт, прилагательными и в целом, чтобы он рассказал, как он чувствует, да, вот какие

359: У него с его брендом на основе этого вам уже легче будет понимать, какой стиль нам подойдёт. Если целевая аудитория это какие-то супер такие богатенькие, не знаю, мужчины и женщины, то чаще всего используют какой-то минимализм

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

361: Стиля, он тоже может выглядеть круто и дорого. Вспомним сайт apple. По сути, ну, его нельзя, конечно, назвать бента стилем, но он вообще не про минимализм. То есть там очень такая крупная, такая толстая пухлая типографика, но при этом, пожалуйста, их продукты дешевле.

362: Не выглядят, поэтому это все супер индивидуально. Старайтесь прокачивать свою вот эту вот чуйку того, какие у вас есть ассоциации по тому или иному предмету, продукту и тд. И тп.

363: Так.

364: Оторвалась, так оторвалась. Спасибо за вдохновение. Да, я старалась в конце, чтобы прям, ух, бунтарский дух. Супер, как всегда. Спасибо большое. Появилось ощущение дизайна. Спасибо. Круто. Спасибо огромное, креатив.

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

366: Процессами, рождением идеи. Креативный дизайн, огонь. Спасибо за фотоопе не знала. Буду пробовать. Да, обязательно попробуйте. Очень много там разных фишек, особенно для тех, кто не может скачать фотошоп, либо у кого есть большой страх фотошопа, такое тоже может быть зайдите в этот плагин буквально

367: Пару тыков и вы сможете обуздать этот плагин вообще на 100%. А если делать оттенки для основных цветов и для заголовков, брать самый Тёмный оттенок.

368: Не поняла, а если делать оттенки для основных цветов?

369: Оттенки цветов. Ну это же, по сути, одно и то же слово. Цвет, оттенок. Пожалуйста, можно мне расшифровать этот вопрос, на ваш взгляд, если касаться коммерческих сайтов, почему в большинстве случаев первые экраны лишены утп?

370: И офферов. Почему это дело игнорируется? Ведь это минимализация выгоды для клиентов. Мне кажется, что это просто вопрос работы команды, если, например, есть коперайтер на стороне.

371: А дизайнер, просто исполняющее лицо, то это на стороне коперайтера, да, то есть, значит, это недостаточно. Ну, нельзя сказать, опытный, но, возможно, человек, который видит по другому презентацию 1 экрана. Вот это правило, что усло,

372: Мы должны заходить, и заголовок должен сразу же закрывать наш вопрос, куда мы попали? Оно в целом работает, но оно уже, по моему мнению, немножко искажено. То есть есть разные варианты. Не знаю, брендов, которым вообще не нужен никакой тп.

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

374: Так, палитра из 3 основных цветов, к примеру. И для каждого цвета делать градацию из 10 оттенков. Это тумач. Во первых, у тебя просто не будет места, куда использовать так много оттенков, а во вторых, такое можно провернуть. Ну, смотря

375: Такой стиль, если ты используешь какие-то прикольные градиенты, пожалуйста, если ты используешь, например, ну вот у меня сейчас фиолетовый, а снизу другая плашка будет вот такая, а ещё снизу, да, если даже вот так сделать. А ещё

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

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

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

379: Выглядеть хорошо, почему бы и нет так?

380: Есть ли ещё какие-то вопросики?

381: Ну, кажется, это все. Мы можем с вами прощаться, дорогие мои слушатели. Я, как обычно, безумно рада находиться здесь. Желаю вам всем прекрасного прекрасного дня и креативных концеп.

382: Пожалуйста, попробуйте порисовать сегодня в абсолютно разных стилях свои сайты и попробовать открыть для себя что-то новое.