На основі успішної веб-платформи https://marred-clove-b33.notion.site/SaaS-Platform-EduTech-17c5fb1ffc0680acaab3cc58351ac30d виникла потреба у розробці мобільних додатків для iOS та Android з дотриманням відповідних платформних рекомендацій (Human Interface Guidelines для iOS та Material Design для Android). Проєкт зосереджений на адаптації онлайн-навчання для мобільного використання, надаючи студентам доступ до освітніх ресурсів у будь-який час та без прив'язки до стаціонарних пристроїв.
Метою було створення мобільного інтерфейсу, який дозволяє студентам завершувати навчання, переглядати матеріали, спілкуватися з менторами та відстежувати прогрес - у будь-який час та з будь-якого пристрою, будь то iOS чи Android. Головним завданням було зберегти функціональність веб-версії, оптимізувавши її для мобільних сценаріїв використання.
Основні ідеї при створенні мобільних застосунків включали: адаптацію успішної веб-платформи для мобільного використання з дотриманням платформних рекомендацій (Human Interface Guidelines для iOS та Material Design для Android), створення інтуїтивного інтерфейсу для навчання та комунікації з менторами, розробку UI kit для забезпечення візуальної послідовності, та оптимізацію всіх ключових функцій для зручного мобільного доступу, що дозволяє студентам навчатися у будь-який час та з будь-якого пристрою.
На базі попередніх досліджень веб-платформи я створила детальні скетчі, щоб наочно продемонструвати функціонал та загальний каркас майбутніх мобільних застосунків. Кожен ескіз відображає основні навігаційні потоки та розміщення елементів інтерфейсу, враховуючи специфіку взаємодії користувачів з iOS та Android платформами.
На етапі візуальної розробки я створила два окремі дизайн-рішення для iOS та Android, дотримуючись відповідних платформних принципів. Для iOS-версії було застосовано принципи Human Interface Guidelines, використано системні шрифти SF Pro, native iOS-компоненти та характерні елементи інтерфейсу, такі як великі заголовки та закруглені кути.
При розробці Android-версії я керувалася принципами Material Design 3, використовуючи системну типографіку Roboto, компоненти Material Design та характерні для платформи елементи навігації, включаючи bottom navigation bar та FAB-кнопки. В обох версіях було збережено єдину айдентику бренду, адаптувавши її під візуальні особливості кожної платформи.
redpandacompress_Запис екрана 2025-03-05 о 123813.mp4
Розробляючи UI Kit, я зосередилась на створенні узгодженої системи дизайну, що включає усі необхідні компоненти, стилі та принципи взаємодії для обох платформ - iOS та Android. Для iOS-версії було впроваджено системні шрифти SF Pro та нативні компоненти, що відповідають Human Interface Guidelines, а також характерні елементи інтерфейсу із закругленими кутами.