Можно использовать 3D-инструменты редактирования для вращения 3D- моделей вокруг оси X, оси Y или оси Z; перемещать модель по осям или изменить масштаб объекта. Во время управления положением 3D-моделью вид камеры осттся неизменным.
Panel Options Info (Информация) и выбрать режим показа справки инструмента (Show Hints ). Выберите инструмент, затем пеместите курсор в окно изображения, чтобы рассмотреть детали инструмента в палитре информации Info (Информация).
1. Выберите в палитре 3D режим 3D-SCENE (3D-сцена).
2. Выберите инструмент навигации, активизируйте его и удерживайте нажатой клавишу Rotate (Поворот), Roll (Прокрутка), Pan (Перетаскивание), Slide (Перемещение) или инструмент Scale (Масштабирование) для движения по прямой линии. Поработайте с трехмеыми инструментами, расположенными на палитре инструментов.
3. Rotate (Поворот). Перетащите или вращайте вниз модель вокруг ее оси X, или в сторону, чтобы создать вращение вокруг ее оси Y. Удерживайте нажатой клавишу (для Windows) или (для Mac OS), чтобы катить модель.
4. Roll (Прокрутка). Перетащите модель в сторону, чтобы создать вращение модели вокруг ее оси Z.
5. Pan (Перетаскивание). Перетаскивайте модель в сторону, чтобы перемеить модель горизонтально, или вверх и вниз, чтобы переместить ее вертикало. Удерживайте нажатой клавишу (для Windows) или (для Mac OS), чтобы при перетаскивании переместиться в X/Z-направлении.
6. Slide (Перемещение). Протаскивайте модель в сторону, чтобы перемеить ее горизонтально, или вверх и вниз, чтобы закрыть ее или возвратиться. Удерживайте нажатой клавишу (для Windows) или (для Mac OS), чтобы при перетаскивании масштабирование выполнялось в X/Y- направлении.
7. Scale (Масштабирование). Тяните вверх или вниз, чтобы масштабировать модель к большему или меньшему размеру. Удерживайте нажатой клавишу
(для Windows) или (для Mac OS), чтобы выполнить масштабование в Z-направлении.
Используйте инструменты редактирования 3D-камеры для просмотра движения камеры, оставляя фиксированным положение 3D-объекта.
Для использования инструментов трехмерной графики следует выбрать Panel Options (Опции панели) из меню вариантов палитры Info (Информация) и режим показа справки (Show Hints ). Выберите инструмент, затем переместите курсор в окно изображения, чтобы рассмотреть детали инструмента в палитре Info (Инфоация).
1. Выберите в палитре 3D режим 3D-MESH (3D-каркас).
2. Выберите инструмент редактирования 3D-камеры, активизируйте его и удеивайте нажатой клавишу при протаскивании инструментов Rotate (Поворот), Pan View (Просмотр перетаскиванием), Walk View (Пошаговый просмотр) для движения по прямой линии.
¿ Rotate (Поворот). Поворачивайте камеру в направлении X или Y. Удерживайте нажатой клавишу (для Windows) или (для Mac OS), когда поворачиваете камеру.
¿ Roll (Прокрутка). Перетащите, чтобы катить камеру.
¿ Pan (Перетаскивание). Перетащите вручную камеру в X- или Y- направлении. Удерживайте нажатой клавишу (для Windows) или
(для Mac OS), когда вы вручную перемещаетесь по документу в X- или Z-направлении.
¿ Walk (Шаг). Перетащите шаг за шагом камеру (Z-преобразование и Y- вращение). Удерживайте нажатой клавишу (для Windows) или
(для Mac OS), когда вы перетаскиваете ее шаг в Z/X направлении (Z-преобразование и Y-вращение).
¿ Zoom (Масштаб). Перетащите камеру, чтобы изменить поле обзора 3D-камеры. Максимальное поле обзора составляет 140°. Выберите вариант ортографического просмотра модели на дисплее, чтобы показать ее в тоом представлении масштаба без любого перспективного искажения.
Источник: Комолова, Н. В., Adobe Photoshop CS5 для всех / Н. В. Комолова, Е. С. Яковлева. - СПб.: БХВ-Петербург, 2011. - 624 с.: ил. + CD-ROM - (В подлиннике)
Скажем, вы хотите повернуть вектор или точку на θ, тогда тригонометрия утверждает, что новые координаты
X" = x cos θ − y sin θ y" = x sin θ + y cos θ
Чтобы продемонстрировать это, давайте возьмем кардинальные оси X и Y; когда мы поворачиваем ось X на 90 ° против часовой стрелки, мы должны получить ось X, преобразованную в ось Y. Рассматривать
Unit vector along X axis = x" = 1 cos 90 − 0 sin 90 = 0 y" = 1 sin 90 + 0 cos 90 = 1 New coordinates of the vector, = ⟹ Y-axis
Когда вы понимаете это, создание матрицы для этого становится простым. Матрица - это всего лишь математический инструмент, позволяющий выполнять это удобным, обобщенным образом, чтобы различные преобразования, такие как вращение, масштабирование и перемещение (перемещение), можно было объединить и выполнить за один шаг, используя один общий метод. Из линейной алгебры, чтобы повернуть точку или вектор в 2D, матрица должна быть построена
|cos θ −sin θ| |x| = |x cos θ − y sin θ| = |x"| |sin θ cos θ| |y| |x sin θ + y cos θ| |y"|
Вращение в 3DЭто работает в 2D, а в 3D нам нужно учесть третью ось. Поворот вектора вокруг начала координат (точки) в 2D означает просто поворот его вокруг оси Z (линии) в 3D; поскольку мы вращаемся вокруг оси Z, его координату следует поддерживать постоянной, то есть 0 ° (вращение происходит на плоскости XY в 3D). В 3D вращение вокруг оси Z будет
|cos θ −sin θ 0| |x| |x cos θ − y sin θ| |x"| |sin θ cos θ 0| |y| = |x sin θ + y cos θ| = |y"| | 0 0 1| |z| | z | |z"|
вокруг оси Y будет
| cos θ 0 sin θ| |x| | x cos θ + z sin θ| |x"| | 0 1 0| |y| = | y | = |y"| |−sin θ 0 cos θ| |z| |−x sin θ + z cos θ| |z"|
вокруг оси X будет
|1 0 0| |x| | x | |x"| |0 cos θ −sin θ| |y| = |y cos θ − z sin θ| = |y"| |0 sin θ cos θ| |z| |y sin θ + z cos θ| |z"|
Примечание : ось, вокруг которой выполняется вращение, не имеет элементов синуса или косинуса в матрице. Я надеюсь, что это делает случай вращения ясным.
СоставВышеупомянутые матрицы вращают объект так, как если бы он находился на расстоянии r = √ (x² + y²) от начала координат; ищите полярные координаты, чтобы знать почему. Это вращение будет относительно мирового космического происхождения. Обычно нам нужно вращать объект вокруг его собственной рамки/оси, а не вокруг мира. Поскольку не все объекты имеют мировое происхождение, вращение с использованием этих матриц не даст желаемого результата вращения вокруг собственной рамки объекта. Следовательно, вам нужно узнать и о переводе . Сначала вы должны перевести (переместить) объект в начало мира (чтобы источник объекта выровнялся с миром, тем самым сделав r = 0), выполнить вращение с одной (или более) из этих матриц, а затем снова перевести его обратно. на прежнее место. Порядок, в котором применяются преобразования, имеет значение .
Я призываю вас прочитать о линейных и аффинных преобразованиях и их композиции для выполнения нескольких преобразований за один раз, прежде чем играть с преобразованиями в коде. Без понимания основных математических основ отладка преобразований была бы кошмаром. Я нашел это видео лекции очень хорошим ресурсом. Другой ресурс - это учебное пособие по трансформациям, которое стремится быть интуитивно понятным и иллюстрирует идеи с помощью анимации.
Примечание. Этот метод выполнения поворотов основан на системе угловых поворотов Эйлера , которую проще учить и понимать. Это прекрасно работает для 2D и для простых 3D случаев; но когда вращение должно быть выполнено вокруг всех трех осей одновременно, то углов Эйлера для этого недостаточно из-за врожденного недостатка этой системы, который проявляется как блокировка карданного подвеса . В таких ситуациях люди прибегают к кватерниону , который более продвинут, чем этот, но при правильном использовании не страдает от карданных замков.
Animate позволяет создавать трехмерные эффекты, перемещая или вращая фрагменты ролика в трехмерном пространстве рабочей области. Animate представляет трехмерное пространство, добавляя ось z к свойствам каждого экземпляра фрагмента ролика. Эффекты 3D-перспективы можно добавить в экземпляры фрагментов роликов, переместив их вдоль соответствующей оси x или повернув вокруг оси x или y с использование инструментов «Перемещение 3D-объекта» и «Поворот 3D-объекта». Используя терминологию трехмерной графики, перемещением объекта в трехмерном пространстве называется его параллельный перенос , а поворотом объекта в трехмерном пространстве называется его преобразование . После применения любого из этих эффектов к фрагменту ролика Animate рассматривает его как трехмерный фрагмент ролика, и при выделении на него накладывается разноцветный указатель осей.
Чтобы объект отображался ближе к зрителю или дальше от него, переместите объект вдоль оси z с помощью инструмента «Перемещение 3D-объекта» или инспектора свойств. Чтобы создать впечатление, что объект расположен под углом к зрителю, поверните фрагмент ролика вокруг его оси z с помощью инструмента «Поворот 3D-объекта». Комбинируя использование этих инструментов, можно создавать реалистичные эффекты перспективы.
Оба инструмента - и «Перемещение 3D-объекта» и «Поворот 3D-объекта» - позволяют работать с объектами в глобальном и локальном трехмерном пространстве. Глобальное трехмерное пространство в пространстве рабочей области. Глобальные преобразования и параллельные переносы выполняются относительно рабочей области. Локальное трехмерное пространство - это пространство фрагмента ролика. Локальные преобразования и параллельные переносы выполняются в пространстве фрагмента ролика. Например, если имеется фрагмент ролика, содержащий несколько вложенных фрагментов ролика, локальные трехмерные преобразования вложенных объектов происходят относительно области рисования в объекте-контейнере. По умолчанию для инструментов «Перемещение 3D-объекта» и «3D-вращение» задается глобальный режим работы. Чтобы использовать их в локальном режиме работы, щелкните переключатель «Глобально» в разделе «Параметры» на панели «Инструменты».
Используя трехмерные свойства экземпляров фрагмента ролика в FLA-файле, можно создавать разнообразные графические эффекты без дублирования фрагментов ролика в библиотеке. Но если фрагмент ролика вызывается для редактирования из библиотеки, примененные 3D-преобразования и переносы не будут видны. При редактировании содержимого фрагмента ролика видны только 3D-преобразования вложенных фрагментов ролика.
Рабочая область с фрагментом ролика, повернутым в глобальном трехмерном пространстве.
Рабочая область с фрагментом ролика, содержащим вложенный фрагмент ролика, повернутый в локальном трехмерном пространстве.
Примечание.
После того как в экземпляр фрагмента ролика добавлено 3D-преобразование, его родительский символ фрагмента ролика нельзя редактировать в режиме «Редактировать на месте».
Если в рабочей области есть трехмерные объекты, можно добавить определенные трехмерные эффекты ко всем таким объектам в группе, настроив свойства «Угол перспективы» и «Точка исчезновения» для FLA-файла. Свойство «Угол перспективы» оказывает эффект масштабирования при просмотре рабочей области. Свойство «Точка исчезновения» оказывает эффект панорамирования на трехмерные объекты в рабочей области. Эти параметры влияют только на представление фрагментов ролика, к которым применялись и 3D-преобразование или 3D-перенос.
В средстве разработки Animate можно контролировать только точку обзора или камеру . Ракурс камеры в FLA-файле совпадает с ракурсом рабочей области. Каждый FLA-файл имеет только один параметр угла перспективы и точки исчезновения.
Чтобы использовать трехмерные функциональные возможности Animate, для настройки «Параметры публикации» в FLA-файле должно быть задано значение «Flash Player 10 и ActionScript 3.0». Вдоль оси z можно поворачивать или перемещать только экземпляры фрагмента ролика. Некоторые трехмерные функции доступны в языке ActionScript, который нельзя напрямую вызывать в пользовательском интерфейсе Animate, например несколько точек исчезновения и отдельные камеры для каждого фрагмента ролика. С помощью ActionScript 3.0 можно применить 3D-свойства не только к фрагментам роликов, но и к таким объектам, как текст, компоненты воспроизведения FLV и кнопки.
Примечание.
3D-инструменты нельзя использовать для объектов, находящихся в маскирующих слоях, а слои, содержащие 3D-объекты, нельзя использовать в качестве маскирующих. Дополнительные сведения о маскирующих слоях см. в разделе Использование маскирующих слоев .
Перемещение объектов в трехмерном пространствеЭкземпляры фрагмента ролика в трехмерном пространстве перемещаются с помощью инструмента «Перемещение 3D-объекта» . Если выбрать фрагмент ролика с помощью этого инструмента, его три оси (X, Y и Z) отображаются в рабочей области над объектом. Ось X показана красным цветом, Y - зеленым, а ось Z - синим.
По умолчанию для инструмента «Перемещение 3D-объекта» задается глобальный режим работы. Перемещение объекта в глобальном трехмерном пространстве равносильно перемещению его относительно рабочей области. Перемещение объекта в локальном трехмерном пространстве равносильно перемещению его относительно родительского фрагмента ролика, в котором он содержится. Чтобы переключить инструмент «Перемещение 3D-объекта» из глобального в локальный режим работы, нажмите переключатель «Глобально» в разделе «Параметры» на панели «Инструменты», когда выбран инструмент «Перемещение 3D-объекта». Можно временно переключить режим работы из глобального в локальный, нажав клавишу «D» при перетаскивании инструментом «Перемещение 3D-объекта».
Инструменты «Перемещение 3D-объекта» и «Поворот 3D-объекта» вызываются одной и той же кнопкой на панели «Инструменты». Щелкните и удерживайте значок активного трехмерного инструмента на панели «Инструменты», чтобы переключиться на другой, неактивный в данный момент трехмерный инструмент.
По умолчанию выбранные объекты, для которых было применено перемещение 3D-объекта, в рабочей области отображаются с наложенными трехмерными осями. Это наложение можно выключить в разделе «Общие» в настройках Animate.
Наложение инструмента «Перемещение 3D-объекта».
Примечание.
Изменение положения трехмерного фрагмента ролика по оси Z приведет к тому, что он изменит свое положение по осям Х и Y. Это вызвано тем, что движение по оси Z идет вдоль невидимых линий перспективы, которые исходят из точки исправления 3D-перспективы (заданной в инспекторе свойств экземпляра 3D-символа) до границ рабочей области.
Перемещение отдельного объекта в трехмерном пространстве Перемещение нескольких выбранных объектов в трехмерном пространствеЕсли выбрано несколько фрагментов ролика, можно переместить один из выбранных объектов с помощью инструмента «Перемещение 3D-объекта» , после чего остальные переместятся точно таким же образом.
Чтобы таким же образом переместить каждый объект в группе в глобальном трехмерном пространстве, переключите инструмент «Перемещение 3D-объекта» в глобальный режим работы, а затем перетащите один из объектов с помощью управляющих элементов оси. Удерживая нажатой клавишу Shift, дважды щелкните мышью один из выделенных объектов, чтобы переместить к нему управляющие элементы осей.
Чтобы таким же образом переместить каждый объект в группе в локальном трехмерном пространстве, переключите инструмент «Перемещение 3D-объекта» в локальный режим работы, а затем перетащите один из объектов с помощью управляющих элементов оси. Удерживая нажатой клавишу Shift, дважды щелкните мышью один из выделенных объектов, чтобы переместить к нему управляющие элементы осей.
Также можно переместить управляющие элементы в центр группы выбранных объектов, дважды щелкнув управляющий элемент оси Z. Удерживая нажатой клавишу Shift, дважды щелкните мышью один из выделенных объектов, чтобы переместить к нему управляющие элементы осей.
Вращение объектов в трехмерном пространствеДля поворота экземпляров фрагмента ролика в трехмерном пространстве используется инструмент «Поворот 3D-объекта» . Управляющие элементы инструмента «Поворот 3D-объекта» появляются над выделенным объектом в активной области. Управляющий элемент для оси X показан красным цветом, для Y - зеленым, а для Z - синим. Используйте оранжевый управляющий элемент свободного вращения, чтобы одновременно поворачивать объект вокруг осей X и Y.
По умолчанию для инструмента «Поворот 3D-объекта» задается глобальный режим работы. Поворот объекта в глобальном трехмерном пространстве равносилен перемещению его относительно рабочей области. Поворот объекта в локальном трехмерном пространстве равносилен перемещению его относительно родительского фрагмента ролика, в котором он содержится. Чтобы переключить инструмент «Поворот 3D-объекта» из глобального в локальный режим работы, нажмите переключатель «Глобально» в разделе «Параметры» на панели «Инструменты», когда выбран инструмент «Поворот 3D-объекта». Можно временно переключить режим работы из глобального в локальный, нажав клавишу «D» при перетаскивании инструментом «Поворот 3D-объекта».
Инструменты «3D-перенос» и «Поворот 3D-объекта» вызываются одной и той же кнопкой на панели «Инструменты». Щелкните и удерживайте значок активного трехмерного инструмента на панели «Инструменты», чтобы переключиться на другой, неактивный в данный момент трехмерный инструмент.
По умолчанию выбранные объекты, для которых был применен поворот 3D-объекта, в рабочей области отображаются с наложенными трехмерными осями. Это наложение можно выключить в разделе «Общие» в настройках Animate.
Наложение инструмента «Глобальное Поворот 3D-объекта».
Наложение инструмента «Локальное Поворот 3D-объекта».
Откройте панель «Преобразование» (выберите в меню «Окно» > «Преобразовать»).
Выберите один или несколько фрагментов ролика в рабочей области.
На панели «Преобразование» введите требуемые значения в полях X, Y и Z для поворота 3D-объекта, чтобы повернуть выделенные объекты. Эти поля содержат выделенный текст, поэтому значения в них можно изменять перетаскиванием.
Примечание.
Поворот 3D-объекта происходит в глобальном или локальном трехмерном пространстве, в зависимости от текущего режима инструмента «Поворот 3D-объекта» на панели «Инструменты».
Чтобы переместить точку поворота 3D-объекта, введите требуемые значения в поля координат X, Y и Z для центральной точки поворота 3D-объекта.
Настройка угла перспективыСвойство угла перспективы в FLA-файле управляет видимым углом обзора трехмерных фрагментов ролика в рабочей области.
Увеличение или уменьшение угла перспективы влияет на видимый размер трехмерных фрагментов ролика и их местоположение относительно границ рабочей области. Увеличение угла перспективы приближает трехмерный объект к зрителю. Уменьшение угла перспективы удаляет трехмерный объект от зрителя. Этот эффект сходен с увеличением или уменьшением масштаба с помощью объектива камеры, когда изменяется угол обзора через объектив.
Рабочая область с углом перспективы 55 градусов.
Рабочая область с углом перспективы 110 градусов.
Владельцам магазинов и фотографам: как получить вращающиеся изображения предметов (товаров) на сайте, в интернет-магазин е
Съёмка и подготовка вращающихся 3D изображений проводится в два этапа:
1й этап - фото или видео съемка предмета на поворотном столеФотографируемый предмет помещается в центр диска поворотного стола.
Камера устанавливается на штатив, настраивается оптимальное освещение.
Отличные результаты даёт съёмка в лайткубе - в нём проще освещать предмет, тени хорошо рассеиваются. На фоне белых стенок лайткуба меньше заметны края белого поворотного круга.
Фокусное расстояние объектива обычно устанавливается в интервале от 50мм до 120мм. Чтобы передать правильные пропорции и форму фотографируемого предмета, расстояние от предмета до объектива камеры должно быть существенно больше, чем размеры самого предмета. Желательно, чтобы в кадр не попадал передний край диска поворотного стола, и также боковые края диска слева и справа от предмета. Если в кадре не будет ничего постороннего, и экспозиция будет настроена правильно, то вам не потребуется трудоёмкая обработка отснятого фотоматериала (либо обработка будет очень простая).
Затем предмет фотографируется (или снимается видео) при разных углах поворота диска. Обычно делается полный оборот на 360 градусов или несколько больше.
Видео . Результатом съёмки видео будет один видеофайл, его можно обработать, например, программой .
Фотосъёмка . В результате 3D фотосъемки получаем серию однотипных фотографий предмета с разными углами поворота относительно фотокамеры:
По завершении съемки предмета, чтобы не запутаться, перенесите отснятые файлы на ваш компьютер и сложите их в отдельную папку. Папке лучше присвоить название по артикулу или наименованию только что отснятого предмета. Если ваша фотокамера не имеет прямого подключения к компьютеру, или копировать файлы в процессе съемки вам не очень неудобно, есть другое решение: делайте пустой кадр - "отбивку" между съемками разных предметов. Например, фотографируйте пустой стол без предмета, или цветную карточку, или свою руку. По окончании съемок всех предметов вы перенесёте файлы на компьютер и легко отделите серии кадров друг от друга - кадры "отбивки" вам помогут.
Получив исходный фотоматериал, переходим к его обработке.
2й этап - создание вращающихся 3D фотоизображений объектов (предметов, товаров)Серии фотографий предмета обрабатываются одним из нескольких способов:
1) Специальные сайты для автоматического создания вращающихся изображенийРекомендуем вам сайты sirv.com , 3dbin.com и megavisor.com . Эти сайты позволяют быстро получить готовые вращающиеся изображения из серии фотографий предмета на поворотном столе. Отличное решение "для чайников" и неспециалистов! Поддерживается вращение мышью влево-вправо, дополнительно можно включить или выключить самостоятельное вращение изображения "волчком".
Процесс работы очень простой: вы регистрируетесь на сайте с желаемым логином и паролем, загружаете отснятую вами серию фотографий в соответствующее окно, и сразу же получаете готовое вращающееся на 360 градусов изображение, а также ссылку в формате html для вставки на ваш сайт. Чтобы вращающееся изображение появилось на вашем сайте (в блоге, в соцсети), вам достаточно скопировать и правильно вставить на страницу вашего сайта html-ссылку. Точно так же, как вставляются ссылки на видео с YouTube.
Преимущество сайтов sirv.com , 3dbin.com и megavisor.com : от вас не требуется никаких специальных знаний, не нужно изучать программы, вся обработка происходит автоматически.
Есть бесплатные и платные варианты пользования этими сайтами, бесплатные имеют некоторые ограничения по количеству создаваемых проектов. Сайты англоязычные.
2) Простое вращение на HTML5 - готовое бесплатное решение для вашего сайтаФотоизображения отображаются в виде вращающейся картинки с помощью специального плеера (скрипта), установленного на сайте. Исходные изображения (фазы вращения предмета) помещаются в отдельную папку, а их отображение на странице сайта осуществляется скриптом (JavaScript), встроенным на страницу. Этот способ анимации гарантирует отличную работу на любых мобильных устройствах и компьютерах, без ограничений.
Для вашего удобства мы подготовили пример простого скрипта с описанием. Вы можете применить его на вашем сайте. Подготовлены заготовки-шаблоны на разное количество ракурсов - скачайте их бесплатно и используйте
3) HTML5 анимация с помощью программы Object2VRObject2VR на сегодня самая популярная программа для получения вращающихся изображений из серии фотоизображений.
Преимущество формата HTML5: совместимость практически со всеми устройствами и операционными системами.
4) HTML5 и GIF анимация с помощью программы 360° Product ViewerСоздание вращающихся 3D изображений в формате HTML или GIF, по вашему выбору. Программа удобна и проста в освоении!
Создание ролика в формате HTML: Программа 360° Product Viewe r автоматически создаёт набор папок с файлами, которые достаточно вставить на сайт, сделать ссылку на файл index.html и вы получите на экране вращающееся изображение предмета. Есть включение/выключение кнопок управления вращением, настройка скорости вращения, зумирования и т.д. Можно вставлять свой логотип в ролик. Пользоваться этой программой очень просто, единственный недостаток: программа не русифицирована (тексты на английском), но всё интуитивно понятно. Демо-версия 360° Product Viewer по умолчанию вставляет в окошко с изображением небольшой логотип "YoFLA". Есть несложный способ удаления этого логотипа, при желании можно подставить вместо него собственный текст. Преимущества формата HTML: вращение без проблем отображается на любых мобильных устройствах!
Создание ролика в формате GIF: Программа 360° Product Viewer создаёт файл GIF-анимации, сразу же готовый для загрузки на сайт. Демо-версия не вставляет логотип производителя в GIF-ролик, поэтому можно спокойно пользоваться данной программой без регистрации. Очень просто и удобно работать!
Программу 360° Product Viewer можно бесплатно загрузить с сайта:
http://www.yofla.com/3D rotate/download/
Создание вращающихся 3D изображений на Javascript, а также в формате GIF
Программа WebRotate 360 Product Viewer отличается разнообразием настроек, предусмотрена пакетная обработка изображений (ретушь, коррекция, обрезка и т.д.).
Скачайте Руководство пользователя к программе WebRotate 360 Product Viewer
(на английском):
webrotate360.pdf
Программу WebRotate 360 Product Viewer
можно бесплатно загрузить с сайта:
http://www.webrotate360.com/360-product-viewer.html
Преимущества формата GIF:
-
GIF анимацию легко сделать, даже не имея навыков,
-
картинка GIF без проблем отображается на всех мобильных устройствах.
Недостаток: невозможно управлять вращением (вращение только безостановочное и только в одном направлении).
Для создания роликов в формате GIF существует множество специальных программ GIF анимации, например:
- PhotoScape
. Простая и удобная бесплатная программа. Есть предварительная обработка изображений. Понимает различные форматы фотографий. Лучше других подходит для роликов с неполным вращением предмета (качание влево-вправо, ping-pong, bounce)
- UnFREEz
. Предельно простая бесплатная программа. Недостаток: не умеет обрабатывать картинки, работает только с уже подготовленным набором картинок в формате GIF
- 360° Product Viewer
. Даёт великолепные результаты. Для создания GIF-роликов не обязательно покупать зарегистрированную версию
-
- Easy GIF Animator
, Babarosa Gif Animator
, Advanced GIF Animator
и др.
Все эти программы можно найти и скачать в интернете. Освоить работу с программами GIF-анимации совсем несложно. Освоив технологию, можно быстро наполнить сайт вращающимися изображениями товаров.
Программа позволит создать интерактивные 3D изображения и встроить их в
каталог вашего сайта всего за 3 шага:
1. Снимите видео вращающегося объекта. Вам понадобятся лишь цифровая
камера, свет, фон и поворотный стол.
2. Отснятое видео загрузите в программу. 3D изображение будет готово
всего через 2 минуты.
3. Загрузите готовое изображение в свой аккаунт на платформе Cappasity и
встройте его на сайт, в мобильное или VR/AR приложение.
В результате:
Независимо от выбранного вами способа анимации, зрители увидят на вашем сайте анимированное изображение предмета с правильным равномерным вращением. Все варианты, кроме GIF, поддерживают вращение мышью.
Характер вращения предмета
Вращение предмета может быть полным (на 360 градусов) или частичным (качание предмета влево-вправо, ping-pong, bounce):
Применение поворотного стола с лайткубом
Лайткуб даёт широкие возможности по управлению светом, при этом источники света могут быть практически любые. Даже недорогие светодиодные рефлекторные лампы дают хороший результат.
Освещение при съемке одежды на манекенах .
Позади поворотного стола со стоящим на нём манекеном вешается белый бумажный фон или ставится большой лист оргалита (фанеры), покрашенный обычной белой акриловой краской. Особенность этой схемы освещения: фон освещается отдельно, а предмет одежды на манекене - отдельно. Задача фонового освещения - сделать фон равномерно белым. Для этого обычно применяется два источника света, стоящие справа и слева от предмета вне кадра, и направленные на фон. А фотографируемая одежда освещается также двумя источниками света спереди и чуть сбоку справа и слева, чтобы правильно передать объем и текстуру одежды.
Подробнее о различных моделях поворотных столов для 3D фотосъемки, видеосъемки, 3D сканирования:| Поворотные столы для 3D съемки предметов с вращением диска рукой (серия M) | Автоматические поворотные столы большой грузоподъемности для 3D съемки (серия SA) | ||||
Самые низкие цены, неубиваемая конструкция, быстрая окупаемость. Удобен для съемки в лайткубе. Идеальный вариант для небольших интернет-магазинов и частных фотографов
Цены
|
Вследствие того, что CSS развивается стремительными темпами и создавать анимацию стало еще проще без использования Javascript на многих сайтах появились очень интересные элементы, которыми нельзя не заинтересоваться. В сегодняшнем уроке мы посмотрим как можно создавать анимацию с помощью ключевых кадров (это еще интереснее чем просто с помощью CSS преобразований). Также наша анимация будет находится не просто в одной плоскости, а будет с эффектом 3D. Если вы не знаете для чего и где можно применить такой эффект — переходите в полную новость и там я вам об этом расскажу. Если CSS преобразований из предыдущей серии уроков работали в браузерах Firefox, Chrome, Safari и Internet Explorer 10+, то в при создании 3D анимации она будет работать только в WebKit браузерах и браузере Mozilla. Самые простые преобразования будут работать и в IE10, но что-то более сложное — нет, так как этот браузер не поддерживает параметр preserve-3d для создания 3D слоев. Анимация CSSАнимация, которую мы создадим будет содержать в себе изображение, которое вращается вокруг оси Y: Классно?! Для тех, у кого нет анимации 😉 : Немного HTMLВсё понятно и просто в HTML структуре: Ключевые кадры CSSЧто такое ключевые кадры? В блоке @keyframes находится ряд правил, которые называются ключевыми кадрами. Ключевые кадры содержат свойства, которые применяются в определенный момент времени при анимации. При анимации значения интерполируются («плавно переходят» от одного значения к другому) и мы видим лишь плавный переход. Вам это может показаться сложным, но это один из самых простых примеров. Определим начальный и конечный ключевой кадр:
Кроме ключевых кадров нас также интересует @keyframes spinner , где мы указываем на что будем ссылаться при анимации позже, а именно на spinner . Создаем сценуНам нужен элемент, в котором наша анимация обрела бы объем и появился эффект объема. Сцена, в отличие от вращающегося изображения, зафиксирована на странице. Для сцены мы будем использовать новое для нас свойство perspective , которое придает глубину. Значение задается в пикселях. Оно определяет расстояние от пользователя до элементов в перспективе. Знаю, это сложно сразу понять 🙂 . Давайте уменьшим с 1200px до 300px и взгляните на результат ниже: Классно?! А также видео: Связываем анимацию с элементомСейчас вы увидите еще несколько новых свойств. И я даже не хочу вас сразу заставлять их запоминать сразу и разбираться в значениях. Можно поступить иначе: вы просто на них посмотрите и что поймете, то поймете. На самом деле, изучая дальше уроки вы будете встречать их часто и начнете понимать для чего они. Поэтому не волнуйтесь на счет того, что их много и вы не знаете и не понимаете что-то! А свойства следующие:
Я подписал свойства без префиксов, потому что те выполняют аналогичные функции, только для других браузеров. Также хочу заметить что мы останавливаем анимацию с помощью специального свойства animation-play-state при наведении на изображение. |
