Добавим окошко браузера или устройства к скриншоту.

[wildhind]

http://getcover.ru

Вот такой сервис для дизайнеров сварганили на днях. В связи с этим вопросы к уважаемому сообществу:

Без пространных объяснений понятно ли, что это за сервис, для чего нужен, как пользоваться? Что можно улучшить в этом плане?

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

Стали бы вы этим сервисом пользоваться? Если да, то как? Если нет, то почему?

Чего не хватает для полного счастья?

[Great Rash]

Не хватает dummy-файла, т.е. мне вот не понятно что я получу на выходе. Вместо серого прямоугольника можно было б разместить примерчик, который заменялся бы моим после загрузки.

UPD: Опять же "Готово", а что готово? Не лучше сразу выдавать картинку, зачем заставлять кликать на кнопку лишний раз? Хотя б вместо "Готово" превьюшка была. не заметил сразу

UPD2: Тень под окном конская! В маках она прям такая же?

[br3t]

Определённо нужно хотя бы базовая пошаговка - даже исходя из вашей подсказки я ожидал, что будет сделан и сохранён скрин указанного сайта

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

Переключатель Браузер-Девайс хочется драг-дропать

Edited March 14, 2012 by br3t

[wildhind]

Не хватает dummy-файла, т.е. мне вот не понятно что я получу на выходе. Вместо серого прямоугольника можно было б разместить примерчик, который заменялся бы моим после загрузки.

Можно подробнее?

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

Определённо нужно хотя бы базовая пошаговка - даже исходя из вашей подсказки я ожидал, что будет сделан и сохранён скрин указанного сайта

Скрин конечно же не делается. Обрабатывается загружаемая картинка.

Сами свой сервис мы пользуем как правило при демонстрации заказчику многостраничного макета: кинуть на страницу несколько сохранённых как png макетов, добавить рамки (известно же магическое воздействие на заказчиков рамок браузеров вокруг макета сайта), получаем адрес страницы с разультатом, и отправляем заказчику ссылку. Заказчик уже оценивает макет именно как макет, а не как абстрактную картинку.

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

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

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

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

А что другие скажут по этому поводу?

Переключатель Браузер-Девайс хочется драг-дропать

Мне тоже Это сделаю в одной из следующих версий

[Great Rash]

Можно подробнее?

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

Зачем жать на кнопку? Вместо кнопки было б круто сразу показывать результат или превьюшку результата.

[wildhind]

Зачем жать на кнопку? Вместо кнопки было б круто сразу показывать результат или превьюшку результата.

Было такое в одной из первых версий.

Да, круто. Но целью было сделать не крутой, а практичный продукт.

Вот один из частых сценариев: нужно показать заказчику ряд макетов его будущего сайта. Макеты лежат в корпоративном дропбоксе, разложенные по папкам (у каждого дизайнера папка своя). Конечно можно развернуть в файловом менеджере весь рабочий каталог в виде дерева, выбрать разом все нужные файлы, а потом тянуть их на страницу и получать результат, не нажимая кнопку. Но неудобно. Куда удобнее зайти сначала в один каталог, выбрать оттуда нужные, затем в другой, там тоже выбрать, и только когда все файлы выбраны, выбрать опции оформления (браузер, ограничение размера, тень и т.п.), нажать кнопу и получить результат. Затем посмотреть результат, понять, что забыт ещё один макет, а браузер сафари уже всем приелся, добавить недостающий макет, блеснуть оригинальностью и выбрать IE9, и … снова нажать кнопу, получить новый результат.

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

А что делать программе, пока пользователь пробивается сквозь менюшки, выбирая белый айфон без тени в качестве оформления? Формировать промежуточный результат после каждого изменения выбора? То есть, выбрал пользователь девайсы вместо браузеров — сформировала программа результат с никому не нужными айпадами. Выбрал он айфон (по умолчанию чёрный и с тенью) — сделали ему чёрный и с тенью, хотя это и не нужно. И всё это время пользователю хоть по секунде, но ждать, получать ненужные ему результаты — зачем?

