wave first wave second wave third wave four wave five wave six wave seven
Business Hero Cards
Zobacz, jak działać w czasie kryzysu

Spotkajmy się

Podczas 15-minutowej rozmowy z ekspertem możesz porozmawiać między innymi o tym, jak poprawić zadowolenie Twoich klientów, zaprojektować i przetestować MVP, stworzyć atrakcyjny i konkurencyjny design produktu, przeprowadzić audyt UX, UI, czy też usprawnić ścieżkę zakupową.
Obserwuj nas

14. Bałagan w produkcie – jak z tego wyjść?

Ale czym jest design system? 

To gotowa biblioteka komponentów. To biblia w Twoim biznesie, która trzyma porządek w produkcie dla wszystkich stron. To nie musi być opasła księga, a prosty i ciągle żywy dokument, który poprawi efekty pracy designerów, developerów, UX i UI-ów – wszystkie strony zainteresowane projektem. 

Jeśli w Twojej firmie nadszedł ten moment gotowości biznesowej, a Ty chciałabyś dowiedzieć się więcej, wysłuchaj najnowszego odcinka podcastu!

Uważamy, że inwestowanie w design system jest oznaką dojrzałości biznesowej. Po prostu – jeśli chcemy rosnąć, to w design system musimy zainwestować.

Właścicielu startupu, przedsiębiorco, twórco, z tego odcinka dowiesz się:

  • jakie oszczędności możesz osiągnąć wprowadzając design system?

  • czy opłaca Ci się inwestować w design system, jeśli biznes prowadzisz od lat?

  • jak połączyć wdrożenie design systemu i bieżących zadań biznesowych?

  • kiedy biznes B2B i B2C nie musi wprowadzać design systemu?

  • czy księga znaków (brand book) może zastąpić Design System?

Rozmowy możesz też posłuchać na Youtube:

“Klient widzi niespójność w Twojej usłudze, nawet jeśli Ci o niej nie powie.”

Transkrypcja rozmowy

Ilona: Cześć. Witamy Was w kolejnym odcinku podcastu Design i Biznes.

Radek: W naszych podcastach mówimy częściej o elementach związanych z UX-em, użytkownikiem. O jego doświadczeniu, o tym, jak badać w ogóle to doświadczenie.

Mniej mówimy o kwestiach technologicznych, czyli o tym jak design może wspierać technologie, rozwijać produkt, jak może przyspieszać ten rozwój.

Jakie problemy rozwiązuje design system?

Radek: Nagrywamy ten podcast dlatego, że widzimy pewne problemy, które adresuje pewne rozwiązanie, o którym dzisiaj będziemy rozmawiać. 

A mianowicie design system. Ilona, zanim przejdziemy do tego, czym ten system jest… Jakie problemy design system mógłby zaadresować? 

Ilona: Ja zauważyłam w wielu produktach cyfrowych… szczególnie tych, które są już jakiś czas na rynku… że jest swego rodzaju niespójność i nie boję się użyć tego słowa — bałagan.

#1 – bałagan w produkcie 

Ilona: Bałagan w produkcie — mam na myśli interfejs i to konkretnie co widzi użytkownik. Żeby podać przykład: jesteśmy na ścieżce użytkownika. I w jednym button jest zaokrąglony. W innym miejscu jest kwadratowy. W tym miejscu, na jakimś ekranie, jest inna wielkość typografii, niż jest w kolejnym miejscu. 

W inny sposób informujemy użytkownika o sukcesie albo problemie, po tym jak wypełni jakiś formularz. Wydawać by się mogło, że to w sumie nie ma znaczenia, bo te elementy są od siebie oddalone i dotyczą różnych ścieżek.

Radek: Wiadomo, to jest button. Trzeba kliknąć. To czy jest on zaokrąglony tu, a tam nie, nie ma znaczenia. 

Ilona: Nie do końca tak jest, bo użytkownicy to widzą. Widzą to też nasi współpracownicy. Widzą to użytkownicy i może nie artykułują tego i nie mówią: Ej w tym miejscu macie taki button, a w tamtym inny, ale oni to widzą. Widzą też tę niespójność całego produktu.

Radek: To też działa trochę podświadomie, o czym zaraz będziemy mówić. Zresztą mówiliśmy też w jednym z naszych odcinków, o tym bałaganie, który może widzieć użytkownik na interfejsie. Ale jest też bałagan, który widzą ci, którzy ten produkt budują.

