Впровадження AI-автодоповнення: від концепції до готового UX

Впровадження AI-автодоповнення: від концепції до готового UX

Уявіть: користувач набирає відповідь у месенджері, і додаток пропонує закінчити речення фразою «Дякую за лист, я розгляну вашу пропозицію». Якщо підказка з'являється із затримкою 2 секунди або мигає при кожному символі — UX зруйновано. Ми вирішували цю проблему для фінтех-додатка з аудиторією 500k+ користувачів. Результат: 30% користувачів використовують автодоповнення щодня, час набору повідомлень скоротився на 40%. Розрив між концептом і робочою реалізацією — в деталях UX і продуктивності.

Коли пропонувати підказку

Найнедооціненіша частина — тригер. Підказка не повинна з'являтися при кожному символі. Робоча евристика: пропонуємо автодоповнення, якщо користувач набрав від 3 слів у поточному рядку і зробив паузу > 600 мс, або натиснув пробіл у кінці незавершеного речення. Нижче — порівняння поширених стратегій тригера.

// iOS - тригер автодоповнення
private var autocompleteTask: Task<Void, Never>?

func textDidChange(_ textView: UITextView) {
    autocompleteTask?.cancel()

    let text = textView.text ?? ""
    let cursorPosition = textView.selectedRange.location
    let textBeforeCursor = String(text.prefix(cursorPosition))

    // Не пропонуємо в середині слова
    guard textBeforeCursor.last == " " || textBeforeCursor.last == "\n" else {
        hideAutocomplete()
        return
    }

    // Мінімум 15 символів контексту
    guard textBeforeCursor.trimmingCharacters(in: .whitespaces).count > 15 else { return }

    autocompleteTask = Task {
        try? await Task.sleep(nanoseconds: 600_000_000) // 600ms debounce
        guard !Task.isCancelled else { return }
        await fetchAutocomplete(context: textBeforeCursor)
    }
}

Запит до моделі та парсинг відповіді

Для автодоповнення використовуємо режим completion, не chat. gpt-4o-mini з max_tokens: 30 і temperature: 0.3 — швидко і передбачувано.

struct AutocompleteRequest: Encodable {
    let model = "gpt-4o-mini"
    let messages: [ChatMessage]
    let maxTokens = 30
    let temperature = 0.3
    let stop = ["\n", "."]  // зупиняємося на кінці речення
}

func buildPrompt(context: String) -> [ChatMessage] {
    [
        ChatMessage(role: "system", content: "Complete the text naturally. Continue from where it ends. Output only the continuation, no commentary."),
        ChatMessage(role: "user", content: context)
    ]
}

Стоп-токени \n і . важливі. Без них модель згенерує кілька речень, а нам потрібне одне продовження.

Чому on-device моделі не завжди підходять?

Альтернатива для on-device — CreateML Text Classifier не підходить, потрібен generative model. На iOS 18+ є Foundation Models framework з on-device LLM (Apple Intelligence). На Android — Gemini Nano через Google AI Edge SDK. Однак Gemini Nano доступний на Pixel 8+ і деяких Samsung — не універсальне рішення. Згідно з Apple Foundation Models, on-device LLM вимагає A17 Pro або M1+. Для широкої аудиторії потрібен серверний fallback.

// Android - Gemini Nano on-device (вимагає підтримки пристрою)
val generativeModel = GenerativeModel(
    modelName = "gemini-nano",
    generationConfig = generationConfig {
        maxOutputTokens = 30
        temperature = 0.3f
        stopSequences = listOf(".", "\n")
    }
)

val response = generativeModel.generateContent(
    content { text("Complete naturally: $contextText") }
)
val completion = response.text?.trim() ?: ""

У таблиці нижче порівняємо підходи:

Гібридний підхід — on-device з серверним fallback — дає краще з обох світів.

Як уникнути мерехтіння підказки?

Suggestion мигає. Виникає, якщо новий запит повертається швидше ніж за 200 мс і одразу змінює попередній. Рішення — показувати новий suggestion лише якщо він відрізняється від попереднього більше ніж на 3 символи.

Модель продовжує віддалений текст. Якщо користувач видалив частину тексту — в контексті для промпта має бути актуальна версія, не попередня. Слідкуйте за синхронізацією textBeforeCursor з реальним станом TextStorage.

