×

Як ми розробили додаток на Apple Watch для управління машиною Tesla

Стаття написана у співавторстві з Олександром Маляренком. Також дякуємо Марті Чавазі за адаптацію тексту з англійської.

Зацікавившись появою розумного годинника від Apple, ми взялись за розробку додатка, який дає змогу керувати електромобілем Tesla Model S через Інтернет за допомогою веб-сервісу API. Додаток досконало вписується в концепт розумних годинників, дозволяє користувачам отримувати важливу інформацію про їхнє авто та керувати ним швидко, не витрачаючи часу на те, щоби дістати з кишені та розблокувати свій телефон.

Можливості Apple Watch для розробників

Якщо ви знайомі з WatchKit, SDK для розробки додатку для Apple Watch, то можете одразу переходити до частини, що безпосередньо стосується додатку.

Якщо ж ні, то у вас є можливість ознайомитися з технічними можливостями WatchKit. Apple люб’язно надав бета-версію SDK учасникам Developer Program. А тут, на жаль, не все так гладко, як це розказує у своїй презентації Тім Кук. Коротко кажучи, Apple Watch — це всього-на-всього додатковий монітор для вашого iPhone, і він не здатен робити що-небудь самостійно. Ось що кажуть з цього приводу представники Apple:

«Застосунки для Apple Watch доповнюють ваш основний iOS-додаток, але не замінюють його. Якщо сьогодні час, який користувач проводить в програмі, вимірюється у хвилинах, то час роботи з додатками Apple Watch буде вимірюватися у секундах».

Саме додаток для iPhone містить у собі весь код у вигляді так званого Watch Extension (ще один тип розширень на додачу до Today Extension, Share Extension та ін., які існували в iOS8), а на боці Apple Watch — виключно ресурси додатка та UI дисплей (у вигляді Storyboard). Ось, власне, діаграми, надані нам компанією Apple, які пояснюють, як це працює і яким чином відбувається взаємодія між смартфоном і розумним годинником.

Тобто, як бачимо, розумний годинник Apple без iPhone — просто іграшка, з якої жодної користі. І хоча Apple згадував про WatchKit Apps — повнофункційні додатки, які, теоретично, повинні працювати без iPhone, поки що вони недоступні, і ніхто не знає, коли з’являться на ринку.

З іншого боку цей істотний недолік — як би парадоксально це не звучало — є великим плюсом. Зважаючи на те, що додаток годинника, по суті, працює на iPhone, програміст має у своєму розпорядженні увесь функціонал і дані з самого iPhone (щоправда, Apple вже попередив нас про ймовірні обмеження на енергозатратні операції). Сам же WatchKit — це такий собі «місток», що з’єднує код на iPhone з інтерфейсом на Apple Watch.

Усі додатки для Apple Watch мають три cхеми роботи:
1) повноцінний додаток, з яким можна працювати з екрану розумного годинника;
2) Glances, що відображає лише картки з необхідною для користувача інформацією;
3) активні сповіщення із двома сценаріями виконання:
— коли ви піднімаєте руку, щоби прочитати нотифікацію і не опускаєте її впродовж кількох секунд, розумний годинник показує вам детальнішу інформацію;
— ви можете швидко реагувати на нотифікації, виконуючи певні дії.

Якщо зануритись глибше і подивитися на можливості, доступні розробникам додатків, відкриється доволі невтішна картина. Apple не балує девелоперів надміром функціоналу та інструментів. Проте, є надія, що така обмеженість функціоналу пов’язана з тим, що це лише перша бета-версія.

А зараз про погане, тобто про функції, які не доступні для девелоперів:
— у розумного годинника є акселерометр та гіроскоп, але девелопери не мають до них доступу;
— існує також Bluetooth, проте, через нього можна з’єднатися виключно з вашим iPhone, і девелоперам він також не доступний;
— екран годинника чутливий до сили натиску, однак розробникам доступний тільки Force Touch, який використовується для виклику контекстного меню;
— поки що також недоступна система тактильних сповіщень TapTic Engine;
— є вбудований динамік і мікрофон, але доступу до нього немає;
— щодо GPS, то ніби-то він є, але тільки на вашому iPhone.

