Realizacja

Aplikacja mobilna dla maturzystów: plan nauki, kursy i testy

Przygotowanie do matury to wiele przedmiotów, poziomów i rozproszonych materiałów. Zaprojektowaliśmy i zbudowaliśmy we Flutterze aplikację mobilną na iOS i Android, która układa je w personalizowany plan nauki z kursami, quizami i przypomnieniami.

Zaprojektowaliśmy i zbudowaliśmy aplikację dla maturzystów: personalizowany plan nauki, kursy i lekcje z różnych przedmiotów i poziomów, quizy i testy oraz planowanie sesji z przypomnieniami.

Typ produktu
Aplikacja mobilna
Rynek
Edukacja (B2C)
Technologie
  • Flutter
  • Product Design
Najważniejsze fakty
  • Jedna aplikacja na iOS i Android napisana we Flutterze
  • Personalizowany plan nauki i ścieżki nauczania
  • Kursy i lekcje dla różnych przedmiotów maturalnych i poziomów zaawansowania
  • Quizy i testy oraz planowanie sesji z przypomnieniami
  • Interaktywny prototyp Hi-Fi w Figmie do testowania UX/UI

Rozproszone materiały maturalne zamieniliśmy w aplikację z planem nauki dopasowanym do konkretnego ucznia.

Moodboard projektu aplikacji mobilnej dla maturzystów

Cele

  • 01

    Plan nauki dla każdego

    Dopasować przygotowania do przedmiotów i poziomu zaawansowania konkretnego maturzysty.

  • 02

    Materiały pod ręką

    Dać szybki dostęp do kursów, lekcji, quizów i testów w jednej aplikacji.

  • 03

    Porządek w czasie nauki

    Pomóc zaplanować sesje naukowe i pilnować ich przypomnieniami.

Proces

Define Ideate Design Prototype & Delivery
  1. Moodboard
    Moodboard

    Wizualny i emocjonalny ton aplikacji ustalony przed projektem ekranów.

  2. Wireframes
    Wireframes

    Struktura i kluczowe funkcje: od wyboru przedmiotów po quizy i testy.

  3. Projekt produktu
    Projekt produktu

    Ekrany planu nauki, kursów, quizów i testów na iOS i Androida.

  4. Prototyp Hi-Fi
    Prototyp Hi-Fi

    Interaktywny prototyp w Figmie, na którym testowaliśmy UX/UI.

Co dostarczyliśmy

Aplikację mobilną, która prowadzi maturzystę od wyboru przedmiotów do kolejnych testów.

  • Wireframes - przejrzysta struktura, która krok po kroku wprowadza w kolejne etapy przygotowań.
  • Prototyp w Figmie - interaktywny prototyp Hi-Fi do testowania UX/UI i zbierania opinii.
  • Kursy i lekcje - personalizowane ścieżki nauki dla różnych przedmiotów maturalnych.
  • Tematyka i poziomy - materiały dla różnych poziomów zaawansowania, z których powstaje indywidualny plan nauki.
  • Planowanie nauki - zaplanowane sesje naukowe i przypomnienia o nich.
  • Aplikacja we Flutterze - jeden kod dla iOS i Androida.

Wyzwanie: uporządkować przygotowania do matury

Przygotowanie do matury to wiele przedmiotów, różne poziomy i dużo materiałów. Uczniowie potrzebują sposobu, żeby to uporządkować.

Aplikacja miała zmienić sposób, w jaki maturzyści przygotowują się do egzaminu. Miała być prosta w obsłudze, elastyczna i dopasowana do potrzeb konkretnej osoby: z personalizowanym planem nauki i szybkim dostępem do materiałów.

Personalizowany plan nauki i materiały do niego miały być zawsze pod ręką, w telefonie.

Rozwiązanie: ścieżka od wyboru przedmiotów do testów

Wireframes ułożyły aplikację w ścieżkę: użytkownik krok po kroku przechodzi od wyboru przedmiotów do szczegółowych quizów i testów.

Kursy i lekcje tworzą personalizowane ścieżki nauki. Materiały są podzielone według przedmiotów i poziomów zaawansowania, więc plan nauki układa się pod konkretnego ucznia. Planowanie sesji naukowych i przypomnienia pomagają zorganizować czas do egzaminu.

Prototyp przed kodem

Interaktywny prototyp Hi-Fi w Figmie pozwolił przetestować UX/UI i zebrać opinie, zanim zaczęliśmy programować. Zmiany wprowadzaliśmy w projekcie, a do developmentu we Flutterze trafiła sprawdzona wersja.

Wireframes ekranów kursu w aplikacji dla maturzystów
Ekran kursu historii z ceną i przyciskiem zakupu
Ekran główny aplikacji z popularnymi kursami maturalnymi

Efekty: jedna aplikacja na iOS i Androida

Aplikacja działa na iOS i Androidzie z jednego kodu we Flutterze.

Wspólna baza kodu daje spójny wygląd i działanie na obu platformach, a zmiany wprowadza się w jednym miejscu.

Opracowanie: Publikacja: Aktualizacja:

Produkt edukacyjny? Zacznijmy od prototypu.

Na warsztacie ustalamy, co trafi do pierwszej wersji aplikacji.

Porozmawiajmy