Sieci wektorowe – Polish (Poland)

Ten artykuł jest dostępny zarówno w poprzednim, jak i w nowym interfejsie aplikacji Figma. Użyj przełącznika w lewym dolnym rogu strony, aby wybrać swój bieżący interfejs użytkownika. Poznaj UI3: nowy wygląd aplikacji Figma →

Zanim zaczniesz

Kto może korzystać z tej funkcji?

Obsługiwana w dowolnym zespole lub planie.

Każdy, kto ma dostęp typu can edit (może edytować), może tworzyć i edytować sieci wektorowe.

Sieci wektorowe to warstwy kształtów składające się ze ścieżek wektorowych. Te ścieżki informują aplikację Figma, jak renderować dany kształt w przestrzeni roboczej, w tym gdzie zastosować właściwości obrysu i wypełnienia warstwy.

Wiele narzędzi wektorowych umożliwia rysowanie ścieżek wyłącznie w jednym kierunku, często kończących się w pierwotnym punkcie początkowym. Sieci wektorowe są wyjątkowe, ponieważ nie wymagają określonego kierunku. Mogą mieć wiele ścieżek, które rozwidlają się w różnych kierunkach, bez konieczności tworzenia i łączenia oddzielnych ścieżek. Dlatego nazywamy je sieciami wektorowymi.

Używaj sieci wektorowych, aby tworzyć własne unikalne kształty, szczegółowe ikony, a nawet złożone ilustracje. Użyj narzędzia Pióro, aby od podstaw tworzyć własne sieci wektorowe. Możesz też edytować dowolną warstwę kształtu, w tym kształty podstawowe, w trybie edycji wektorowej, aby utworzyć sieć wektorową.

Tworzenie sieci wektorowych

Możesz użyć narzędzia Pióro lub dowolnego narzędzia Kształt, aby utworzyć nową sieć wektorową.

Podczas korzystania z narzędzi Kształt możesz przytrzymać klawisze modyfikujące, aby rysować je w określony sposób:

Przytrzymaj klawisz ⇧ Shift podczas tworzenia kształtu, aby zablokować proporcje kształtu na 1:1.
Przytrzymaj klawisze ⌥ Option / Alt podczas tworzenia kształtu, aby skalować go względem środka, a nie lewego górnego rogu.
Klikając i przeciągając w trakcie tworzenia kształtu, przytrzymaj klawisz Spacji, aby przesunąć kształt po przestrzeni roboczej przed zwolnieniem przycisku myszy.

Edytowanie sieci wektorowych

Tryb edycji wektorów umożliwia zaznaczanie, dostosowywanie i zmianę właściwości poszczególnych punktów, linii lub całych kształtów.

Edytując obiekt, możesz oddziaływać na istniejące punkty i linie między nimi. Możesz także użyć narzędzia Pióro do zaznaczania dodatkowych punktów i manipulowania nimi.

Aby przejść do trybu edycji wektorowej:

Wybierz ścieżkę i naciśnij klawisz Return / Enter.
Możesz też wybrać ścieżkę i kliknąć przycisk w górnej części prawego paska bocznego.

Aby opuścić tryb edycji wektorowej, naciśnij ponownie klawisz Return / Enter lub kliknij przycisk Close (Zamknij) na pasku narzędzi pomocniczych.

Tworzenie zakrzywionych ścieżek za pomocą uchwytów Béziera

Uchwyty Béziera umożliwiają tworzenie krzywych na ścieżce. Podczas tworzenia lub edytowania sieci wektorowej można dostosować uchwyt Béziera dla każdego punktu na ścieżce wektorowej.

Wybierz sieć wektorową.
Kliknij na górze prawego paska bocznego lub naciśnij klawisz Return / Enter, aby przejść do trybu edycji.
Jeśli jest to krzywa, uchwyty będą już wyświetlane. Jeśli jest to narożnik bez uchwytów, naciśnij przycisk na pasku narzędzi pomocniczych lub przytrzymaj klawisz ⌘ Command / Control i kliknij punkt, aby wyświetlić uchwyty i utworzyć krzywą lustrzaną.
Kliknij i przeciągnij uchwyty, aby dostosować krzywiznę ścieżki.

Zaokrąglanie narożników kształtów

Możesz zaokrąglić dowolny punkt pośredni na ścieżce za pomocą właściwości promienia narożnika na prawym pasku bocznym.

Jeżeli zaznaczysz całą sieć wektorową, wszystkie narożniki zostaną zaokrąglone do tej samej wartości. W trybie edycji możesz wybrać poszczególne punkty i nadać im różne wartości promienia narożnika.

