Перейти к содержимому


!!! Только у нас на форуме !!!
Спектакли от дяди Пчёлки

для просмотра необходима регистрация
Фотография

как сделать "интерактивное" фото "для сравнения до и после


  • Please log in to reply
17 ответов в этой теме

#1 Verendey

Verendey
  • Участник
  • 19 201 Сообщений:

Отправлено 31 мар 2016 - 20:09

Периодически вижу в сети фотки с возможностью посмотреть "до и после" с помощью клика мышкой (или более сложные формы, как тут)  

Может кто знает как это делается? мне очень интересна эта технология!


  • 0

#2 jurisviii

jurisviii
  • Участник
  • 3 641 Сообщений:

Отправлено 31 мар 2016 - 20:47

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

Spoiler

Сам скрипт находится на странице выше.


  • 0

#3 Verendey

Verendey
  • Участник
  • 19 201 Сообщений:

Отправлено 31 мар 2016 - 21:08

понятно... что мне это не освоить   :fie: 

"когда слышу слово "скрипт" - хватаюсь за... сердце"  )))
 

PS вот где-то тут (на 1 DV)  недавно мелка ссылка на онлайн сервис, позволяющий делать " 2 фото по очереди в одной рамке" (в хорошем качестве, не gif анимация)  но я (дурак) её не сохранил (( 


  • 1

#4 Sego

Sego
  • Модераторы
  • 16 344 Сообщений:

Отправлено 31 мар 2016 - 21:12

:yes: 


  • 0

#5 Verendey

Verendey
  • Участник
  • 19 201 Сообщений:

Отправлено 31 мар 2016 - 22:15

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

Может кто подскажет как правильно задать вопрос яндексу? я уже 2 часа безрезультатно ищу (((


  • 0

#6 Sego

Sego
  • Модераторы
  • 16 344 Сообщений:

Отправлено 31 мар 2016 - 22:48

не, я не знаю, меня улыбнуло это -  но я (дурак) её не сохранил (( 

 

 (патамушто сам такой)  :close_tema:


  • 0

#7 Степных Александр

Степных Александр
  • Участник
  • 9 151 Сообщений:

Отправлено 31 мар 2016 - 23:09

http://zurb.com/play...nd/twentytwenty


  • 0

#8 Verendey

Verendey
  • Участник
  • 19 201 Сообщений:

Отправлено 31 мар 2016 - 23:17

Нифига не понял - там опять какие-то скрипты.. ты сам с помощью этой ссылки сможешь сделать?


  • 0

#9 Степных Александр

Степных Александр
  • Участник
  • 9 151 Сообщений:

Отправлено 31 мар 2016 - 23:32

Ой. вряд ли......


  • 0

#10 Dick

Dick
  • Участник
  • 11 196 Сообщений:

Отправлено 01 апр 2016 - 02:43

PS вот где-то тут (на 1 DV)  недавно мелка ссылка на онлайн сервис, позволяющий делать " 2 фото по очереди в одной рамке" (в хорошем качестве, не gif анимация)  но я (дурак) её не сохранил (( 

 

Это я давал. Но это именно ГИФ-анимация.... лежит ссылка в нашей теме по созданию ГИФов.

Да и просто в Поиск забить "Создание GIF он лайн". Там можно выкладывать фото с хор. разрешением и задавать время смены снимков

На выбор:

ТУТ

ТУТ

Я пользовался таким ГИФом, когда сравнивал фото до и после обработки. Очень наглядно. Ставил интервал смены где-то 3 сек... Но надо подписывать, что это ГИФ, чтобы зритель ждал изменения картинки, а не соскочил...

 

Да и самому по той теме соорудить в простой проге ГИФчик не проблема. Я свой курящий аватар сделал на раз.


Сообщение отредактировано Dick: 01 апр 2016 - 03:21

  • 0

#11 Verendey

Verendey
  • Участник
  • 19 201 Сообщений:

Отправлено 01 апр 2016 - 04:21

Спасибо. Но гиф не подходит. Качество сильно теряется.
Сервис гугл фото тоже делает гифки https://goo.gl/photo...EZtVNoeV1oFFhw7
Но качество не то.
Наверное не здесь видел, скорее на фж
А ещё в гугл фото есть бесплатное хранилище для неограниченного количества фото во вполне приличном разрешении (4000 с чем то на 3000 px)... И есть автозагрузка. Я её включил и он закачал туда уже несколько сотен моих фото. Загружает неспешно, но думаю за несколько дней загрузит все фотки с компа)
Резервное хранилище)
  • 0

#12 Степных Александр

Степных Александр
  • Участник
  • 9 151 Сообщений:

Отправлено 01 апр 2016 - 06:53

А ещё в гугл фото есть бесплатное хранилище для неограниченного количества фото во вполне приличном разрешении (4000 с чем то на 3000 px)... И есть автозагрузка. Я её включил и он закачал туда уже несколько сотен моих фото. Загружает неспешно, но думаю за несколько дней загрузит все фотки с компа)
Резервное хранилище)

Мне это очень нравится! надо будет присоединиться


  • 0

#13 DiSel

DiSel
  • Модераторы
  • 1 541 Сообщений:

Отправлено 06 апр 2016 - 12:29

Коллеги и друзья, прошу прощения за медлительность.

 

Набросал на коленке скрипт для сравнения фотографий: http://video007.ru/2020/index.html

 

 

Для работы нужно взять ссылки на изображения из открытых источников (т.е., если картинка находится в личном почтовом ящике или закрытом альбоме Яндекса/Гугла - может сработать только для авторизованного пользователя, а для стороннего - уже нет). Загрузку файлов не стал делать, т.к. это тянет за собой ещё немного дополнительной работы. А у меня сейчас два нажатия на кнопку могут растянуться на 4 часа :)

 

Вставляются ссылки, нажимается кнопка, загружаются картинки. Ширина ограничена 1000 пикселов, но это условные ограничения, если будет мешать - можно увеличить. По высоте не ограничивается. Работает и для портретных и альбомных.

 

Увы, только для личного пользования - нет возможности указать фотки и дать клиенту прямую ссылку на их сравнение.


Одно существенное ограничение - картинки должны совпадать по размерам. Иначе поведение непредсказуемо.


  • 0

#14 Verendey

Verendey
  • Участник
  • 19 201 Сообщений:

Отправлено 06 апр 2016 - 13:53

Дима, раз уж ты вынес на публичное обсуждение  :crazy:  скопирую сюда из письма) 

 

  • главная задача этой "сравнилки"  показать заказчику (или коллеге) "До и после". с минимальным количеством действий: С помощью ссылки в письме или на форуме. в  таком виде она бессмысленна - я только жене могу показать))) ...
  • я догадываюсь/предполагаю что "гости" могут заDDoS-ить страницу, если мы будем делать её публичной, нужно предусмотреть и это. Может Ограничить кол-во загрузок (10 в день для одного посетителя и не более 1000 посетителей в день) и ограничить срок хранения 10 дней
  •   Размер нужно делать на весь монитор 1920 по длинной стороне (можно ли выводить вообще без полей? Если нет, то на максимум площади)

  • 0

