2
Дизайн сайта с помощью Midjorney
Midjourney — отличный инструмент для получения вдохновения в различных принципах дизайна и творчества.
Как мы можем использовать дизайны сгенерированные Midjorney:
- По типу сгенерированного сайта собрать похожую картинку с нуля.
- Сохранить сгенерированный Midjorney дизайн и с помощью сторонних сервисов для создания сайтов, переделать сгенерированные изображения под себя (пример будет ниже).
Конструкция:
+ ui, ux, ui/ux, сайт, целевая страница (уточняющие подсказки)
+ цвет + стиль (опционально, в зависимости от задачи)
+ --ar 16:9 (формат экрана, по умолчанию выдаёт квадрат 1:1)
Дизайны для сайтов
Пример 1. Делаем дизайн сайта для онлайн кинотеатра.
Промпт: Professional website screen for online movie theater, ui, ux, ui/ux, website, landing page, vector illustration --ar 16:9
В запрос я добавил слово "screen" , для того чтобы в результате получился именно экран, а не компьютер, ноутбук или телефон с изображением сайта.
Пример 2. Дизайн сайта для кулинарной школы
Промпт: Professional website screen for online cooking school, ui, ux, ui/ux, website, landing page, light colors, --ar 16:9
Пример 3. Дизайн сайта для ресторана японской кухни в красных тонах
Промпт: screen professional website for japanese cuisine restaurant, ui, ux, ui/ux, website, landing page, red tones, --ar 16:9
Пример 4. Дизайн сайта для гида по Стамбулу
Промпт: Professional website for Istanbul tour guide, ui, ux, ui/ux, website, landing page, figma, high quality graphics, illustration, --ar 16:9
Пример 5. Сайт для криптообменника
Промпт: professional website screen for crypto exchange, ui, ux, ui/ux, website, landing page, green and metallic colors, --ar 16:9
Пример 6. Дизайн сайта для фитнес курса
Промпт: Professional website screen for fitness course, ui, ux, ui/ux, website, landing page, red and white colors , --ar 16:9
Дизайн мобильного приложения
Пример 1. Дизайн мобильного приложения для компании бронирования столиков в ресторанах Москвы
Промпт: Design of a mobile application for a company for booking tables in Moscow restaurants, ux, ui, purple and blue and gold and yellow colors, navigation menu, video player, beautiful design
Пример 2. Дизайн мобильного приложения для доставки еды на дом
Промпт: Mobile app design for breakfast delivery company, ux, ui, purple and blue and gold and yellow colors, navigation menu, video player, beautiful design
Пример 3. Дизайн мобильного приложения для игры по типу ГТА5
Промпт: Mobile application design for a GTA5-like game, ux, ui, purple and blue and gold and yellow colors, navigation menu, video player, beautiful design
Пример 4. Дизайн для приложения онлайн библиотеки
Промпт: Mobile application design for online library, ux, ui, black and white colors, navigation menu, video player, beautiful design. Vector illustration
Дополнительные подсказки
- Dark colors (темные цвета)
- Light colors (светлые цвета)
- Bright colors (яркие цвета)
- Black-white (черно-белое)
- Colorful (цветное)
- Pink (Розовый)
- Blue (Синий)
- Violet (Фиолетовый)
- Red (Красный)
- Green (Зелёный)
- Peach (Персиковый)
- Indigo (Индиго)
- Jade (Джейд)
- Salmon (Лососевый)
- Wooden (Деревянный)
- Metallic (Металлик)
- Gold (Золотой)
- Можно писать причислением цветов, можно писать градиентом (градиент)
Стили иллюстраций для сайта:
- Векторная иллюстрация
- Плоская иллюстрация
- Контурная иллюстрация
- Линейная иллюстрация
- Акварельная иллюстрация
- Изометрическая иллюстрация
- Мультфильм
- 3д
- Абстрактное искусство
- Фото реалистично
Дополнительные подсказки, для добавления деталей:
Ну и конечно вы можете добавлять другие слова — предметы, которые вы хотите видеть на вашем изображении.
Отрицательные подсказки
Используйте «--no» в своих подсказках, если вы хотите вызвать катастрофу какого-либо элемента.
Все, что введено после --no [текст] не будет все, что угодно, на изображении. Это называется негативной подсказкой.
Midjorney + Figma
Теперь попробуем создать пару страниц для сайта и отредактировать их в Figma.
Например, сделаем сайт для парка развлечений в стиле Парк Юрского Периода, под названием "Динополис"
professional website screen for jurassic park theme park, ui, ux, ui/ux, website, landing page, vector illustration --ar 16:9
2. Переходим в Figma и заходим в Photopea
3. С помощью кисти стираем все ненужные нам надписи и получаем готовый исходник, на который мы можем добавить все, что нам необходимо
4. Напишем название, адрес, добавим надписи в две кнопки и получаем готовую страницу для нашего сайта
5. Теперь сгенерируем второй слайд для нашего сайта, для покупки билетов
Промпт: Professional website screen for jurassic park style theme park, ticket purchase menu, ui, ux, ui/ux, website, landing page, vector illustration --ar 16:9
6. Переходим в Figma+Photopea, замазываем все надписи и добавляем свои
7. Остальные слайды делаются по такому же принципу.
Вот такой сайт мы можем создать из готовых изображений, сгенерированных Midjorney, от нас лишь требуется немного редактирования.