войти зарегистрироваться

Web-разработка whois

индекс
184,85

Системы коллективного комментирования в отладке сайтов

В этом обзоре мы проанализировали несколько систем коллективного комментирования веб-страниц и постарались найти идеальный инструмент для удаленного обсуждения и отладки work-in-progress сайтов с заказчиком и другими участниками работы.

image

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

Что он имел ввиду? Что и на какой странице он хочет изменить? Где-что разъехалось, у меня всё в порядке? Такими вопросами задавался хотя бы раз каждый дизайнер/верстальщик/программист/контентщик при попытке передать свою работу коллеге для дальнейшего ведения проекта или клиенту.

Частично с этой проблемой помогают справиться системы типа The commentor, позволяющие добавлять комментарии к изображениям и указывать на конкретные части картинки несколькими несложными инструментами. Однако что делать, если работа идёт уже со свёрстанным макетом, а то и с готовым сайтом. Уменьшить бюрократию, сократить время на сбор багов и правок можно существующими сервисами — системами коллективного комментирования.

Обзор сделан на основе проведенного нами поиска системы для внедрения в дизайн-студии Nimax, поэтому у нас есть определенные требования:
  • Простая регистрация. Любой клиент должен справиться с регистрацией и установкой плагина (если таковой есть);
  • Возможность комментировать страницу в целом, комментировать конкретный участок страницы, например блок текста или изображение;
  • Бесплатность. Себе мы конечно можем позволить платный сервис, но не можем навязывать его клиентам;
  • Уведомления о полученных комментариях.
В рассмотренных вариантах мы не будем обращать особого внимания на социальные сервисы, а сконцентрируемся на тех функциях, которые могут быть полезны именно в дебаге\комментировании веб-страниц перед сдачей.

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

Twiidla


Наиболее близкий по своему принципу к The commentor сервис. Предлагает создать свою публичную или частную комнату, в которой можно загрузить любое изображение или открыть любой сайт для коллективного комментирования. Twiddla дает инструменты для рисования, размещения различных объектов на полотне сайта, а также живого чата.

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

image

Официальная страница: http://www.twiddla.com

Плюсы
  • Рисование по поверхности сайта;
  • Размещение любых объектов на рабочей странице;
  • Не требует установки плагинов, кроссбраузерен;
  • Не требует регистрации.
Минусы
  • Невозможность одновременной работы с несколькими страницами в одной комнате;
  • Малое количество функций в бесплатной версии.

SideWiki


Сервис-надстройка для панели Google для создания публичных комментариев к сайтам. Позволяет, имея Google-аккаунт и панель Google (для IE или FF), оставлять сообщения к любым публичным веб-страницам. Комментарии размещаются в боковой панели и относятся или к странице целиком, или к конкретному блоку текста. Сервис имеет свой API, позволяющий создать скрипт, уведомляющий автора о новых сообщениях. Владелец сайта также может писать свои особые, администраторские комментарии, выделенные цветом и размещённые вверху списка. К сожалению, несмотря на перспективность, на данный момент у сервиса нет возможности приватного комментирования, что делает использование его в качестве визуального баг-трекера на публичных адресах невозможным.



Официальная страница: http://www.google.com/sidewiki/intl/ru/index.html

Плюсы
  • Простота использования;
  • Широкий охват аудитории, пользующейся панелью «Google»;
  • Сервис и справка на русском языке.
Минусы
  • Невозможность комментирования изображений;
  • Невозможность комментирования «поверх» сайта;
  • Отсутствие приватного режима комментирования;
  • Сложности с уведомлением.

Reframeit


Сервис, аналогичный викикомментариям по реализации, не требует установки панели, прячется в виде плагина (IE7+, FF) и дает схожую с Sidewiki боковую панель, правда гораздо более богатую функционально. Комментировать можно страницу целиком, выбранный блок текста или изображение. Сообщения можно оставлять публичные или приватные, определять группы просматривающих комментарии (это могут быть рабочие группы проекта), следить за появлением новых. На сайте «Reframeit» можно следить за новыми сообщениями в определённых группах и на отслеживаемых страницах. Для самого списка комментариев, на панели предусмотрено несколько режимов отображения и фильтрация, но в общем интерфейс сложно назвать интуитивно понятным, что может негативно сказаться, если речь идет о передаче сайта клиенту, а не внутри команды.



