O kliencie
FLIR Systems (obecnie część Teledyne FLIR) to jeden z największych na świecie producentów kamer termowizyjnych.
Wyzwanie
Aby testować swoje urządzenia i wprowadzać nowe funkcje, FLIR gromadzi ogromne ilości danych wizualnych – zarówno wideo, jak i zdjęć. Niektóre z tych funkcji wykorzystują uczenie maszynowe, które wymaga precyzyjnie oznaczonych danych, aby generować poprawne wyniki.
Przygotowanie danych to czasochłonny i żmudny proces, wymagający dokładnej analizy przeprowadzanej przez wyspecjalizowane zespoły. Aby usprawnić ich pracę, stworzono wewnętrzne narzędzie do zbierania, przetwarzania i kategoryzowania danych. Początkowo był to niewielki projekt, który z czasem rozrósł się w rozbudowaną aplikację. Jednak brak odpowiedniego projektu zaczął negatywnie wpływać na jej funkcjonalność i wydajność.
Cel
Naszym zadaniem było odświeżenie projektu i optymalizacja istniejącej aplikacji poprzez:
- Przemyślenie roli produktu, refaktoryzację istniejących funkcji i zaproponowanie nowych
- Zaprojektowanie intuicyjnego interfejsu użytkownika, poprawiającego doświadczenie użytkowników
- Dopasowanie stylu aplikacji do wewnętrznych wytycznych firmy
- Poprawę wydajności, aby zwiększyć efektywność zespołów przetwarzających dane – w ekstremalnych przypadkach nawet podstawowe operacje zajmowały kilkadziesiąt sekund
Stos technologiczny
React.js, Node.js, Apollo GraphQL, RabbitMQ, AWS (EBS, SES, ECR).
Proces
Zaczęliśmy od wdrażania drobnych usprawnień i poprawek błędów, aby zapoznać się z istniejącym rozwiązaniem i lepiej zrozumieć wymagania biznesowe. Równocześnie współpracowaliśmy z projektantem UI/UX, aby opracować nowy wygląd i zaplanować dodatkowe funkcjonalności.
Optymalizowaliśmy również zapytania GraphQL wysyłane do serwera, ograniczając ilość zwracanych danych, co w niektórych przypadkach skróciło czas odpowiedzi nawet trzykrotnie.
Gdy pierwsze projekty graficzne były gotowe, ustaliliśmy następujący harmonogram działań:
- Wymiana podstawowych komponentów interfejsu, takich jak przyciski i listy rozwijane.
- Aktualizacja kluczowych elementów aplikacji, np. pasków narzędzi i nawigacji.
- Redefinicja układów z refaktoryzacją starszych elementów, które musiały zostać dostosowane do nowego projektu, oraz optymalizacja renderowania, aby działało tylko wtedy, gdy było to konieczne.
- Wymiana pozostałych, mniej istotnych komponentów UI.
- Dalsza optymalizacja zapytań GraphQL w celu jeszcze większego ograniczenia zbędnego transferu danych.
W miarę postępów w projekcie zaangażowano dodatkowych programistów, aby zapewnić precyzyjną realizację projektu w rozsądnym czasie. Ostatecznie zarządzaliśmy zespołem składającym się z Project Managera, projektanta UI/UX, czterech programistów i testera.
Rezultat
Po 15 miesiącach pracy klient otrzymał nową wersję aplikacji frontendowej z nowoczesnym, uporządkowanym interfejsem, zgodnym z wewnętrznymi wytycznymi firmy. Wydajność została poprawiona nawet o 300%.