Таким чином, з точки зору розробки, Apple Watch на сьогодні є дуже обмеженим пристроєм зі слабким потенціалом для програмістів. Хоча сміливі висновки з цього приводу ми зможемо робити після 24 квітня, коли годинник з’явиться у продажі. Наразі говорити про нього ми можемо лише виходячи із наданого SDK, який, нагадаємо ще раз, перебуває на першій бета стадії.

У результаті в нас складається досить неоднозначне враження про новинку від Apple. З одного боку все гарно, інноваційно і цікаво, а з іншого — обмежений функціонал не дає можливості розробити дійсно функціональний додаток із гарним дизайном.

Apple Watch для Tesla Car

Але ми не здалися і поставили собі за мету використати увесь доступний функціонал управління Tesla Car, адаптувавши UX до контексту Apple Watch. Після брейнштормінгу ми зупинилися на 6 екранах:
— main screen (водночас екран статусу автомобіля) — повідомляє про загальний стан електромобіля: стан батареї, температуру повітря, пробіг та ін.;
— controls menu (контекстне меню з командами) — дає можливість відчиняти/зачиняти авто, вмикати/вимикати фари та сигналити;
— charging screen (екран заряду батареї авто) — детально інформує про стан батареї та перебіг процесу заряджання;
— climate screen (екран клімату всередині авто) — показує температуру і дає можливість змінювати її в різних зонах авто;
— location screen (екран місця перебування авто) — повідомляє про поточне місце перебування електромобіля;
— glance screen — екран, на який виводиться інформація про стан автомобіля для Apple Watch Glance.

Технічні деталі додатку

Watch Extension для годинника, так само як і версія додатка для iPhone, взаємодіє із веб-сервісом API від Tesla через окремий модуль роботи з сервісом, у формі окремого Cocoa Touch Framework (ще одна порада для розробників від Apple з написання додатків, що містять Extension).

Окрім цього був реалізований механізм обміну даними між iPhone і Apple Watch за допомогою shared app group:
«App group — це спеціальний контейнер групи додатків, що уможливлює одночасний доступ до спільних даних. Звичайний обмін даними між додатком та розширенням не можливий, оскільки кожен з них виконується у своєму „sandbox“ і не має доступу до пам’яті інших додатків. Тому, щоби уможливити передачу та обмін даними між додатком і розширенням, компанія Apple розробила App Group. Завдяки цій технології розробники можуть без будь-яких проблем додати функцію обміну даними між додатками».

Із документації Apple для девелоперів

Ось приклад коду, який забезпечує завантаження і збереження контейнера даних у NSUserDefaults:

+ (void)saveSummaryModel:(SummaryModel *)summaryModel {
    NSData *archivedData = [NSKeyedArchiverarchivedDataWithRootObject:summaryModel];
    NSUserDefaults *defaults = [LocalStorageHelper getSharedDefaults];
    [defaults setObject:archivedData forKey:SummaryModelKey];
    [defaults synchronize];
}
+ (SummaryModel *)loadSummaryModel {
    NSUserDefaults *defaults = [LocalStorageHelper getSharedDefaults];
    NSData *archivedData = [defaults dataForKey:SummaryModelKey];
    SummaryModel *summaryModel = [NSKeyedUnarchiverunarchiveObjectWithData:archivedData];
    return summaryModel;
}
+ (NSUserDefaults *)getSharedDefaults {
    NSUserDefaults *sharedDefaults = [[NSUserDefaults alloc] initWithSuiteName:@"group.eleks.TeslaModelS"];
    return sharedDefaults;
}

Окрім цього, ми створили гарний і зручний дизайн для додатка, який відповідає усім вимогам Apple.


Проблеми і труднощі

У процесі розробки додатку у нас виникали певні труднощі, переважно — під час імплементації дизайну. Ось детальніше про деякі з них.