Официальная страница: http://www.reframeit.com

Плюсы
  • Возможность отвечать на комментарии;
  • Приватные комментарии, с разграничением на группы;
  • Возможность работы без регистрации, через OpenID;
  • Возможность отслеживания появляющихся комментариев, в том числе через RSS;
  • Можно комментировать страницы на внутренних/закрытых сайтах.
Минусы
  • Субъективно интерфейс может быть сложен для клиента;
  • Невозможность коментирования «поверх» сайта;
  • Разработчики предупреждают о статусе ранней беты у плагина для IE.

Diigo


«Diigo» — панель для IE и FF, букмарклет для Оперы, Сафари и Хрома. Основное назначение — коллективные закладки, однако благодаря возможности комментирования и выделения (highlight) элементов страниц, вполне подходит под наши задачи. Для любой страницы можно оставлять сообщения, делать выделения и оставлять комментарии к выделениям. Кроме того, контекстное меню позволяет добавлять на любое странице произвольное число стикеров. Записки могут быть размещены над любым элементом страницы или прикреплены к конкретному выделению на странице, каждая из них может иметь свои комментарии, которые размещаются непосредственно в её поле. Неактивные записки сворачиваются в небольшие иконки, которые удобно размещать по странице, не боясь мешанины.

image

Официальная страница: http://www.diigo.com

Плюсы
  • Можно комментировать страницы на внутренних/закрытых сайтах;
  • На плоскости сайта можно размещать стикеры;
  • Есть официальные букмарклеты для альтернативных браузеров;
  • Возможность отслеживания появляющихся комментариев, в том числе через RSS.
Минусы
  • Серьезных нет.

AddATweet


Плагин для FF, использующий идентику и авторизацию OpenID Твиттера для создания панели комментирования. Мы не будем на нём подробно останавливаться, потому как несмотря на возможность оставлять сообщения на отдельной странице, как публичной, так и на внутреннем адресе, указать конкретный блок текста или изображение нельзя. Также нельзя создавать приватные комментарии, однако можно дублировать сообщения в твиттер и отвечать на комментарии в твиттер-стиле. Этот сервис подойдет любителям минимализма.

image

Официальная страница: http://www.addatweet.com

Плюсы
  • Интеграция с твиттером;
  • Твиттер-минимализм.
Минусы
  • Только Firefox 3+, плагин для IE обещают позже;
  • Нет возможности комментирования отдельных блоков текста и изображений;
  • Нет приватных комментариев.

Goozzy


Панель для основных браузеров рунета (Опера, FF, IE). Русский сервис с приятным оформлением и грамотным подходом к делу. Позволяет создавать приватные и публичные стикеры, а также стикеры для групп. Каждая заметка может иметь свои комментарии. На сервисе не требуется дополнительной регистрации и всё довольно подробно «разжёвано» при первом входе. Стикеры запоминают своё расположение и не боятся сайтов, не доступных из интернета.

image

Официальная страница: http://www.goozzy.com

Плюсы
  • Сервис и справка на русском языке;
  • Возможность работы без регистрации, через OpenID.
Минусы
  • Плагин для IE в статусе альфы;
  • Периодически бывают проблемы с загрузкой сайтов и flash-плагином, что оправдывается бета-статусом панели.
Среди рассмотренных нами вариантов, каждый имеет свои преимущества и недостатки, больше подходит в том или ином случае. В итоге, мы остановились на сервисе Goozzy, поскольку он очень прост, удобен и имеет русскоязычный интерфейс. Для внутреннего обсуждения проектов мы можем позволить себе использовать англоязычный сервис, но для общения с клиентами, в большинстве случаев нет. Для обсуждения больших и сложных проектов наша компания использует Twiidla, поскольку она позволяет как угодно комментировать и «разрисовывать» обсуждаемый сайт.
+72
9 ноября 2009, 17:06
Nimax

