Курс Mobile Apps: Design

Створиш дизайн власного застосунку-стартапу на iOS та Android. Зрозумієш різницю між гайдлайнами. Пропрацюєш необхідний функціонал і важливі нюанси. Дізнаєшся, як створити правильну інформаційну архітектуру та навігацію. Протестуєш на юзерах. Оформиш якісний і детальний case study у портфоліо.

Програма курсу

Знайомство з гайдлайнами

• Знайомство. Ринок мобільних застосунків у наші дні
• Нативні та кросплатформні програми, мобільний сайт. Чим відрізняється дизайн застосунків від дизайну сайтів
• HIG від Apple (iOS). Особливості платформи, UI кіт
• Material Design Guidelines (Android). Особливості платформи, UI кіт
• Визначаємось з темою свого застосунка

Підготовка і дослідження

• Етапи розробки мобільного засосунку
• Брифування клієнта. Як визначити задачі і потреби бізнесу
• Вторинне дослідження. Пошук інформації і його аналіз
• Визначення цільової аудиторії застосунка. Методи, які працюють
• Опитування користувачів

Інформаційна архітектура, типографіка та аргументація

• Інформаційна архітектура мобільних застосунків. Що це таке насправді
• Як правильно створити ІА
• Види навігації у застосунках: Tab bar, Hub & Spoke, Ієрархічна навігація, Navigation drawer, Navigation bar тощо
• Sitemap, як частина ІА. Як продумати шлях користувача у продукті
• Аргументація своїх рішень
• Типографіка платформ. Правила використання й оформлення текстів в мобільних інтерфейсах

Макети, сітки та навігація

• Детальний розбір рідних навігацій обох платформ
• Viewport та роздільна здатність екранів. Як підійти до вибору розміру
• Макет та сітка в HIG (iOS) та Material Design (Аndroid). Які підходи краще застосовувати
• FAB (плаваюча кнопка дії в Material Design)

Splash Screen, онбординг, елементи інтерфейсу

• Splash screen. Екран заставка. Чому вона потрібна і як її розробити правильно
• Онбординг. Основні риси та правильна побудова. Коли не варто робити онбординг
• UX Writing мобільних застосунків (база)
• Елементи інтерфейсу: Tabs, Segmented buttons, Segmented control
• Системні кнопки HIG & Material
• Іконки. Як підбирати і на що звернути увагу

Вхід, порожні екрани, елементи інтерфейсу

• Sign in/Sign up. Як створити зручну форму. Розбір текстових полей обох платформ
• Sign in with Apple. Як правильно використовувати
• Елементи інтерфейсу: bottom app bar, toolbar
• Порожні екрани. На що звернути увагу і які є нюанси

Технології у мобільних інтерфейсах, модальні вікна

• Технології у мобільних інтерфейсах: Карта, локація, AR
• Нотифікації, геолокація та доступи. Коли питати дозволу, щоб не дратувати юзера і отримати від нього підтвердження
• Модальні вікна у мобільних застосунках. Їхні види та способи використання
• Push notifications

Функціонал різних сторінок у застосунках. Частина 1

• Особистий кабінет користувача
• Сторінка налаштування
• Списки, таблиці, картки в мобільних застосунках
• Жести
• Елементи інтерфейсу: Checkbox, Radio button, Switch & Toggle

Функціонал різних сторінок у застосунках. Частина 2

• Стрічки активності (Feed) у мобільних застосунках
• Сторінки бронювання (подорожі, місце в коворкінгу)
• Елементи інтерфейсу: date & time pickers
• Фільтри та сортування де і як використовувати
• Оплата у застосунку, які є види
• NFC в телефонах (база)

Презентація рішень та спілкування з клієнтом

• Як презентувати свої рішення ефективно, щоб в них повірили
• Спілкування та листування з клієнтами

Презентація своїх рішень

• Практика презентації на курсі
• Кожен студент отримує детальний фідбек від ментора

Мудборд, візуальне оформлення, тренди

• Moodboard. Формування мудбордів за візуальними рішеннями та патернами
• Tone of voice застосунків
• Кольори і палітри
• Темна тема. Її важливість і нюанси створення
• Тренди та антитренди у мобільних застосунках

Візуальне оформлення

• Візуальне оформлення. З чого складається гарний дизайн та як його створити
• Зображення, фото, ілюстрації
• UI kit для мобільних застосунків

Практика редизайну. Воркшоп

• Практикуємось знаходити різні ідеї та редизайнити
• Практикуємось аналізувати інтерфейси, знаходити гарні та недоречні рішення

Візуал, UX закони, орієнтація пристрою

• Візуальна ієрархія. Як управляти увагою користувача
• UX закони та кращі практики дизайну застосунків
• Проєктування для орієнтації пристрою: від книжкової до альбомної
• Accessibility

Анімація та прототип

• Що таке супераппи
• Animation. Основи анімації, принципи
• Створення прототипів мобільних застосунків, тонкощі, які варто враховувати

App Store / Google Play

• App Store/Google Play. Скриншоти та іконки застосунків для магазинів застосунків
• Дизайн віджетів (Widgets)

Просування, гейміфікація та передача файлів

• Як просувають мобільні застосунки та що впливає на рейтинг
• Гейміфікація (mobile apps engagement)
• Передача файлів розробникам. На що звернути увагу

Юзабіліті тестування

• Юзабіліті тестування мобільних застосунків
• Як провести тестування ефективно і отримати потрібні результати
• Метрики. Чому вони такі важливі в дослідженнях і як їх використовувати
• Ментальні моделі користувачів

Case Study

• Правильне оформлення Case study проєкту, щоб виділитись серед конкурентів
• Портфоліо: варіанти оформлення

Додаткові теми

• Базово про дизайн застосунків для годинників
• Live Activities (iOS)
• Dynamic Island

Пошук роботи

• Співбесіда в IT компанію на посаду Mobile UX/UI designer
• Резюме. Як зробити так, щоб його помітили
• Soft skills. Як їх прокачувати
• Тестове завдання в IT компанії. Як підвищити шанси виконати тестове успішно

Практика проходження співбесід (з ментором групи)

• Готуємося до проходження співбесіди по лекції з модуля
• Структуруємо всі отримані знання на курсі
• Відвідуємо симуляцію реальної співбесіди з ментором групи, відповідаємо на питання, отримуємо фідбек від ментора, що треба покращити, а що було дуже добре

Фінальна зустріч

• Аналізуємо свій прогрес на курсі
• Ділимося успіхами та фейлами
• Визначаємо зони розвитку

Особливості курсу

• 10 тижнів навчання
• 10 модулів з відео уроками в записі
• 18 студентів у групі
• 6 онлайн занять
• 2 практики презентацій своїх рішень
• Командна та індивідуальна робота на курсі
• Підтримка ментора
• 85% практики та відео розбір кожної домашки
• Закриті чати зі студентами
• Індивідуальний чат з ментором
• Додаткові матеріали, конспекти, тести
• Сертифікат про проходження курсу
• 6 місяців доступу після завершення курсу

Викладачі курсу

Олександра Коваль - Lead Product Designer