Piotr Bąk Developer Bez Kodu

Figma jest jednym z moich podstawowych narzędzi pracy. Wykorzystuje je do projektowania stron WWW,  tworzenia banerów na social media, miniaturek na kanał YT i do tworzenia różnych grafik na strony internetowe moich klientów. Figma posiada wiele przydatnych wtyczek poszerzających możliwości tego narzędzia. 

Poniżej znajdziesz osiem wtyczek, które regularnie wykorzystuję podczas pracy w Figmie. Te narzędzia poprawiają wydajność i zwiększają funkcjonalność, co sprawia, że praca z Figmą staje się jeszcze bardziej satysfakcjonująca i produktywna.

🔌 01 Vector Logos

Vector Logos umożliwia użytkownikom znajdowanie i wstawianie wersji SVG logo i marek bez opuszczania interfejsu Figma. Aplikacja ma prosty, nieskomplikowany interfejs, który oszczędza czas i wysiłek. Użytkownicy mogą otworzyć wtyczkę, wyszukać logo lub markę, kliknąć tę, którą chcą wstawić i kontynuować projektowanie. Wtyczka jest open source i otrzymała pozytywne opinie od użytkowników, choć niektórzy sugerowali ulepszenia, takie jak pozostawienie wtyczki otwartej po wybraniu i wstawieniu logo. Wtyczka jest na licencji Community Free Resource License.

Zadania:

• Dodaje loga firmy i marki w formacie SVG bez opuszczania Figmy.
• Przyjazny dla użytkownika interfejs oszczędza czas i wysiłek.

🔗 Link ▸

🔌 02 Image Tracer

Image Tracer pozwala użytkownikom konwertować grafikę rastrową na wektorową za pomocą jednego kliknięcia. Wtyczka została zaprojektowana w celu łatwej konwersji obrazów o niskiej rozdzielczości lub pikselach na ostre i skalowalne grafiki wektorowe, odpowiednie do wykorzystania w logo, ilustracjach i nie tylko. Jest ona kompatybilna z paskiem szybkich akcji Figma i oferuje zarówno proste, jak i szczegółowe opcje śledzenia. Wtyczka jest całkowicie bezpłatna i została dobrze przyjęta przez użytkowników, choć niektórzy zgłaszali problemy z jej funkcjonalnością.

Zadania:

•   Konwertuje grafikę rastrową na skalowalną grafikę wektorową.
•   Możliwość jednoczesnej konwersji wielu obrazów, co przyspiesza proces.

🔗 Link ▸

🔌 03 Feather Icons

Wtyczka daje nam szybki dostęp do pięknych ikon open source z kolekcji Feather. Każda ikona została zaprojektowana na siatce 24x24 z naciskiem na prostotę, spójność i czytelność.

Zadania:

 ⋅ Dodaje stylowe i darmowe ikony, wraz z biblioteką komponentów dla Figmy.

🔗 Link ▸

🔌 04 Noise & Texture

Noise & Texture to narzędzie, które pozwala użytkownikom dynamicznie generować bezszwowy szum kafelkowy, tekstury, wzory, gradienty i inne. Wtyczka umożliwia użytkownikom wybranie warstwy i dodanie szumu lub tekstury, a następnie zmianę ustawień, aby zobaczyć, jak warstwy są aktualizowane na żywo. Zapewnia również takie funkcje, jak eksperymentalny kod osadzania do iframe/html, promienie Boga dodane do gradientów, lepszy selektor kolorów i niestandardowy edytor shaderów.

Wtyczka otrzymała pozytywne opinie od użytkowników, w tym pochwały za jej użyteczność i wartość w projektach projektowych. Jest ona dostępna za darmo w bibliotece wtyczek Figma Community.

Zadania:

⋅ Pozwala na zastosowanie efektów szumu i tekstur do obiektów.

⋅ Aktualizacja warstw w czasie rzeczywistym po zmianie ustawień.

🔗 Link ▸

🔌 05 To Path

