Leadel.net

Leadel.net – это видеопортал и социальная сеть, финансируемая European Jewish Congress, который занимается элементами социальности, технологиями, политическими и финансовыми лидерами и таким образом позволяет посетителям Leadel исследовать то, что заставляет их делать то, что они делают. Сайт сосредоточен на особенностях евреев и пытается исследовать, что нас делает различными и уникальными.

Путь LEADEL заключается в определении идентичности, для создания сайта, который обращается к молодым людям, говорит с ними на одном языке и лёгок в использовании. Это был отличный шанс использовать модуль Services, который мы (linnovate) никогда не использовали раньше. Мы закончили созданием 16 специальных модулей и использовали Drupal для организации информации на сайте и флеш для вывода информации пользователям, эта комбинация показалась нам самой лучшей.

Карусель выступлений

Карусель выступлений — это главная визуальная часть первой страницы и используется для дальнейшего перехода к видео.

Это работает на модуле Services, который в свою очередь работает вместе с Views. Вид с опубликованными «обращениями» возвращает список активных публикаций с цитатами различных лидеров, изображением и категорией, где каждый термин таксономии имеет свой цвет. Когда пользователь нажимает значок воспроизведения, это приводит к открытию страницы с «обращением», на которой находится интервью и которое начинает проигрываться в плеере.

Интересной особенностью этого элемента является то, что он выводит все результаты, если сервисный модуль не получает аргумент, но когда вы фильтруете результаты с помощью облака тегов вверху правой колонки, номер термина передаётся в карусель с помощью JavaScript и флеш начинает проигрывание кадров на основании нового аргумента. Services тогда получает аргумент (номер термина), который запускает вид с этим аргументов. Это то, каким образом мы фильтруем результаты без перезагрузки всей страницы.

Башня

Башня используется для создания ассоциативного вывода различных категорий использующих сегмент «обращений» на сайте. Это сделано с помощью специального сервиса, которая получает дерево категорий словаря и добавляет дополнительные метаданные об этих категориях (такие как их цвета и описание). Башня имеет три функции зависящие от местонахождения пользователя на сайте. Мы проверяем URL и получаем переменную во флеше с желаемым режимом. На первой странице облако тегов используется для фильтрации карусели обращений, путём отправки выбранной категории в качестве аргумента в вид карусели обращений и таким образом, фильтруя результат вывода обращений из выбранных категорий.

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

Цветовая линейка

Красивая возможность запрошенная редакторами LEADEL была реализацией показа того, как связываются многообразие идентичностей участников сайта. Мы решили использовать цветовые линии, которые объединены решениями участника (на странице правки участника), но позднее нуждались в развитии его собственных связей для получения идентичности участников сайта.

Цветовые линии сохраняются в скрытом поле CCK и раскрашиваются используя CSS, который показывает процент идентичности определённой категории. Для включения развития цветовой линии, мы создали сервис внедрённый в плеер, который добавляет небольшие проценты цвета из категории «обращения» которое просматривается, в цветовую линию участника. Цветовая линия показывается не только на странице участника, но также в различных списках участников по всему сайту.

Сообщения

Одним из главных вопросов было создание лёгких, понятных и быстрых каналов связи между участниками. Модуль Privatemsg предоставляет хорошие возможности по взаимодействию участников на сайте, но его интерфейс был не тот, который хотел заказчик.

Они хотели более «фейсбукнутый» интерфейс, с большим количеством плавающих открывающихся и закрывающихся слоёв и активным использованием AJAX.

Мы полностью переписали интерфейс, который в основном работает отталкиваясь от входящих сообщений.

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

К счастью, при поиске решения я узнал о модуле JSON server, который предоставляет возможности позволяющие нам использовать сервисы использующие jQuery основываясь на нужных нам запросах.

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

Плеер

Мы самостоятельно написали плеер на флеше, который проигрывает записи, размещающиеся в нашей сети.

Вообще, плеер является базовым способом связи с целями LEADEL, так как это требование внедрено в большинстве элементов сайта, которые и показываются с использованием флеш-плеера. В плеере используются несколько возможностей:

• Рейтинг (используются модули Fivestar и Voting API)
• Связанные видеозаписи (используется модуль Node references из пакета CCK, с помощью которого добавляются ссылки на другие разговоры)
• Закладки (используется модуль Favorite Nodes)

Кнопка «Share» является смесью Buddylist и Privatemsg, в основном мы читаем список друзей пользователя и создаём список из изображений его друзей, которые он уже может выбрать. Затем этому пользователю отправляется сообщение через Privatemsg или на почту.

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

Modules Used

Дополнительные модули

• Activity — активность пользователей на сайте
• AMFPHP — поддержка AMFPHP в модуле Services
• Buddylist — составление списка друзей и отслеживание их сообщений
• CCK — создание и управление дополнительными полями
• Fivestar — оценка документов и комментариев
• Flag content — отметка документов, комментариев и авторов для их проверки модератором
• Forward — отправка ссылки на текущую страницу по почте
• JSON server — АПИ для работы с JSON
• LoginToboggan — настройка входа в аккаунт
• Masquerade — переключение на другого пользователя
• Mollom — защита от спама на основе интеграции с сервисом Mollom
• Node Profile — создание и управление документами-профилями пользователей
• Nodequeue — сбор документов в упорядоченные группы
• Privatemsg — личные сообщения
• Service links — кнопки ссылок для сохранения закладок в социальных сетях
• Services — АПИ-модуль для работы с различными сервисами
• Views — создание и управление списками содержания
• Webform — конструктор форм

Специальные модули

• debate — модуль ведения дебатов
• popup_form — всплывающие формы для сообщений

Инфраструктура

Основной сайт расположен на Amazon EC2 и Drupal, в котором используется кеширование с помощью APC и специфическая настройка MySQL. Видеозаписи располагаются с использованием CDN.

Разработка

Большие команды нуждаются в управлении и инструментах, которые позволят показывать определённые аспекты проекта клиенту. Для работы над сайтом мы использовали систему управления проектами redmine.

Вещь, которую я люблю в redmine, это то, что эта программа очень проста в установке и поддерживает множество SVN-хранилищ. У неё есть много дополнений (такиме как общее управление документами, вики, форумы, публикация новостей) и она позволяет эффективно использовать время.

Заключение

Сайт был спроектирован и разработан компанией Linnovate и несколькими нашими отличными партнёрами:

• Hinbit Development: разработка на Друпале, управление аккаунтами, работа с оформлением и тестирование
• Inbal East: дизайн и информационная архитектура
• Fatlady: разработка флеш-приложений