Перша і найприкріша — це запуск додатку для годинника на симуляторі. Час від часу він просто-напросто не запускається, зависаючи на статусі «Waiting to Attach». Скоріш за все, проблема викликана нестабільністю бета-версії XCode і не пов’язана з налаштуваннями проекту чи чогось іншого.

Застосування кастомних шрифтів до текстових об’єктів. Спроба використовувати шрифти у редакторі storyboard в IDE не дала бажаного результату: сам шрифт змінювався, однак колір і розмір шрифта залишалися тими ж. Кастомізація шрифта наразі доступна тільки в коді.

// Configure an attributed string with custom font information.
let menloFont = UIFont(name: "Menlo", size: 12.0)!
var fontAttrs = [NSFontAttributeName : menloFont]
var attrString = NSAttributedString(string: "My Text", attributes: fontAttrs)
// Set the text on the label object
self.label.setAttributedText(attrString)

Цифрова Коронка доволі обмежена. Перш за все, вона не доступна в емуляторі, отже ми не могли використати її для нашого додатку. Але що гірше — сторонні додатки можуть використовувати її лише для прокрутки (scrolling). Сумно, але наразі це не дає достатньо можливостей для розробників third-party додатків.

Застосування стилів дизайну до контекстного меню, що викликається за допомогою Force Touch. Кнопки меню та іконки на кнопках — сірого кольору і не дають простору для дизайнерських пошуків.

Елемент WKInterfaceSlider має напівпрозорий сірий фон, що накладається екрану на фон самого екрану, і його неможливо замінити чи забрати. Тому, щоби застосувати створений дизайн, довелося робити зовнішній аналог слайдера з двох кнопок — WKInterfaceButton і тексту в WKInterfaceLabel.

Через відсутність ProgressBar, ми змушені були створювати щось подібне.

Як бачимо, більшість проблем пов’язані саме із застосуванням елементів дизайну до інтерфейсу. Навіть той невеликий набір елементів, який сьогодні надає розробникам WatchKit, має дуже обмежені можливості для кастомізації. До того ж обмеження накладає сильно врізаний функціонал SDK, який на сьогодні доступний для розробників.

Результат

Увесь вихідний код ви можете знайти на нашій сторінці у Github, а ось скрінкасти функціонування додатку на емуляторі:

Попри загальне враження, що Apple Watch пропонує широке поле для творчості, на жаль, поточні можливості розробки на емуляторі не збігаються із очікуваннями. Робити щось дійсно потрібне і функціональне для Apple Watch з поточною версією SDK дуже і дуже непросто. До того ж, деякі початково обіцяні функції, що ідеально підійшли би до цікавих бізнес-ідей, поки що не доступні.

Єдине, що залишається розробникам, — чекати на реліз нової версії WatchKit і початок продажу Apple Watch.

Робоча група
— Олександр Маляренко — співавтор ідеї, iOS-інженер;
— Влад Кріченко — дизайнер;
— Олександр Болховецький — iOS інженер;
— Олександр Кабаченко — співавтор ідеї;
— Віктор Малейчик — співавтор ідеї.

Продолжение:
Apple Watch vs. Android Wear: Хто з них проїде з Теслою далі?

Все про українське ІТ в телеграмі — підписуйтеся на канал DOU

👍ПодобаєтьсяСподобалось0
До обраногоВ обраному0
LinkedIn

Схожі статті




47 коментарів

Підписатись на коментаріВідписатись від коментарів Коментарі можуть залишати тільки користувачі з підтвердженими акаунтами.

Мне одному кажется, что приложение не соответствует гайдлайнам Apple?

developer.apple.com/...c/uid/TP40014992-CH22-SW1
developer.apple.com/...c/uid/TP40014992-CH28-SW1

Цікавий момент — за вісім таких годинників можна купити одну теслу.

P.S.: Хлопцям великий респект.

Обязательно золотые покупать? Обычные Sport 350 баксов

Ну хто ж буде купляти саму дешеву версію — засміють!

лучше потратить 5 зарплат и купить золотую, которую на третий день с тебя снимут гопники, когда будешь возвращаться в свою однушку на Оболони

Ну чому відразу 5 зарплат. В іпотеку на 10 років :D