Ilona: Tak, bo ten bałagan zewnętrzny jest efektem bałaganu wewnętrznego. A ten bałagan wewnętrzny polega na tym, że nie ma jednego centralnego miejsca, w którym jest powiedziane: tak i tak wygląda ten komponent. 

Każdy projektuje, jak chce, jak mu się podoba, jakie sam sobie zasady przyjął. Bo nie ma takiej ścieżki, nie ma takiego miejsca, więc trzeba sobie jakoś poradzić. I ja też to rozumiem. 

#2 – każdy robi po swojemu

Ilona: Druga rzecz — każdy deweloper też robi po swojemu. I myślę, że to jest większy problem. Bo najpierw designer zrobi po swojemu. Potem deweloper zrobi po swojemu. I odkręcenie wszystkich tych zmian jest bardzo czasochłonne i drogie.

Radek: Żeby jeszcze to był jeden deweloper, a często jest tak, że nad produktem cyfrowym pracuje kilka zespołów. Ten zespół ma swój buttonik, tamten zespół ma swój buttonik. 

To są takie rzeczy, które wpływają na interfejs. I te rzeczy działają podświadomie na użytkownika, na jego odbiór i ocenę naszego produktu. 

Mamy bałagan po stronie użytkownika. Mamy bałagan wewnątrz, który właśnie na to wpływa. I to jest bolączka, którą rozwiązuje nasz design system, który będziemy zaraz omawiali. 

#3 – dodatkowe koszty 

Ilona: Trzecia rzecz, na którą trzeba zwrócić uwagę, to są same koszty dewelopmentu. Jeżeli deweloperzy, zamiast korzystać z gotowej biblioteki, kodują każdy widok od zera, to spędzają nad tym o wiele więcej czasu, niż korzystając z gotowych komponentów.

Czym jest design system?

Radek: Trochę rąbka tajemnicy odkrywasz… Czyli design system jest gotową biblioteką komponentów.

Ilona: Tak, to jest gotowa biblioteka komponentów. Design system jest odpowiedzią na brak zasad funkcjonowania naszego interfejsu, tego jak to powinno być zaprojektowane, jak to powinno działać. 

Oczywiście można się posiłkować i robić to w inny sposób. Możemy mieć na przykład opasłą dokumentację, która to trzyma w sobie. To jest odpowiedź na ten problem ze starych czasów.

Dlatego, że design system to nie jest coś, co było 10, 20, 30 lat temu. Pewnie, w dużych korporacjach powstawały pierwsze design systemy. Były jakieś zalążki. 

Niemniej jednak same programy graficzne, z których my korzystamy, nie umożliwiały wcześniej korzystania z takich bibliotek. Było więc bardzo trudno tę spójność zachować. 

Teraz na szczęście mamy takie narzędzia. Możemy taką bibliotekę komponentów trzymać sobie w narzędziu, potem korzystać z tych elementów i szybciej budować interfejsy. 

Jednak tak jak powiedziałam, to jest nowość. Może to nie jest nowość z 2023, ale to nie jest coś, co było z ami od 10 lat.

Radek: Podejrzewam, że mogą niektórzy z naszych słuchaczy myśleć, że design system jest trochę jak księga znaku. To jest dobre porównanie, ale być może też fałszujące pewną rzeczywistość i prawdę na temat design systemu. Bo design system to nie jest coś, co można podać i trzymać w PDF-ie. 

Księga znaku vs design system 

Radek: Jakie są różnice między księgą znaku a design systemem interfejsu?

Ilona: Różnicą między brand bookiem, księgą znaku a design systemem jest to, że brand booka robimy prawdopodobnie raz. Rzadko kiedy coś dodajemy lub zmieniamy. Powstanie owego brand booka raczej wiąże się z tym, że robimy lekki lift logotypu. Albo całkowicie ten logotyp zmieniamy.

I wtedy wypracowujemy na nowo zasady mówiące o tym, jakiej typografii używamy. Jeśli na przykład logo funkcjonuje w różnych środowiskach — cyfrowym lub analogowym, tym naszym papierowym,

A design system, przynajmniej z mojej perspektywy, to biblioteka komponentów, która jest żywym dokumentem, z którego ja korzystam na co dzień.

Radek: Ale mówisz dokumentem, czyli co…?