Jeśli pracujesz z otwartą ścieżką, możesz zaokrąglić tylko pierwszy i ostatni punkt zakotwiczenia, używając zakończeń ↓

Dodawanie wypełnień do kształtów i obszarów

Możesz dodawać wypełnienia do dowolnych zamkniętych obszarów sieci wektorowej. Jeśli w sieci wektorowej znajduje się wiele zamkniętych obszarów, możesz dostosować wypełnienie każdego z nich oddzielnie.

Możesz dodać lub edytować wypełnienie wybranej sieci wektorowej we właściwościach wypełnienia w prawym panelu bocznym. Jeśli chcesz zastosować wypełnienia tylko do niektórych obszarów lub użyć różnych wypełnień dla różnych obszarów, musisz przejść do trybu edycji.

Po zaznaczeniu warstwy naciśnij klawisz Return / Enter, aby przejść do trybu edycji.
Kliknij narzędzie Wiadro z farbą na dolnym pasku narzędzi pomocniczych lub naciśnij klawisz B.
Ustaw kursor na obszarze sieci wektorowej, do którego chcesz dodać wypełnienie. Wzór złożony z ukośnych pasków wskazuje, który obszar jest aktualnie zaznaczony.
Kursor zmieni się w ikonę kropli ze znakiem:
- + jeśli możesz dodać wypełnienie do tego obszaru;
- – jeśli istnieje wypełnienie, które możesz usunąć.
Kliknij, aby dodać lub usunąć wypełnienie kształtu lub obszaru.
Aplikacja Figma domyślnie używa szarego wypełnienia. Możesz zmienić wypełnienie, używając właściwości Fill (Wypełnienie) na prawym pasku bocznym. Możesz zastosować gradienty, obrazy, pliki GIF lub style kolorów z biblioteki.
Aby dodać inne wypełnienie do innego obszaru, możesz ustawić kursor na tym obszarze w celu jego zaznaczenia.
Kliknij, aby dodać wypełnienie i dostosować właściwość wypełnienia na prawym pasku bocznym.
Naciśnij klawisz Enter, Esc lub przycisk Close (Zamknij), aby opuścić tryb edycji.

Dodawanie dużych liter do punktów końcowych

Dodaj stylizację do punktu końcowego dowolnych otwartych ścieżek. W aplikacji Figma właściwość zakończenia wygląda inaczej w zależności od wybranego typu ścieżki wektorowej.

Ścieżki wektorowe z dwoma końcami

Aplikacja Figma wyświetli właściwości zakończeń na prawym pasku bocznym, jeśli zostanie wybrana ścieżka wektorowa posiadająca tylko dwa punkty końcowe. Możesz ustawić każde zakończenie niezależnie od pozostałych.

Ścieżki wektorowe z więcej niż dwoma punktami końcowymi.

Aplikacja Figma wyświetli właściwości zakończeń w menu zaawansowanym obrysu, jeśli zostanie wybrana ścieżka wektorowa posiadająca więcej niż dwa punkty końcowe.

Nie można edytować zakończeń niezależnie, jeśli zaznaczono całą ścieżkę wektorową. Aby niezależnie edytować zakończenia, wybierz pojedynczy punkt wektorowy w trybie edycji wektorowej i dostosuj typ zakończenia.

Możesz wybrać jeden spośród sześciu różnych rodzajów zakończeń:

Brak: nie dodaje zakończenia na końcu ścieżki. Końce ścieżki są przycinane pod kątem prostym, bez zwiększania jej długości.
Strzałka liniowa: wstawia dwie linie pod kątem 45 stopni po obu stronach punktów końcowych. Grubość linii jest taka sama jak grubość linii ścieżki. Nie możesz zmienić długości linii grotów strzałek.
Strzałka trójkątna: dodaje trójkątny grot do obu końców. Aby zastosować strzałkę tylko do jednego końca ścieżki, musisz przejść do trybu edycji wektorowej.
Odwrócony trójkąt: odwrócona lub obrócona wersja trójkąta ze strzałką skierowaną do wewnątrz w kierunku ścieżki.
Strzałka okrągła: wypełnione zakończenie w kształcie koła.
Strzałka w kształcie rombu: wypełnione zakończenie w kształcie rombu.
Zaokrąglenie (domyślne): dodaje zakończenie o grubości równej grubości połowy obrysu, a także zaokrągla punkt końcowy ścieżki do 50% szerokości.
Kwadrat: dodaje zakończenie o grubości równej połowie grubości linii, jednocześnie ustawiając punkt końcowy ścieżki na kwadrat.

Sprawdź ten samouczek wideo o sieciach wektorowych, aby zobaczyć, jak działają. I koniecznie przeczytaj „Wprowadzenie do sieci wektorowych” na naszej stronie Medium.