🔥 Бесплатный курс по дизайну с бесплатной обратной связью: t.me/freeeducation_uprockbot Что может быть лучше для завершения недели, чем еще одна практика по дизайну от меня)) Как вам проект?
очень нравится, как вы логически объясняете выбор каждого визуального решения. Это просто космос, насколько круто вы умеете понимать задачу каждой мельчайшей закорючки на сайте!
Как всегда на высоте!) Приятные и плавные анимации самого видео, современный и привлекающий дизайн макета, + пошаговое объяснение каждого блока. Спасибо, что ведешь ютуб. Очень сильно в свое время помог не промахнуться в выборе школы для обучения. Переживал в те времена попасть в неумелые руки и заплатить за общую информацию, делая посредственные работы. Благо это все обошлось и вот уже я во всю делаю корпоративный сайт :) Еще раз спасибо тебе и твоим крутым кураторам, что помогают развиваться в этой замечательной сфере!)
Женя, очень понравился твой ре-дизайн)) Интересно, через какое время эти ребята изменят свой сайт))😊 Очень жду процесс создания, прошлый ролик из этой рубрики очень зашёл 🙌🏼
Дизайн просто бомбический! Спасибо за такой нестандартный, креативный и фантастический взгляд! Сложно отвыкать от тех знаний когда колонок должно быть именно 12, выравнивать ровно по ним и когда заголовки должны быть строго больше описания.
Салют! Всегда пожалуйста) Да, всегда лучше идти от общего к частному, от базовых, основополагающих вещей к деталям. Когда общие принципы дизайна остаются незыблемыми, отношение к вариативным подходам, инструментам и трендам становится куда более гибким и их сменане вызывает никаких затруднений👍
Евгений, спасибо Вам за обратную связь! Скажите, пожалуйста, на примере этого дизайна, если заголовок, например h1/h2 меньше описания, не будет ли трудностей у гугл-поисковика? Надеюсь, нет). Уж очень крутые подходы! @@UPROCK
Женя, каждый день смотрю твои видео и балдею с каждого проекта Очень хотелось бы увидеть ролик, где ты рассказываешь подробнее про работу с типографикой
@@tommyshelby8122 Да, на самом деле нужно постоянно перебирать множество вариантов, чтобы по итогу выбрать самый оптимальный. В начале пути тебе помогает арт-дир (или как в моей школе, куратор), чтобы "откалибровать" свое понимание того, что нужно пользователю. Фактически тебе нужно развить вкус и эмпатию, а потом ты сам сможешь подбирать самые безумные, но эффективные решения)
Визуал дичайший! Ещё нравится объяснение логики действий. Так становятся понятны причины видимого следствия. Спасибо за крутой ролик. Понравилась мысль про висячие предлоги и союзы, но я уже так научился и боюсь не смогу делать макеты иначе :) Ещё хотелось попросить видео о различии колонок и направляющих. Почему направляющие сместили колонки? И как это отразилось на последующей вёрстке?
Смотри, хочешь заморачиваться с предлогами, то это твой выбор. Я только в заголовках иногда правлю этот момент. Но по факту верстальщик все равно верстать будет с висящими предлогами, можно только в ручную контролировать в заголовках. Весь контент расположен вдоль направляющих, так как сайты вытянутые и они являются для нас как бы маршрутами для изучения контента. Колонки я как бы тоже использую, но они не лежат в основе дизайна.
Привет! По-хорошему обычно точку не ставят. Пойми правильно, не хватает времени чтобы и сам проект нарисовать и видео смонтировать) на коммерческие поекты обычно выделяется больше времени
Не обращай внимание на тех, кто ищет тут нарушение правил)) почти любое правило можно нарушить, если это нужно для крутого и необычного дизайна)) а правила нужны, что бы их нарушать) очень крутой макет, и очень классно рассказываешь, отличная тема - и насмотреннасть развиваю, и учусь чему-то) спасибо
Привет, Алина! да, так и есть, в дизайне нет критичных правил) Есть только одно правило: чтобы дизайн был классным для пользователя и для бизнеса клиента
Мне кажется желтый белый ну такой себе цвет был изначально у той студии) Полагаю желтый основной у них был, брендинг и т.п., и решили с белым сочетать. Мне кажется, что вообще черно-желтый самый топ всегда) шмели, пчелы, за нас придумала природа такие паттерны)
Спасибо за видео, Евгений, как всегда - респект! Попутно замечу, как ученик школы Uprock, начинал учиться в Uprock и одновременно в Way up (Гаврилов)... там, как раз и учат вот тому дизайну, с первого кадра)))😄
Согласен, много школ учат устаревшему дизайну. Я к этому очень скептично отношусь, считаю это неправильно, когда основатель школы не имеет реального опыта в дизайне
Спасибо Женя за видос. Шикарный дизайн, хороший рассказ) "Будь проще и люди подтянутся" хорошо знакомо) Да будет интересно посмотреть процесс, как пришли к этому дизайну! Отличный формат видео, полезный и познавательные 🙏. Женя а на основе чего выбирать сетку, и как определять какую? Спасибо 😎
Если будешь учиться у меня - обещаю, что научишься, у нас даже есть специальный блок для презентаций) Можешь посмотреть здесь www.youtube.com/@uprockclan
Видео супер, вся серия то что надо, прямо в точку, чтобы понять как и почему. Спасибо за подробные объяснения - почему это сделано именно вот так. От себя очень прошу добавить в объяснения про декор и вспомогательные элементы. Например, в этом проекте есть желтая подсветка в одном месте страницы, в блоке этапы работы, справа от кнопки "Оставить заявку". Для чего ее сделали? Почему именно тут? Почему этот элемент только один на странице? Как пришли к тому чтобы использовать именно этот элемент? Понимаю, что это удлинит время работы над видео, но если получится, будет очень здорово. Спасибо!
Привет! Жёлтая подсветка там нужна потому что сам по себе блок узкий и нужно было композиционно заполнить общее пространство. Почему именно в этом месте: чтобы сделать дополнительный акцент на кнопке "оставить заявку". Он не один на странице, в блоке с блогом точно такая же подсветка, только другого цвета, так как элементы справа сами по себе жёлтые и всё бы сливалось. Пришли к данному решению с помощью перебора большого количества вариантов: было ощущение что эти места пустоваты и для баланса в композиции нужно было их заполнить. Но на самом деле использование этих элементов не критично.
Давно смотрю Вас, очень крутые работы) Хотелось бы увидеть видео про сложные интерфейсы, по типу CRM или что-то близкое к этому :( Надеюсь такое видео выйдет))))))
Как и прежде все отлично. С пояснениями смотреть намного лучше интереснее и увлекательно, прям как видео в курсе школы. Если добавить капельку придирчивости то на главном экране у девайса кнопки и крестик поменять местами , разве что они зеркальные, или это девайс будущего.
Добрый день! А где на платформе "геткурс" смотреть это обновление по иллюстрациям, про которое в завершении видео говорил Евгений? Не видел такого обновления. Я приобрёл этот курс.
Какой стииль! Подскажите, пожалуйста, есть ли какое-то правило, по которому вы делаете отступы между смысловыми блоками? Есть какое-то определенное расстояние или это уже с опытом определятся "на глаз"? Мне просто всегда хочется добавить "воздуха" между блоками, но у вас очень все логично, органично и ёмко выглядит, что хочется тоже научиться такому же подходу) Буду рада ответу
Если не знаешь какие делать отступы - делай 150) А вообще мы делаем таким образом, чтобы визуально считывалось четкое разделение между разными областями. Иногда это можно реализовать за счет размещения в плашке, либо за счет цвета, как в этом макете. Одно могу сказать: без переборов большого количества вариантов не найти нужный. В этом и суть обучения, куратор будет давать много комментариев и правок, пока не "откалибруется" понимание)
Женя, уже не в первый раз ты говоришь, что колонки для веб-дизайна не нужны, а нужны направляющие. Можешь подробнее пояснить этот момент? Непонтна твоя мысль, что ты имеешь в виду)
Привет! Я имею в виду инструменты. В связи с тем, что стандартные колонки ограничивают нас в выборе решений для сетки, композиции и вообще давным давно устарела, для обозначения сетки на сайте я пользуюсь направляющими вместо layout grid
Ну как же. Как же можно так оставить. Я бы постарался придумать как-то что-то... Но так бы не оставил. Размер кегля не в любви с шириной колонки. НО! Специалист тут вы! И профи. + агентство и школа. А это делов миллиард, выдержка и способность зарабатывать на этом хорошо. Это тоже надо уметь. Я на своем дезигне. Вобще не могу заработать. И нахера я тут спорю? ))) Умник блин. Спасибо за урок @@UPROCK
Весь контент расположен вдоль направляющих, так как сайты вытянутые и они являются для нас как бы маршрутами для изучения контента. Колонки я как бы тоже использую, но они не лежат в основе дизайна. Сами колонки пришли из графического дизайна, а у нас тут веб и свои правила.
Потому что колонки придумали дизайнеры из Твиттера, много лет назад и на данный момент они сами от колонок отошли, это видно по новому дизайну соц. сети
Евгений, Вы сказали, что те, кто сейчас купил Middle+ получает еще и навык в иллюстрации, если я купил 11 ноября, ко мне же тоже относится? И в каком разделе это будет, Сайты про? Спасибо большое, я сейчас на спринте лендинга и за 3 недели плодотворной работы чувствую, как во мне начала появляться структурность и понимание этапов разработки с точки зрения логики сайта, Спасибо за Вашу работу!
Женя, подскажи пожалуйста чем ты руководствуешься когда задаешь направляющие? 3 колонки у тебя будет или две или 4 и тд. Это зависит от задумки (сначала родился концепт и под него строишь сетку) или наооброт Никак не могу с этим разобраться.
Привет! Я руководствуюсь тем, чтобы максимально подобрать комфортную систему для расположения всего контента на сайте. И перед тем как показать вам этот вариант, я прорабатываю большое количество других вариантов)
очень было бы круто собрать этот дизайн в прототипе и прикрепить к какому-то useberry и соответсвенно скинуть ЦА. Интересно будет посмотреть их поведение и тепловую карту. Пока я немного скептически отношусь к такому виду дизайна. Пока он выглядит для меня не продающим - стильным, модным - да. Внушающий доверие, не знаю. Но все это мое субьективное мнение, говорят Цифры.
Давай попробуем поэксперементировать. Ответь мне на два вопроса: 1. В моем макете контент более логично и понятнее структурирован? 2. Есть ли отражение визуального позиционирования и индивидуализация компании в моем дизайне?
@@UPROCK 1-да 2- не совсем уверен. Мало айдентики компании, но это наверное больше вопрос к компании. Если вы уберете логотип то да я пойму что компания занимается разработкой ПО, но что именно это за компания навряд ли - скорее очередная компания. Вопрос в принципе не к вашей работе данной, а ко всему тренду который сейчас мы можем наблюдать. Широкая типографика, минимум контента. Мало CTA, интересно просто как все это влияет на цифры. Если что я без Хейта, а скорее с точки зрения исследования
@@k09t1 да ты все очень корректно. Самое главное ты ответил на первый вопрос, что стало удобнее и понятнее. Не это ли является основным ответом стало ли лучше? И тренды создаются только на запрос пользователя, чтобы все стало комфортнее для них. CTA мало потому что на таком сайте это не нужно, на других лендингах в моих редизайнах их больше. Все определяет контекст. По эмоциям, все же этот сайт зафиксируется в памяти, ну и по хорошему надо всю айдентику в таком стиле сделать, тогда будет полное соотношение с компанией.
Евгений, здравствуйте. Только сейчас пришла мысль в голову о том что в блоке с шагами работы можно было бы кнопку "оставить заявку" поместить вместо пункта номер 8 раз как раз там проходит силовая линия, а один из шагов сместить в правую часть. Что думаете?
Привет! На своём дизайне ты можешь использовать решения, которые считаешь правильными, я для себя поставил в конце, как последовательное и логичное завершение всех шагов)
Конкретно эту рисовал иллюстратор, но в ближайшее время для тех, кто купил пакет middle+ у нас появится бесплатный курс, в котором мы будем учить делать такие иллюстрации веб-дизайнеров)
Привет, Жень. Есть одна вещь, которая мне не даёт покоя. Я, занимаясь в твоей школе, обнаружил интересную закономерность: структура используемого вашей студией стиля предоставляет практически все возможные варианты, которые только можно использовать при конструировании дизайна сайта. Вы целенаправленно проводили исследования, которые привели к созданию этого альманаха стилей? В частности структура примеров хедеров встречается практически без изменений во всех без исключения работах, которые я только видел на дрибле или бихансе. Ну ладно, с исключением в виде совсем уж концептуальных сайтов.
Привет! Да, так и есть - стиль дизайна Uprock это по сути результат большого анализа всего, что есть на рынке, всех рабочих решений. Молодец, что проанализировал, не все готовы искать закономерности в куче UI-китов) Всё равно нужно понимать, количество блоков ограничено, а вот их комбинации и варианты коррекции правил под разные ситуации - почти бесконечны.
@@UPROCK По сути ведь получается, что ты и твоя команда БУКВАЛЬНО продаёте самый удобный курс по UX/UI Дизайну, который применим везде. Вопрос: почему идиоты из госуслуг спонсируют не тебя, а мразотные скиллбоксы?
@@vsssss1089 думаю у меня не достаточно известности, как у скилбокса. Но я не стремлюсь за этим. Если у нас увеличится внезапно количество студентов в 2 раза, то качество резко упадет. Я предпочту лучше более равномерный спокойный рост.
Салют! Это заказ одного из моих студентов, мы берём на редизайн заказы к которым наши студенты имели прямое или косвенное отношение. Либо он до курса делал этот сайт, либо кто-то из его колег, сейчас не могу точно сказать
Привет! Сверстанного нет, так как это был заказ одного из наших студентов, мы хотели показать как мог бы выглядеть проект, к которому он имел отношение. Для этого у нас есть воображение - чтобы представить как он будет выглядеть сверстанным)
Очень классно получилось !!! Женя, а не считаешь ли что у тебя проекты становятся однообразными ? Она проявляется в больших шрифтах и заголовках, разбросанным описаниям и сетка уже одинаковая в большинстве работах Я не негативлю, просто хочу узнать твое мнение об этом ))
Если взять большинство сайтов то там тоже все одинаково, меняются только цвета и контент, и ничего жили с этим десятки лет) приложения тоже по факту своему все похожие меняется расположение элементов и цвета
Добро пожаловать в реальность) Мой стиль - это только отражение запроса пользователя и актуальных трендов. Завтра у нас появится третий глаз, и я изучу, как по новому пользователи изучают контент и скорректирую стиль под них. Вообще если посмотришь все современный сайты то увидишь общие закономерности с моим стилем.
@@ЭльдарРахимов-щ1р ну честно мои сайты все равно на голову выше, чем то что можно встретить в интернете. Но я не ухожу в совсем в фестивальные сайты, так как уважаю пользователей и это накладывает некоторые ограничения. В любом случае, если пользоваться моими интерфейсами есть ощущение новизны и оригинальности. Просто они не бьют в пах своей оригинальностью)
6:18 Так нельзя делать нигде - ни в вебе, ни в печати. Это не «прием из ворда», это ошибка всех любителей и начинающих дизайнеров, которые ничего не знают про переносы и инструменты борьбы с дырами в тексте - изменение расстояния между словами, буквами, а также небольшое растягивание глифов по горизонтали. Я уже не первый раз вижу такой «графический прием», который впитывают новички и, к сожалению, считают, что именно так выглядит выравнивание по ширине. Если прием «красная строка» можно применить в вебе как графический прием и это будет выглядеть вполне красиво, то делать «дырявые» текстовые блоки - это неправильно, т.к. это воспитывает шрифтовое бескультурье. Типографика, как ни крути, имеет свои правила и законы, связанные с эстетикой и удобочитаемостью, любой хороший дизайнер должен их знать, прежде чем попытаться нарушить.
А мне так можно делать) Я люблю немного делать так как нельзя другим. Потому что я лучше всех))) Шучу) Все эти правила о которых ты озвучил - это не законы физики, их обдуманно можно и нужно иногда нарушать, если это идет на пользу. Единственные правила, которые нельзя нарушать - это паттерны сканирования и потребления контента пользователями. И как сказал в видео, ты свободен применять или отказываться от моих решений. Все в твоих руках, а на своих макетах позволь мне решать, как правильно)
@@UPROCK Решать тебе, безусловно. Я говорил о том, что конкретно такой неправильный способ верстки начинающие дизы переносят в печать и решают, что это стандарт. В печати помимо паттернов сканирования еще нужно следить за равномерным набором - параметром, который отвечает за удобочитаемость. Ну и эстетика, повторюсь тоже не последнее дело. Успехов, Женя, спасибо за клевые работы.
@@Vladimir-po8qe я думаю начинающим правильно научиться обще принятым стандартам, а потом уже пробывать эксперементировать. Ну как минимум я так учу) Спасибо, за комментарий и что посмотрел мое видео)
@@UPROCK Я что-то упускаю, наверное. Какой именно функциональностью обусловлена простановка запятых в меню вообще? Чтобы что? Но это бы ладно, вкусовщина, коли бы перечисления не начинались с Большой буквы, а так... Необходимости никакой, а выглядит безграмотно. Опустить точку в заголовке, в крайнем случае удержать однобуквенный предлог до перевода строки, что-то больше ничего на ум не приходит, где можно поступиться с правилами.
Привет! Мы делаем редизайны проектов, которых так или иначе касались наши студенты: либо они делали их сами, либо их коллеги по работе. Самый главный бонус в том, что мы делаем любые коммерческие проекты со своими студентами, в ближайшее время об этом тоже выложим ролик)
Поверь, никто его не закладывал, паттерн это не про размещение контента в форме буквы F) Это скорее про движение слева направо по строке, возврат к основной оси, перемещение на уровень вниз, движение слева направо и так далее
![Рисуем сайт для садоводов и разбираем композицию [Re-Design]](http://i.ytimg.com/vi/J2JkIFj5CG8/mqdefault.jpg)
🔥 Бесплатный курс по дизайну с бесплатной обратной связью: t.me/freeeducation_uprockbot
Что может быть лучше для завершения недели, чем еще одна практика по дизайну от меня))
Как вам проект?
Класс жду следующее видео)
@@max_whoareyou7926 Скоро выложу!
Пушка!
Огнище
Очень приятно и интересно смотреть ваши видео. Рад, что учился и учусь в вашей школе! Невероятно крутые, топ! ❤
очень нравится, как вы логически объясняете выбор каждого визуального решения. Это просто космос, насколько круто вы умеете понимать задачу каждой мельчайшей закорючки на сайте!
Да, с опытом приходишь к этому. Цель всегда и была в том, чтобы и пользователю было удобно и клиенту было легко обосновать свои решения)
Как всегда на высоте!)
Приятные и плавные анимации самого видео, современный и привлекающий дизайн макета, + пошаговое объяснение каждого блока.
Спасибо, что ведешь ютуб. Очень сильно в свое время помог не промахнуться в выборе школы для обучения. Переживал в те времена попасть в неумелые руки и заплатить за общую информацию, делая посредственные работы. Благо это все обошлось и вот уже я во всю делаю корпоративный сайт :)
Еще раз спасибо тебе и твоим крутым кураторам, что помогают развиваться в этой замечательной сфере!)
Очень рад, бро, что смог помочь тебе и ты не ошибся с выбором. Обещаю, буду всегда развивать школу и давать только лучшие знания!
Очень классный формат! Побольше бы такого :) Помогает понять как думает опытный дизайнер и прокачивает "обоснованость"🔥
Да, это очень важно. На собеседованиях, или при презентации клиенту, обязательно нужно рассказывать как должен выглядеть хороший дизайн)
Женя, очень понравился твой ре-дизайн))
Интересно, через какое время эти ребята изменят свой сайт))😊
Очень жду процесс создания, прошлый ролик из этой рубрики очень зашёл 🙌🏼
Обычно, это происходит не скоро. Но буду рад, если у них будет с развитием компании и улучшаться их дизайн сайта.
По процессу запишу обязательно!
Дизайн просто бомбический! Спасибо за такой нестандартный, креативный и фантастический взгляд! Сложно отвыкать от тех знаний когда колонок должно быть именно 12, выравнивать ровно по ним и когда заголовки должны быть строго больше описания.
Салют! Всегда пожалуйста) Да, всегда лучше идти от общего к частному, от базовых, основополагающих вещей к деталям. Когда общие принципы дизайна остаются незыблемыми, отношение к вариативным подходам, инструментам и трендам становится куда более гибким и их сменане вызывает никаких затруднений👍
Евгений, спасибо Вам за обратную связь! Скажите, пожалуйста, на примере этого дизайна, если заголовок, например h1/h2 меньше описания, не будет ли трудностей у гугл-поисковика? Надеюсь, нет). Уж очень крутые подходы! @@UPROCK
@@aliciajc4985 Пожалуйста🔥Очень рад) Нет, при грамотном подходе к верстке никаких проблем с индексированием такого сайта не возникнет
Женя, каждый день смотрю твои видео и балдею с каждого проекта
Очень хотелось бы увидеть ролик, где ты рассказываешь подробнее про работу с типографикой
И мне хочется увидеть. Я тоже каждый день смотрю. Все повторять пытаюсь
Посмотри пожалуйста эти ролики, возможно они закроют этот вопрос: th-cam.com/video/MulF0MG0VdU/w-d-xo.html th-cam.com/video/3fqJRH-TqCs/w-d-xo.html
@@UPROCK я их смотрел) я имел ввиду на конкретных проектах, как определять оптимальные размеры для стилей
Неужели на глаз?))
@@tommyshelby8122 Да, на самом деле нужно постоянно перебирать множество вариантов, чтобы по итогу выбрать самый оптимальный. В начале пути тебе помогает арт-дир (или как в моей школе, куратор), чтобы "откалибровать" свое понимание того, что нужно пользователю. Фактически тебе нужно развить вкус и эмпатию, а потом ты сам сможешь подбирать самые безумные, но эффективные решения)
Спасибо Женя! Понятно, интуитивно, без воды. Приятно смотреть и вникать в суть.
Рад, что нравится формат!
Редизайн, подача материала - просто бомба, Uprock лучшие!
Спасибо, Дарья)
Спасибо! Обожаю😍
Всегда пожалуйста, Татьяна ☺️
Визуал дичайший! Ещё нравится объяснение логики действий. Так становятся понятны причины видимого следствия. Спасибо за крутой ролик. Понравилась мысль про висячие предлоги и союзы, но я уже так научился и боюсь не смогу делать макеты иначе :)
Ещё хотелось попросить видео о различии колонок и направляющих. Почему направляющие сместили колонки? И как это отразилось на последующей вёрстке?
Смотри, хочешь заморачиваться с предлогами, то это твой выбор. Я только в заголовках иногда правлю этот момент. Но по факту верстальщик все равно верстать будет с висящими предлогами, можно только в ручную контролировать в заголовках.
Весь контент расположен вдоль направляющих, так как сайты вытянутые и они являются для нас как бы маршрутами для изучения контента. Колонки я как бы тоже использую, но они не лежат в основе дизайна.
Зашло! Пояснения процесса - отдельное мастерство 👍
Супер! Рад что зашло) Надеюсь, со временем ваш дизайн будет не менее обоснованным)
С удовольствием посмотрел! Дизайн, как минимум, необычный) Заметил тут и у студии йоги, что в конце предложений точка то есть, то её нет
Привет! По-хорошему обычно точку не ставят. Пойми правильно, не хватает времени чтобы и сам проект нарисовать и видео смонтировать) на коммерческие поекты обычно выделяется больше времени
Не обращай внимание на тех, кто ищет тут нарушение правил)) почти любое правило можно нарушить, если это нужно для крутого и необычного дизайна)) а правила нужны, что бы их нарушать) очень крутой макет, и очень классно рассказываешь, отличная тема - и насмотреннасть развиваю, и учусь чему-то) спасибо
Привет, Алина! да, так и есть, в дизайне нет критичных правил) Есть только одно правило: чтобы дизайн был классным для пользователя и для бизнеса клиента
По-моему, это лучший редизайн, который пока делал Женя в рамках этой рубрики)
Лучший редизайн в рамках этой рубрики ПОКА)
Мне кажется желтый белый ну такой себе цвет был изначально у той студии)
Полагаю желтый основной у них был, брендинг и т.п., и решили с белым сочетать.
Мне кажется, что вообще черно-желтый самый топ всегда) шмели, пчелы, за нас придумала природа такие паттерны)
Черно-желтый достаточно агрессивный/активный и поэтому сложный в работе.
Женя, ты красавчик! Продолжай радовать талантливыми идеями!
Спасибо! Буду продолжать двигаться дальше)
Мне очень понравилось, большое спасибо за разбор реального проекта !!!
Всегда пожалуйста! Сейчас большинство роликов, котороые мы делаем, про разбор реальных проектов)
Спасибо за видео, Евгений, как всегда - респект!
Попутно замечу, как ученик школы Uprock, начинал учиться в Uprock и одновременно в Way up (Гаврилов)... там, как раз и учат вот тому дизайну, с первого кадра)))😄
Согласен, много школ учат устаревшему дизайну. Я к этому очень скептично отношусь, считаю это неправильно, когда основатель школы не имеет реального опыта в дизайне
Вроде в такую тематику напрашивается движение элементов на сайте, но как здорово получилось и без этого
Да можно и анимацию, это уже на следующем этапе. Но как ты правильно заметил, можно нарисовать и в статике круто, чтобы без анимации все было хорошо.
Спасибо Женя за видос. Шикарный дизайн, хороший рассказ) "Будь проще и люди подтянутся" хорошо знакомо) Да будет интересно посмотреть процесс, как пришли к этому дизайну! Отличный формат видео, полезный и познавательные 🙏. Женя а на основе чего выбирать сетку, и как определять какую? Спасибо 😎
Договорились скоро выложу!
Кайф. Я хочу также научиться защищать свои дизайн-решения)
Если будешь учиться у меня - обещаю, что научишься, у нас даже есть специальный блок для презентаций) Можешь посмотреть здесь www.youtube.com/@uprockclan
Видео супер, вся серия то что надо, прямо в точку, чтобы понять как и почему. Спасибо за подробные объяснения - почему это сделано именно вот так. От себя очень прошу добавить в объяснения про декор и вспомогательные элементы. Например, в этом проекте есть желтая подсветка в одном месте страницы, в блоке этапы работы, справа от кнопки "Оставить заявку". Для чего ее сделали? Почему именно тут? Почему этот элемент только один на странице? Как пришли к тому чтобы использовать именно этот элемент? Понимаю, что это удлинит время работы над видео, но если получится, будет очень здорово. Спасибо!
Привет! Жёлтая подсветка там нужна потому что сам по себе блок узкий и нужно было композиционно заполнить общее пространство. Почему именно в этом месте: чтобы сделать дополнительный акцент на кнопке "оставить заявку".
Он не один на странице, в блоке с блогом точно такая же подсветка, только другого цвета, так как элементы справа сами по себе жёлтые и всё бы сливалось.
Пришли к данному решению с помощью перебора большого количества вариантов: было ощущение что эти места пустоваты и для баланса в композиции нужно было их заполнить. Но на самом деле использование этих элементов не критично.
Очень круто и понятно, Женя, спасибо за рубрику!))
Рад, что рубрика нравится) Пожалуйста!
Давно смотрю Вас, очень крутые работы)
Хотелось бы увидеть видео про сложные интерфейсы, по типу CRM или что-то близкое к этому :(
Надеюсь такое видео выйдет))))))
Может быть тебе такое видео подойдет?
th-cam.com/video/KhS5soaWC-4/w-d-xo.html
Обалденное видео. Спасибо!
Пожалуйста)
Как и прежде все отлично. С пояснениями смотреть намного лучше интереснее и увлекательно, прям как видео в курсе школы. Если добавить капельку придирчивости то на главном экране у девайса кнопки и крестик поменять местами , разве что они зеркальные, или это девайс будущего.
Класс) очень рад что новый формат нравится)
Да, можно отзеркалить
Спасибо большое! Очень крутой разбор
Пожалуйста) Рад, что видео нравится
обожаю😂❤🔥офигенный формат
Спасибо) Очень рад, что формат нравится)
Просто огонь!!!
Спасибо)
это очень круто! надеюсь, я тоже так научусь.
Обязательно!
Добрый день! А где на платформе "геткурс" смотреть это обновление по иллюстрациям, про которое в завершении видео говорил Евгений? Не видел такого обновления. Я приобрёл этот курс.
Привет! Уточни пожалуйста, о каких иллюстрациях речь? Если про курс, то он добавится в ближайшее время
@@UPROCK да, про включение в курс "От нуля до миддл". Кажется так называется
Какой стииль! Подскажите, пожалуйста, есть ли какое-то правило, по которому вы делаете отступы между смысловыми блоками? Есть какое-то определенное расстояние или это уже с опытом определятся "на глаз"? Мне просто всегда хочется добавить "воздуха" между блоками, но у вас очень все логично, органично и ёмко выглядит, что хочется тоже научиться такому же подходу) Буду рада ответу
Если не знаешь какие делать отступы - делай 150)
А вообще мы делаем таким образом, чтобы визуально считывалось четкое разделение между разными областями. Иногда это можно реализовать за счет размещения в плашке, либо за счет цвета, как в этом макете. Одно могу сказать: без переборов большого количества вариантов не найти нужный. В этом и суть обучения, куратор будет давать много комментариев и правок, пока не "откалибруется" понимание)
Хотелось бы посмотреть как будет сайт на мобилке. Как будет работать гигантский текст в первом блоке
Заказ принят) Макет уже нарисован, ролик по нему сделаем без проблем
Женя, уже не в первый раз ты говоришь, что колонки для веб-дизайна не нужны, а нужны направляющие. Можешь подробнее пояснить этот момент? Непонтна твоя мысль, что ты имеешь в виду)
Привет! Я имею в виду инструменты. В связи с тем, что стандартные колонки ограничивают нас в выборе решений для сетки, композиции и вообще давным давно устарела, для обозначения сетки на сайте я пользуюсь направляющими вместо layout grid
Видео очень классное и полезное, спасибо вам! Подскажите пожалуйста, какой шрифт в проекте использовался на заголовках?)
Пожалуйста, очень рад) Следите за оповещениями, впереди ещё много интересного)
В проекте использовался шрифт Neue Machina
@@UPROCK Спасибо вам большое за ответ! 😊
@@en_larionova Всегда пожалуйста)
бомба! рубрика топ
Супер) Рад, что зашло
Ну блииин. Что с выключкой? Второй слайд. Текст над топ-7. Евгений, ну ты чего?
6:18 ну и вот для кого я тут распинался целую минуту?🥲
Ну как же. Как же можно так оставить. Я бы постарался придумать как-то что-то... Но так бы не оставил. Размер кегля не в любви с шириной колонки.
НО! Специалист тут вы! И профи. + агентство и школа. А это делов миллиард, выдержка и способность зарабатывать на этом хорошо. Это тоже надо уметь.
Я на своем дезигне. Вобще не могу заработать. И нахера я тут спорю? ))) Умник блин.
Спасибо за урок
@@UPROCK
Контейнер 1360px многовато будет, если разрешение монитора 1366px. Там ещё скролл-бар браузерный, отнимает где-то 15-17px.
Да, ты прав, лучше делать с запасом, 1320
Очень классно! Только почему колонки это устаревшая механика?
Весь контент расположен вдоль направляющих, так как сайты вытянутые и они являются для нас как бы маршрутами для изучения контента. Колонки я как бы тоже использую, но они не лежат в основе дизайна.
Сами колонки пришли из графического дизайна, а у нас тут веб и свои правила.
Потому что колонки придумали дизайнеры из Твиттера, много лет назад и на данный момент они сами от колонок отошли, это видно по новому дизайну соц. сети
@@radjivbriya5417 больше я думаю это из графического дизайна пришло, но твиттер тоже повлиял на это
Евгений, Вы сказали, что те, кто сейчас купил Middle+ получает еще и навык в иллюстрации, если я купил 11 ноября, ко мне же тоже относится? И в каком разделе это будет, Сайты про? Спасибо большое, я сейчас на спринте лендинга и за 3 недели плодотворной работы чувствую, как во мне начала появляться структурность и понимание этапов разработки с точки зрения логики сайта, Спасибо за Вашу работу!
Привет! очень рад)
Никому не говори, по большому секрету: у тебя тоже будут все обновления и бонусы)
Женя, подскажи пожалуйста чем ты руководствуешься когда задаешь направляющие? 3 колонки у тебя будет или две или 4 и тд. Это зависит от задумки (сначала родился концепт и под него строишь сетку) или наооброт
Никак не могу с этим разобраться.
Привет! Я руководствуюсь тем, чтобы максимально подобрать комфортную систему для расположения всего контента на сайте. И перед тем как показать вам этот вариант, я прорабатываю большое количество других вариантов)
@@UPROCK Спасибо за ответы🙏🏼
Дальтонический привет))
Взаимно☺️
очень было бы круто собрать этот дизайн в прототипе и прикрепить к какому-то useberry и соответсвенно скинуть ЦА. Интересно будет посмотреть их поведение и тепловую карту.
Пока я немного скептически отношусь к такому виду дизайна. Пока он выглядит для меня не продающим - стильным, модным - да. Внушающий доверие, не знаю.
Но все это мое субьективное мнение, говорят Цифры.
Давай попробуем поэксперементировать. Ответь мне на два вопроса:
1. В моем макете контент более логично и понятнее структурирован?
2. Есть ли отражение визуального позиционирования и индивидуализация компании в моем дизайне?
@@UPROCK
1-да
2- не совсем уверен. Мало айдентики компании, но это наверное больше вопрос к компании. Если вы уберете логотип то да я пойму что компания занимается разработкой ПО, но что именно это за компания навряд ли - скорее очередная компания.
Вопрос в принципе не к вашей работе данной, а ко всему тренду который сейчас мы можем наблюдать. Широкая типографика, минимум контента.
Мало CTA, интересно просто как все это влияет на цифры.
Если что я без Хейта, а скорее с точки зрения исследования
@@k09t1 да ты все очень корректно.
Самое главное ты ответил на первый вопрос, что стало удобнее и понятнее. Не это ли является основным ответом стало ли лучше?
И тренды создаются только на запрос пользователя, чтобы все стало комфортнее для них.
CTA мало потому что на таком сайте это не нужно, на других лендингах в моих редизайнах их больше. Все определяет контекст.
По эмоциям, все же этот сайт зафиксируется в памяти, ну и по хорошему надо всю айдентику в таком стиле сделать, тогда будет полное соотношение с компанией.
Евгений, здравствуйте. Только сейчас пришла мысль в голову о том что в блоке с шагами работы можно было бы кнопку "оставить заявку" поместить вместо пункта номер 8 раз как раз там проходит силовая линия, а один из шагов сместить в правую часть. Что думаете?
Привет! На своём дизайне ты можешь использовать решения, которые считаешь правильными, я для себя поставил в конце, как последовательное и логичное завершение всех шагов)
Огонь!
Спасибо!
Где глянуть сайты вживую
которые вы сделали?
Привет! Можно посмотреть портфолио студии www.agency.uprock.ru/#projects
Иллюстрация обалденная! Если не секрет, ее рисовал веб-дизайнер или именно иллюстратор?)
на стоках такого типа иллюстраций много, обычно из нескольких можно собрать что-то подходящее
Конкретно эту рисовал иллюстратор, но в ближайшее время для тех, кто купил пакет middle+ у нас появится бесплатный курс, в котором мы будем учить делать такие иллюстрации веб-дизайнеров)
@getcasher с одной стороны да, но с другой стороны нужен хороший вкус и умение рисовать самому чтобы собрать что-то достойное
@@UPROCK жаль я в свое время купил все курсы по отдельности, а не пакетом 😅
Снимаю шляпу)
Взаимно)
Привет, Жень. Есть одна вещь, которая мне не даёт покоя. Я, занимаясь в твоей школе, обнаружил интересную закономерность: структура используемого вашей студией стиля предоставляет практически все возможные варианты, которые только можно использовать при конструировании дизайна сайта. Вы целенаправленно проводили исследования, которые привели к созданию этого альманаха стилей? В частности структура примеров хедеров встречается практически без изменений во всех без исключения работах, которые я только видел на дрибле или бихансе. Ну ладно, с исключением в виде совсем уж концептуальных сайтов.
Привет! Да, так и есть - стиль дизайна Uprock это по сути результат большого анализа всего, что есть на рынке, всех рабочих решений. Молодец, что проанализировал, не все готовы искать закономерности в куче UI-китов) Всё равно нужно понимать, количество блоков ограничено, а вот их комбинации и варианты коррекции правил под разные ситуации - почти бесконечны.
@@UPROCK По сути ведь получается, что ты и твоя команда БУКВАЛЬНО продаёте самый удобный курс по UX/UI Дизайну, который применим везде. Вопрос: почему идиоты из госуслуг спонсируют не тебя, а мразотные скиллбоксы?
@@vsssss1089 думаю у меня не достаточно известности, как у скилбокса. Но я не стремлюсь за этим. Если у нас увеличится внезапно количество студентов в 2 раза, то качество резко упадет. Я предпочту лучше более равномерный спокойный рост.
7:55 ЗЕЛЁНЫЙ? Я ДУМАЛ ЕДКО-ЖЕЛТЫЙ АХАХА
я потом увидел сноску😢
Да-да, именно поэтому она там и размещена😉
@@UPROCK гений
Женя ты крутой, но почему сайт этого проекта до сих пор старый?
Салют! Это заказ одного из моих студентов, мы берём на редизайн заказы к которым наши студенты имели прямое или косвенное отношение. Либо он до курса делал этот сайт, либо кто-то из его колег, сейчас не могу точно сказать
Лайк!
И тебе тоже сердечко!
А есть этот сайт свёрстанный? Где его увидеть?
Привет! Сверстанного нет, так как это был заказ одного из наших студентов, мы хотели показать как мог бы выглядеть проект, к которому он имел отношение. Для этого у нас есть воображение - чтобы представить как он будет выглядеть сверстанным)
Очень классно получилось !!!
Женя, а не считаешь ли что у тебя проекты становятся однообразными ?
Она проявляется в больших шрифтах и заголовках, разбросанным описаниям и сетка уже одинаковая в большинстве работах
Я не негативлю, просто хочу узнать твое мнение об этом ))
Если взять большинство сайтов то там тоже все одинаково, меняются только цвета и контент, и ничего жили с этим десятки лет) приложения тоже по факту своему все похожие меняется расположение элементов и цвета
Добро пожаловать в реальность) Мой стиль - это только отражение запроса пользователя и актуальных трендов. Завтра у нас появится третий глаз, и я изучу, как по новому пользователи изучают контент и скорректирую стиль под них.
Вообще если посмотришь все современный сайты то увидишь общие закономерности с моим стилем.
@@kuptsov_design я знаю что все похожи, но Женя всегда был на пару шагов впереди от трендов и всегда придумывал что-то новое вот и спросил )
Спасибо, буду ждать )
@@ЭльдарРахимов-щ1р ну честно мои сайты все равно на голову выше, чем то что можно встретить в интернете. Но я не ухожу в совсем в фестивальные сайты, так как уважаю пользователей и это накладывает некоторые ограничения. В любом случае, если пользоваться моими интерфейсами есть ощущение новизны и оригинальности. Просто они не бьют в пах своей оригинальностью)
подскажите, пожалуйста, как называется шрифт, который здесь в заголовках используется?
PP Neue Montreal
@@dmitryom спасибо!
Спасибо, что помогли!
Cool
tnx)
6:18 Так нельзя делать нигде - ни в вебе, ни в печати. Это не «прием из ворда», это ошибка всех любителей и начинающих дизайнеров, которые ничего не знают про переносы и инструменты борьбы с дырами в тексте - изменение расстояния между словами, буквами, а также небольшое растягивание глифов по горизонтали. Я уже не первый раз вижу такой «графический прием», который впитывают новички и, к сожалению, считают, что именно так выглядит выравнивание по ширине. Если прием «красная строка» можно применить в вебе как графический прием и это будет выглядеть вполне красиво, то делать «дырявые» текстовые блоки - это неправильно, т.к. это воспитывает шрифтовое бескультурье. Типографика, как ни крути, имеет свои правила и законы, связанные с эстетикой и удобочитаемостью, любой хороший дизайнер должен их знать, прежде чем попытаться нарушить.
А мне так можно делать) Я люблю немного делать так как нельзя другим. Потому что я лучше всех))) Шучу)
Все эти правила о которых ты озвучил - это не законы физики, их обдуманно можно и нужно иногда нарушать, если это идет на пользу.
Единственные правила, которые нельзя нарушать - это паттерны сканирования и потребления контента пользователями.
И как сказал в видео, ты свободен применять или отказываться от моих решений. Все в твоих руках, а на своих макетах позволь мне решать, как правильно)
@@UPROCK Решать тебе, безусловно. Я говорил о том, что конкретно такой неправильный способ верстки начинающие дизы переносят в печать и решают, что это стандарт. В печати помимо паттернов сканирования еще нужно следить за равномерным набором - параметром, который отвечает за удобочитаемость. Ну и эстетика, повторюсь тоже не последнее дело. Успехов, Женя, спасибо за клевые работы.
@@Vladimir-po8qe я думаю начинающим правильно научиться обще принятым стандартам, а потом уже пробывать эксперементировать. Ну как минимум я так учу)
Спасибо, за комментарий и что посмотрел мое видео)
Правильно или нет, решает каждый сам исходя из своего опыта и навыка.
@@МарияШафран-ч8й так и есть
А как такую 3D сделать?
Я учу этому на курсе school.uprock.ru/middle
а так в векторе нарисовать или сделать аналогичное что-то в Cinema 4D или Blender
«Ежедневные статьи по UX» - тут ссылка сломалась
Ты про эту ссылку? www.uprock.ru/all-articles
Если не та то напиши пришлю корректную)
А меню, кстати, сделано не по правилам руского письма, через запятую слова пишутся с маленькой буквы.
И это не единственное правило русского письма, которым можно пренебречь, чтобы сделать дизайн более функциональным и удобным😉
@@UPROCK Я что-то упускаю, наверное. Какой именно функциональностью обусловлена простановка запятых в меню вообще? Чтобы что? Но это бы ладно, вкусовщина, коли бы перечисления не начинались с Большой буквы, а так... Необходимости никакой, а выглядит безграмотно.
Опустить точку в заголовке, в крайнем случае удержать однобуквенный предлог до перевода строки, что-то больше ничего на ум не приходит, где можно поступиться с правилами.
а это реальный проект?
Это часть реального проекта одного из моих студентов, обратившегося за консультацией
Будем так же бомбить...
Именно... Рок-н-ролл🔥
А сама студия не в курсе да, что вы ей сделали редизайн?
Привет! Мы делаем редизайны проектов, которых так или иначе касались наши студенты: либо они делали их сами, либо их коллеги по работе. Самый главный бонус в том, что мы делаем любые коммерческие проекты со своими студентами, в ближайшее время об этом тоже выложим ролик)
Хороший зелёный сайт
Точно)
Висячие предлоги
))))
Классный дизайн.
Спасибо) рад, что зашло)
В начале мне кажется сразу видно зрительный F паттерн, что не так?)
Поверь, никто его не закладывал, паттерн это не про размещение контента в форме буквы F) Это скорее про движение слева направо по строке, возврат к основной оси, перемещение на уровень вниз, движение слева направо и так далее