50% Wyższa Wydajność Dzięki Systemowi Projektowemu Silk

Contents
Stworzenie autorskiego systemu projektowemu umożliwiło zespołowi Netguru skrócenie czasu wykonania przy zwiększeniu jakości rezultatów w projektach dla klientów oraz wewnętrznych.
Projekt
Silk to autorski system projektowy Netguru. Został stworzony po to, aby szybciej i wydajniej projektować interfejsy użytkownika na platformach mobilnych. Zawiera elastyczny zestaw narzędzi, które pozwalają na usprawnienie procesu, zapewnienie spójności wizualnej, oraz skrócenie czasu realizacji projektów dla klientów.
Silk ułatwia pracę projektantów dzięki modułowemu podejściu do biblioteki komponentów interfejsu. Umożliwia szybkie prototypowanie, tworzenie makiet i przewodników po stylu. Jednocześnie pełni funkcję systemu projektowego, który daje gotowe elementy do użycia w projektach komercyjnych. Te cechy gwarantują elastyczność i wydajność w adresowaniu wszelkich potrzeb projektowych.
Wyzwania
- Niespójne elementy wizualne i interakcje
- Trudność skalowania istniejących rozwiązań projektowych
- Brak dokumentacji, co spowalnia proces wdrożenia projektów
- Różnica w znajomości zasad projektowania w zespole, co utrudnia współpracę
- Brak wspólnego języka łączącego projektowanie i programowanie, co utrudnia priorytetyzację

Projekt
System projektowy Silk to obszerny projekt z wieloma funkcjami i zasobami służącymi do usprawnienia procesu projektowania interfejsu. Jego kluczowe komponenty to:
-
Core features
-
Rozbudowane komponenty: biblioteka gotowych do użycia, w pełni konfigurowalnych komponentów, która ułatwia szybkie prototypowanie jak i tworzenie nowych, skalowalnych systemów projektowych, oraz zapewnia spójność wizualną projektowanych rozwiązań.
-
Tokeny projektowy: zdefiniowane schematy kolorów, czcionek, spacjowania, oraz kształtów, które ułatwią tworzenie tożsamości wizualnej marki i zapewniają jednolitość projektu.
-
-
Wszechstronność zastosowa
-
Funkcjonalność out-of-the-box: idealny do szybkiego prototypowania, umożliwia błyskawiczne wdrożenie bez potrzeby konfigurowania.
-
Konfigurowalny system projektowy: łatwy w dopasowaniu do potrzeb tożsamości wizualnej marki, dzięki czemu przydaje się w komercyjnych i długoterminowych projektach.
-
-
Szczegółowa dokumentacja
-
Proste konwencje nazewnicta: standardy dla plików i komponentów, które ułatwiają współpracę i zwiększają wydajność procesów.
-
Zalecenia utrzymania i rozbudowania: szczegółowe instrukcje co do rozbudowywania biblioteki i zapewnienia spójności systemu w długim terminie.
-
Porady pisania treści UX: praktyczne rady dotyczące tworzenia przyjaznej dla użytkowników treści i utrzymania jednolitego tonu komunikacji.
-
-
Narzędzia wdrożeniowe
-
Poradniki krok-po-kroku: szczegółowe instrukcje dotyczące implementacji Silk w różnych środowiskach, jak projekty wewnętrzne lub komercyjne.
-
Przykładowe wdrożenia
Wdrożenia u klienta #1
W 2024 roku, Silk został użyty do stworzenia MVP natywnej mobilnej aplikacji, skracając czas realizacji i wspomagając spójność projektu. Podobny projekt z 2021 roku, ale realizowany bez Silk trwał dłużej i realizacja była mniej wydajna.
Impact of Silk Design System
|
Aspect |
With Silk (2024) |
Without Silk (2021) |
|
Czas trwania |
3 miesiące |
6 miesięcy |
|
Zespó |
1 projektant systemu projektowego, 1 projektant UX |
2 projektantów systemu projektowego |
|
Konfigurowalność |
Lekkie zmiany stylu, dodane 6 komponentów (z 27 do 33), przeprojektowany komponent chat |
Niestandardowe komponenty budowane od zera |
|
Platforma |
Natywna aplikacja mobilna (iOS, Android) |
Aplikacja webowa i mobilna (iOS, Android) |
|
Dokumentacja |
Obszerna, rozbudowana w trakcie implementacji |
Ustalono standardy ale wymagania czasowe wpłynęły na spójność |
|
Wdrożenie |
Agile: styl komponentów był globalnie aktualizowany przy użyciu tokenów, co przyspieszyło wdrożenie i jednoczesne rozwijanie MVP aplikacji |
Kaskadowy: wymagał dużego nakładu pracy przy dopracowaniu stylu i regularnych konsultacji w kwestii brandingu i marketingu. Wdrożony dopiero po zakończeniu projektowania. |

Wdrożenie u klienta #2
W tym projekcie tworzona była aplikacja mobilna, która miała ułatwić rezerwację lotów i zakwaterowania. Dopasowana do specyfiki rynku, aplikacja umożliwia użytkownikom wyszukiwanie lotów, kupno biletów i zarządzanie rezerwacjami hotelowymi bez wysiłku.
Wpływ systemu projektowego Silk
- Wstępne projektowanie: Silk odegrał kluczową rolę w zachowaniu krótkiego terminu, pozwalając na zaprojektowanie aplikacji w 4 tygodnie. Dzięki użyciu gotowych komponentów, zaoszczędził około 6 dni pracy, jednocześnie ulepszając spójność wizualną różnych części aplikacji. Dodano również niestandardowe komponenty, które pasowały do stylu wizualnego aplikacji.
- Rebranding: gdy klient stworzył nową markę, Silk pomógł zespołowi szybko dopasować projekt aplikacji. W 2 dni przeprojektowano główne elementy aby szyko dostarczyć komponenty do wdrożenia zespołowi programistów. Pełny proces rebrandingu, wraz z informacją zwrotną od klienta i poprawkami, został skończony w 3 dni. Bez Silk, ten proces zająłby dodatkowe 4 dni.

Rezultaty
- Wzrost wydajności: projekty realizowane w oparciu o Silk trwają krócej, sam proces szybkiego prototypowania odbywa się 50% szybciej niż bez Silk.
- Łatwa konfiguracja: 80% użytkowników z powodzeniem zaadaptowało komponenty Silk do wymagań marki, bez negatywnego wpływu na spójność projektu.
- Produktywna współpraca: zespoły odnotowują lepszą spójność i komunikację dzięki szczegółowej dokumentacji Silk i ustrukturyzowanej bibliotece komponentów.