#15 Kolobokk

Kolobokk
  • Участник
  • 2 377 Сообщений:

Отправлено 06 апр 2016 - 16:18

Нифига не понял - там опять какие-то скрипты.. ты сам с помощью этой ссылки сможешь сделать?

 

1. Просто скачайте архив из ссылки http://zurb.com/play...nd/twentytwenty на жёсткий диск компьютера и распакуйте.

2. В папку img сложите свои фотографии в замен имеющихся, если лень переименовывать пути. Можно и сам html поправить, например, заменить надписи на свои. Откройте его в текстовом редакторе и через Ctrl+F найдите оригинальную надпись и замените своей. Только сохраняйте в формате UTF-8.

3. Запустите файл с расширением html. Он должен открыться в вашем браузере, установленном по умолчанию.

4. Когда вы убедитесь, что браузер показывает ваши картинки и текст верный, сохраните файл в формате mht. Это, чтобы был всего один файл, а не куча. Его и можно отправлять заказчику. Правда, некоторые браузеры, например - Internet Explorer, могут ругаться на активное содержание (скрипт). Пользователь должен дать разрешение на использование заблокированного содержания. Можно его предупредить.


  • 0

#16 Verendey

Verendey
  • Участник
  • 19 201 Сообщений:

Отправлено 06 апр 2016 - 17:30

спасибо... но вы читали статью DiSel?

так будет удобнее для рядового пользователя...\

 

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


  • 0

#17 Kolobokk

Kolobokk
  • Участник
  • 2 377 Сообщений:

Отправлено 06 апр 2016 - 20:58

спасибо... но вы читали статью DiSel?

так будет удобнее для рядового пользователя...\

 

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

Статью не читал. Дайте ссылку. Но, если вы о посте, что чуть выше, то видел. Вы что же заставите заказчика чего-то там загружать и прочее за его же деньги. Вы же не сможете контролировать процесс и получите обычный "испорченный телефон".

 

Не нужно никакого программирования. Вы просто кладёте в папку картинки и подписываете их теми же именами, что там уже есть. Вы наверное даже архив тот не скачали, а уже выводы сделали.

 

Вы же сохраняли веб страницу на заре Интернета, когда за каждое скачивание нужно было платить... При её сохранении, тоже образовывалась подобная папка с файлами, где лежали картинки, файлы стилей, скриптов и т.д. А можно было ту же страницу сохранить один файлом. То есть, это обычные пользовательские операции с обычным браузером.

 

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


  • 0

#18 Verendey

Verendey
  • Участник
  • 19 201 Сообщений:

Отправлено 06 апр 2016 - 21:52

исправляюсь) 

пошел пробовать ваш "двадцать/двадцать) 


***

протестил, вот что обнаружил:

  1. папка одна и фотки обязательно переименовывать по шаблону 1_1.jpeg 1_2.jpeg
  2. выводится в маленьком размере и ... "в двух вариантах" см. фото 
  3. 9297683m.jpg 
  4. При попытке сохранить Html  "веб страница, только html"  - сохраняет файлик 3 кб и он не работает (
  5. при сохранении "web страница полностью" - работает, но...  а) неудобно пересылать папку+файл (или архив) с долгим объяснением, что нужно скачать файл и папку в одну папку, потом кликнуть... и т.п.  НО если бы оно сохраняло на весь экран, я бы смирился.. 

Вывод  (мой, внутренний  :yes: )  - скриптом можно пользоваться, если его поправить - оставить только 1 картинку и в большом размере 1920х1080... 

В том виде, что есть этот скрипт пока просто игрушка 


Сообщение отредактировано Verendey: 06 апр 2016 - 21:52

  • 0


0 человек читают эту тему

0 пользователей, 0 гостей, 0 скрытых пользователей

Rambler's Top100