Ilona: No właśnie. To też jest kolejna różnica między księgą znaku a design systemem, ponieważ zwykle z księgi znaków korzystamy właśnie pod postacią takiego PDF-a. 

Natomiast design system jest czymś, co jest wewnątrz naszego programu graficznego. My korzystamy z Figmy. Żeby odkryć trochę technikaliów… mamy stronę na Figmie, gdzie mamy poukładane wszystkie elementy graficznie. 

Ale mamy też je poopisywane tak, że deweloper, który wejdzie do tego pliku i kliknie dany element, nie dość, że będzie miał wygląd tego elementu, to jeszcze po prawej stronie będzie miał opis od UX designera. I będzie miał różne stany tego komponentu.

Radek: Tak jak powiedziałaś, design system żyje. To jest jedna rzecz. A druga rzecz jest taka, że jest on dostępny dla wszystkich. Każdy ma do niego dostęp i jeśli następują jakieś zmiany w design systemie, to one się zmieniają wszędzie.

Ilona: Księgę znaku teoretycznie też możemy mieć dostępną dla wszystkich. Wystarczy umieścić ją w jakimś intranecie czy na dysku Google’… w jakimkolwiek miejscu, do którego zaglądają ludzie. I faktycznie tam mogą mieć cały czas dostęp do tego dokumentu.

W przypadku design systemu też mamy dostęp do tego dokumentu. Ale tutaj idziemy krok dalej. Samo narzędzie, jakim jest Figma, wysyła nam notyfikację, kiedy jedna osoba z naszego zespołu zmieni coś w tej naszej bibliotece.

Korzyści design systemu

Ilona: Wyobraźmy sobie taką sytuację. Projektujesz jakiś nowy produkt w ramach już istniejącego produktu i obecne komponenty po prostu nie wystarczają. Musisz dodać coś nowego. Więc projektujesz ten nowy komponent i w momencie, kiedy ten nowy element strony jest gotowy, dodajesz go do tej naszej biblioteki, naszego źródła prawdy.

W momencie, kiedy ty jako jeden z projektantów w powiedzmy piętnasto-, dwudziestoosobowym zespole, dodasz ten element do design systemu to wszyscy dostają notyfikację, że to się wydarzyło.

Przed design systemem pamiętam sytuację, gdzie miałam zaprojektowaną ścieżkę użytkownika i to był formularz. I wiadomo, że ten formularz projektuje się w różnych stanach — nie wypełniony, wypełniony, z walidacją, z jakąś komunikacją do użytkownika. 

I teraz przychodzi na przykład klient i mówi, zdecydowaliśmy biznesowo, że usuwamy pole telefon. Teraz ja jako projektantka w tym starym systemie, musiałam iść na wszystkie ekrany, gdzie był ten formularz i musiałam to pousuwać. 

W momencie, gdy miałabym to stworzone jako komponent. Zrobiłabym to w jednym miejscu,  w bibliotece. I usunęłoby mi się wszędzie. Co jest zdecydowanie bardzo dużą oszczędnością czasu

Radek: Dobra a powiedz mi Ilona, ile kosztuje Twoja godzina pracy? 

Każda godzina pracy pracownika kosztuje. Jakbyśmy porównali sobie teraz… gdybyś miała odklikiwać to wszytko, to policzyłabyś mniej, bo robisz jakąś mniej znaczącą rzecz?

Nie, policzyłabyś to samo. Chcę zwrócić uwagę na to, że ta automatyzacja mega obcina koszty. Będziemy mogli skupić się na innych ważnych aspektach rozwoju produktów, a nie na odklikiwaniu rzeczy. 

Story Book

Radek: Powiedziałaś o Figmie. Ja bym chciał jeszcze usłyszeć o jakiś innych narzędziach. Bo design system nie tylko tam może być umieszczony. Może być również zakodowany i być narzędziem czysto dla deweloperów.

Ilona: To jest druga strona medalu. Z jednej strony mamy przygotowane te elementy w naszym programie graficznym i możemy sobie w łatwy sposób budować widoki. 

A z drugiej strony nie chcemy, żeby deweloper wdrażał wszystkie widoki pojedynczo. Czyli brał każdy pojedynczy widok i zgodnie z designem było wdrażane. Też chcemy, żeby budował z komponentów.

I tutaj z pomocą przychodzi na przykład takie narzędzie jak Story Book, które umożliwia zakodowanie tych elementów… przetrzymywanie ich w Story Booku i potem tylko korzystanie z tych gotowych zakodowanych elementów.