да я с финансовым гением общаюсь, не иначе! Коллега, не мог ожидать встретить Вас тут!

Знаю-знаю, сам не очікував. Приємно зустріти цікавого і ціленаправленого однодумця.

Интересно, при непрерывной работе, что первым сядет — iWatch или Tesla.

Годинник. Та це не біда — у теслі є USB. ;)

Дякую за статтю. Впевнений деяке інфо зекономить багато часу іншим розробникам :) Ще раз дякую.

Дякую за цікаву статтю!

Вже була схожа штука з Android Wear, доречі у вашій же компанії:
autogeek.com.ua/...yat-elektromobilem-tesla

Так, тільки ми створили аналогічний додаток для Android Wear на прохання Google вже після успіху з Apple Watch.

А що на вашу ідею кажуть Apple i TeslaMotors? Я думаю варто заявити, що геніальну інтеграцію цих двох монстрів інноваційного світу зробили саме в Україні! ;)

Мне было бы так же интересно открыть новости и прочитать «Ответный шаг — супердевайс от Yotaphone и АвтоВАЗ», вот смеху то будет....

Думаю в якості веар-девайсу вони можуть залучити Пеббл — не буде потреби заморочуватись над дизайном

Хлопці — це супер! Реально мега круто, дякую за статю, та за те що ви це робите!

Технічна стаття на ДОУ українською? Нарешті! :)

Якщо хтось випадково пропустив, ось ще кілька статей на ДОУ українською, не всі вони, правда, технічні:

Як ми реалізували крос­платформенну розробку мобільного додатку на Xamarin
dou.ua/...articles/xamarin-project

Wearable devices: як вичавити із них усі соки
dou.ua/...rticles/wearable-devices

Книжки з програмування: як читати і що саме
dou.ua/...ticles/programming-books

Маніфест розвитку ІТ-сфери України
dou.ua/...lenta/articles/manifesto

Java 8/Scala — різниця в підходах та взаємні інновації
dou.ua/...a/columns/java8-vs-scala

Що таке якісний дизайн. Відкритість, адитивність, відстежуваність
dou.ua/...cho-take-yakisniy-dizayn

Що нового у світі програмування
dou.ua/...o-u-sviti-programuvannya

Не знаю як кому але якби я купив собі смартвотч то тільки для того щоб не таскати із собою смартфон, а тут така фігня. Епл знають як з людей гроші витягувати :)
Але за проект звісно респект!

Хорошая идея, отличный дизайн, молодцы
Главный вопрос — где Теслу для тестирования взять? ;)

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

По всей видимости, Тесла им не понадобилась.

Подождем, что ответят разработчики.

Тесла не понадобилась. Использовалось что-то вот такое docs.timdorr.apiary.io

Во Львове есть салон Теслы

Адресу в студію)))

teslamotors.lviv.ua

И насколько я знаю, физически машины есть в салоне РІК — АВТО®
Но не уверен.
Какое-то время назад тест драйв пройти можно было.

Всмысле, просто дилер какой-то продаёт? На сайте Теслы ничего нет
UPD: Вопрос отпал.

Более того, при попытке отправить багрепорт (нашёл случайно еще одну ошибку в переадресациях) с адреса в контактах [email protected] приходит «delivery error». Кажется, на сайт забили.

У Львові є вже по-ходу дві тесли:
www.facebook.com/Teslamotors.lviv.ua

і ще були такі експерименти:
elekslabs.com/...through-google-glass.html

і кажуть навіть заправки є:
okko.ua/..._fuels=&point_services=55

можна в меню Сервіс вибрати електрозаправки

Нет :) Не заработал на Теслу еще

По Львову багато їх їздить,
можна поспілкуватись з власниками)

Описали реальное положение вещей, спасибо большое за статью. Наконец-то что-то действительно полезное на ДОУ

гарно. успіху!

«Я его слепила из того, что было...» Отличная идея и хорошая реализация, думаю.

Я сплю, или это техническая статья на доу?

Скорее всего, вы в танке.

Код на ДОУ? Ну ни фигасе

Підписатись на коментарі