Tab перехоплюється системою. На Android Tab на м'якій клавіатурі недоступний. Використовуйте кастомну inline-клавішу або жест свайп-вправо через GestureDetector.

Відображення підказки

Стандартний патерн: сірий inline-текст після курсора. Користувач натискає Tab або свайп вправо — підказка приймається. Будь-яке інше введення — приховується.

// Android Compose - inline suggestion
@Composable
fun TextFieldWithSuggestion(
    value: String,
    suggestion: String,
    onValueChange: (String) -> Unit,
    onAcceptSuggestion: () -> Unit
) {
    val annotatedText = buildAnnotatedString {
        append(value)
        withStyle(SpanStyle(color = Color.Gray.copy(alpha = 0.6f))) {
            append(suggestion)
        }
    }

    BasicTextField(
        value = TextFieldValue(
            annotatedString = annotatedText,
            selection = TextRange(value.length)  // курсор — після реального тексту
        ),
        onValueChange = { tfv ->
            val newText = tfv.text.take(value.length + suggestion.length)
            if (newText.startsWith(value + suggestion)) {
                onAcceptSuggestion()
            } else {
                onValueChange(tfv.text.take(value.length))
            }
        },
        keyboardActions = KeyboardActions(
            onDone = { onAcceptSuggestion() }
        )
    )
}

На iOS inline suggestion через UITextInput + drawText(in:) або простіше через overlay label, позиціонований через caretRect(for:).

Що входить у роботу

При замовленні реалізації AI-автодоповнення ви отримуєте:

• Архітектурну документацію: вибір підходу (сервер / on-device / гібрид), схему інтеграції.
• Реалізацію тригера та debounce з урахуванням UX.
• Інтеграцію з обраним API або on-device SDK.
• UI-компоненти inline-підказки під iOS та Android.
• Тестування на реальних пристроях: достовірність підказок, відсутність мерехтіння, коректна поведінка при видаленні.
• Інструкцію з експлуатації та рекомендації з донавчання моделі.

Спираючись на досвід реалізації понад 10 проектів у сфері NLP, ми гарантуємо стабільну роботу підказок. Зв'яжіться з нами, щоб оцінити ваш проект — ми підберемо оптимальне рішення за 1-2 дні.

Орієнтири за термінами

Базове автодоповнення з серверним API + inline UI — 5–8 днів. On-device через Apple Intelligence / Gemini Nano з серверним fallback — 2–3 тижні. Точні терміни залежать від кількості платформ, вимог до дизайну та необхідності підтримки офлайн-режиму. Отримайте консультацію — ми розрахуємо термін під ваш проект.

Часті проблеми та їх вирішення

Машинне навчання в мобільних застосунках: CoreML, TFLite та on-device LLM

Ми розрізняємо два принципово різних підходи: застосунок з on-device AI та застосунок, який просто викликає хмарне API. Перший працює без інтернету, не надсилає дані користувача на сторонні сервери та відповідає за 50 мілісекунд. Другий залежить від затримки мережі та тарифного плану. Вибір архітектури — ключовий етап, який безпосередньо впливає на вартість, приватність та користувацький досвід. Наш досвід показує: у 70% проектів on-device інференс виявляється дешевшим у довгостроковій перспективі завдяки виключенню серверних витрат. Економія може сягати 40% щомісячних витрат — отримайте консультацію, ми порахуємо для вашого кейсу.

Як вибрати між CoreML та TFLite для on-device інференсу?

CoreML — нативний фреймворк Apple для запуску ML-моделей на пристрої, описаний у документації Apple. Підтримує Neural Engine (A11 Bionic та новіші), GPU та CPU як fallback. Моделі конвертуються у формат .mlmodel через coremltools з PyTorch, ONNX або TensorFlow. Конвертація — не завжди тривіальна: кастомні шари вимагають реалізації MLCustomLayer, а квантизація до INT8 іноді помітно знижує точність на специфічних даних. Ми гарантуємо, що підсумкова модель проходить валідацію на реальних даних до та після конвертації.