Kiedy zainwestować w design system?

Radek: Był u nas niedawno tutaj Paweł Friske, nasz klient, któremu projektujemy sklep internetowy — Open Gift, polecamy! 

Paweł powiedział coś takiego, że design system nie na początku, tylko w momencie, kiedy już jesteśmy w jakiś sposób rozwinięci. Czy ty byś się zgodziła z jego słowami? Pytanie, czy taki wysiłek warto podejmować na początku?

Ilona: Ja jako projektantka zrobiłabym design system. Oczywiście. Bo mi to ułatwia pracę. 

Radek: Taki malutki…

Ilona: Dokładnie. Nie ma sensu inwestować w bardzo dużą, rozbudowaną bibliotekę składającą się z komponentów, których nigdzie nie używamy, tylko dlatego, że one istnieją i warto je mieć i może kiedyś się to przyda. 

Ale tak myślę sobie o moich obecnych projektach, że nie wyobrażam już sobie nie korzystać z design systemu. Ten design system nie musi być rozbudowany. To może być biblioteka kilku najczęściej powtarzających się elementów po to, żeby ułatwić nam pracę i ułatwić nam potem wprowadzenie poprawek.

Radek: Czyli można powiedzieć, że robimy taki design kit. Robimy stronę lotniska, aplikacje, cały system różnych marek i widzieliśmy, że musimy zaprojektować ten projekt… że to będzie duże. 

Design system jest absolutnie istotny w takich sytuacjach. Wiadomo, że będziemy potrzebować masy komponentów i trzeba je zaprojektować, żeby móc przyspieszyć pracę nad tymi różnymi elementami.

Ilona: Robimy stronę lotniska od zera, więc możemy ten design system zaprojektować od zera i wszystko zrobić spójnie. 

Są też takie momenty, kiedy marka istnieje już jakiś czas na rynku. To jest produkt, który ma 10-15 lat i nie było możliwości skorzystania z gotowej biblioteki komponentów, która byłaby dedykowana dla mojej marki. 

Miałam kilku designerów. Miałam kilku programistów frontend i każdy wdrażał tak, jak uważał. I występowały tak naprawdę te problemy, o których powiedzieliśmy na początku.  Bałagan w produkcie, dłuższy czas dewelopmentu

Taki klient stoi przed pytaniem, czy inwestować w design system, czy nie? Czy mi się to opłaca, czy lepiej poświęcić ten czas na poprawianie na przykład tych widoków, które już są? Czy lepiej zainwestować i jednak stworzyć tę bibliotekę? 

Możemy oczywiście dalej brnąć w ten nasz bałagan i próbować trochę go uporządkować. I wtedy jest jakiś projekt wyklikiwacz, który przechodzi te wszystkie widok i to poprawia. 

I problem jest zażegnany na jakiś czas, ale długoterminowo uważam, że bardziej opłaca się zainwestować w design system. 

Nawet poświęcając miesiąc albo dwa, żeby przygotować te podstawowe komponenty i przerysować kilka widoków, żeby sprawdzić, czy to ma sens, czy to dobrze wygląda, czy nie powinniśmy na przykład czegoś zmienić. 

Tworzenie design systemu to jest bardzo dobry moment na weryfikację naszego interfejsu

Wyobraźmy sobie sytuację, że zaczynamy tworzyć ten design system i patrzymy na to, co stworzyliśmy i tak myślimy sobie, trochę trąci myszką, przydałoby nam się odświeżenie. Wtedy automatycznie tworzymy design system i w pewien sposób poprawiamy już to, co mamy.

Radek: Jedna rzecz to jest ta warstwa wizualna. A druga rzecz to jest ta warstwa z flow albo z architekturą informacji czy strukturą menu. Też takie klocki wychodzą czasami podczas takiej analizy.

Tutaj fajnie powiedziałeś, że warto zacząć od tego, żeby przerysować to, co już jest. Patrzeć czego my potrzebujemy, czego nam brakuje. Być może trzeba zrobić parę kroków do tyłu i przemyśleć właśnie tę strukturę, te bardziej UX-owe rzeczy. 

Ilona: Zainwestowanie w ten kawałek UX-owy, UI-owy pomoże nam później wdrażać elementy szybciej. Wyobraźmy sobie, że poświęcimy kilka miesięcy na to, żeby ten design system wdrożyć, ale to nie znaczy, że praca stoi. 