[br3t]

Пошаговка типа

1. Перетащи картинку
   
2. Выбери оформление
   
3. Нажми магическую кнопку
   
4. Профит
   

Можно небольшими тизерами вверху или слайдшоу по клику на Как же это работает

[Int]

Логотип некликабельный. Как вернуться к началу?

Хммм, когда я выбила 600px, я думал, что будет уменьшена моя картинка, а не вся картинка. Всю я и сам могу уменьшить.

Это поле с перетаскиванием вообще должно работать в FF под линуксом?

[buddah]

Мне очень понравился сервис. Если уж придираться к юзабилити - должна быть кнопка "Сохранить" или что-то похожее. Save As хорошая штука, но клиент уже привык, что все прозрачно и делается за него.

За сервис спасибо, от меня жирный плюс, меня напрягает каждый раз в ФШ делать.

[wildhind]

Мне очень понравился сервис.

Спасибо. Значит для вас и делаем.С любыми пожеланиями добро пожаловать.

Если уж придираться к юзабилити - должна быть кнопка "Сохранить" или что-то похожее.

В обозримом будущем на страницу результата добавим кнопку «скачать всё одним архивом». Вы не об этом ли?

[buddah]

В обозримом будущем на страницу результата добавим кнопку «скачать всё одним архивом». Вы не об этом ли?

Да, именно об этом. Спасибо.

[mishka]

Кому этот сервис может пригодится?

Вебстудии без дизайнера, чтобы в стиле Лебедева делать скрины сайтов?

Про загрузку результата уже сказали, Было бы неплохо сделать в лайтбоксе предосмотр результата с размерами 1х1.

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

[kvant]

1. Если выбрать не картинку, то ничего не происходит, а хотелось бы чтобы была ошибка

2. Если открыл сайт впервые, то совершенно не ясно его назначение

3. Непонятно как вернуться к началу

4. Если добавить два файла с именем в кириллице будет забавный глюк

5. Кнопка Готово ни к чему

6. Как сохранить результат?

Сервис полезный, но по эргономике 2 балла.

[ablay2009]

Огромное спасибо за столь полезный сервис! Особенно понравилась возможность выбора iPad. Кнопка "Готово" совсем не лишняя - действительно если забыл, к примеру, тень добавить, то можно вернуться на предыдущую вкладку и всё. Но логотип все-таки сделать бы ссылкой на сброс всех картинок.

[kvant]

Кнопка "Готово" совсем не лишняя - действительно если забыл, к примеру, тень добавить, то можно вернуться на предыдущую вкладку и всё.

Ну тогда эту кнопку было бы логичнее назвать "Перейти к результатам" или хотя бы "Далее" иначе получается, что типа всё сделано и у пользователя возникает резонный вопрос "Ну и где то, что мне обещали?"

К тому же можно просто не делать кнопку "Забацать" неактивной и использовать ее, то есть забыл тень, вернулся на страницу, добавил, нажал опять "Забацать".

Edited March 21, 2012 by kvant

[wildhind]

Огромное спасибо за столь полезный сервис!

Приятно, что вам понравилось

Особенно понравилась возможность выбора iPad.

А вы смотрели когда ещё просто два айпада было или когда уже был выбор цвета, положения (горизонтально/вертикально), наличия окна браузера в составе айпада? Как раз вчера этот выбор добавился.

Кнопка "Готово" совсем не лишняя - действительно если забыл, к примеру, тень добавить, то можно вернуться на предыдущую вкладку и всё. Но логотип все-таки сделать бы ссылкой на сброс всех картинок.

Видимо логотип и сделаем сбросом в одной из ближайших версий.

К тому же можно просто не делать кнопку "Забацать" неактивной и использовать ее, то есть забыл тень, вернулся на страницу, добавил, нажал опять "Забацать".

Кнопка делается неактивной на 15 секунд, затем снова становится активной.

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

[kvant]

