Прототип landing page в Axure

Для создания прототипов есть 2 популярных программы: Axure и Balsamiq. Эта статья будет об Axure. При создании лендингов я пользуюсь именно им – он серьезный (без смешных и детских шрифтов как в Balsamiq), удобный и простой для работы. Сегодня вы узнаете какой функционал есть у Axure и как в нем сделать прототип.

Зачем нужен этап прототипирования (или архитектуры)

Прототип выполняет несколько задач:

1. Вы показываете заказчику расположение блоков, тексты и структуру будущего лендинга или сайта.
2. Прототип является техническим заданием для дизайнера. Намного проще показать расположение элементов в макете, чем словами объяснять дизайнеру где должны находиться иконки и как должен быть оформлен текст (подчеркнутый, жирный или обычный).

Функционал

Так выглядит только запущенная программа: Это страницы, в которых делают макеты. Если делаете только лендинг (1 страницу) – вам потребуется только страница "Home". Если делаете сайт, то это очень удобно и выглядит так: Нужные элементы находятся здесь в папке Default:

Как начать работать

Сперва рекомендую указать границу прототипа – ставьте 1000 пикселей: Для этого наведите курсор на эту область… … и перетягивайте курсор до нужной границы. Элементы для редактирования текста:

Элементы, которые вам понадобятся:

1. Плашки (футер, шапка и т.д.)

2. Для конкретных изображений: 3. Иконки: 4. Заголовки: 5. Текст: 6. Кнопки: 7. Формы: 8. Границы для разделения блоков:  

Как это выглядит в прототипе

и на дизайне: Делайте простые и понятные прототипы!