
Августина Жиянбаева - старт 01.10.24
Этапы
[этапы создание]
1. Прототип 2. Дизайн 3. Верстка 4. Функционал ----- Основы фотошоп - до инструмента заплатка
Основы фотошоп
- Векторная маска
- Обтравочная маска
- FX эффекты
- Режимы наложения
Домашнее задание
Привет!
Создать документ - 1920 х 1080px 72dpi и Девушку привести в порядок и отправить в космос)! Все файлы у тебя в телеграм:) Творчество приветствуется!
Только засеки время)
Смотри, представь у тебе позвонили отдел яндекс по роботехнике и сообщили следующее: "Август, мы изобрели технологию, которая очищает воздух в экстремально загрязненных городах, но у нас проблема. Мы знаем как это донести до аудитории. Помоги нам создать презентацию и примерный вид такого робота."
Технически это презентация 1920x1080px 72dpi
Необходимо не менее 5 слайдов
Главное раскрой идею!
Эти сайты тебе помогут:
https://www.freepik.com/
https://lexica.art/
https://www.dji.com/ru
Задача следующая, создай карточку маркет плейса для OZON - для специального ошейника для кошек, который отслеживает буквально всё. Пульс, место нахождение, кол-во коллорий, который он употребляет и сжигает, а также он может менять окрас самого кота. Необходимо не менее 5-6 карточек
Главное раскрой идею!
Эти сайты тебе помогут:
https://www.freepik.com/
https://lexica.art/
https://www.dji.com/ru
Наступило светлое будущее. Люди прекратили войны, стали более бережно относиться к планете, но но но стрессы остались все равно частью повседневной жизни. Он конечно не настолько высок.. Но все же. И пришла пора психологических сессий от искусственного интеллекта.
Придумай, как может выглядеть психолог в каждом доме. Придумай сам вид этой технологии, коробку или упаковки или устройства. Покажи как это может быть в домашнем быту. Расскажи о функциях.
Размер файла - 1920x1080px 72 dpi - 5-6 слайдов. И все упаковать в pdf презентацию.
https://www.freepik.com/
https://lexica.art/
Цель: Создать пост для Instagram на тему путешествий.
Техническое задание:
Формат: Пост для Instagram (1080x1080 пикселей).
Тема: Путешествия.
Содержание:
Использовать минимум одну фотографию, связанную с путешествиями (например, пляж, горы, городская архитектура и т.д.).
Добавить текстовое описание, которое включает:
Название места/локации.
Краткое описание (2-3 предложения).
Призыв к действию (например, "Узнайте больше", "Бронируйте сейчас", "Поделитесь своим опытом").
Интегрировать логотип или название компании/блога.
Дизайн:
Пост должен быть визуально привлекательным и соответствовать современным трендам.
Использовать цветовую палитру, которая ассоциируется с темой путешествий (например, голубые, зеленые, песочные оттенки).
Внимательно подойти к выбору шрифтов: они должны быть читабельными и гармонировать с общим дизайном.
Добавить графические элементы (например, иконки, линии), которые дополняют тематику поста.
Требования к файлу:
Проект должен быть выполнен в Figma
Названия всех слоев и групп должны быть осмысленными и упорядоченными
Так же прописал Горячие клавиши
Удачи!)
Описание задания:
Создай прототип сайта, который представляет город Новороссийск. Цель проекта — показать основные особенности города, включая его достопримечательности, культуру, события и важную информацию для туристов. Продумай, как будет выглядеть карточка города, какие элементы на ней разместить, и создай логичную, интуитивную навигацию по сайту.
Что должно быть в прототипе:
- Главный экран: красивое фоновое изображение или иллюстрация города Новороссийск, название и краткое описание города.
- Основные разделы:
- **Достопримечательности:** краткие карточки для основных достопримечательностей с возможностью перехода к подробной информации.
- **Культура и события:** раздел для новостей и мероприятий в Новороссийске.
- **Туристическая информация:** полезные советы для туристов (транспорт, места для проживания, рестораны и кафе).
- Карточка города: разработай отдельную карточку с основными сведениями о городе (население, география, история) и добавь элементы взаимодействия (кнопки или ссылки).
Цель задания: Научиться создавать комплексные прототипы, адаптировать интерфейс под различные устройства.
Привет! У меня для тебя интересное домашнее задание, которое прокачает тебя на максимум в Figma. Вот что нужно сделать:
Подумай, какой сайт тебе интересен. Это может быть:
- Корпоративный сайт компании
- Интернет-магазин
- Личный блог или портфолио
- Образовательная платформа
- Новостной портал
- Или что-то своё уникальное!
- Подумай, для кого этот сайт. Кто твоя аудитория?
- Посмотри, как делают сайты конкуренты. Что в них хорошего, а что можно улучшить?
- Запиши, какие страницы и функции должны быть на твоём сайте. Например:
- Главная
- О нас
- Услуги
- Блог
- Контакты
- и т.д.
- Нарисуй простую карту, как пользователи будут перемещаться по сайту (например, от главной страницы к странице услуг).
- Нарисуй схему сайта (sitemap) — как связаны между собой страницы.
- Сделай простые наброски (вайрфреймы) ключевых страниц.
- Добавь цвета, шрифты, иконки и изображения.
- Используй все возможности Figma:
- Рисуй иконки и элементы интерфейса с помощью векторных инструментов.
- Настрой красивые шрифты и цветовую палитру.
- Организуй слои и группы, чтобы всё было аккуратно.
- Расставь элементы на странице так, чтобы всё выглядело гармонично.
- Добавь изображения и графику, которые подходят к теме сайта.
- Сделай интерактивный прототип, чтобы можно было "переходить" между страницами и видеть, как будет работать сайт.
- Настрой переходы между страницами, чтобы можно было протестировать навигацию.
- Добавь простые и не очень анимации, чтобы сайт выглядел живее.
- Все страницы и прототип должны быть в одном файле Figma.
- Постарайся всё хорошо организовать и назвать слои понятно.
- Все страницы должны быть в одном стиле, чтобы сайт выглядел цельно.
- Сделай так, чтобы пользователям было легко ориентироваться на сайте.
- Внимательно проработай мелкие элементы — это делает дизайн профессиональнее.
- Пусть он будет кликабельным и показывает основные пути пользователя по сайту.
- Выбор темы: Выбери то, что тебе действительно интересно. Это повысит мотивацию и качество работы.
- Исследование: Посмотри примеры хороших сайтов в выбранной категории, вдохновись их идеями.
- Планирование: Разбей работу на этапы — исследование, структура, дизайн, прототипирование.
- Обратная связь: Покажи промежуточные результаты друзьям или однокурсникам, чтобы получить советы и улучшить проект.
- Если возникнут вопросы или нужна помощь, всегда можешь обратиться ко мне.
С тебя на следующий урок: мудборд + прототип сайта портфолио, либо если прийдет в голову что-то более интересное, можно использовать его.
сайты для подбора референсов:
madeontilda
awwwards
Для погружения
Сервисы
http://www.awwwards.com/
https://brandingstyleguides.com/
https://lexica.art/ - аналог миджорни - но можно использовать как сток
https://unsplash.com/ - классный сток фотографий
https://thenounproject.com/ - хороший сток иконок (аналог flaticon)
https://sapiens.ui8.net/- Отличный сервис для создание дудлов
https://unblast.com/ - неплохой сервис бесплатных мокапов
https://www.freepik.com/
2. awwwards.com
3. godly.website
4. minimal.gallery - сервисы для поиска референсов сайтов и вдохновения.
5. fonts.ninja - расширение для браузера для просмотра шрифтов на сайте.
Создание и редактирование:
Копировать: Ctrl + C
Вставить: Ctrl + V
Вырезать: Ctrl + X
Отменить действие: Ctrl + Z
Вернуть действие: Ctrl + Shift + Z
Инструменты:
Перемещение (Move tool): V
Пропорционально масштабирование (Scale): K
Рамка (Frame tool): F
Прямоугольник (Rectangle tool): R
Эллипс (Ellipse tool): O
Линия (Line tool): L
Перо (Pen tool): P
Текст (Text tool): T
Комментарии (Comment tool): C
Управление слоями и объектами:
Группировать объекты: Ctrl + G
Разгруппировать объекты: Ctrl + Shift + G
Дублировать объекты: Ctrl + D
Показать/скрыть линейки: Shift + R
Навигация и просмотр:
Увеличить масштаб: Ctrl + =
Уменьшить масштаб: Ctrl + -
Подогнать под экран: Shift + 1
100% масштаб: Shift + 0
Включить/выключить полноэкранный режим: Ctrl + .