Wtyczka "To Path" pozwala użytkownikom łączyć dowolne obiekty lub tekst na ścieżce, klonować kształty w celu powtórzenia wzdłuż dowolnej ścieżki, umieszczać tekst wzdłuż dowolnego kształtu, w tym okręgów i dowolnych ścieżek, a także edytować oryginalny kształt lub tekst, a zmiany są odzwierciedlane w czasie rzeczywistym, gdy wtyczka jest otwarta. Zapewnia również możliwość późniejszej edycji krzywej i obserwowania zmian na żywo. Wtyczka jest darmowa i open source na licencji GPL-3.0.
 

Zadania:

⋅ Umożliwia umieszczanie obiektów lub tekstu wzdłuż ścieżki, idealne do tworzenia ilustracji i wzorów.

⋅ Otwiera możliwości eksperymentowania z kompozycją.

🔗 Link ▸

🔌 06 Color Shades

Color Shades, pozwala użytkownikom generować wiele odcieni z tego samego koloru bazowego. Użytkownicy mogą wprowadzić kolor bazowy za pomocą próbnika kolorów lub wpisując wartość szesnastkową w polu wprowadzania. Mogą również dostosować kontrast, klikając i przeciągając wartość kontrastu lub wprowadzając liczbę z zakresu 0-100. Wtyczka otrzymała pozytywne opinie od użytkowników, z komentarzami chwalącymi jej łatwość użycia i funkcjonalność. 

Zadania:

⋅Generuje różne odcienie wybranego koloru podstawowego.

⋅Upraszcza wybór palety kolorów i dodaje harmonii projektom.

🔗 Link ▸

🔌 07 SmoothShadow

Pozwala użytkownikom tworzyć gładkie, warstwowe cienie i dostosowywać alfa, przesunięcie i rozmycie za pomocą indywidualnych krzywych wygładzania, zapewniając kontrolę nad wyglądem cienia. Wtyczka otrzymała pozytywne opinie od użytkowników, a niektórzy sugerowali ulepszenia, takie jak dodanie numerycznych elementów sterujących i poziomych suwaków przesunięcia. Wtyczka jest dostępna w społeczności Figma i jest na licencji Community Free Resource License.

Zadania:

• Tworzy jaśniejsze i piękniejsze cienie, nadając projektom realizmu.
• Poprawia wygląd projektów, sprawiając, że są bardziej atrakcyjne.

🔗 Link ▸

🔌 08 Draw Connector

Draw Connector to wtyczka, która pozwala użytkownikom rysować idealne ortogonalne złącza między warstwami w Figma. Wtyczka ma różne funkcje, takie jak dostosowywanie krawędzi, terminali łączników, koloru obrysu, szerokości, stylu i innych. 

Zadania:

• Łączy warstwy, obiekty lub ramki, korzystne przy tworzeniu niestandardowych skryptów.
• Rysuj złącza, które pokonują najkrótszą możliwą drogę i wykonują najmniejszą możliwą liczbę zakrętów o 90°.
• Dostosuj krawędzie do połączenia
• Dostosowywanie końcówek złączy (brak, okrąg, strzałka lub ortogonalne)
• Przesunięcie zacisków złącza
• Ustaw kolor obrysu, szerokość obrysu, styl obrysu (ciągły/przerywany), promień narożnika i margines.
• Automatyczna aktualizacja po zmianie położenia lub wymiarów połączonych warstw

🔗 Link ▸

Zakończenie

A jakie są Twoje ulubione wtyczki do Figmy bez, których nie wyobrażasz sobie pracy? Co polecasz? 🙂 Dołącz do ciekawej dyskusji w tym temacie na 🇵🇱 Polską Społeczność NoCode.

#figma #wtyczki #projektowanie 

Jestem jak to mówią "One man army". Prowadzę agencję cyfrową Smart Pixel, zajmującą się budową stron i sklepów www. Tworzę również własne projekty sprzedażowe i produkty cyfrowe. Oprócz tego od ponad 12 lat aktywnie działam w branży sportowej - jestem dystrybutorem sprzętu i odzieży znanej na rynku marki ⚽ Uwielbiam wykorzystywać nowoczesne narzędzia no-code i automatyzacje w prowadzeniu biznesu, sprzedaży i tworzeniu produktów cyfrowych. 🤖💪

Piotr Bąk

przedsiębiorca, no-code developer, twórca cyfrowy

📧 Newsletter

Inne ciekawe wpisy

Główna | Blog | NoCode News

Piotr Bąk Developer Bez Kodu