От интерьеров — к интерфейсам
Ольга Коробицына
23 года
Город:
Самара
Образование:
Колледж сервисных технологий и дизайна, дизайнер по отраслям
Место работы:
графический дизайнер в типографии
Курс Contented:
Профессия UX/UI-дизайнер с нуля до ПРО
Я с детства хотела заниматься дизайном, но не могла определиться с направлением. Поэтому поступила в колледж на дизайнера по отраслям. Это прикладная специальность, которая сочетает разные направления: мы изучали натюрморт, живопись, делали дизайн квартир в ArchiCAD. Для дипломной работы выбрала дизайн интерьера актового зала.
Дизайн актового зала — дипломная работа Оли в колледже
Во время учебы поняла, что мне гораздо интереснее графический дизайн, и записалась на курс к своему преподавателю из колледжа. Там изучила основные программы: Photoshop, Illustrator и InDesign.
Читайте также:
«Онлайн-школа изменила мою жизнь»: как учатся в Contented
В 2023 году задумалась о том, чтобы получить более актуальную и прибыльную профессию. Изучала вакансии, советовалась с родственниками и выбрала UX/UI. Поступила в онлайн-школу дизайна Contented. Поначалу было трудно, поскольку приходилось совмещать учебу с работой, но спустя два года наконец получила диплом.
Дизайн приложения, который Оля сделала на курсе Contented
Лендинг для Cafe Mimi: девчачий, но не розовый
Одна из причин, почему выбрала Contented, — это возможность пройти стажировку у крупных брендов. Во время первой делала лендинг для бренда Cafe Mimi.
Заказчику нужен был визуально чистый, но динамичный сайт, который презентует бренд, передает яркость и «вкус» продуктов. При этом хотелось избежать стереотипной розовой темы и оскорбительной дерзости на грани.
Референс к проекту
Мудборд, который составила Оля
Я изучила референсы и взяла за основу голубые и зеленые оттенки, они отлично подходят для молодежи — целевой аудитории бренда. Сделала блоки, которые просил заказчик:
— новинки;
— хиты продаж;
— каталог.
Понравилось, как получился главный экран: я добавила анимацию, чтобы товары крутились по кругу. Еще анимировала узор на фоне, фото и тексты.
Раздел с хитами продаж
Последними блоками довольна не до конца, потому что время было ограничено и не успела довести до ума. Еще расстроило, что мы просто отправили ссылку и не было возможности презентовать проект, показать, как он должен работать, — так решил сам партнер.
Фрагменты лендинга
Это был интересный, но трудный кейс, потому что я делала лендинг одна и могла рассчитывать только на свои силы. Зато научилась грамотно оценивать объем работы и пользоваться Figma.
В дизайне Cafe Mimi понравился свежий взгляд со стороны, однако было видно, что у студентов мало опыта для таких проектов. Однозначно стоит развивать насмотренность и, возможно, изначально закладывать более комфортные сроки.
Дарья, Chief Product Officer в Greencosmetics
Дизайн без папоротников для Ecolatier
Вторым проектом во время стажировки был лендинг для бренда Ecolatier. Мы делали его в команде, и это было гораздо легче, чем работать одной.
У бренда был дизайн упаковки, который не совсем подходит сайту, поэтому его хотели переделать. Главное пожелание заказчика — избегать полей с подорожником, изобилия папоротников и других аналогичных ассоциаций, потому что идея бренда должна строиться вокруг научности, экологичности и эстетики.
Референс к проекту
Материалы от партнера
Для главного экрана выбрали космический фон и добавили летящие звезды. Анимацию лого делала в Adobe After Effects — программа тяжелая и часто вылетает, поэтому работа заняла два дня, но результат очень порадовал. При скролле лого превращается в текст: «Погрузись во вселенную Ecolatier», после зума надпись исчезает. Появляется увеличенный фон с пузырями, который добавляет объем, но при этом не нагружает пользователя лишними деталями.
Анимация на главной лендинга Ecolatier
У нас было несколько вариантов загрузочного экрана. Изначально хотели нарисовать капли, но заказчик сказал, что это больше относится к фарме, чем к косметике. Тогда мы решили двигаться в сторону космоса, потому что это была первая ассоциация к референсам. Анимировали звезды, чтобы сделать сайт динамичным и добавить эффект погружения.
Этот экран делала в Spline — это новый инструмент для меня, на курсе еще не дошли до 3D-анимации. Училась использовать инструмент сразу на практике — это огромный плюс стажировки.
Соловьева Дарья, графический дизайнер, участница команды
На сайт добавили блоки, которые просил заказчик:
- о нас;
- о продукте;
- магазин с описанием коллекций;
- хиты продаж;
- новинки;
- каталог.
Дизайн сделали в двух цветах — изумрудном и мятном, т.к. партнер просил светлую и темную тему. Оба цвета взяли из референсов, получилась очень приятная цветовая гамма. В некоторых блоках использовали горизонтальную прокрутку, сейчас она очень популярна. Для пользователя ничего не меняется, он листает сайт точно так же — колесиком мыши.
Темная тема сайта
Светлая тема сайта
Для экрана о бренде взяли мою идею горизонтального скролла. Видела ее у разных студий и на прошлом хакатоне в лендинге АСТ. Но там была немного другая концепция — сайт был полностью горизонтальный, как книга. А здесь использовали комбинацию: сначала листаем вниз, потом вбок и т.д. Такая верстка выглядит современно и очень необычно, что подходит под характер бренда.
Соловьева Дарья, графический дизайнер, участница команды
Горизонтальный скролл на сайте Ecolatier
Я верстала лендинг в Figma. Это удобный инструмент для совместной работы, где легко вносить правки. Для анимации с шариками использовала Spline — это онлайн-сервис, где есть библиотека готовых элементов, которые можно адаптировать и применять в своих проектах. Это очень упрощает работу, т. к. мы выбрали 3D, но ранее никто с ним не работал.
Чуприна Елизавета, графический дизайнер, участница команды
Работать над этим кейсом было легче, потому что была команда, на которую можно положиться. Мы оттачивали навыки, которые получили на курсе, учились общаться и вместе работать над одним проектом.
В кейсе Ecolatier был более опытный ментор, поэтому вовлеченность студентов была больше и качество работ заметно выше. С точки зрения дизайна мы получили достаточно сильные проработанные идеи и сейчас находимся в процессе обсуждения. К сожалению, у нас это довольно длительный процесс.
Дарья, Chief Product Officer в Greencosmetics
Как поменять специальность, если страшно
Сейчас я продолжаю работать графическим дизайнером в типографии — это стабильная работа с хорошим окладом. Возможно, скоро решусь уволиться и пойти стажером в UX/UI на небольшую зарплату. Только так можно набраться опыта и составить портфолио.
Тем, кто хочет тоже поменять специальность, советую начать с бесплатных уроков в сети, чтобы найти то, что нравится, и дальше развиваться в выбранном направлении.
профессия UX/UI-дизайнер с нуля до про
профессия UX/UI-дизайнер с нуля до про
Создавайте продуманные интерфейсы сайтов и приложений без навыков программирования. Погрузим в дизайн-среду с первого модуля и дадим опыт, который реально пригодится в работе
Научиться