Pull to refresh

Comments 35

Только утром увидел статью на Prismatic-е, зашел на Хабр — перевод, оперативненько — спасибо! У меня давно были мысли по поводу точки фокуса и использования ее при кадрировании. Но вот чтоб вот так прямо на CSS — и подумать не мог.

И все же мне кажется, лучше готовить изображения заранее. Как раз вчера выпустил новую версию бесплатной программы для создания html сайтов WebProject, в которую добавил графический редактор и возможность автоматом кропить и ресайзить изображения при сборке сайта. Вот как раз такая функциональность там бы очень пригодилась. Пожалуй займусь реализацией.
Ну это как посмотреть. Просто карма плавно сконвертировалась в посетителей сайта и пользователей программы. Это был по большей части эксперимент. Полную статью на Хабре в «Я пиарюсь» я планировал написать через недельку, а тут зашел с утра на Призматик и такая статья интересная попалась, прочитал — оценил, сделал выводы.

Зашел на Хабр, а тут перевод, ну думаю, статья по теме, наверняка выйдет на главную, коммент первый — скандальный, наверняка народ пойдет глянуть. Ну и подумал, а дай-ка эксперимент поставлю — насколько сильно уронят комментарий, карму и во что это сконвертируется. Устроил себе реалитишоу сегодня смотрел как тихонько тает карма и конвертируется в установки программы. :)

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

Я тоже люблю, когда кармы до жопы, и можно позволить себе в комментариях какую-нибудь непотребность. Мне как-то за один тридцать пунктов сняли — и ничего, живу.
Друзья, резюмирую — пиар действительно не удался. С хабра пришло 457 человек. Расплата кармой -10 (голосов было больше, но как в минус так и в плюс). Количество пользователей программы за день — 37 (это на уровне среднего значения до заминусованного пиарного коммента в топике). Т.е. пиариться таким образом невыгодно, лучше писать нормальную, дельную и полезную статью в «Я пиарюсь». У статьи есть еще одно преимущество, с Хабра активно перепечатывают, поэтому вы получаете дополнительные переходы с других источников.

Ивниняюсь перед теми, чьи чувства я задел своим первым комментом, постараюсь больше так не хулиганить.
Конвертация кармы в трафик.
Недостатком фреймворка является необходимость заключать изображение в два div'а
Если для изменения масштаба фотографии мне нужно поменять лишь цифры в именах классов (right-, up- ), тогда не страшно :)
Если расчет ведется от центра, то и координатную сетку стоило расположить на фотографии так же — было бы понятнее (0 в центре + — расходятся в стороны)
image

Мне одному кажется что здесь должно быть 2 Up и 2 Right?

И еще не понятно почему за центр они взяли строку 6, но столбец 7.
За центр явно взяты пересечение вертикали между 6 и 7 столбцом и такой же горизонтали. Тогlа и 3 Up сходятся и 3 right

Просто нарисовано криво. Не надо было закрашивать целиком квадраты, нужно был линии на диагоналях изобразить:

Блин, я думал по ссылке будут примеры неудачного или прикольного авто-кадрирования, типа какой-нить интересной части человеческого тела на весь кадр, а там тьюториал… Я разочарован… :)
Там материал для совершенствования подхода — не точки 1-12 на 1-12 надо делать, а зоны в которые их стоит ставить или не стоит. Я только показал, что задача несколько сложнее, чем кажется. Надо не просто указать точку фокуса, но и не дать ей переместится из «правильных мест» изображения.
Ну тогда надо не точку ставить, а прямоугольник указывать предпочтительного кадрирования. Я так скорее всего у себя в WebProject и сделаю.

А на CSS это здорово конечно, тем более, что с поддержкой ретины многие рекомендуют не ресайзить картинки, а наоборот делать разрешение в 2 раза больше, но вот проставлять такие свойства ручками утомительно. Нужен все же инструмент для этого.
Я не программист. С точки зрения программиста наверно все выглядит Ок. Задача есть, задача выполнена.

Я только подаю повод глубже посмотреть на задачу. И на проблемы, которые текущая реализация может вызвать. Возможно для программиста не кажется большой проблемой, что «точка фокусировки» сместится произвольно в другое место. Но это важно. Нельзя просто так взять и кропнуть. Для этого есть еще условия, кроме условия «вот тут не кропить».

Вот пример

image

В этом изображении можно двигать влево-вниз и вправо-вверх. Но не наоборот. Хотя именно в этом кадре вообще кропить уже нельзя — это законченное произведение.

image

