Как сделать перелистывающийся фотоальбом

Добавил пользователь Алексей Ф.
Обновлено: 04.10.2024

Войти

Авторизуясь в LiveJournal с помощью стороннего сервиса вы принимаете условия Пользовательского соглашения LiveJournal

Делаем флип-книгу, которую можно листать

fotovivo

Такую, как в предыдущей записи, делают специальной программой.
Т.е. можно, конечно, и универсальным Flash Maker-ом, но существуют специализированные для эффекта переворачивающихся страниц.
С понятным и дружелюбным интерфейсом.
Оптимальный вариант по соотношению "замороченность - качество": FlipALBUM .
Даже древняя, 2012-го года portebl-версия имеет приличный функционал (не требует установки, сразу по скачиванию готова к работе):

fotovivo

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

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

Внизу в том же разделе настроек можем добавить музыку к альбому.

fotovivo

Имеется встроенный графический редактор для ресайза и обрезки изображений. Подправили - жмите ОК.
Лупа вызывает предпосмотр страниц.

fotovivo

Сиреневая вкладка Page Info предназначена для редактирования выбранной страницы.
Слева поле для текста и заголовка с опциями шрифтовых эффектов (+ можно добавить активную ссылку)
Опция "слой" (синий квадрат) layout - определяет будет ли текст расположен поверх фона или над/под ним

fotovivo

Предлагается несколько предустановленных фоновых картинок или можно тут же закачать свою.
(т.е. у нас уже есть страница с изображением или текстом и плюс к этому можно установить фон).
Если есть желание в рамочку - придется обойтись штатными.

fotovivo

Настроить стиль (фон, надписи, интерактив) можно на всех страницах разом или на нескольких избранных -
если кликнуть, зажав ctrl - выделятся те, по которым кликнули; чтобы выделить все - клик по верхней, прокручиваем (за полосу прокрутки сбоку) и зажав shift клик по нижней - всё тоже самое, как в обычных системных папках.
Обратите внимание: звездочкой обозначено положение странички на книжном развороте.

По дефолту установлен фоновый градиент "выпуклая страница".

fotovivo

Смысл настраивать фон есть только если размер загруженного содержимого меньше страниц альбома.

fotovivo

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

Переходим на зеленую вкладку - приступим к формированию обложки.
Всё так же, как для страниц: выбираете бэкграунд - картинку для обложки,
заполняете (или оставляете пустыми) текстовые поля:

fotovivo

Оборотная сторона обложки настраивается отдельно (или отметьте "flip style" - скопировать стиль)
На обороте автоматически формируется меню - превьюшки страничек,
если поставить галочку в нижний чек-бокс

fotovivo

Меню с полосой прокрутки.

Абсолютно анологичная процедура для задней обложки (желтая вкладка):

fotovivo

Если нужно добавляем текстовую аннотацию.
Позиция заголовка по вертикали регулируется ползунком справа.
Кроме набора (встроенных) шрифтов, есть настройка текстуры букв (внизу выпадающее меню).
Align - это центрирование/сдвиг влево-вправо.

fotovivo

В качестве бэкграунда для любого элемента можно поставить флеш из своих файлов
(хоть на каждую страницу). А поверх фонового флеша - еще и добавить
предустановленые флеш-фенечки (плюсик "add flesh").
Только поставьте галочку на "альфа"-канал, и, если ваш ролик исходно прозрачный - тоже.
Правда чтоб все это взлетело, придется запастись терпением, чем больше причуд, тем дольше грузится.

fotovivo

Нижний чек-бокс слева - "Flip style of end page" - скопировать стиль на обороте обложки.
Флеш тоже скопируется, работающий, в зеркальном отражении :)

fotovivo

Вернемся на страницу общих настроек и обратим внимание на нижнюю кнопку -

fotovivo

она предназначена для редактирования подложки - "рабочего стола", на котором располагается листаемая книга.
Разумеется, кроме предустановленной можно использовать свою.

Рассмотрим последнюю вкладку "расширенные настройки":

fotovivo

Вверху - автолисталка; задержка при старте;
отключение звука перелистываемых страниц;
ниже поля в пикселях и под ними - опция мягкой или жесткой обложки;
дальше настройки мелких деталей дизайна, с выпадающим меню и предпросмотром^
тень середины книжного разворота, стиль кнопок управления и
те самые рюшечки -"lace" или "standart" - изображение толстого книжного обреза.
Если нет желания возиться - оставьте все по умолчанию.

fotovivo

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

Вверху справа - кнопка предпросмотра -


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

fotovivo

"Сохранить Альбом" - это получить готовый флеш файл, который можно расшарить, переслать, разместить в сети.
"Экспортировать ХТМЛ код" - практически то же самое, только к флешке будет присовокуплена страница HTML, со встроенным файлом. (Типа как флеш-вставлялка для ЖЖ)

Какой бы программой или сервисом вы ни пользовались - "на вынос" формат будет тот же самый. Флеш.
Нет других вариантов, если книга предназначена для встраивания в блог или показа на сайте.
Видео в качестве выходного файла могут предложить. Его не полистаешь.
Исполняемый файл ехе (экзешник так называемый) - годится только для пересылки друзьям, которые вам очень-очень доверяют, как и файлы слайд-шоу/презентаций, которые зачастую могут быть открыты только в той программе, в которой созданы.

Офф-топом:
Многочисленные сервисы предлагают "издание" он-лайн книг.
У некоторых даже есть варианты с перелистыванием. Только у них на сайте.
Не вижу в этом смысла. Большую книгу так читать не удобно - долго.
Флешка - это игрушка, забава для блога.
Для скачивания электронные издательства выставляют обычные PDF, e-pub
(по отзывам - не лучшим образом скомпилированные). Офисный пакет делает тоже самое.
Еще проще не мудрить, формат HTML - универсальное решение для интернета.

