March 17

Uizard 

Uizard — это инструмент для проектирования пользовательского интерфейса с поддержкой искусственного интеллекта, который используется для создания макетов, схем и прототипов за считанные минуты. Мне стало любопытно, сможет ли новичок в дизайне разобраться в этой программе и создать что-то по-настоящему крутое. В этом гайде я расскажу вам о своем опыте использования нейросети для создания стильных дизайнов.

В данной ИИ есть 3 главные функции :

  • New blank project - создание проекта с нуля
  • Generate with Autodesigner - создание сайта/приложения и тд. с помощью ИИ
  • Start from template - создать сайт с помощью шаблона

Разберем каждую функцию.

New blank project

Прежде чем начать работу, ИИ попросит вас выбрать формат, который вы хотите создать: Web, tablet, mobile.

После того, как вы выберете формат, вы попадете в рабочую область.

Здесь есть 4 основных части рабочей области.

Поле слева

панель с элементами, которые вы можете добавить в свой проект:

  • добавить готовый дизайн (скриншот, варфрейм, файл фигмы и тд)
  • шаблоны главных страниц, отдельных блоков сайта
  • фигуры
  • текст
  • изображение, гиф (можно выбрать из предложенных сервисом или загрузить свое)
  • иконки разных стилей
  • кнопки
  • возможности ИИ

Главное поле по центру

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

Поле справа

это панель работы с готовым дизайном:

  • первая возможность - редактирование элементов
  • переключаться между несколькими экранами (если таковые имеются)
  • давать комментарии по определенным моментам (если работаете с командой)
  • переключать режим на режим прототипа
  • достать код какого-то элемента
  • общие настройки

В поле сверху вы можете поделиться проектом или же выгрузить его в нужном формате.

Шаг 1. Регистрация в Uizard

Сначала я перешла на сайт https://uizard.io/ и нажал на кнопку “Sign up for free”. Здесь можно ввести свои данные или авторизоваться через Google аккаунт или учетную запись Microsoft. Я обычно авторизуюсь через Google, так проще и быстрее.

Далее выбираем с какой целью будет использоваться сервис: работа, учеба, благотворительность или личные цели. Для себя я выбрала работу и затем ответил на дополнительные вопросы о своей деятельности. После этого процесс регистрации будет завершен.

Шаг 2. Создаем проект

Для создания проекта можно воспользоваться уже готовыми шаблонами или создать свой собственный.

Бесплатная версия включает в себя создание трех проектов и использование 10 шаблонов.

Я решила попробовать создать дизайн для электронного магазина, точнее сайт для пиццерии, используя готовый шаблон. Для сначала с помощью библиотеки изображений я меняю картинки на нужный товар.

Просто ввожу в поиск изображений слово “pizza” и мне выдает много нужных результатов.

После того как картинки готовы, я приступила к замене текста. Данный шаблон учитывает заголовок и подзаголовок страницы, категории, полезную информацию и статьи, сами товары, рассылку со скидкой и другую полезную информацию.

Менее чем через полчаса у меня получился вот такой неплохой результат, практически готовый дизайн сайта для пиццерии. При желании можно добавить больше элементов: текст, кнопки, иконки.

В целом, Uizard очень полезный сервис, как и для людей мало знакомых с дизайном, так и для более опытных пользователей. С помощью него можно с легкостью создать лендинги и другие дизайны для веб-страниц, мобильных приложений или планшетов. Конечно, для бесплатной версии шаблонов не так много, но даже среди них я нашла что-то более-менее подходящее.