Tworzenie innowacyjnych produktów IT to zadanie wyjątkowo trudne, ponieważ wymaga wyjątkowej kreatywności ze względu na brak benchmarków. Podobnie było przy projektowaniu aplikacji dla kadry naukowej, który wykonaliśmy na przełomie grudnia 2022 r, i stycznia 2023 r.
Wykorzystane narzędzia i technologie
Opis projektu
Zadaniem w opisywanym projekcie było stworzenie prototypu aplikacji do mapowania wyników badań naukowych. Proces tworzenia zaczął się od spotkań z klientem, podczas których poznaliśmy jego dokładne oczekiwania oraz założenia. Aplikacja ta ma na celu pomóc przeszukiwać oraz analizować zbiory artykułów naukowych pod kątem konkretnych, wybranych przez użytkownika zmiennych. Klientowi zależało na prostocie w użytkowaniu oraz estetycznym, lekkim wyglądzie przy jednoczesnym zachowaniu wszystkich niezbędnych funkcjonalności.
Etap projektowania
Kolejny etap procesu tworzenia prototypu składał się z wykonania makiet niskiej oraz wysokiej szczegółowości. W pierwszej części skupiliśmy się na podejściu od strony UX. Biorąc pod uwagę oczekiwania klienta, część aplikacji odpowiadająca za wprowadzenie plików oraz ich filtrowanie została podzielona na 4 kroki. W pierwszym wgrywane są pliki PDF z artykułami naukowymi, które zostaną poddane analizie. Drugi krok polega na wybraniu słów kluczowych, czyli zmiennych pod kątem których użytkownik chce analizować publikacje. Krok 3 i 4 służą do filtrowania prac kolejno po branży oraz kraju.
Efektem tych kroków jest druga część prototypu, w której widzimy mapę połączeń między wybranymi zmiennymi a ich przyczynami/ antecedencjami oraz konsekwencjami danego zjawiska/zmiennej. Wyzwaniem na tym etapie projektowania było przedstawienie wszystkich informacji na temat powiązań w czytelny dla odbiorcy sposób. W wynikach analizy miała się znaleźć wspomniana mapa połączeń, a także statystyczny charakter związku danych zjawisk (pozytywny, neutralny, negatywny). W każdym artykule może być on opisany w inny sposób, a co z tym idzie wyniki analizy także mogą się różnić w poszczególnych artykułach, dlatego niezbędne okazało się pokazanie tabeli z wartościami statystycznymi w konkretnych artykułach oraz odnośniki do publikacji, aby można było zgłębić wybrane fragmenty analizy.
Kwestia dotycząca zależności statystycznych została rozwiązana za pomocą kolorów: związek pozytywny - kolor zielony, neutralny - niebieski, negatywny - czerwony. Po kliknięciu w pole z danym słowem z boku ekranu wyświetlana jest tabela z rozpisanymi konkretnymi wartościami oraz artykułami. Ważna jest także nawigacja po mapie, ponieważ jej rozmiar jest zależny od ilości wgranych publikacji obszerności danych w nich zawartych. Dlatego w lewym dolnym rogu znalazła się zmniejszona wersja wszystkich zmiennych rozmieszczonych na mapie.
Stworzenie prototypu
Ostatnim etapem do wykonania było stworzenie interaktywnego prototypu. Do budowy warstwy front-end wykorzystaliśmy React CRA wraz z biblioteką komponentów Material-UI która zapewnia gotowe do użycia wizualne elementy, takie jak przyciski, pola tekstowe, listy, menu, karty i wiele innych. W aplikacji wykorzystaliśmy bibliotekę react-use-form do stworzenia wielokrokowego formularza. Biblioteka ta umożliwia łatwe zarządzanie stanem formularza, jego walidacją oraz obsługą błędów. Następnie skupiliśmy się na wyświetlaniu wyników w postaci diagramu. Do tego celu wykorzystaliśmy bibliotekę React-Flow, która umożliwia łatwe tworzenie i zarządzanie grafami i diagramami. Po ukończeniu implementacji, przetestowaliśmy prototyp pod kątem funkcjonalności i wydajności, a następnie dostarczyliśmy klientowi gotowy prototyp.
Poprzedni projekt
Strony internetowe CeeCam
Kolejny projekt
Aplikacja web + ChatGPT