BookStory

Разработка сервиса BookStory

Задача:

Cоздать систему с онлайн конструктором фотоальбомов. С возможностью заказать печать получившегося фотоальбома.

Функционал:

  • выгрузка фотографий из Вконтакте, Facebook, Instagram;
  • вёрстка фотоальбома в онлайн-конструкторе;
  • редактор обложки;
  • выбор формата печати и формирование цены в реальном времени;
  • история заказов;
  • автоматическое создание pdf альбома;
  • информационный сайт с блогом.

О проекте

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

Основные задачи

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

Прототипирование

Немало времени мы потратили на UX конструктора. Так как он должен был быть максимально простым, мы безжалостно отсекали всё ненунжное. В итоге, мы пришли к концепции 4 шагов:

1. Загрузка фото

2. Редактирование и выстраивание фотографий внутри альбома

3. Редактирование обложки

4. Выбор формата альбома

Дизайн

Основой дизайна проекта была максимальная монохромность и простота. Так как пользователю приходилось работать с большим количеством фотографий, как правило, цветных, то мы убрали все лишние цветовые акценты и сделали светлый просто интерфейс системы. Цветовые акценты поставили лишь на кнопки загрузки фотографий и кнопку заказа альбома. Получился очень стильный и современный дизайн, чем-то похожий на стилистику Instagram, к которому привыкли 99% потенциальных клиентов.

Программирование

Для разработки мы выбрали фрэймворк Laravell, так как использовать какие-либо CMS было совершенно неуместно, а писать на чистом php неоправданно долго. Использование Laravell позволило ускорить процесс производства, при этом оставив полную свободу в разработке. Что касается Front-end системы, используя jQuery и JS мы “оживили” предпросмотр фотоальбома и другие моменты.

Выгрузка фотографий

Отдельный пласт работы по проекту - загрузка фотографий. Функционал конструктора позволяет загрузить фотографии с устройства (компьютер, телефон, планшет), выгрузить фотографии с аккаунта пользователя в Instagram, Вконтакте или Facebook. При реализации этого функционала мы столкнулись со сложностями настройки. Так как соц. сети блокируют массовую выгрузку данных. В итоге, мы разработали алгоритм, позволяющий выгружать разово до 60 фотографий, без опасности блокировки. Конечно же, при загрузке с устройства ограничений нет.

Настройки

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

Администрирование

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