Кнопка делается неактивной на 15 секунд, затем снова становится активной.

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

Я не об этом. Я о том, что кнопку "Готово" можно вообще убрать и сразу показывать результаты.

[Veseloff]

Было бы хорошо, чтобы можно было ввести адрес сайта и всё бы автоматически построилось.

[buddah]

Было бы хорошо, чтобы можно было ввести адрес сайта и всё бы автоматически построилось.

Иногда надо только часть сайта показать.

[wildhind]

Кнопка делается неактивной на 15 секунд, затем снова становится активной.

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

Я не об этом. Я о том, что кнопку "Готово" можно вообще убрать и сразу показывать результаты.

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

Было бы хорошо, чтобы можно было ввести адрес сайта и всё бы автоматически построилось.

простите, адрес какого сайта и что должно построиться?

[sigma77]

простите, адрес какого сайта и что должно построиться?

Как я понимаю, любого.

Вводишь url, сервис делает его скриншот и добавляет соответствующую подложку.

Всё тоже самое только без загрузки скрина самим пользователем.

Это удобно, когда нужно сделать скрин уже существующего сайта.

[wildhind]

Более 80% применения этого сервиса — демонстрация дизайнерами заказчику новых разработок, макетов, ещё не существующих как сайты.

Скриншоты — это совершенно другой функционал, никаким боком к данному сервису не относящийся.

[sigma77]

Более 80% применения этого сервиса — демонстрация дизайнерами заказчику новых разработок, макетов, ещё не существующих как сайты.

Скриншоты — это совершенно другой функционал, никаким боком к данному сервису не относящийся.

Почему не относящийся?

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

[ablay2009]

А вы смотрели когда ещё просто два айпада было или когда уже был выбор цвета, положения (горизонтально/вертикально), наличия окна браузера в составе айпада? Как раз вчера этот выбор добавился.

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

[wildhind]

Сервис ориентирован на довольно узкую целевую аудиторию и узкое применение.

Обзоры сайтов, системы помощи и прочее сюда не входит.

Сервис ориентирован на дизайнеров, преимущественно на веб-дизайнеров.

Известен факт, что заказчик получает более чёткое представление о дизайне разрабатываемого сайта, если дизайнер демонстрирует не голый макет, а обёрнутый в окно браузера. Как бы ближе к действительности получается. В окне браузера — уже не абстрактная картинка, при взгляде на которую возникают нездоровые фантазии вроде «а добавьте здесь красненького, а тут пусть вертится», а действительно макет сайта. Заказчик видит его уже как бы в действии, как он будет выглядеть в браузере, и принятие решения насчёт развития дизайна переходит в более конструктивное русло.

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

Сервис разработан изначально для своих дизайнеров с учётом в первую очередь их пожеланий. А они таковы:

— одновременная загрузка и одновременная обработка нескольких изображений;

— выбор браузеров и устройств;

— нормализация размеров итоговых картинок;

— возможность повторной обработки уже загруженного набора;

— возможность дать ссылку на итоговый набор картинок;

— конфиденциальность (невозможность подбора адреса существующих сетов);

— автоматическое удаление с сервера устаревших сетов.

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

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

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

Опросы показали забавную тенденцию: высокооплачиваемые дизайнеры в основном довольны сервисом, настрония у них варьируются от умеренно положительного до щенячьего восторга. Низкооплачиваемые дизайнеры ворчат: «это ж для кого такой сервис? кто не может своими руками то же самое сделать в фотошопе?». А программисты в 80% случаев вообще не понимают, что это, для кого, зачем, и что с этим делать И начинаются фантазии насчёт скриншотов и прочего не имеющего отношения к основной затее.

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

А вы смотрели когда ещё просто два айпада было или когда уже был выбор цвета, положения (горизонтально/вертикально), наличия окна браузера в составе айпада? Как раз вчера этот выбор добавился.

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

Спасибо. Передам эти сомнения дизайнеру. Пусть проверит.

Edited March 23, 2012 by wildhind