Mając już podstawy i mając już kawałek design systemu, wtedy przychodzi biznes i mówi, robimy teraz jakiś nowy ficzer do naszego produktu. To nie jest tak, że zespół spędza kilka miesięcy na tym, żeby to narysować, albo kilka tygodni. Korzystając z design systemu, można coś szybko zamakietować nawet w tydzień.

Design system a szybkie zmiany 

Radek: Ja mam taki kejs. Potrzebuję dokonać zmiany na interfejsie, który jest trochę frankensteinem, który jest wyrysowany ze złych komponentów. Design system by dużo usprawnił, ale mój biznes wymaga szybkich usprawnień

Co można powiedzieć takiemu product ownerowi, który ma cel biznesowy do osiągnięcia i nie może sobie pozwolić na to, żeby poczekać. 

Trudne co? Bo to są tego typu kejsy — czy zatrzymać biznes na chwilę, złapać głęboki oddech i przygotować się na wzrost, ale później? 

Ilona: Wyobrażam sobie, że w takich produktach cyfrowych, które są już jakiś czas na rynku… Jest zaplanowana jakaś roadmapa, powiedzmy na kwartał. 

Nie wyobrażam sobie sytuacji, że przychodzi designer albo nawet product owner i mówi: To teraz my stopujemy pracę i nie robimy rzeczy, które są zaplanowane na roadmapy i zaczynamy budować design system. 

Podjęcie takiej decyzji na pewno chwilę trwa, ale jeżeli zaplanujemy to i powiemy sobie, OK dobra, teraz podejmujemy jakiś kompromis i na przykład budujemy z tego, co mamy. 

Albo właśnie budując z tego, co mamy, robimy mini design system, który będziemy rozwijać przez kolejne kwartały. I dajemy sobie więcej czasu na to, żeby budować taki design system — naszą bibliotekę komponentów, nasze źródło prawdy.

Jeżeli nie mamy dostatecznych zasobów, to zawsze można się zgłosić do agencji takiej jak nasza i my taki design system możemy stworzyć we współpracy z UI designerami i UX designerami. 

Radek: Możemy pomóc, wspierając zespół, robiąc rzeczy, które mogą dziać się w tle, czyli budować tę bibliotekę komponentów. 

Jeśli macie takie wyzwanie, albo chcielibyście się dowiedzieć więcej o design systemach, zapraszamy na naszą stronę designzima.com. Tam kliknijcie przycisk, zapytaj eksperta.  My się wami skontaktujemy i będziemy mogli porozmawiać na ten temat. 

Domyślam się, że są tzw. użytkownicy B2C, czyli tacy, którzy kupują od nas dla własnych celów. To nie jest tak zwany produkt SaaSowy. Mówię o tym dlatego, że zaprojektowanie tego wyjątkowego design system odgrywa kluczową rolę, bo ono podbija wartość marki.

Ilona: Generalnie, tak. Zgadzam się z tobą. Design system daje ci pewną unikatowość i pozwalać się wyróżnić na rynku. Zgadzam się z tym. Ale powiedziałeś o tym B2B, B2C i od razu mi się zapaliła lampeczka, dlatego, że ja pracuję dużo dla B2B.  

Myśląc o przykładach gotowych design systemów… jednym z najbardziej popularnych design systemów jest Carbon, który jest od IBM-u. Znowu mamy tutaj firmę, która sprzedaje głównie B2B. To jest ogromna marka, która zauważyła to, że ma niespójność w produktach. 

Też pomyślmy sobie, ile tych produktów mają. Jeżeli mamy taki duży przekrój produktowy, to nie da się utrzymać tej spójności. 

Trzeba mieć jakąś jedną jednostkę, która będzie dbała o to, że ten design system po pierwsze jest żywy. Po drugie, że jest update’owany. A po trzecie, że ludzie z niego korzystają i korzystają z niego dobrze.

Jak zainwestować w design system 

Radek: Chciałbym poruszyć wątek inwestowania w design system. 

To, o czym rozmawialiśmy wcześniej, z tą marką, która ma już od lat produkt cyfrowy na rynku. Musi usprawnić pracę nad produktem, musi uspójnić wizualnie swój produkt, swój interfejs. 

To jest taki kejs, gdzie inwestowanie w design system jest z mojego punktu widzenia i z punktu widzenia naszych klientów dość jasny.

