Смотрите более свежий подход к созданию сайта в Adobe Muse по этой ссылке.

В предыдущей статье я кратко показал Вам процесс создания прототипа в программе Adobe Illustrator. Что происходит дальше? После того, как прототип создан я продолжаю создание сайта в программе Adobe Muse. Вот как это происходит.

Этап №1. Предварительная подготовка.
а) Использование модульной сетки. На этом этапе я создаю рабочий документ и использую 12 колонок и ширину экрана 980 px.

Создание сайта в Adobe Muse. Мой рабочий процесс.
Вот так это выглядит в готовом варианте. 12 колонок — это наиболее часто используемый формат при создании сайтов.

Создание сайта в Adobe Muse. Мой рабочий процесс.
Зачем это нужно? Нужно это для того, чтобы элементы на странице имели свой размер и логику.
Я  не ограничиваюсь 12 колонками, а создаю дополнительную модульную сетку на сайте modulargrid.org.

Создание сайта в Adobe Muse. Мой рабочий процесс.

Вертикальные линии называются «базовыми линиями». Этот термин используется в типографики. Таким образом создавать сайт намного проще. Все имеет свою структуру. После создания необходимой сетки я делаю заливку в Adobe Muse. Вот, что получается в итоге.

Создание сайта в Adobe Muse. Мой рабочий процесс.
б) Типографика. В основном при разработке сайта я использую 1 шрифт. Реже 2 шрифта и подготавливаю страницу со всеми размерами шрифта заранее.
Создание сайта в Adobe Muse. Мой рабочий процесс.

Этап №2. После того, как сохраню все изображения в отдельную папку, то переношу ранее созданный прототип в Adobe Muse и размещаю его сбоку.
Создание сайта в Adobe Muse. Мой рабочий процесс.

 

 

Создание сайта в Adobe Muse. Мой рабочий процесс.
Таким образом можно смотреть на прототип и задача создания сайта облегчается в разы.

Создание сайта в Adobe Muse. Мой рабочий процесс.

 

Создание сайта в Adobe Muse. Мой рабочий процесс.

Создание сайта в Adobe Muse. Мой рабочий процесс.

Создание сайта в Adobe Muse. Мой рабочий процесс.

Создание сайта в Adobe Muse. Мой рабочий процесс.

Создание сайта в Adobe Muse. Мой рабочий процесс.
Этап №3. Добавляю спец. эффекты, если этого требует задача. Эффекты могут быть такие, как например такие как «Parallax scrolling»  или анимация из программы Adge Animate.

Создание сайта в Adobe Muse. Мой рабочий процесс.

Создание сайта в Adobe Muse. Мой рабочий процесс.

 

 

Чтобы посмотреть, что получилось в итоге, нажмите на эту ссылку.