комментарии (50)

  • раскрыть комментарий
    • Он ведь с картинками только работает, а в статье речь о комментировании живых сайтов.
    • Там нужно заливать картинку — это удобно для обсуждения дизайна, но мы для этого используем The commentor. Вы же не будете делать принт-скрины и заливать на этот сервис все страницы сайта, который нужно обсудить? Это долго и неудобно.

      Здесь речь идет о способах обсуждения и комментирования сверстанного или уже работающего сайта.
  • Приятно читать о своем проекте вот в таких обзорах. Nimax, спасибо!

    Как руководитель проекта Goozzy, хотел бы обратить ваше внимание на то, что если создать закрытый «сгуззток» и всех заинтересованных пользователей добавить туда, то сообщения о всех новых нотес в этом сгуззтке будут приходить в режиме реального времени.
    • Да не за что :)
      Закрытый сгуззток — мы так и сделали.

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

      еще вопрос, как к представителю Гуззи — наличие активного тулбара в опере не может нарушить поведение сайтов?
      • нет, не должно нарушать. но если вы обнаружите некорректное поведение — напишите мне или сюда, или в саппорт гуззи. обязательно исправим ошибку.
    • Планируется ли поддержка Chrome?
      • да, планируется. но пока не готов сказать, когда сделаем плагин.
  • Несправедливо Гузи есть, а Юстикера нет.
    yousticker.com
    ОпенИД, букмарклеты, русский язык тоже в наличии
    • напомните мне. в юстикере есть прикрепление к объекту на странице или стикер позиционируется по координатам?
      • затрудняюсь ответить к чему именно он привязывается. Скорее всего конечно по координатам (страницы, а не экрана), врядли есть привязка к DOM-элементам
        • для использования по тому юз-кейсу, как приводит автор топика, нужна привязка к DOM-элементам.
          • Рад что вы открылись и доступны по гуглаккаунтам и опенид. Хотел по этому поводу попробовать, но, как оказалось, всё ещё нужен фурефокс.
            Кстати о юзкейсе в статье. Не заметил требования привязки к ДОМ-элементу (с радостью бы глянул как это у вас сделано), зато была необходимость работы с клиентами без лишних телодвижений. Букмарклет с минимальной функциональностью спас бы положение, ИМХО.
            • opera и IE (правда немного не стабильный, признаю) вас не устраивают? какой браузер вы хотите?
              • YouSticker.com — работает под всеми популярными браузерами (Firefox, Safari, Chrome, Opera, IE)!
                Огромное отличие от всех: YS позволяет приаттачивать картинки, флеш и цитаты к стикерам на любом сайте. Я думаю, самая удачная функциональность не только для комментирования при отладке сайта, но и я для микроблогов и закладок!
                Более того есть YouSticker-слайдер, который может быть установлен на сайт веб-мастера для фидбека от любых юзеров.
                Заходите посмотрите!

                Спасибо за внимание.
                • Посмотрим, спасибо за наводку, возможно расширим статью.
                  • Взгляните, я думаю, должен понравится
                • а как прикреплять картинки и флэш?! или я сам свой стикер вообще не могу комментировать и т.п.?!
                  • Очень легко!
                    Вы просто вы запускаете юстикер на интересной вам странице потом наводите на видео и слева появится иконка YS
                    Подробнее. Этому посвящена целая статья на хабре
                • а как прикреплять картинки и флэш?! или я сам свой стикер вообще не могу комментировать и т.п.?!
              • Я браузер не хочу. Я гуглофил и пользуюсь Хромом, который кстати уже имеет довольно взрослую систему расширений и поддержку юзерскриптов из коробки (с автоустановкой ввиде расширения). А вообще, хотябы букмарклет с минимальной функциональностью сильно бы исправил текущее положение дел.
                • отписался выше. поддержка Хрома планируется, но точные сроки пока не назову.
          • кстати о применимости в данном юзкейсе, как раз хотелось бы услышать от автора топика.
            • Будем смотреть, гугл в своё время не вывел на этот сервис, так что его попросту не тестировали.
    • на сколько я знаю, у yousticker есть ограничение на 140 символов в сообщении
      • Да! Это верно.
        YouSticker есть это ограничение, т.к. в стикерах поэмы никто не пишет. :)
        • поэмы не пишет, но тем не менее, использовать его для отладки веб-сайтов по этой причине проблемотично.
    • cst
    • cst
    • 9 ноября 2009, 18:10
    • #
      • +1
    А где www.browzmi.com или я один им пользуюсь? =)
    Анонс на Хабре был с годика полтора назад.
    • Интересный сервис, однако почему-то не может открыть довольно много сайтов в зоне .ru (список тестируемых могу привести).

      А в остальном, на первый взгляд, browzmi больше на комьюнити рассчитан, комментарии к конкретному блоку на сайте не привязать.
      • Не встречал неработающих сайтов, правда.
        Иногда проблема с пхпбб возникает файлы незагружаются и вконтактике какая-то кнопочка не работает. А так все ок.
  • Имхо, лучший сервис (а ещё и на русском) www.thecommentor.com/rus/
    • Вам, наверно, стоит перечитать статью — Вы совсем не поняли о чем она. Вкратце — нужен был инструмент для комментирования сайтов, а не статичных картинок.
      • Теперь понял, спасибо.
  • ИМХО лидер в этой области уже YouSticker (http://yousticker.com) Намного удобнее нежели гуззи, есть закрытые группы, работает под всеми браузерами, крайне удобен. Мы его юзаем для багтрекинга на dev серверах.
  • раскрыть комментарий
    • А при чём тут Google Wave?
      • Он является гибкой открытой платформой. На его базе будут представлены различные корпоративные решения для коллективного обмена информацией в режиме реального времени.
        • Мы Wave понемногу тестим в рамках доступного количества инвайтов, но пока очевидной возможности использовать его как систему комментирования не нашли. Хотя линии общения по проекту очень удобно формировать.

          Вообще мы начали использовать SideWiki, но потом перешли на Goozzy. Вся идея родилась случайно — мне нужно было одному из наших программистов, неожиданно заболевшему, рассказать о нескольких срочных правках верстки сайта.
  • Из вышеперечисленного работал только с Diigo, огорчил медленой работой со страницами, на которых большое количество заметок.
    • Попробуй yousticker.com ;)
      • Такая реклама с твоей стороны, имеешь отношение к yousticker или просто так понравилось?
        • Я имею отношения к yousticker, т.к. с ним с самого первого релиза на хабре.
          На самом деле удобно.
          Винду снес а закладки-то остались
  • Спасибо за обзор.
    Пока только приходилось пользоваться подобием basecamp'a (пока бесплатным) — coutline, который того и гляди скоро станет просить деньги :( и Линчелкой

    Тесты:
    Жаль, но Twiddla не захотела открывать мой сайт, а так надеялся :(
    Goozy не порадовал особо…

    Результат:
    остался на coutline + gmail :)
    • Coutline очень интересен, спасибо за наводку. Однако он, если я правильно понял, для проектирования дизайна и UI, а не для комментирования готовой свёрстанной работы. Кроме того, закрытая регистрация сводит на нет все перспективы его использования где-либо за пределами компании.

      Подскажите, есть ли там возможность экспорта готового проекта?
      • Ответил, читайте ниже (простите не туда клацнул, глазки еще не протер)
  • Судя по всему есть. Пройдитесь по «Lear More» секциям. Кстати, там Вы поймете, почему этот сервис используется не столько для проектирования сколько для обсужденяи ;)

    О закрытой регистрации… кто Вам мешает зарегить еще один аккаунт (регают всех, кто присылает «бла-бла-бла, моя хотеть регистрация, моя будет вам благодарна и отписываться о багах») и выдавать его всем, кто должен\хочет участвовать в проектах? ;)
  • Посмотрите еще викиволл — http://wikiwall.ru

    Помоему, у ребят получился хороший сервис.
  • Помню, в прошлом веке =), был такой IM сервис Odigo. Он позволял оставлять заметки на страницах для других пользователей, просматривать кто еще из пользователей этого сервиса находится на данной странице данного сайта.
Только авторизованные пользователи могут оставлять комментарии. Авторизуйтесь, пожалуйста.