Итоговая работа
Зачёт курса: согласовать тему сайта и отрисовать макет в Figma.
On this page
Кратко суть
Вы сами выбираете, какой сайт проектируете, согласовываете тему с преподавателем и сдаёте макет в Figma: понятный, удобный, аккуратный интерфейс, а не набор красивых картинок и непонятных Rectangle.
Код работы в названии файла или страницы Figma не нужен: это одна итоговая, но если очень хочется указать, то укажите Final.
1. Тема
Сначала тема, потом макет. Не начинайте рисовать что-то серьезное, пока тема не согласована.
Подходит сайт с понятной задачей: продукт, услуга, событие, медиа, сервис. Не подходит случайная вывеска «чтобы хоть что-то сдать». Если сомневаетесь, скажите на занятии до отрисовки.
На согласование недостаточно названия. Покажите, что это за сайт:
- черновой макет (набросок экрана, даже грубый), или
- подробное описание идеи: зачем сайт, кому, какие экраны, или
- коллаж референсов с подписями: идея и что где будет располагаться.
Итоговую можно делать так, чтобы она пригодилась в дипломе. Приходите с темой ВКР и тем, что уже есть: наброски, референсы, черновик. Дальше интерфейс допиливаем или собираем с нуля.
Утверждение темы, промежуточные варианты и вся остальная работа над итоговой идут на занятиях. Консультации и согласования тоже. В переписке такие вопросы практически не решаются.
Делаем только desktop-интерфейс сайта. Игровые интерфейсы лучше не брать из-за специфики масштаба и различной логики построения UI/UX. Мобильные версии сайтов также не делаем.
2. Макет
Нужен полноценный сайт: секции страницы, шапка, контент, изображения, футер, меню, кнопки.
Ориентир: реальные сайты, не картинки с Pinterest, Dribbble, Behance и похожих витрин. Там макеты часто кривые, нелогичные и ни с чем в жизни не совпадают. Смотреть на них можно: композиция, цвет, порядок подачи информации. Это крупные мазки. Настоящую структуру, композицию и сложные грамотные решения видно только на живых сайтах. Копировать чужой сайт один в один не нужно.
В Figma это не «нарисовать прямоугольники». Макет собираете на Auto Layout, через компоненты, с нормальными отступами и размерами: кратно 2, 4, 8, 16. Контент режете на блоки, у каждой секции понятная роль. То же самое стоит в критериях ниже.
Примеры структуры (не темы и не визуальный стиль):
Нашли живой сайт, на котором хорошо видно структуру, сетку, секции? Принесите на занятие или скиньте ссылку. Не стесняйтесь: сайт, что Вы покажете, может попасть в этот список.
3. Критерии
Минимум
- Полноценный сайт: секции, шапка, контент, футер, меню и кнопки.
- Контент разбит на блоки, у каждой секции есть своя роль.
- Весь UI на Auto Layout.
- Масштаб 1 к 1.
- Отступы и размеры кратны 2, 4, 8 или 16.
Сильнее
- Компоненты Figma.
- Стили и переменные хотя бы для шрифтов и цветов.
- Понятное поведение блоков и состояний кнопок.
4. Сдача
Публичная ссылка на Figma. Как открыть доступ и как проверяют в инкогнито: в приветствии, раздел «Как сдавать работы». Файл можно подписать Final.
Если успеваете закрыть работу до конца семестра, оценка может быть максимальной. Если доделываете уже в сессию, максимум 4 или на усмотрение преподавателя.