Ale są też kejsy, gdzie duże produkty, czyli te już rozwinięte, które mają swój produkt cyfrowy… Według mnie nie ma sensu inwestowania w taki dedykowany design system

Mówię tutaj bardziej właśnie o tym segmencie B2B, bo tutaj częściej poleciłbym korzystanie z gotowych bibliotek.

Ilona: To jest decyzja biznesowa, którą każdy musi podjąć na swoim podwórku. I zastanawiam się, czy to jest kwestia bycia B2B, czy B2C? 

Radek: No właśnie, może nie…

Ilona: Myślę sobie, o przykładach z życia, gdzie bardziej bym poleciła firmom, które dopiero zaczynają i chcą na przykład budować jakiś produkt cyfrowy… i tutaj się zastanawiam niezależnie chyba czy B2B, czy B2C… Niemniej jednak w B2C będzie to bardziej widoczne, żeby skorzystały z gotowych komponentów. 

A dlaczego mówię, że w B2C będzie to bardziej widoczne? Dlatego, że te gotowe design systemy są w wielu produktach i my już trochę się z nimi o patrzyliśmy.

Radek: Dla mnie taki produkt nie będzie wyjątkowy, nie będzie budził większych emocji jeśli…

Ilona: Z drugiej strony, żeby udowodnić na przykład, że nasz produkt ma szansę na rynku i będzie się sprzedawał, że działa… 

Myślę, że nie ma problemu, żeby skorzystać z takiego gotowego design systemu, dlatego, że będziemy mieć wszystkie benefity dotyczące spójności, będzie szybszy dewelopment. A nie poniesiemy tej inwestycji na przygotowanie dedykowanej biblioteki komponentów. 

Myślę, że z punktu widzenia biznesowego to byłoby mądre, żeby tak zrobić. Ale znowu w naszym portfolio mamy przykłady startupów i scale-upów, które po pewnym czasie postanowiły ostylować to po swojemu. 

Mówię o startupie B2B. Mówię „ostylować”, bo korzystamy z jakiegoś gotowego frameworku. Ktoś już to wymyślił i pewne zachowania możemy sobie skopiować. Ale stylujemy po naszemu. Z naszymi kolorami, z naszymi zasadami. 

I ten produkt cyfrowy, aplikacja… oni nie zdecydowali się, żeby zrobić to na samym początku, ale po 5 latach uznali, że to już jest ten moment. Mamy na tyle trakcji, że trzeba w to zainwestować i w pewien sposób się odróżnić.

Radek: Inwestowanie w design system i w ogóle w design jest oznaką przejścia pewnego etapu rozwoju. I jeśli chcemy rosnąć, to musimy w ten design również zainwestować.

Ilona: Dokładnie, bardzo ładnie to powiedziałeś. To jest taki moment, że już nie jesteśmy startupem, jesteśmy scale-upem. I idziemy po więcej. 

Najlepsze biblioteki 

Radek: Wróćmy do tych gotowych bibliotek. Bo to nie jest taki oczywisty temat. Które biblioteki według Ciebie można by było polecić naszym klientom, tak po prostu. A z drugiej strony chciałbym usłyszeć, jakie są blaski i cienie korzystania z takich bibliotek.

Ilona: Gotowe design systemy, których nazwy już padły wcześniej, to na pewno Carbon design system od IBM-u. Oraz Material Design od Google, który już od dziesięciu lat jest na rynku. To są dwa najbardziej popularne. 

Ant Design to jest design system, z którego my najczęściej korzystamy, jeżeli robimy rzeczy dla B2B. Zdarzało nam się projektować na przykład dashboardy do fabryk, tabele, rzeczy związane z IoT, rzeczy związane z data processing… 

Wtedy, kiedy mamy produkt, gdzie jest bardzo dużo danych, dużo tabel… Ant Design sprawdza się świetnie. Jest bardzo dużą biblioteką, która ma, nie wiem ile komponentów…  tysiąc? Może więcej? 

Radek: Miałem okazję akurat budować i duże i małe produkty na bazie Ant Designu. Czasami, można przestrzelić się, wziąć bibliotekę, której obsługa jest bardzo trudna. Przebicie się przez te wszystkie komponenty, znalezienie właściwego…

Co za dużo to…

Ilona: Ale co to znaczy w ogóle, przebić się przez właściwe komponenty? Bo myślę, że nasi słuchacze mogą nie do końca wiedzieć, o co chodzi. 

