Figma: Biblioteki

00:00.600Żeby pokazać Ci ostatnią ze świetnych funkcji, które są w Figmie odnośnie pracy zespołowej, muszę na jednym

00:06.540z kont przejść sobie z powrotem do plików, a następnie mamy tutaj taką sekcję jak zespoły. Mamy możliwość

00:13.310stworzenia nowego zespołu, czyli opcję "New Team", i piszemy tutaj, np. "Team Eduweb", wybieram polecenie "Create", teraz wpisuję

00:22.020adresy e-mail osób, które będą należały do tego zespołu. Wpiszę tylko jeden adres.

00:28.640Autouzupełnianie mi pomogło, ale nie chcę kolejnych adresów.

00:33.450Wybieram polecenie "Invite".

00:35.060I w tym momencie mam informację o tym, kto jest w moim zespole. Ja jestem jego "ownerem", natomiast każdy,

00:40.710kto jest w zespole może domyślnie edytować moje dokumenty. Mogę dać mu uprawnienia "admina", czyli możliwość

00:46.360dopraszania innych ludzi do zespołu, albo dawania im różnych innych uprawnień, np. nadawania uprawnień do

00:52.410edycji. Mogę oczywiście jeszcze raz wysłać zaproszenie, bo to zaproszenie, poszło mailem. Mogę też autoryzować

00:59.760połączenie ze Slackiem, tak, aby w moim zespole pojawiały się też komentarze i powiadomienia z Figmy bezpośrednio

01:05.760na jakimś kanale na Slacku.

01:07.050W związku z tym można to zintegrować z tymi wszystkimi narzędziami, z których właśnie na co dzień korzystasz.

01:13.740Ja otrzymałem już maila, który zaprasza mnie na to konto do zespołu "Eduweb". Więc wybieram polecenie "Accept Invite",

01:22.140a w zasadzie skopiuję sobie ten link i upewnię się, że wkleję go w tej innej przeglądarce. Więc klikam sobie

01:28.050na ten link.

01:29.530I, jak widzisz, teraz już ilość osób w zespole wzrosła do dwóch.

01:32.730Mamy "Team members: 2" i ta osoba jest już aktywna. Nie jest wyszarzona, w związku z tym może pracować nad naszymi

01:39.000projektami w zespole. I, o ile mamy tutaj projekty "Personal", to możemy też stworzyć sobie nowy projekt

01:44.670zespołowy i nazwać go. np. ja go nazwę "Test". Zauważ, że od razu przenosimy się do tej przestrzeni i możemy

01:52.860stworzyć jakiś nowy plik.

01:54.460Wybieram polecenie "New File". W tym momencie może nazwijmy go "Sample File". A po lewej stronie, w tym okienku,

02:03.960w którym jestem zalogowany na konto "Spam" pojawił mi się tutaj ten zespołowy, drużynowy projekt "Test",

02:09.660który został kilka sekund temu utworzony.

02:11.820Mogę dodać go do ulubionych, jeżeli kliknę na samą gwiazdkę, tak, aby pojawił mi się tutaj w tej części.

02:17.580I mogę już przejść do tego projektu. Jak widzisz "Sample File", jak i wszystkie pozostałe pliki, które będziemy

02:22.050tworzyć w ramach takiego projektu są już dostępne.

02:24.600Mam informację o tym, że Grzegorz akurat edytuje ten plik. Mogę wejść do tego pliku, aby edytować go razem

02:30.840z nim. I teraz, jeżeli na tym oknie sobie stworzy jakiś nowy frame...

02:34.860Utwórzmy sobie frame'a. Tworzę jakiś kształt w środku.

02:39.120Zauważ, że to wszystko działa w czasie rzeczywistym, a członkowie, wszyscy członkowie zespołu mają dostęp

02:44.790do wszystkich nowych plików, które stworzę w ramach tego projektu zespołowego. I teraz, to, co jeszcze możemy

02:50.850zrobić, to przejść do sekcji "Team Library", czyli "Biblioteka", z pomocą której możemy w ramach naszego zespołu

02:59.280tworzyć tak zwane "Shared Components", czyli komponenty, które będą współdzielone na przestrzeni naszego zespołu.

03:06.930Zamknę na razie to okno i stworzę z pierwszego elementu, który sobie tutaj dodaliśmy komponent. Klikam na opcję "Create Component",

03:13.440tak jak to robiliśmy wcześniej, czyli stworzyłem sobie pierwszy komponent. A teraz mogę przejść

03:18.600jeszcze raz do "Team Library", i mamy informację o tym, że "Share Component" powinien zostać...

03:36.400I w tym momencie stworzyłem taki mój komponent prywatny.

03:39.130On jeszcze nie jest dostępny w tej zespołowej bibliotece.

03:42.520Ale, jeśli spojrzę tutaj na prawą część, to mam informację, mam taką sekcję "Component", która pozwala mi dodać

03:49.390ten komponent do biblioteki.

03:51.130Może to być np. nasze logo, może to być masa rzeczy, które będziemy trzymać sobie wspólne w naszej bibliotece