А в этом примере вполне можно. Но нужно жестко привязать левый нижний угол. Диагональ должна проходить через него. А вот в верхнем правом это уже не так будет заметно.
По-моему и на картинке с мужиком, приведенной в топике, после кадрирования «полетела» композиция. Из-за обрезания картины взгляд уходит с картины направо.
В «оригинале» рама снизу торчащая тоже красивости не добавляет. Я наверняка не зашел-бы в этот пост, но вот именно иллюстрация «резанула по глазам». Что и послужило более внимательному чтению поста.
Любое кадрирование выполняемое не ради эстетических целей а для экономии места — полумеры. В примере поста, это очень удачные полумеры которые позволяют кадрировать фотографию так как это считает допустимым автор. Разумеется мадонну кадрировать смысла нет, но для обычных повседневных фотографий это очень удобный и грамотный ход.
В примере поста мы видим два варианта. А их может быть сколько угодно — именно для такого случая все и затевается — чтобы «само» вписалось/кропнулось не затронув важного. Но «важное» это не только что на фото, но и как оно расположено по отношению к другому важному и его место в кадре.
Не «само» а именно с указанием важных для сохранения смысла точек. Я полагаю автор фотографии сам выбирает что на его фотографии является важной частью и чем можно пренебречь для экономии места. И раз он решается на использование кропа — пренебречь есть чем.

Вы рассматриваете каждую фотографию как щедевр в котором каждый дюйм важен и ни от чего нельзя отказаться. А этот скрипт нужен для обычных повседневных фотографий в которых при необходимости, какую-то часть можно и откинуть ради увеличения на экране более важной части кадра
Это так не работает. У кадра есть «композиция» — если она изначально неправильная, испортить действительно уже не получится. Но исходить надо из того, что она есть и её нужно сохранить.

Ок. Я согласен, если человек сам выбрал данный инструмент — он осознанно пошел на такие. Я же предложил посмотреть на проблему шире.

К примеру можно добавить сетку «золотого сечения» с узлами привязки. Типовые варианты есть по ссылке — их всего несколько.
Сначала был человек с руками, потом стал человек с обрубками рук. IMHO, особо улучшений не наблюдается…
А вдруг дядька случайно в кадр с картиной попал?
Хватит все подряд, называть фреймворками, это — библиотека.
Мне кажется, этот метод крайне редко может быть применим. Единственный логичный вариант, который приходит на ум — адаптивные галереи, в которых и так по клику/тапу раскрывается полное изображение. В остальных случаях я просто не вижу смысла в использовании этой техники.
Отличная штука. Чего вы прицепились к композиции. Я как вижу, этот инструмент лучше всего подходит для оформления превьюшек. Часто замечал на разных сайтах, что превьюшка не соответствует самой фотке, показывает только одну из деталей.
Отличная полноразмерная превьюшка. А не проще заранее кропнуть как надо?
Для каких-то целей — проще и кропнуть. А для каких-то — проще использовать такую автоматизированную штуку.

Не надо драться за инструменты. Надо просто правильно подходить к их выбору.
Я хочу понять логику зачем такое надо? На первый взгляд идея кажется прекрасной. Но чем дальше, тем меньше я вижу мест, где её можно применить.

Я уже написал, чем идея таких превьюшек мне не понравилась — тем, что будут вкачаны все изображения из показываемого сета в полном их разрешении. Это трафик и время.

Автоматизации я тоже не вижу — точки фокуса проставляются в ручную. Все равно в итоге получается виртуальный кроп «потом» с непредсказуемыми размерами и с скачиванием клиентом полноразмерного изображения в любом случае.

С таким-же успехом можно сделать просто ресайз под текущее разрешение и не гадать что и как обрежется.
Не-не-не. Не скажите. Я считаю автоматический кроп хорошей и иногда очень полезной штукой. Вот у себя в программе, нудачно отпиаренной в первом комменте, я в шаблоне SimpleWeb как раз делаю автоматический кроп изображений для слайдера и «заголовочных» изображений для статей. Т.е. я не заморачиваюсь, просто прицепляю изображение к статье или слайдеру. А при сборке сайта, оно автоматически ресайзится и кропится. НО у меня в настройках автокропа в шаблоне есть параметр, как кропить — по центру или по верхней части или на уровне 25% от верха (это если портрет, то как раз обычно там лицо) и я выбираю параметр в зависимости от целей. Получается не идеально — но вполне сносно — зато экономия времени огромная.
Дело личное. Я бы много написал на эту тему, но не вижу особого смысла. Кончается это все такими статьями.

Мне, как работающему с изображениями, такой подход кажется работой спустя рукава. Кто-то к новостной статье лепит произвольную картинку по тегам и не видит проблем, а кто-то «на говно изойдет» из-за «не того» шрифта.

Да, я согласен, но ведь тут дело в целях и задачах. Вот пример, мне надо скриншоты разместить на странице, полноразмерные разместить прямо на месте не могу — место не позволяет. Ресайзить — артефакты будут от ресайза — буковки нечитабельные. Поэтому надо поместить кроп-вариант и по клику открывать полноразмерный. А кроп-вариант руками делать для каждого шота, выбирать композицию, да еще и уложиться в размеры дизайна страницы — этак жизни не хватит. Поэтому и делаю авто-кроп. Да, есть косяки, тут буковки торчат, тут линия висит, но каждый кроп доводить до совершенства я смысла не вижу, т.к. основная цель не в этом, да и заметит это пара человек от силы — остальным пофиг. Если в среднем на просмотр страницы серфер тратит от 1 до 3 секунд — то приложенные усилия не окупятся.
Увы, но на своей основной работе мне так делать не получится. Механика штука такая — или сделать, чтобы работало и работало долго или чинить потом опять.
Sign up to leave a comment.

Articles