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

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

@sofyafilippova
Изображение канала: Философия дизайна с Филипповой Софьей
2475 подписчикoв
16 постов
Посты
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
11 ч.
@sofyafilippova
➡️ НАВИГАЦИЯ ПО КАНАЛУ Навигация по хештегам: ⚫ – посты с моими личными рекомендациями ⚫ – моя база проверенных шрифтов, которыми я делюсь с вами. Все они с бесплатной лицензией ⚫ – события, которые происходят в мире дизайна ⚫ – здесь все, от трендов и подборок, до анонсов моих полезных роликов на ютуб ⚫ - для постов, я делиюсь своим мнением о сайтах и интерфейсах: что понравилось, что можно улучшить. ⚫ - подборки инструментов, сервисов для дизайнеров ⚫ - отдельный хештег для книжных рекомендаций ⚫ - здесь я собираю классные плагины для Figma ⚫ - анонсы видео на моем YouTube-канале ⚫ – информация о всех курсах и анонсы новых потоков ⚫ – хештег для рассказа обо мне и моей жизни вне работы ⠀ Мои социальные сети и проекты: ⚫ instagram.com/sofyafilippovayoutube.com/@sofyafilippovavk.com/sofyafilippova_vk 📎 Записаться на курсы по дизайну - filschool.ru
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Гайды
1 д.
@sofyafilippova
⚡Открыли запись на 5 поток В анонсе рассказываю про курс, новые условия тарифов и конечно о розыгрыше бесплатного места 📎 Записаться на курс можно по ссылке - uxui.filschool.ru Для вопросов и рассрочек напишите нашему менеджеру @filschool_telegram ⠀ ⠀ 📱Смотреть на YouTube 📱Смотреть в VK Видео
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Гайды
2 д.
@sofyafilippova
🔥 Выпускная работа Ани @cold_ann — выпускница первого потока, и её кейс — это тот случай, когда проделанная работа впечатляет. Её проект — это не просто макет, а полноценный проект, выполненный по всем этапам. Бриф, анализ целевой аудитории, cjm, персоны, навигационная карта, варфреймы, мудборд, визуальные концепции, дизайн, ui-kit, подготовка к разработке — всё проработано до мельчайших деталей. И это принесло Ане практически максимальный балл на защите. Особенно трогает история проекта: он выполнен для её мамы. Мама активно участвовала в процессе, давая свои комментарии и правки. Это уже настоящая практика работы с реальным клиентом Делюсь ссылкой на кейс — загляните, оцените и, если работа вам понравится, поддержите Аню лайком или комментарием. Уверена, ей будет очень приятно! 🆕 Cтарт пятого потока 13 января. До 2 декабря стоимость курса прежняя, так что успевайте забронировать место. 📎 https://uxui.filschool.ru/">https://uxui.filschool.ru
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
3 д.
@sofyafilippova
Вы дождались! Я сняла несколько видео на ютуб, ну и на вк. Пока коротыши для разгона. Сценарии для больших видео написаны и ждут своего часа. 📱 Смотреть на YouTube 📱 Смотреть в VK видео Приятного просмотра!
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
4 д.
@sofyafilippova
🆕 Разбор сайта На интерактиве с учениками третьего потока мы впервые попробовали разобрать сайты в прямом эфире. Идея такого формата пришла от второго потока, а сайт «Бобёр» прислала @elis_great с третьего. Этот сайт стал настоящим примером хорошего UX. Что я для себя отметила: ⚫ Иконки в меню Когда открываешь категории продуктов, видишь минималистичные иллюстрации вместо фотографий. Это сразу помогает понять, что перед тобой. Очень удобно, когда названия не говорят о сути продукта. И выглядит эстетично, фотографии выглядели бы хуже. ⚫ Карточки товаров Ховер-эффекты сами по себе классные, но есть нюансы. В каталоге продуктов при наведении карточка меняет цвет и увеличивается изображение, а в разделе аксессуаров смена цвета отсутствует. Ховеры должны быть одинаковыми для единства. Само увеличение объекта чрезмерное, мешает просмотру. Я бы сделала его менее динамичным. Выбор цвета лучше сделать на наведении, а не на клике. ⚫ Страница продукта Детализация здесь просто на высоте! Всё, что нужно для принятия решения: подробное описание, характеристики, примеры использования. А ещё можно добавить индивидуальную гравировку с визуализацией текста прямо на термосе. Единственное, что хотелось бы исправить, — текст в кнопке плохо выровнен. ⚫ Апсейлы Раздел с рецептами — просто кайф. В каждом рецепте указано, какой термос использовался. Это отличный пример ненавязчивой, но эффективной продажи. Мы не только видим рецепт и красивую подачу, но ещё получаем визуальную привязку к продукту. ⚫ Корзина Добавляешь товар, и корзина появляется сбоку. Но главное — наводишь на иконку корзины в хедере, и сразу видишь её содержимое. Это позволяет быстро проверить, что ты туда положил, не уходя со страницы. Это пример отличного юзабилити. Сайт минималистичный, с фокусом на продукте, без лишнего визуального шума. Есть небольшие недочёты, но в целом это отличный пример, как можно сделать интернет-магазин функциональным и визуально привлекательным А что скажете вы? Заметили ещё что-то интересное?
Video is not supported
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
15 д.
@sofyafilippova
😂 Не иди в дизайн, пока не сделаешь это... Очень часто встречаю людей, которые хотят записаться на курс, но как будто спонтанно: увидели пост и решили — а почему бы и нет? Иногда такие импульсивные решения действительно приводят к крутым результатам. Но больше я радуюсь, когда ученики пишут, что долго думали, пробовали, выбирали и наконец-то решили, что дизайн — это их. *️⃣ Как подойти в выбору рационально: Шаг 1. Определитесь с направлением Первое, с чего стоит начать, — это хотя бы понять, какую сферу вам хочется изучить. Если просто хотите «в IT», то изучите направления. В IT их масса: дизайн, разработка, менеджмент, аналитика и ещё куча всего. Подумайте, что действительно привлекает. Можете даже списочек составить, чтобы было проще видеть картину целиком. Шаг 2. Узнайте о профессиях внутри этой сферы Скажем, решили вы, что вам нравится дизайн. Окей, идём дальше — что именно? К нам часто приходят ребята, которые мечутся между графическим дизайном, UX/UI-дизайном и веб-дизайном. Важно понимать, что это абсолютно разные области. Да, на первый взгляд они могут казаться похожими, но по факту — это три отдельные профессии, и навыки там требуются совершенно разные. Погуглите, почитайте описания, посмотрите пару видео, где разбирают особенности каждой профессии. Шаг 3. Пробуйте практиковаться Вот тут без вариантов: никакая теория не даст понимания, что вам подходит, пока вы не попробуете. Если задумались о веб-дизайне, например, у меня есть куча видео на канале: и про профессию, и про плюсы-минусы, практические уроки для новичков. Чтобы попробовать на себе, что это такое и каково это — быть веб-дизайнером. Потому что без пробы пера ничего не получится. Шаг 4. Изучите профессию подробно Если после практики поняли, что нравится, углубитесь в тему. Разберитесь, кто такие UX/UI-дизайнеры, что они делают, где работают и как зарабатывают. И главное - не стоит идти на курс, не разобравшись, что это за профессия и что вас там ждёт.
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
23 д.
@sofyafilippova
🆕 Пополняю вашу копилку сервисов Mobbin — это сайт, который помогает находить реальные функциональные референсы для приложений и сайтов. Что там есть: ⚫Приложения для iOS и Android с детальной демонстрацией интерфейсов. ⚫Сайты со сложными интерфейсами. ⚫ Конкретные страницы и UI-элементы - карточки продуктов, аккордеоны, формы, таблицы, чекбоксы и еще куча всего. ⚫ Конкретные сценарии (Flow), которые показывают ключевые действия - регистрация, оплата, добавление в корзину и т. д. Я люблю Mobbin, потому что он решает одну из главных UX-проблем. В прошлых постах я уже говорила, что многие референсы с Pinterest — это скорее красивые картинки для портфолио, чем функциональные решения для интерфейсов. А чтобы найти референсы, которые реально работают, приходится проходить сценарии, делать скриншоты и сохранять результаты. Mobbin отчасти сделал это за нас. Да, там нет русскоязычных сервисов, но даже в таком виде — это суперудобный и полезный инструмент, с базой реальных решений. Долгое время я оплачивала подписку на Mobbin иностранной картой и использовала его через VPN. Но оказывается, есть зеркало — Mobbin.ru. Это полная копия, которая работает без VPN и позволяет оплачивать подписку российской картой. Идеально подходит тем, кто ищет реальные UX/UI-решения, а не только стилистические референсы с Pinterest.
Video is not supported
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
24 д.
@sofyafilippova
Недавно у нас с учениками был интерактив, и я подумала: «Хотела как лучше, а получилось как всегда». Хотя на первый взгляд всё было идеально: интерактив, где мы смотрим итоговые задания по модулю UI, ученики присылают свои работы, а я даю обратную связь в реальном времени. Мы разбираем проекты, обсуждаем, что можно улучшить, а одногруппники видят работы друг друга. Но вот в чём загвоздка: к концу практически каждый ученик сказал одно и то же — «У ребят такие классные работы, а у меня явно хуже». И так сказал почти каждый! Получается, если каждый думает, что у него хуже, то где тогда те самые «классные работы», о которых все говорят? Что за магия? Сравнение — это одна из самых больших ловушек для новичков. Когда ты только начинаешь, ты естественно смотришь на других и думаешь: «Ну у них-то точно всё лучше, чем у меня». И это может сильно подорвать уверенность. Интерактивы, на которых ребята видят работы друг друга, полезны, потому что они могут учиться друг у друга. Но именно это сравнение часто вводит их в ступор. Они забывают, что они — новички, и вместо того чтобы радоваться своему прогрессу, начинают видеть только свои недостатки. Это действительно проблема, с которой сталкиваются многие мои ученики. Здесь я всегда вспоминаю ту самую классическую фразу: «Не сравнивайте себя с другими, сравнивайте себя с собой вчерашним». И как бы банально это ни звучало, это работает! Если вчера у вас вообще не было никакой работы, то сегодняшняя уже на голову выше. Сам факт того, что ваша работа существует, — это уже победа. И вот в чём важный момент: сравнение может как мотивировать, так и разочаровывать. Всё зависит от того, как вы к этому относитесь. Да, видеть чужие работы полезно, но только если это помогает вам расти, а не тормозит. Что с этим делать? Сравнивайте себя с собой, отмечайте каждый шаг вперёд. Если вы сделали работу — это уже успех. Не ждите шедевров с первого раза, но обязательно цените сам факт прогресса. На этом этапе супер круто, если ваша работа на четвёрку. Но самое важное — это то, что вы вообще что-то сделали. Так что в следующий раз, когда вы увидите чью-то работу, вместо «Они сделали лучше меня» подумайте: «А что я могу сделать, чтобы в следующий раз быть лучше себя?» Потому что главная гонка — это гонка с самим собой, а не с другими.
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
29 д.
@sofyafilippova
Интересно, зачем Фигма сменила соотношение сторон в обложках проектов? Ну ладно, я всё равно собиралась их обновить…
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
30 д.
@sofyafilippova
⚡Как мелочи рушат интерфейс Заказываю продукты, ввела запрос «твёрдый сыр» и поперхнулась кофе, когда увидела ценник в 1000 рублей. Это за что? За этот небольшой кусочек?! На фото маленький брикетик, но цена, которую сразу бросает в глаза, указана за килограмм. Конечно, там где-то мелким шрифтом написали об этом, но давайте честно, когда видишь яркую цифру 1220 рублей и маленький кусок сыра возникает мысль: «Ого, это что, сыр с золотыми стружками?» Почему это проблема? Когда информация на картинке и в тексте расходится, пользователи начинают теряться. Это называется когнитивным несоответствием, и оно подрывает уверенность. Мозг автоматически связывает изображение товара с указанной рядом ценой, и если цена выглядит завышенной, то возникает «ценовой стресс». Пользователь начинает сомневаться: может быть, он что-то неправильно понял, или его пытаются обмануть? Всё это ведёт к снижению доверия. ⚫Что можно улучшить? Правило UX-дизайна: «Не заставляйте думать!» — здесь прямо просится к действию. Лучше сразу показывать стоимость за 300 грамм (если это минимальное количество), ведь это то, что на изображении. Это снижает тревожность и упрощает принятие решения. На моём курсе(http://uxui.filschool.ru/) в модуле UX у нас есть отдельный урок по разбору интерфейсов. «Лента» стабильно держится в топе «пациентов» на разбор. Так что если вам интересны подобные казусы, в уроках мы разбираем их детально и на примерах других сайтов.
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
33 д.
@sofyafilippova
Оказывается, все это время я использовала сайт Midjourney неправильно… Я заходила только для того, чтобы брать готовые референсы и смотреть чужие работы. Иногда даже находила там что-то прямо готовое для своих проектов. И вот до меня дошло, что там же можно генерировать изображения прямо на сайте Интерфейс, кстати, суперудобный — никаких больше этих команд типа /imagine и других фокусов с префиксами и референсами. Просто вводишь текст, крутишь ползунки, и вуаля — результат готов! Если вдруг вы такие же, как я, и упустили этот момент — вот, ловите подсказку. Теперь можно спокойно создавать картинки прямо на сайте Midjourney, и Discord можно даже не открывать
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
36 д.
@sofyafilippova
Если бы я начинала с нуля в дизайне, вот что бы я сделала: 1. Составила план изучения Без чёткого плана легко потеряться в информации и потерять мотивацию. Для этого можно начать с просмотра моего видео о пошаговом плане освоения веб-дизайна. Это не UX/UI-дизайн, но многое похоже. Вы сможете адаптировать этот план под себя и двигаться уверенно. 2. Начала с базового освоения Figma Не нужно сразу погружаться в глубокие дебри программы. Можно начать с простого: просто повторяйте за другими, чтобы освоить базовые действия. Это позволит вам быстрее понять суть программы, не теряя мотивацию. Вот ссылка на мой урок по Figma, где можно сразу начать практиковаться. 3. Училась постепенно Теория кажется простой, пока не начинаешь работать над реальным проектом. Начните с малого: вот мой урок по весенним баннерам, урок номер 2, урок номер 3. Попробуйте повторить, а потом создайте что-то своё. Маленькие шаги ведут к большим результатам — это проверено. 4. Искала бы обратную связь Когда только начинаешь, сложно понять, где вы на правильном пути, а где нужно улучшить. Часто кажется, что всё плохо или, наоборот, слишком хорошо. Но взгляд со стороны помогает быстрее расти и двигаться вперёд. 5. Не стеснялась бы задавать вопросы Часто страх показаться неопытным мешает задавать вопросы. Но это ловушка — ведь именно через вопросы приходит рост. Спрашивать — это нормально, особенно если есть кому ответить и помочь. 6. Практиковалась каждый день Даже 15 минут в день могут дать результат. Сделайте прототип главной страницы сайта или попробуйте создать любой блок сайта. Главное — не останавливаться. Маленькие шаги каждый день создадут большой прогресс. 7. Осваивала не только дизайн Помимо дизайна важно изучать основы верстки, ноу-код решения и анимации. Это помогает создавать более живые проекты. Также важно изучать маркетинг — это делает вас универсальным специалистом и помогает лучше понимать задачи клиентов. 8. Нашла наставника В начале пути мне очень не хватало человека, который мог бы указать на ошибки и направить. Наставник помогает избежать множества ошибок и быстрее достичь результата. И напоследок: не бойтесь начинать. Кажется, что ещё рано, что нужно больше знаний, но это всего лишь страх. Единственный способ узнать — это пробовать. Вы удивитесь, как много у вас получится, если сделаете первый шаг. *️⃣ 4 ноября стартует мой курс по UX/UI дизайну. Все вопросы мы разберём вместе, чтобы никакой головной боли. 21 октября стоимость повышается на 10 тысяч рублей. По хэштегу можно почитать отзывы, посмотреть работы учеников и узнать больше о курсе.
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
38 д.
@sofyafilippova
🔥 Это вам для подогрева интереса к практическому видео Сделала 17 вариантов первого экрана и ещё кучу удалила. Потратила все свои лимиты в Midjourney — придется докупать ещё генерации. ChatGPT опять приложил руку — помог взглянуть на дизайн со стороны и вытащил меня из тупика, когда я застряла на главном экране. Мораль? Хороший дизайн — это не волшебство и не случайный успех с первой попытки. Это десятки концепций и бесконечные правки, пока не найдёшь именно то, что нужно! Анимацию тоже покажу, но скорее всего в отдельном видео Как вам? Сколько у вас уходит вариантов на первый экран?
Video is not supported
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
39 д.
@sofyafilippova
😂 Пинтерест-референсы — это чаще всего просто мусор Большинство дизайнеров собирают "красивые" картинки, которые не имеют никакого отношения к реальной работе над интерфейсом. В итоге: эффектный портфолио — да, полезный продукт — нет. Градиенты, стеклянные кнопки, тени — всё это выглядит круто на дриббле, но когда дело доходит до реальных пользователей, вся эта красота начинает сбоить. Когда вы собираете только стилистические референсы, вы рискуете получить проект, который выглядит как одежда с модного показа — красиво, но непрактично для повседневной жизни. Без анализа функционала такие проекты превращаются в "стартер-пак" дизайнеров: набор стандартных решений, который все используют, но мало кто задумывается о том, хорошо ли они работают. Если внимательно изучить даже известные сайты, можно найти мелкие ошибки и упущения, которые легко пропустить без глубокого анализа. Функциональные референсы нужно искать в реальных проектах, которые действительно работают, и это сложная задача. На Pinterest, Dribbble и Behance таких проектов немного, потому что большинство — концепты. Вот почему важно анализировать настоящие сайты и приложения, даже те, которые вы лично не используете. Причем делать это нужно регулярно, а не только по ходу работы над проектом. Листаете Pinterest ради вдохновения? Отлично! Но не забывайте по пути собирать и примеры реальных решений, которые можно применить на практике. Кто-то может сказать: «Мы ведь анализируем конкурентов, так что и там можно найти функциональные референсы». Да, но проблема в том, что это только конкуренты. Крутые решения могут быть и за пределами вашей ниши. И что с этим делать? Во-первых, не забывайте собирать примеры реальных решений. Нашли хорошую идею, сделали запись экрана, скриншот сайта или приложения, сохранили. Вы можете хранить их в своем Telegram-канале или даже на том же Pinterest, если вам удобна эта платформа. Важно не только развивать насмотренность в стиле, но и понимать, как работают интерфейсы в реальных проектах. P.S. Я говорю только о дизайне интерфейсов. Если вы делаете лендинги, карточки товаров, оформляете соцсети или занимаетесь графическим дизайном, этот текст не для вас
Изображение поста
Изображение канала: Философия дизайна с Филипповой Софьей

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

Блоги
41 д.
@sofyafilippova
Поигралась нейросетью в Figma. Сразу скажу, это очень поверхностный пост, я буквально потыкала минут 30. Перевод текста на любой язык — класс, давно искала что-то подобное, а теперь встроено. Удаление фона пока сырое, работает грубовато, плагины и сервисы делают это лучше. Генерация картинок - промты понимает отлично, но качество пока не дотягивает до Midjourney, там результаты интереснее и проработаннее. Попробовала делать варфреймы и дизайн вышло что-то довольно шаблонное. Как и раньше говорила, что работа останется у тех, кто делает хороший дизайн, а не копипастит. Остальное пока не пробовала, чуть позже выделю на это время. В видео есть прикол с тем, как нейросеть видит Большого Будду. В первом дизайне мне понравился второй блок. Но, опять же, это часто встречается в бесплатных макетах от Figma Community. Кто что уже тестировал? Как вам?
Video is not supported
Изображение канала: Философия дизайна с Филипповой Софьей

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

Гайды
42 д.
@sofyafilippova
Делюсь новым видео с курса — это запись нашего второго интерактива с третьим потоком на модуле UX-дизайн. До этого я уже показывала приветственный созвон, его тоже можно глянуть по хештегу . Мне кажется, что увидеть "внутрянку", которая обычно остаётся за кадром, гораздо интереснее. Хотя кусочек с интерактива совсем небольшой, в конце вы услышите отзывы участников о курсе. Особенно полезно тем, кто ещё только думает идти на курс. Четвёртый поток стартует 4 ноября 📎 uxui.filschool.ru
Video is not supported