Мастера | UX Fox

Уроки для новичков

Мастера

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

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

Главное преимущество мастеров состоит в том, что один мастер можно применять одновременно к нескольким страницам, при этом редактируя его в одном месте. Любые изменения, которые вы вносите при редактировании мастера, автоматически применяются на всех страницах, которые его используют. На одну страницу можно добавлять неограниченное количество мастеров.

Приведем пример. Допустим, вы создали мастер с навигационным меню, в котором имеется кнопка «Преимущества», поместили его на некоторых страницах, а затем решили поменять название кнопки с «Преимущества» на «Особенности». Редактирование этого мастера автоматически изменит навигационное меню на всех страницах, где вы его разместили. Зачастую это неплохо экономит время, поэтому старайтесь использовать мастера везде, где одинаковые элементы повторяются на нескольких страницах.

Создание и настройка мастеров

Панель мастеров

Создавать и настраивать мастера можно при помощи панели мастеров, расположенной в левом нижнем углу.

Чтобы создать мастер, кликните по кнопке Add Master (Создать мастер) на панели инструментов окна мастеров.

Чтобы переименовать мастер, кникните по нему два раза с паузой.

Чтобы удалить мастер, выделите его и нажмите кнопку Delete Master, расположенную на панели инструментов окна мастеров.

Для упорядочивания мастеров их можно перетаскивать, или воспользоваться стрелочками на панели инструментов окна мастеров. Вы также можете разложить мастера по папкам — создайте папку с помощью кнопки «Add folder» на панели инструментов окна мастеров, а затем перетащите в нее нужные мастера.

Редактирование мастеров

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

Вы также можете помещать одни мастера в другие, перетаскивая существующий мастер из окна мастеров в окно создания макета.

Совет: Если вы работаете со страницей, и решили поместить несколько виджетов в мастер, выделите эти виджеты и в контекстном меню выберите опцию Convert >Convert to Master (Конвертировать в мастер). Это действие создаст мастер, поместит в него выделенные элементы и поместит мастер на текущую страницу так, чтобы преобразованные элементы остались на своих местах.

Поведения мастеров
Мастера могут следовать трем поведениям: Нормальное (Normal), Пользовательский виджет (Custom Widget) или Часть фона (Place in background). Чтобы переключить поведение мастера, нужно нажать правой кнопкой на названии мастера в окне мастеров и выбрать поведение из подменю Behavior контекстного меню.

Вы можете изменять поведение любого мастера в любое время, однако такое изменение затронет мастер только в том случае, если он был добавлен на страницу после изменения. Например, если у вас был мастер с поведением Custom Widget, и вы поменяли его на Normal, это действие не поменяет поведение этого мастера в местах, где он уже был добавлен.

Чтобы изменить поведение мастера, который уже находится на одной из страниц, кликните по нему правой кнопкой мыши в окне создания макета и перейдите в подменю Master в контекстном меню. Там вы найдете опции Place in Background (Поместить на фон), Remove from Background (Убрать с фона) и Flatten (Выровнять) (с помощью последней опции виджеты можно «вытягивать» из мастера и редактировать отдельно).

Нормальное (Normal) поведение мастера (поведение по умолчанию)

Мастер с нормальным поведением можно перемещать по странице без ограничений.

Мастера с нормальным поведением имеют розовую маску, однако ее можно выключить в строке меню (выберите Wireframe > Mask Masters).

Поведение “Часть фона” (Place in Background)

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

Мастера с таким поведением имеют серую маску.

Поведение “Пользовательский элемент” (Custom Widget)

После добавления в окно создания макета, мастер с таким типом поведения теряет связь с первоначальным мастером и может быть отредактирован отдельно как любые другие виджеты. Это удобно при создании библиотеки виджетов с предварительно заданными свойствами, примечаниями и/или взаимодействиями.

Мастера хранятся в файле проекта. Чтобы создавать библиотеки, которые хранятся отдельно (как стенсилы Visio), и которые можно использовать в других проектах, создайте пользовательскую библиотеку элементов.

Добавление мастеров на страницы

Чтобы добавить мастер на страницу, перетащите его из окна мастеров в окно создания макета.

Наверняка вы заметили, что у каждого мастера есть своя цветовая маска: мастер с нормальным поведением отображается розовым, а мастер с поведением “Часть фона” – серым. Выделение маской можно отключить в строке меню, сняв галочку с опции Mask Masters в меню Wireframe.

Добавив мастер в окно создания макета, вы можете открыть его для редактирования двойным щелчком в окне мастеров или в окне создания макета.

Итог
Теперь вы знаете, что такое мастеры.