TensorFlow Lite — крос-платформна альтернатива для Android та Flutter відповідно до специфікації Google. На Android використовує NNAPI (Neural Networks API) для апаратного прискорення — з Android 10+ NNAPI стабільніший, до цього краще явно використовувати GPU delegate через GpuDelegate. Типова помилка: модель навчена на нормалізованих даних у діапазоні [0,1], а в застосунку на вхід подається [0,255] — інференс працює, але з безглуздими результатами без помилки. Ми включаємо модуль автоматичної валідації вхідних даних у SDK.

Для задач класифікації зображень, детекції об'єктів та сегментації доступні готові оптимізовані моделі. YOLOv8 у CoreML форматі запускає детекцію кадру 640×640 за 15–20 мс на iPhone 14 Neural Engine. MobileNetV3 на TFLite з GPU delegate — близько 8 мс на Pixel 7 при класифікації.

Що робити, якщо потрібна генерація тексту на пристрої?

Запуск невеликих мовних моделей на пристрої став реальністю за останні роки. Apple Intelligence використовує власні моделі через Private Cloud Compute, але для сторонніх розробників доступні інші шляхи.

llama.cpp з Metal backend на iOS — робочий підхід для phi-3-mini (3.8B параметрів, 4-bit квантизація, ~2.3 ГБ). Інференс: 15–25 токенів/секунду на iPhone 15 Pro. Для інтеграції в Swift використовуємо Swift Package llama.swift або обгортку через C-інтерфейс llama.h. Бінарник до застосунку не додаємо — модель завантажується при першому запуску та зберігається в Application Support. Наші сертифіковані розробники налаштовують інкрементальне завантаження, щоб не блокувати перший запуск.

На Android аналог — Google AI Edge (колишній MediaPipe LLM Inference API) з підтримкою Gemma-2B. Працює через GPU delegate, на Tensor G3 чіпі Pixel 8 Pro — близько 20 токенів/секунду.

Інтеграція OpenAI API та інших хмарних моделей

Для сценаріїв, де cloud inference допустимий, інтеграція OpenAI, Anthropic або Google Gemini — це HTTP клієнт + streaming SSE. У Swift зручно через AsyncThrowingStream для стрімінгових відповідей. У Kotlin — через Flow.

Критично важливо: API-ключі ніколи не зберігаються в бандлі застосунку. Навіть обфускований ключ витягується з IPA за 10 хвилин через strings або frida. Правильна архітектура: мобільний застосунок → власний backend → OpenAI API. Backend контролює rate limiting, логує запити, захищає ключ.

Що входить у роботу (результати)

• Навчена та квантизована модель під цільовий пристрій (документація за метриками)
• SDK для інтеграції (Swift/Kotlin/Flutter) з прикладами виклику
• Тести продуктивності на 3–5 реальних пристроях
• Інструкція з оновлення моделі OTA
• Підтримка при проходженні модерації App Store / Google Play (перевірка відповідності Guidelines 4.2, 5.1)
• 2 тижні технічної підтримки після релізу

Типовий пайплайн проекту

1. Аналіз завдання — вимірюємо latency, privacy, size, підтримувані пристрої.
2. Прототипування моделі — в Python, оцінка accuracy на цільових даних.
3. Конвертація та квантизація — під CoreML/TFLite з валідацією.
4. Інтеграція в застосунок — модель обгортається в сервісний шар (легко замінювати CoreML → TFLite → хмара).
5. Тестування — на реальних пристроях, вимір FPS, RAM, батареї.
6. Деплой — через TestFlight / Firebase App Distribution, моніторинг метрик.

Терміни: інтеграція готової CoreML/TFLite моделі — 1–2 тижні, розробка кастомної моделі з мобільною оптимізацією — від 6 тижнів, on-device LLM чат з персоналізацією — 4–8 тижнів.

Чому ми беремося за складні кейси?

10+ років досвіду в мобільній розробці, 50+ впроваджених AI/ML рішень, гарантія сумісності з актуальними версіями iOS та Android. Всі проекти проходять code review та навантажувальне тестування. У вартість вже входить підготовка документації для модерації та навчання вашої команди.

Зв'яжіться з нами — ми допоможемо вибрати архітектуру та впровадити ML у ваш застосунок під ключ. Замовте аудит наявного рішення — безкоштовно оцінимо потенціал економії серверних витрат. Отримайте консультацію експерта — напишіть нам сьогодні.