Обложка: название, ссылка, список работ, награда.
О проекте
Я проходила менторство у Саши Васильева и, выполняя одно из заданий по композиции забрела на сайт Aimclo, которых очень люблю. Меня цепляют идеи бренда, который не гонится за трендами, а создает минималистичные базовые вещи. Мне захотелось сделать необычный сайт, который показал бы вещи бренда в ином воплощении.
Для справки
Aimclo - это бренд одежды из Новосибирска, делающий упор на производстве трикотажа. Свитеры вяжутся из пряжи с неплохим составом (50% шерсти и 50% синтетических волокон), что просто превосходит большинство брендов в подобной ценовой категории.
Задача
Вдохновиться работами бренда и создать необычную композицию: динамичную и живую. В основе сайта должны были быть модели бренда, но с другой идеей и подачей.
Исследования
Я начала с небольших исследований, обнаружив что большинство подобных сайтов сделаны в одном стиле. Причина этого мне ясна - так пользователям проще ориентироваться на сайте, а также он будет быстрее грузиться. Но есть в этом что-то скучное и обезличивающее.
Вдохновившись работами я создала прототип сайта, придумав необычное название {когда как не зимой мы мерзнем и носим вязаные вещи}. А также градацию теплоты свитеров вместо стандартного фильтра, который делит все вещи на три категории: супер-теплые (на случай адских морозов), просто тёплые (для осени) и почти летние.
Дизайн
В качестве основного стиля был выбран необрутализм, на которой меня натолкнул мой любимый моноширинный шрифт - IBM Plex Mono. В пару к нему был выбран бесплатный и простой Inter.
В ходе создания концепта я не испытывала мук выбора между несколькими вариантами потому что сразу нащупала стиль, который хотела бы видеть.
баннер кнопки: сразу на баннер добавила возможность посмотреть мужскую и женскую коллекцию
первый блок: сделала четкую систему теплоты свитеров, которую будет просто запомнить и реализовать на тильде
карточка товара описание: перенесла описание товара и цену с привычного места внизу в самый верх карточки, чтобы пользователь первым делом видел цену и название
композиция: в композиции чередуются ряды лесенкой и ряды с крупной фотографий для того, чтобы пользователю было интересно пролистывать сайт.
Верстка
Я разрывалась между написанием сайта (это было бы более простой задачей) и кастомизацией стандартного магазина на тильде. В итоге проект был реализован на тильде почти полностью в стандартных блоках. В ходе разработки я не использовала чужие модификации так как это противоречит моим принципам (а также не устраивает качество кода) :D
Была переделана стандартная корзина и ее отображение в меню.
На английской версии страницы добавлен курсор и эффект перевод логотипа.
Полностью перекроены карточки продуктов: композиция в самой карточке, а также композиция в рядах продуктов.
Переоформлен стилями стандартный футер.
Традиционно покажу до/после
Сайт попал в подборку #madeontilda, пару раз попадал в подборки Тильды, а также получил награду CSS Light
Если зачитался и уже готов со мной работать - нажми на кнопку ниже.