Jeżeli mamy bardzo dużą bibliotekę komponentów i ja jako projektant siadam, otwieram sobie Figmę. Importuję gotowy design system. Wpisuję sobie nazwę tego komponentu i w przypadku tak ogromnych systemów mogę nie precyzyjnie napisać nazwę i dostać na przykład 100 komponentów do przejrzenia. I spośród tych stu muszę wybrać ten, który mi się najbardziej podoba. Albo ten, który najbardziej mi pasuje. 

Radek: Kiedy powiedzieliśmy sobie, że dla małych produktów, trzeba uważać, jaką bibliotekę się wybiera, żeby nie była za duża. Czym jeszcze powinniśmy się kierować przy wyborze takiej biblioteki? Wielkość mojego produktu, to jak jest skomplikowany… to jest jedna rzecz z tych rzeczy.

Biblioteka to nie wszystko 

Ilona: Gotowa biblioteka to nie są gotowe ekrany. Biblioteka tak jak sama nazwa wskazuje, to jest po prostu zbiór tych komponentów. Potem taki UI designer musi usiąść i korzystając z tych komponentów zbudować to, o co nam chodzi. 

I to, o czym powiedzieliśmy wcześniej… Dzięki temu oszczędzamy czas, zrobi to szybciej. Ale to nie jest tak, że naciśniemy jeden przycisk generuj widok taki i taki i to się stworzy.

Patrząc na tempo, w jakim rozwija się sztuczna inteligencja… Może to jest pomysł na startup, żeby zbudować na przykład taki flow, który pozwoli nam podpiąć gotową bibliotekę, czyli właśnie te komponenty. I jednocześnie w formie tekstowej pisać, co chcemy mieć na widoku. I może to się będzie generowało. Nie mówię, że nie.

Radek: Ale jesteśmy jeszcze w epoce kamienia łupanego. Designer musi sam ułożyć krany…

Ilona: Designer siedzący w jaskini. 

Radek: Dokładnie, układa sam. I co jeszcze ten designer musi zrobić, żeby użyć takiej biblioteki. Bo te biblioteki dają się ostylowywać. Jest zakres swobody, możliwości personalizacji takiej biblioteki. 

Tutaj sobie myślę, że jeśli mamy gotowy jakiś look and feel, to może by włożyć tam swoje kolory? Możemy zamienić na przykład fonty tak, żeby jednak zbliżyć ten nasz produkt do tego looku, który my chcemy osiągnąć. 

Podsumowanie 

Radek: Podsumowując… Biblioteki są na pewno tańsze. Wciąż wymagają obsługi, ale nie wymagają kreowania tego wszystkiego. 

Warto się zastanowić, jaka jest skala mojego produktu, żeby dobrać odpowiednią bibliotekę.  Żeby nie brać za dużej, gdzie do małego produktu, po prostu będzie przestrzeleniem. 

Chciałbym podkreślić, że to jest bardzo duże wyzwanie. I firmy, które się na to decydują, to są firmy, które liczą się z kosztami. Liczą się z czasem. Ale to są firmy, które na pewno chcą się rozwijać. Chcą wejść poziom wyżej i chcą przestać się przejmować takimi rzeczami jak układanie interfejsów i projektowanie.

Ilona: Fakt, że tego nie było, a teraz jest i staje się standardem… jest swego rodzaju drogowskazem, w jakim kierunku firmy powinny iść.

Trzeba się zastanowić na swoim podwórku, czy chcemy inwestycję zrobić teraz, czy za kilka lat. Może być już wtedy trochę trudniej, bo będzie więcej rzeczy do sprzątania. Ale oczywiście każdy musi taką decyzję podjąć samodzielnie. 

Gdybyście potrzebowali wsparcia w budowaniu design systemów, wejdźcie na naszą stronę.  W prawym górnym rogu macie przycisk zapytaj eksperta.

Jeżeli macie jakiekolwiek pytania. Jeżeli nie rozwinęliśmy jakiegoś wątku dostatecznie dobrze, to zapraszamy do kontaktu. Chętnie porozmawiamy o tym, jak zbudować design system.

Radek: Zapraszamy was serdecznie. Do usłyszenia.

Ilona: Cześć.

Podobał Ci się ten odcinek?

Do usłyszenia!
Radek & Ilona
Radek & Ilona

Podoba Ci się nasz podcast?

Zobacz pozostałe odcinki

Wszystkie odcinki