В дополнение к предыдущим заметкам - как настроить Windows 10:

- Откройте браузер Microsoft Edge на компьютере.
- В правом верхнем углу щелкните значок .
- Выберите Настройки в нижней части меню.
- Щелкните Просмотреть дополнительные параметры в разделе Дополнительные параметры.
- Установите для параметра Использовать Adobe Flash Player значение Вкл.

Как включить Flash Player в Chrome:

Но есть упорные версии, где вместо "Allow sites" только белый список доверенных сайтов,
и даже собственного сочинения флешку не посмотришь, Хром ругается:

Перелистывающиеся страницы с фотографиями

Отлично. Только в Яндекс-браузере, в Хроме и в Опере у меня есть глюк — когда страница пролистывается, быстро 1 раз мелькает предыдущая. В Мозилле этого нет, там всё хорошо. У меня только такое или нет, не знаю.

Спасибо за замечание!
Что то от сайта мешает…
В вакууме все нормально, и даже с подключенными стилями этого сайта.
Сейчас буду смотреть, искать причину

Терпеть не могу такие непонятки, еще и для конкретного браузера.
Пока писал коммент, у меня стала мигать только одна страница..
Потом обновил — перестала мигать… еще раз обновил — начала.

Вчера буквально парился также с хромом из-за такого же мигания в нем 3д табов на мобильной версии. Там пришлось менять стиль трансформации…



Рекомендации:

Ох, Надежда Андреевна, Вы как всегда впереди всех! Офис 2016 наверное еще не скоро войдет в наше пользование. Сейчас очень многие предпочитают даже 2007, чем 2010.

Не виноватая я, Ольга Михайловна! Это всё он - сын! Что установил, тем и приходится пользоваться. Я долго привыкала к этому офису, да и до сих пор его изучаю, потому и случайно, совсем недавно, обнаружила этот переход Мой любимый "выцветание" на время в тень ушёл.
А уж как огорчилась, что он не у всех работает

Здорово, когда есть такие люди, которые поднимают нам планку. Хочется тоже "расти", достигать, покорять высоты мастерства. Спасибо, Надежда Андреевна.

Не по своему желанию, Ирина Николаевна Но сын сказал, что надо шагать в ногу со временем, вот и. "тащусь", осваиваю возможности офиса

Надежда Андреевна! У меня в 10 видимо такого перехода нет, потому что ничего не происходит, но в любом случае спасибо за новые идеи.

Искренне жаль, Лидия Петровна, что у Вас этого перехода нет, но я дала ссылки на статьи, может они Вам как-то помогут

Вера Витальевна, в пояснительной записке к работе я объяснила, в чём дело, и дала после "Источников информации" "Ссылки статей по устранению проблемы"
Всё дело в офисе 2016 года, который поддерживается 2013, у некоторых и 2010 годом, а вот более ранние офисные программы, к сожалению, этот переход не поддерживают

Надежда Андреевна, спасибо за чудесные шаблоны книг. Ваш ресурс облегчит работу при создании презентации с приемом "Листание"

Работа прекрасная! Но увы, воспользоваться нет возможности! Творческих Вам, Надежда Андреевна, успехов и вдохновения.

Calameo – это он-лайн сервис (его не надо устанавливать у вас на компьютере) для размещения вашей 3D книги с эффектом перелистывания страниц. Таким образом книга, журнал, брошюра, фотоальбом и многое другое передается путем ссылки на вашу публикацию.


Сервис очень удобен тем, что:

1) сервис на русском языке;

3) нет лимита на количество размещенных на сервисе страниц;

4) просмотр статистики;

5) можно комментировать и давать оценки тем или иным публикациям;

6) хранить понравившееся вам публикации в избранном;

7) публиковать и распространять свои flash публикации он-лайн через ссылку;

8) есть каталог по рубрикам — не нужно долго искать нужную вам тему.

Пример flash журнала с эффектом перелистывания страниц:


Для выбора темы, которая вас интересует заходим в “Просмотр”:



На сервисе есть рубрика “Группы” в которые можно вступить после регистрации:

Есть рубрика “Сообщество” на которой можно объединиться, так же есть социальные сети, если нажать на вкладку “Пригласить друзей”:


Можно просмотреть статистику:




После регистрации вам предлагают четыре варианта аккаунта для расширенного просмотра вариантов нажмите на вкладку “Сравнить наши планы”:


После нажатия на вкладку “Сравнить наши планы” откроется расширенный план:


Ваш аккаунт сразу после регистрации:


Создание новой flash публикации с эффектом перелистывания страниц:

В своем аккаунте нажимаем на “Создать публикацию”, загружаете файл кнопкой “Просмотр”, заполняете все поля. Для дополнения публикации есть вкладки: “Дополнительные опции”, “Возможности распространения”, “Персонализация публикации”:


После того как вы заполнили все поля нажимаем “Начать загрузку”:


После чего ваша публикация успешно опубликована:



Он-лайн сервис Calameo – для 3D книги с эффектом перелистывания страниц доступен всем и прост в эксплуатации.

П. С. Если Вас интересует набор программ для компьютера, читайте: Необходимый набор программ для компьютера

Маркетолог, вебмастер, блогер с 2011 года. Люблю WordPress, Email маркетинг, Camtasia Studio, партнерские программы)) Создаю сайты и лендинги под ключ НЕДОРОГО. Обучаю созданию и продвижению (SEO) сайтов в поисковых системах. Мои контакты >>>

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

Читайте также: