Сайт принтованной одежды на основе шрифтов eggoprint

•

Сайт и система редактирования для бренда eggoprint

Принтованная одежда и композиции на основе шрифтов. Качественная минималистичная одежда для лаконичного самовыражения. Чистый дизайн, выстроенный на шрифтовых композициях.

• Бренд разрабатывает шрифтовые композиции для плакатов, заголовков, монограмм, титров;
• Делает индивидуальные проекты совместно с заказчиком;
• Устраивает и участвует в различных коллаборациях с дизайнерами и специалистами, экспертами в разных областях.
• Делает мерч.

https://eggoprint.ru/

Для чего (пользователю) этот сайт

• Узнать об активностях бренда;
• Участвовать в коллаборации с дизайнерами и специалистами, экспертами в своих областях;
• Заказать индивидуальный дизайн;
• Купить майку с принтом.

Как устроен сайт

Сайт двухуровневый лендинг

Главная

• Коллекции

- logofont

- Moning routine

- StopGold

- Медиамайка

- HNY

- Слово и образ
• Индивидуальный дизайн
• Совместные проекты (коллаборации)
• Я
• Статьи

- Неведомые знаки

- Как появились мои логотипы из букв

- Пионерский лагерь “Мирный” 1975 - 1979

- Постер для выставки “Избранное”. ЦСИ г. Тула

- Постер для подкаста Broad Cast

- Между 4 океанами

- 28 января 1820 года. Открытие Антарктиды. Лист для Календаря №1 2019 года

- Mickey Mouse inspires the World

Главная страница

Содержит: логотип, «Контент-слайдер», дескриптор и боковое меню в шапке сайта, «Ленту анонсов» и подвал с ссылками на соцсети и мой персональный сайт.

Контент-слайдер

В слайдере — тизер деятельности бренда: майки, коллажи со шрифтовыми композициями, люди в майках.

Слайдер предоставляет широкие возможности для создания выразительных слайд-композиций из текста, изображений и видео. Доступно применение CSS, HTML и JS для достижения интересных стилевых эффектов, анимации и позиционирования c учётом адаптивной вёрстки.

Лента анонсов

Рассказ об активностях бренда. Каждый анонс дает краткую информацию по теме и позволяет получить расширенную дополнительную информацию в виде ссылок и кнопок действия (присоединиться к коллабу, отправить заявку и т.д.). Анонсы располагаются в шахматном порядке.

Коллекция и карточка товара

Бренд выпускает 1—2 коллекции в год. На данный момент представлены 6 коллекций. У посетителей сайта есть возможность заказать майку с понравившимся принтом.
На карточке товара, при наведении мыши демонстрируются ситуативные изображения принта.

При нажатии на кнопку «Майку» открывается форма заказа. Заказ приходит на почту. Я списываюсь с заказчиком. После полной оплаты майка отправляется почтой России или курьером, доставка оплачивается при получении.

Индивидуальный дизайн

Мы сделаем уникальную вещь, которой больше ни у кого не будет или коллекцию, доступную для всех.

Образование, Увлечения, проекты касающиеся меня лично.

Дизайн-система (UI-kit)

• Цвета;

• Шрифт;

• Иконки;

• Кнопки;

• Ссылки;

• Элементы управление слайдером (<> ...);

• Хинты (подсказка при наведении на элемент мышкой);

• Боковое меню;

• Слайдер;

• Формы отправки.

Цвета

Фон: различные оттенки серого;

Акценты: коралловый (из иллюстратора 2-й слой), светло-синий (из фреймворка Bootstrap). Цвета напоминают об использованных инструментах.

Шрифт

Open Sans

Иконки

Кнопки

Хинты

Формы отправки (Модальное окно)

Фреймворки

• Bootstrap 5.3, для системы редактирования сайта, а так же стрелочки и кружечки в слайдерах;

• Собственный фреймворк для интерфейса сайта.

Гайдлайны мы не делали, разработчик получал мои хотелки в ТЗ в Jira и лично.

Адаптивная вёрстка

Сайт запущен в 2020 году. Работающий прототип сделан за 3 дня в Readymag, после обсуждения, программист сделал рабочую версию за неделю. В ней были основные разделы (Главная с лентой анонсов; Коллекции с карточками товара; Индивидуальный дизайн; Я) адаптивная вёрстка и статистики по сайту.

Система редактирования сайта

Была разработана оригинальная система редактирования сайта, которую мы сразу же начали использовать (добавление слайдов в слайдер, лента анонсов, карточки товара), остальное доделывать по ходу. Система рассчитана на 3—5 пользователей. Роли: администратор, редактор, гость.
Система имеет модульную структуру, легко расширяется, позволяет управлять сайтом во время разработки новых модулей. Имеет минималистичный дизайн. Использован фреймворк Bootstrap 5.3.

Аккаунт редактора