03:57.340i edytować je razem z zespołem. W momencie, gdy zmienią się w jednym projekcie,

04:00.790ponieważ są to komponenty, one będą aktualizowane, a te zmiany będą zaktualizowane w tych wszystkich

04:06.520pozostałych. Więc wybieram polecenie "Add to Library".

04:09.330No i, jak widzisz, mamy opcję publikowania zmian w tej bibliotece "Eduweb", którą mam. Ta elipsa zostanie dodana do biblioteki.

04:16.300Skąd on wie, że to jest elipsa?

04:18.130Jeśli za oknem to okienko i pokaże na moment menu "View", "Panel warstw", to zauważ, że tak właśnie nazywa się mój

04:25.120obiekt. Mogę go nazwać przykładowo "Logo". I teraz, jeśli wybiorę polecenie "Update in Library", mam informację

04:30.940o tym, że właśnie "Logo" zostanie dodane do biblioteki.

04:33.490Możemy wybrać jeszcze opcję konfiguracji.

04:35.570Jak widzisz, mamy możliwość opublikowania czy wyłączenia publikacji tego elementu, jak również wszystkich

04:41.050innych, które znajdują się w bibliotece, a także ciekawą opcję dotyczącą tego, czy komponent zmienił swój

04:46.360stan.

04:46.660Jeżeli ktoś wyedytuje komponent pod naszą nieobecność w Figmie, to będziemy mieli informację o statusie.

04:53.140Lub jeżeli my będziemy go aktualizować, też będziemy mieli informację o tym, czy coś się w nim zmieniło.

04:57.930No i mamy informację o tym, że ta zmiana została opublikowana w bibliotece naszego zespołu.

05:03.670Jeśli teraz na drugim koncie przejdę do biblioteki, i, załóżmy, że właśnie chciałbym je otworzyć, jak widzisz

05:09.910mam tutaj coś takiego jak ten plik "Logo". I teraz, jeżeli w innym dokumencie mogę stworzyć sobie jakiś

05:17.500nowy plik, będę chciał wykorzystać ten komponent z mojej drużynowej biblioteki. Mogę go przeciągnąć i

05:25.120upuścić.

05:25.960I, jak widzisz, już tutaj się znalazł.

05:28.330Teraz zamknijmy tę bibliotekę i spróbujmy wykonać jakieś zmiany

05:31.600do tego komponentu, czyli np. zmienimy jego tło, jego kolor. I teraz, zauważ, że w naszej bibliotece, jeśli

05:38.650do niej wrócę, ten komponent się nie zmienił. Tego komponentu nie da się tutaj bezpośrednio edytować, ponieważ,

05:44.440podobnie jak pozostałe instancje komponentów, to jest tylko jakby jego instancja. To co pokazywałem Ci

05:50.140wcześniej - możemy robić "Override'y", czy np. zmiana wypełnienia do instancji,

05:54.310ale jeśli chcemy edytować komponent, musimy edytować go w oryginalnym pliku.

05:58.780Możemy w tym momencie przejść do naszej wspólnej biblioteki, a następnie kliknąć prawym przyciskiem myszy

06:04.300na komponent, który tutaj mamy i mamy, opcję "Show in source file".

06:08.740Jeśli klikniemy na tę opcję, zostanie w nowej zakładce otwarty plik, w którym znajduje się to źródło komponentów,

06:14.970a nie jego instancja. I ponieważ tu jest oryginalne źródło komponentu, to wykonane w tym pliku zmiany, np.

06:21.310zmiana koloru komponentu na kolor zielony, będą miały odzwierciedlenie w bibliotece. Ale warunkiem takiej

06:27.610zmiany jest wybranie opcji "Update in Library". Czyli musimy wybrać opcję aktualizacji tego komponentu

06:34.690w bibliotece. Możemy go stąd też usunąć, ale, jak widzisz, to powiązanie tutaj jest, i mamy informację co

06:39.850się stanie,

06:40.690zmieni się kolor czerwony na kolor zielony.

06:43.120Publikujemy te zmiany, wybieramy polecenie "Publish changes".

06:45.880Mamy informacje, że te zmiany zostały zapisane do biblioteki. I teraz, nawet na drugim koncie, jeśli wejdę

06:50.350do biblioteki okaże się, że ten plik jest już zaktualizowany.

06:54.130Jeśli miałbym jakieś update'y do wielu obiektów,

06:56.470one będą tutaj widoczne, a ja zaktualizowałem z innego konta ten plik w bibliotece

07:01.180i teraz mogę go używać w wielu projektach, na wielu kontach zespołowych.

07:04.990Jak widzisz taki wspólny workflow, który pozwala na jednoczesną pracę, ale też na pracę osobno na jakichś konkretnych

07:11.300komponentach

07:12.400Jest niezwykle wydajny i może być bardzo skuteczny w twoim zespole. Także polecam Ci sprawdzenie tego

07:17.860trybu. A ja dziękuję Ci za uwagę w tej lekcji i do usłyszenia już za chwilę!