Dodawaj pomiary i wstawiaj adnotacje w projektach
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?
Dostępność we wszystkich płatnych planach.
Każdy, kto ma stanowisko Full oraz dostęp do pliku typu can edit
(może edytować), może dodawać pomiary i adnotacje
Każdy, kto ma stanowisko Full lub stanowisko Dev i co najmniej dostęp do pliku typu can view
(może wyświetlać), może wyświetlać pomiary i adnotacje
Za pomocą adnotacji i pomiarów możesz szybciej tworzyć bardziej przejrzyste materiały do przekazania, które pozostają aktualne nawet w przypadku zmian w projektach.
Dzięki adnotacjom projektanci mogą przekazywać i łączyć kluczowe szczegóły bezpośrednio z projektami.
- Wyróżnianie ważnych właściwości, których nie będą mogli przeoczyć programiści
- Ułatwienie programistom szybkiej wizualizacji takich specyfikacji jak odstępy i rozmiary
- Udostępnianie dodatkowego kontekstu za pomocą notatek tekstowych
- Twórz i kategoryzuj adnotacje, by ułatwić nawigację
Programiści mogą na bieżąco obserwować aktualizacje adnotacji podczas pracy w interfejsie Dev Mode, dzięki czemu mają pewność, że nie pominą żadnych istotnych informacji podczas przekazywania projektu.
Dodawanie pomiarów do projektu
Dodawaj pomiary, by szybko wizualizować odstępy między komponentami i ich rozmiary.
Aby dodać pomiar do projektu:
- Kliknij Measurement (Pomiar) na pasku narzędzi lub użyj skrótu klawiaturowego Shift + M.
- Ustaw kursor na warstwie, aby sprawdzić, gdzie możesz rozpocząć pomiar.
- Kliknij i przeciągnij od punktu początkowego do warstwy, gdzie chcesz zakończyć pomiar.
- Kliknij i przeciągnij pomiar, aby nie zasłaniał projektu.
- Możesz kliknąć pomiar dwukrotnie, aby dostosować jego tekst.
Wskazówka: Aby usunąć pomiar, kliknij go i naciśnij klawisze Delete lub Backspace.
Dodawaj adnotacje w projektach
Projektanci mogą dodawać adnotacje, aby zapewnić kontekst, zdefiniować właściwości projektu lub przekazać inne istotne informacje dla programistów umożliwiające przekształcenie projektu w kod. Adnotacje mogą dotyczyć zdefiniowanych właściwości warstwy, takich jak kierunek wyrównania lub rozmiar, albo przekazać dodatkowe szczegóły w postaci dowolnego tekstu. Nawet jeśli później projekty zostaną zaktualizowane, właściwości adnotacji pozostają aktualne i dokładne, dzięki czemu nic nie umknie.
Adnotacje można dodawać w trybie projektowania lub Dev Mode. Aby dodać adnotacje do projektu:
- Kliknij Annotation (Adnotacja) na pasku narzędzi lub użyj skrótu klawiaturowego Shift + T.
- Wybierz warstwę, do której chcesz dodać adnotację.
- Napisz notatkę w polu tekstowym lub kliknij opcję + Property (+ Właściwość), aby wybrać właściwość z listy. W adnotacji można uwzględnić zarówno zwykły tekst, jak i właściwości.
Kategoryzuj adnotacje
Kategoryzując adnotacje, nadasz im jeszcze większą przejrzystość. Kategorie pomagają odróżniać różne typy adnotacji, co ułatwia wyszukiwanie odpowiednich informacji.
Edytorzy mogą używać domyślnych etykiet, a także modyfikować i usuwać kategorie adnotacji. Etykiety kategorii dotyczą tylko bieżącego pliku – gdy zmodyfikujesz lub usuniesz domyślne kategorie, w innych plikach nic się nie zmieni.
W plikach projektowych Figma znajdziesz dostępne gotowe kategorie adnotacji:
- Development (Programowanie)
- Interaction (Interakcja)
- Udogodnienia dla osób niepełnosprawnych
- Zawartość
Aby dodać nową kategorię:
- Wybierz istniejącą adnotację lub utwórz nową, a następnie kliknij menu rozwijane kategorii.
- Kliknij Edit categories… (Edytuj kategorie…).
- Kliknij , a następnie wybierz kolor i wpisz nazwę nowej etykiety kategorii.
Uwaga: Kopiowanie warstw z adnotacjami zawierającymi kategorie powoduje skopiowanie kategorii z pliku źródłowego do pliku docelowego. Jeśli w pliku docelowym nie będzie dokładnego dopasowania (koloru i etykiety), zostanie zdefiniowana nowa kategoria.
Wskazówka: Dzięki interfejsowi API wtyczek zespoły mogą tworzyć niestandardowe wtyczki Dev Mode do masowego tworzenia i zarządzania adnotacjami.
Filtruj według kategorii
Adnotacje można filtrować według kategorii, co jeszcze bardziej ułatwia znajdowanie potrzebnych szczegółów w obszarze roboczym. Istnieje kilka sposobów filtrowania adnotacji według kategorii:
Menu prawego przycisku myszy
- Kliknij prawym przyciskiem myszy adnotację w obszarze roboczym.
- Wybierz Filter by (Filtruj według).
- Wybierz kategorię, której chcesz użyć jako filtru, lub opcję All categories (Wszystkie kategorie).
Menu powiększenia w Dev Mode
- Kliknij menu rozwijane powiększenia na prawym pasku bocznym w Dev Mode.
- Najedź kursorem na pozycję Annotations (Adnotacje).
- Wybierz kategorię, której chcesz użyć jako filtru, lub opcję All categories (Wszystkie kategorie).
Ukrywanie adnotacji
Wszystkie adnotacje w pliku Figma Design są domyślnie widoczne w interfejsie Dev Mode. Aby ukryć adnotacje:
- Kliknij menu główne na pasku narzędzi.
- Ustaw kursor na widoku w menu rozwijanym.
- Usuń zaznaczenie opcji Annotations (Adnotacje).
Wskazówka: Aby usunąć adnotację, kliknij ją i naciśnij klawisze Delete lub Backspace.
Zanim zaczniesz
Kto może korzystać z tej funkcji?
Dostępność we wszystkich płatnych planach.
Każdy, kto ma stanowisko Full Design, może edytować
adnotacje w interfejsie Dev Mode
Każdy, kto ma stanowisko Dev Mode, może wyświetlać
adnotacje w interfejsie Dev Mode
Twórz szybsze i bardziej przejrzyste przekazania dzięki adnotacjom i pomiarom, które pozostają aktualne, nawet gdy projekty się zmieniają.
Dzięki adnotacjom projektanci mogą przekazywać i łączyć kluczowe szczegóły bezpośrednio z projektami.
- Wyróżnianie ważnych właściwości, których nie będą mogli przeoczyć programiści
- Ułatwienie programistom szybkiej wizualizacji takich specyfikacji jak odstępy i rozmiary
- Udostępnianie dodatkowego kontekstu za pomocą notatek tekstowych
Programiści mogą na bieżąco obserwować adnotacje projektantów podczas pracy w interfejsie Dev Mode, dzięki czemu mają pewność, że nie pominą żadnych istotnych informacji podczas przekazywania projektu.
Wskazówka! W interfejsie Design Mode otrzymasz powiadomienie, gdy do pliku zostaną dodane nowe adnotacje. Kliknij kropkę obok projektu i wybierz opcję View annotations in Dev Mode (Wyświetl adnotacje w interfejsie Dev Mode), aby zobaczyć zaktualizowane adnotacje w interfejsie Dev Mode.
Dodawanie pomiarów do projektu
Dodawanie pomiarów ułatwia programistom wizualizację odstępów i rozmiarów.
Aby dodać pomiar do projektu:
- Kliknij przełącznik Dev Mode w prawym górnym rogu paska narzędzi lub użyj skrótu klawiaturowego Shift + D.
- Kliknij przycisk Measure (Zmierz) na pasku narzędzi lub użyj skrótu klawiaturowego Shift + M.
- Ustaw kursor na warstwie, aby sprawdzić, gdzie możesz rozpocząć pomiar.
- Kliknij i przeciągnij od punktu początkowego do warstwy, gdzie chcesz zakończyć pomiar.
- Kliknij i przeciągnij pomiar, aby nie zasłaniał projektu.
Wskazówka! Aby usunąć pomiar, kliknij go i naciśnij klawisze Delete lub Backspace.
Dodawanie adnotacji do projektu
Projektanci mogą dodawać adnotacje, aby zapewnić kontekst, zdefiniować właściwości projektu lub przekazać inne istotne informacje dla programistów umożliwiające przekształcenie projektu w kod. Można dodawać adnotacje w postaci dowolnego tekstu i zdefiniowanych właściwości, takich jak kierunek wyrównania lub rozmiar. Nawet jeśli później projekty zostaną zaktualizowane, właściwości adnotacji pozostają aktualne i dokładne, dzięki czemu nic nie umknie.
Aby dodać adnotacje do projektu:
- Kliknij przełącznik Dev Mode w prawym górnym rogu paska narzędzi lub użyj skrótu klawiaturowego Shift + D.
- Kliknij przycisk Annotate (Dodaj adnotację) na pasku narzędzi lub użyj skrótu klawiaturowego Shift + T.
- Wybierz warstwę, do której chcesz dodać adnotację.
- Napisz notatkę w polu tekstowym lub kliknij opcję + Property (+ Właściwość), aby wybrać właściwość z listy. W adnotacji można uwzględnić zarówno zwykły tekst, jak i właściwości.
Wskazówka! Dzięki interfejsowi API wtyczek zespoły mogą tworzyć niestandardowe wtyczki Dev Mode do masowego tworzenia i zarządzania adnotacjami.
Ukrywanie adnotacji
Wszystkie adnotacje w pliku Figma Design są domyślnie widoczne w interfejsie Dev Mode. Aby ukryć adnotacje:
- Kliknij menu główne na pasku narzędzi.
- Ustaw kursor na widoku w menu rozwijanym.
- Usuń zaznaczenie opcji Annotations (Adnotacje).
Wskazówka! Aby usunąć adnotację, kliknij ją i naciśnij klawisze Delete lub Backspace.