Философия дизайна с Филипповой Софьей

Философия дизайна с Филипповой Софьей

@sofyafilippova
Изображение канала: Философия дизайна с Филипповой Софьей
2 475 подписчиков
77 постов
Посты
🔍 Горящий дом, тревожный красный и потерянный смысл. Разбираем баннер
Показываю фото с местности, так реально видят баннер, находясь на нужной полосе Попросила вас глянуть, что не так — собрали почти 30 комментариев. Спасибо за активность! Вот топ проблем: 🔵Цвет Все пишут про тревожный красный, «жжёт глаза» и ощущение пожара. 🔵Иллюстрация Дом выглядит как будто горит. Вместо природы и спокойствия, опасность и страх 🔵Непонятный смысл Что предлагают? Продажа? Аренда? Отдых? 🔵Мелкие шрифты Инфа не считывается, надпись «500 м» теряется. 🔵Выравнивание и сетка Много кто заметил косяки с отступами, пустоты и отсутствие логичной сетки. 〰️ Главная ошибка и вывод: Макет — это не просто красиво. Это должно работать в реальности. Проверять нужно не только композицию и типографику, а как это читается из машины, на скорости, за пару секунд. *️⃣Люди не разбираются в отступах, выравниваниях, шрифтах. Они видят образ. И если вместо посёлка показали пожар — сетка, аккуратность и стиль уже не спасут. То же самое — с сайтами. На макете всё может быть по сетке, красиво, эстетично и аккуратненько. Но если пользователь не понимает: — куда кликнуть, — где искать главное, — о чём вообще речь, то он просто закрывает вкладку. Дизайн — это не про красоту. Это про смысл, логику и восприятие в живых условиях. Именно поэтому всегда проверяем не только пиксели и отступы, но и реальный пользовательский сценарий. Потому что иначе — будет «Ясная Поляна» в огне. ________________ *️⃣Мои курсы: UX/UI-дизайн, Tilda, Карточки товара, Веб-дизайн, Work&Sell, Магазин уроков
Изображение поста
🔥Дизайнеры, срочный сбор. Что не так с баннером?
Попробуйте найти ошибки или спорные моменты в дизайне. Я скоро вернусь со своим разбором, а пока давайте порассуждаем в комментах ⬇️
Изображение поста
⚡ Делюсь сервисами для вдохновения и поиска референсов для сайтов
Чтобы всегда было, на что опереться, когда кажется, что «ничего не нравится». Сайты-сервисы с работами: 🔵lapa.ninja.com 🔵onepagelove.com 🔵land-book.com 🔵siteinspire.com 🔵minimal.gallery 🔵collectui.com 🔵mobbin.com 🔵cosmos.so 🔵curated.design 🔵webframe.xyz 🔵bentogrids.com Сайты с наградами: 🔵awwwards.com  🔵cssdesignawards.com 🔵madeontilda.ru 🔵csswinner.com 🔵webflow.com/made-in-webflow Классика: 🔵behance.net 🔵dprofile.ru 🔵dribbble.com 🔵pinterest.com #полезное ________________ *️⃣Мои курсы: UX/UI-дизайн, Tilda, Карточки товара, Веб-дизайн, Work&Sell, Магазин уроков
Изображение поста
🆕 Хочу запустить новую рубрику — создавать разные дизайн-элементы с помощью нейросетей и делиться с вами исходниками, чтобы вы могли использовать их в своих проектах.
Ну а что, доступ к нейросетям у меня есть, работать с ними я умею — грех не поделиться! 🔵Во-первых, как вам идея? Нужно ли вам это вообще или такого и так хватает в других источниках? 🔵Во-вторых, если идея заходит, что бы вам хотелось видеть в первую очередь? Какие элементы? Может, 3дшки всякие - надутые, стеклянные, меховые, или персонажи для сайтов и соц сетей? *️⃣Хочется, чтобы эта рубрика была максимально полезной, так что пишите запросы!
Изображение поста
⚡У нас пошел первый пул защит на третьем потоке!
В это воскресенье девчонки показали свои работы и успешно защитили их. А уже в следующее воскресенье ждем защит. Кто-то будет защищать проекты в рамках тарифа «Максимум» с модулем «Портфолио», так что впереди классные кейсы. Скоро начну показывать! Вообще, защита — это не просто «показать сайт и уйти», это: 🔵умение аргументировать свой дизайн (чтобы не зависеть от мнения случайного прохожего в комментариях); 🔵 презентация себя — очень важный навык, если вы планируете продавать свои услуги, искать клиентов или устраиваться в студии; 🔵 возможность получить обратную связь не только от куратора, но и от меня; 🔵 ну и дополнительный баллы в нашей балльной системе, которую можно потом обменять на полезные штуки (а кто не любит бонусы?). *️⃣Если коротко, защита — это как генеральная репетиция перед реальными клиентами и hr. Лучше потренироваться в «теплой» атмосфере с нами, чем потом краснеть перед заказчиком. В общем, горжусь всеми, кто дошел до этого этапа. Если вдруг читаете и думаете: «А мне слабо?», — не слабо! Просто надо начать. *️⃣17 марта стартует 6 поток курса. Ещё можно успеть по старой цене, если ввести промокод «телега» 📎 https://uxui.filschool.ru/">https://uxui.filschool.ru #курс
Изображение поста
🔥Собрала дайджест полезных постов с января, чтобы вам было проще их найти.
Если уже видели — напишите, какой оказался самым полезным. А ещё круто, что за два месяца нас стало на 500 человек больше 🔵https://t.me/sofyafilippova/558">https://t.me/sofyafilippova/558 - почему нет клиентов? Ошибки, которые делают почти все новички 🔵https://t.me/sofyafilippova/561">https://t.me/sofyafilippova/561 - как придумать проект для портфолио без клиента 🔵https://t.me/sofyafilippova/562">https://t.me/sofyafilippova/562 - большое практическое видео с лендингом для новичков 🔵https://t.me/sofyafilippova/563">https://t.me/sofyafilippova/563 - типичные ошибки новичков в дизайне 🔵https://t.me/sofyafilippova/572">https://t.me/sofyafilippova/572 - виды композиции в блоках сайтов 🔵https://t.me/sofyafilippova/582">https://t.me/sofyafilippova/582 - как выбрать композицию для блока 🔵https://t.me/sofyafilippova/584">https://t.me/sofyafilippova/584 - плагины для работы с иконками 🔵https://t.me/sofyafilippova/585">https://t.me/sofyafilippova/585 - подборка шрифтов 🔵https://t.me/sofyafilippova/591">https://t.me/sofyafilippova/591 - туториал буквы из травы в Figma 🔵https://t.me/sofyafilippova/593">https://t.me/sofyafilippova/593 - контраст в дизайне: как делать акценты правильно 🔵https://t.me/sofyafilippova/602">https://t.me/sofyafilippova/602 - подборка шрифтов 🔵https://t.me/sofyafilippova/612">https://t.me/sofyafilippova/612 - как я делаю котиков для своих постов 🔵https://t.me/sofyafilippova/614">https://t.me/sofyafilippova/614 - нейро-фотосток *️⃣И не забывайте, что 17 марта стартует 6 поток курса UX/UI-дизайн. Сегодня ещё можно успеть записаться по старой цене, завтра повышение 📎 https://uxui.filschool.ru/">https://uxui.filschool.ru #полезное
Изображение поста
🆕 Как начать в дизайне и не слиться через неделю
Много новичков приходят с мыслью «хочу в дизайн, но не знаю, с чего начать». Если это про вас, вот чек-лист для первых шагов — без перегруза, только самое важное. 🔵Определитесь с направлением Дизайн — это не только красивые картинки. Есть UX/UI-дизайн, веб-дизайн, графический дизайн. Они похожи, но задачи и подходы разные. Чтобы выбрать, почитайте, посмотрите видео, попробуйте разные инструменты. 🔵Вам нужна система Если хаотично смотреть уроки, читать статьи и пробовать что-то делать, легко запутаться. Нужен чёткий план обучения. Так вы не будете теряться и всегда будете понимать, какой следующий шаг. 🔵Освойте базовые инструменты Figma — основная программа для UX/UI и веб-дизайна. Не лезьте сразу в сложные фишки. Откройте интерфейс, попробуйте повторить простой макет, разберитесь с инструментами 🔵Начните практиковаться Теория без практики — просто шум. Начните с простого: попробуйте сделать баннер, карточку товара, повторить чужой макет. Чтобы не искать всё по крупицам, я собрала для вас подборку видеоуроков. Ссылки оставлю в комментариях. Если хотите начать уже сейчас, просто откройте видео и повторяйте. 🔵Окружите себя дизайном Подпишитесь на дизайн-каналы, следите за работами профессионалов, пробуйте туториалы. Чем больше смотрите и пробуете, тем быстрее растёте. 🔵Учиться самому можно, но сложно Это правда. Ученики часто приходят на курс после попыток разобраться в одиночку и говорят одно и то же: слишком много разрозненной информации, нет системы, нет поддержки, мотивация падает. Что даёт мой курс по UX/UI-дизайну: 🔵Пошаговая система обучения — от базовых инструментов до полноценного кейса в портфолио. 🔵Разборы работ и поддержка кураторов — вам укажут на ошибки и помогут их исправить. 🔵Много практики — не просто лекции, а реальные проекты. 🔵Интерактивы со мной — возможность разобрать ошибки и задать вопросы напрямую. Старт 17 марта *️⃣Повышение цен послезавтра Записывайте, если хотите быстрее освоить UX/UI-дизайн и не разбираться во всём в одиночку. https://uxui.filschool.ru/">https://uxui.filschool.ru/ По хэштегу #курс можно почитать отзывы, посмотреть работы учеников и узнать больше о курсе.
Изображение поста
🌱 Весенние скидки на курсы! С 7 по 10 марта 🌱
Делаем -25% на три курса, чтобы весна началась с апгрейда навыков! Figma x Tilda - создание сайтов на Tilda 9 900₽ → 7 500₽ (тариф без поддержки) 19 900₽ → 15 000₽ (тариф с поддержкой) Карточки товара - быстро освоите создание карточек для маркетплейсов 4 900₽ → 4 000₽ (без поддержки) 14 900₽ → 10 000₽ (с поддержкой) Work&Sell - курс по работе и поиску клиентов 10 000₽ → 7 500₽ (без поддержки) 20 000₽ → 15 000₽ (с поддержкой) *️⃣Дизайноведение в скидках не участвует — скоро анонс обновления и индивидуальные предложения Промокод: ВЕСНА Действует с 7 по 10 марта включительно. Если планировали обучение, самое время воспользоваться скидками 🔥 Промокод вводится на странице выбора способа оплаты. Над стоимостью курса нажмите на синий текст "Знаете промокод?"
Изображение поста
⚡Плагин для быстрой анимации
Animate It — плагин, который упрощает работу с анимацией. Можно сразу посмотреть, как всё будет выглядеть, без лишних тестов. Варианты стандартные, но этого хватает, чтобы ускорить процесс. Если делаете анимации в проектах — попробуйте, штука реально удобная Установить плагин #полезное #плагины
🔥Кейс Ксении: проработка деталей и сильный визуал
Сегодня хочу поделиться кейсом Ксении, ученицы второго потока. Она разработала проект для женской спортивной студии, уделив внимание не только дизайну, но и глубокой проработке структуры, аналитики и визуальной айдентики. Отзыв Ксении - https://t.me/sofyafilippova/437">https://t.me/sofyafilippova/437 Этот кейс — отличный пример того, как можно выйти за рамки стандартного макета. Ксюша детально проработала не только сам сайт, но и сопутствующие элементы бренда: пропуски, сумки, плакаты. Благодаря этому проект выглядит цельным и продуманным. В процессе работы у Ксюши возникали вопросы, и мы вместе искали решения. Иногда нужно просто немного взгляда со стороны, чтобы сдвинуться с мёртвой точки. Для меня важно быть рядом с учениками, помогать разобраться в сложных моментах и поддерживать их на каждом этапе. Посмотреть проект *️⃣17 марта стартует 6 поток курса. До 10 марта ещё можно успеть по старой цене 📎 https://uxui.filschool.ru/">https://uxui.filschool.ru #курс
Изображение поста
Как я делаю своих котов? 🐱
Меня в комментариях часто спрашивают, как я создаю котов для своих дизайн-постов. Я уже давно записала рилс, выложила его в Инстаграм… и забыла поделиться с вами здесь. Так что исправляюсь и, наконец, делюсь! Если останутся вопросы — пишите в комментариях
🚀 Кейс Анастасии: как важно довести проект до финала
Хочу поделиться работой Анастасии — выпускницы первого потока курса. Она прошла все этапы: от анализа продукта, проектирования и концепции до детальной проработки UI-кита и финального кейса. Здесь ее отзыв - https://t.me/sofyafilippova/361">https://t.me/sofyafilippova/361 Сроки были сжатые, и у неё было ещё много идей, которые хотелось воплотить. Но вместо бесконечного улучшения Анастасия сосредоточилась на главном — закончить работу так, чтобы она решала задачу и выглядела цельно. В её кейсе есть анализ, проработанный UI-кит и сильная визуальная часть. Полный кейс 🔥А если хотите прокачаться в дизайне, 16 марта стартует 6 поток курса. До 10 марта ещё можно успеть по старой цене 📎 https://uxui.filschool.ru/">https://uxui.filschool.ru #курс
Изображение поста
⚡Открыли запись на 6 поток
В анонсе рассказываю про курс и конечно о розыгрыше бесплатного места Все важные посты о курсе собрала здесь 📎 Записаться на курс можно по ссылке - uxui.filschool.ru Для вопросов и рассрочек напишите нашему менеджеру @filschool_telegram ⠀ ⠀ 📱Смотреть на YouTube 📱Смотреть в VK Видео
Изображение поста
🔥Как перестать улучшать свою работу и выложить её в портфолио?
Вот эта валентинка ключ к тому, как научиться отпускать работу, даже если до идеала далеко. Исправляешь мелкие недочёты, думаешь: «Ещё чуть-чуть». Смотришь на чужие работы — и переделываешь снова, но идеала всё нет. Что делаю я в таких случаях: ⚫️Ограничиваю количество правок Ставлю себе правило: три итерации — и стоп. Если после трёх кругов хочется что-то менять, это уже не объективное улучшение, а бесконечное ковыряние. Всё, я делаю выводы и завершаю. ⚫️Ставлю дедлайн на публикацию Не на работу, а на публикацию. Например, «выложить в пятницу в 14:00». И точка. Чем больше откладываю, тем меньше шанс, что работа вообще выйдет в портфолио. ⚫️Запрещаю себе смотреть чужие работы перед публикацией Никаких Dribbble и Behance. Это ловушка, которая только усиливает неуверенность. ⚫️Ловлю себя на слове Если в начале работа мне нравится, а потом вдруг хочу что-то переделать, спрашиваю: «Я переделываю, потому что стало хуже или потому что боюсь выложить?» ⚫️Не откладываю публикацию Если работа готова, я её публикую. Не даю себе «недельку» или «месяцочек». Чем больше откладываю, тем меньше шансов, что работа вообще выйдет. Так что, дорогие мои, помните: Идеально не будет, выкладывайте! Работа завершена, вы хотя бы немного довольны результатом, всё, публикуйте. Идеал — это миф, всегда можно найти, что улучшить
🆕 Новый плагин с крутым эффектом блюра
Он делает интересный эффект, который я использовала для текста Плагин Progressive Blur
Изображение поста
🔥Туториал - буквы из травы в Figma
Я подготовила для вас пошаговый разбор, как создать крутой эффект “травяных” букв. Eсли у вас получится что-то интересное, обязательно делитесь результатами в комментариях А я прикладываю кисть в комменты, которые помогут вам сделать этот эффект 📱 Смотреть на Youtube 📱 Смотреть в VK Video #ютуб
Изображение поста
*️⃣Многие просили посты про портфолио. Поделюсь тем, что у меня уже вышло, а вы отпишитесь что еще вам интересно
В рамках Адвент календаря выходило видео о том, как сделать портфолио, которое привлечёт работодателей и клиентов. Там есть презентация из видео и пример кейса. https://t.me/sofyafilippova/510">https://t.me/sofyafilippova/510 *️⃣В вакансиях указано требование "базовое знание html, css". На что конкретно здесь нужно обращать внимание? Вам не нужно быть верстальщиком, но знание основ поможет создавать более адекватные дизайны и находить общий язык с разработчиками. Это про лучшее понимание процесса, а не про кодинг с нуля. 🔵 Понимание, что такое HTML (структура страницы) и CSS (стилизация элементов). 🔵 Разница между фронтенд-разработкой (визуальная часть сайта) и бэкендом (логика, данные). 🔵 Адаптивность: как дизайн подстраивается под экраны. 🔵 Понимание терминов и процессов помогает проще работать с разработчиками. *️⃣Как выбрать стиль, в котором будешь делать заказ? Начните с анализа целевой аудитории и тематики проекта. Подумайте, что нравится вашей аудитории: молодые люди оценят креатив и нестандартные решения, а для корпоративного сектора важны сдержанность и структура. Обратите внимание и на тематику сайта. Например, детский проект лучше не делать в минимализме — добавьте больше «веселья» и яркости, чтобы на фоне конкурентов сайт не выглядел пустым и безликим. Если речь о магазине современной одежды, то отлично подойдёт швейцарский стиль, минимализм или даже необрутализм — всё зависит от того, что подходит к настроению и продуктам бренда. Я снимала подробное видео о стилях — https://t.me/sofyafilippova/507 *️⃣Как подготовить дизайн к вëрстке и что важно учесть дизайнеру, чтобы его дизайн потом сверстали? Все просто, если держать под рукой мой гайд - https://t.me/sofyafilippova/511
Изображение поста
🚀 Полезные плагины для работы с иконками. Делюсь своими фаворитами, которые помогают с иконками
🔵 Iconify — плагин для поиска иконок в формате SVG. Его фишка в том, что в фильтрах можно выбрать тип лицензии "без указания автора". Это редкость среди плагинов 🔵 Quick Tracing — если у вас есть PNG-иконка, но нужна векторная, этот плагин может её преобразовать. Но будьте готовы к тому, что иногда случаются косяки — контуры могут быть не идеальными 🔵 Filler — идеально, если нужно перекрасить PNG-иконку. С помощью маски он закрашивает её в любой цвет, и всё выглядит аккуратно. 🔥 Если у вас есть свои находки для работы с иконками, делитесь в комментариях и ставьте реакции, если больше делиться с вами плагинами #полезное #плагины
Изображение поста
Как выбрать композицию?
Если выбрать правильный тип, блок выглядит красиво, логично и выполняет свою задачу. 1. Симметричная композиция Всё чётко и ровно: элементы расположены симметрично друг относительно друга. Это вариант для серьёзных, структурированных блоков. Подходит для: ⚫Корпоративных сайтов. ⚫Первых экранов лендингов с серьёзными темами. 2. Асимметричная композиция Части блока разного размера, чтобы создать акцент и добавить динамики. Выбирай этот вариант, если нужно что-то выделить. Применяй в: ⚫Креативных проектах. ⚫Блоках, где важен акцент на ключевом элементе (тексте или кнопке). 3. Сеточная композиция Блок делится на невидимые колонки, чтобы элементы были выровнены и выглядели аккуратно. Это лучший выбор для: ⚫Блоков с большим количеством контента. ⚫Каталога товаров. 4. Центрированная композиция Все элементы расположены по центру, чтобы акцентировать внимание на ключевом посыле. Это работает для: ⚫Промо-блоков ⚫Лендингов с простой, но яркой подачей. 5. Диагональная композиция Элементы расположены так, чтобы направить взгляд по диагонали. Такой вариант добавляет движения и делает блок необычным. Используй для: ⚫Динамичных дизайнов. ⚫Проектов с сильным визуалом. Советы: ⚫Для строгих блоков — симметрия. ⚫Для акцентов — асимметрия. ⚫Для больших объёмов контента — сетка. ⚫Для акцентных или промо-блоков — центрирование. ⚫Для динамики — диагональ. *️⃣Вы там дайте знать, что это вам интересно #полезное
Изображение поста
UX-ошибка, которая бесит 😞
Хочешь организовать день рождения ребёнка и посмотреть цены с телефона — Тарифы спрятаны в выпадающем списке. — Выбрал — описание появляется внизу. Хочешь другой — снова наверх. Как надо было: 🔵Сделать свайпы между тарифами. 🔵Или показать все тарифы сразу внизу.