Поддержка и публикация мобильного приложения INSIDER.MOSCOW

Екатерина И.

Как сделать мобильное приложение для сайта? «Натив», «гибрид», браузер в приложении и прочие хитрости

Есть несколько способов делать мобильные приложения.

Не вдаваясь в детали, можно назвать 2 — «браузер в приложении» и «нативные приложения».

Мы несколько раз пробовали делать «браузерные приложения» (это почти то же самое что «гибридные») — и разочаровались в этом подходе.

Гибкости нет, скорости нет, много проблем с соблюдением гайдлайнов Apple и Google.

ИНТЕРВОЛГА делает нативные приложения (Swift и Java), интегрируя их с сайтами через http-API.

Далее описан пример именно такого приложения, бекендом для которого выступил ранее сделанный сайт на Laravel.

Мобильное приложение

Зачем сайту мобильное приложение?

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

Под это определение как раз подходит один из наших клиентов — проект insider.moscow. Это сайт с рецензиями московских и питерских ресторанов. Мы занимаемся технической поддержкой этого сайта, и владелец обратился к нам с просьбой доделать и опубликовать приложения для iOS и Android. Приложения были когда-то написаны предыдущими разработчиками, но так и не увидели свет.

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

От получения архивов с кодом до появления приложений в Google Play и AppStore нам пришлось пройти несколько этапов.

Актуализация проекта

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

Для приложения iOS потребовалось перейти от версии языка Swift2 к Swift3.

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

Для Android-приложения все прошло проще — там было достаточно актуализировать минимальную и целевую версию sdk и обновить несколько сторонних библиотек в проекте Android Studio.

Доработки приложения

Оба приложения были нативные — написанные на Swift для iOS и Java для Android.

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

Сайт сделан на Laravel, предыдущими разработчиками уже было написано API для приложений, поэтому здесь нам оставалось только прописать правильное открытие этого api в настройках сервера сайта и исправить несколько багов.

Сторона приложения

У нас было два отдельных приложения — для iOS и для Android, поэтому все правки внешнего вида необходимо было производить и там, и там.

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

Несколько примеров:

  • изменили меню, переименовав и переместив несколько пунктов,

Внесли изменения в меню

  • уменьшили затемнение на картинках,

Уменьшили затемнение на картинках

  • сделали панель навигации прозрачной

Сделали панель навигации прозрачной

Сторона сервера

Серверные правки — общие для обоих приложений, так как они получают одинаковые данные.

В приложениях было предусмотрено два формата получения данных:

1. В виде json-массива для генерирования нативных таблиц приложения, например список ресторанов

Список ресторанов

2. В виде готовой html-верстки, которая показывается в приложении «как есть», например страница «О проекте»:

Страница «О проекте»

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

Пример изменений верстки текста рецензии, получаемой с сайта

Пример изменений верстки текста рецензии, получаемой с сайта

Публикация

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

Google Play

После заполнения описания и скриншотов согласно рекомендациям и загрузки финальной версии сборки приложение было благополучно проведено через этапы альфа и бета тестирования в кабинете Google Play Console.

После перевода выпуска в боевой режим и отключения всех бета-тестеров приложение приняло в плеймаркете свой итоговый вид.

Вид приложения в плеймаркете

App Store

Приложение было проверено заказчиком через TestFlight, он предоставил нам описание и скриншоты по рекомендациям AppStore.

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

Вид приложения в AppStore

Интересный момент, что в AppStore приложение получило рейтинг 17+ из-за упоминания алкоголя (винный рейтинг ресторанов), в Google Play же оно 3+, хотя вопросы в анкете были примерно одинаковыми. Только в Google Play их было немного больше.

Финальная проверка приложения магазинами прошла быстро — в рамках одного рабочего дня для iOS и пары часов для Android.

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

У вас есть недоделанное приложение? Доделаем и выпустим

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

ИНТЕРВОЛГА создает мобильные приложения с нуля и берет на доработку сделанные другими компаниями-разработчиками.

Приходите, поговорим.

Оцените статью
20.11.2018
Понравилась статья?
Поделитесь ссылкой с друзьями и коллегами!
Мы работаем по одному из двух форматов:
  • аренда команды (от 2 человек, не менее 3 месяцев);
  • итерации с фиксированной ценой (1-3 месяца длительностью).
ИНТЕРВОЛГА предоставляет:
  • регулярные онлайн-планерки с заказчиком;
  • квалифицированных специалистов;
  • организованную команду (находятся в одном помещении, что упрощает решение рабочих вопросов);
  • полную прозрачность и регулярность отчетов о результатах.
Ключевые услуги:
  • нагруженный интернет-магазин;
  • личный кабинет;
  • оптовые продажи — B2B-платформа;
  • маркетплейс;
  • технический аудит сайта;
  • Битрикс24 — корпоративные HR-порталы;
  • Битрикс24 — построение CRM-системы;
  • Битрикс24 — личные кабинеты сотрудников;
  • Битрикс24 — аудит портала;
  • 1С — интеграция с другими системами;
  • 1С — доработка системы;
  • маркетинг — комплексное интернет-продвижение;
  • маркетинг — продвижение для B2B.
Хотите получать лучшие статьи от INTERVOLGA раз в месяц?
Подпишитесь на рассылку — спамить не будем