Zawartość
- 01. Kopiuj i wklej przewodniki
- 02. Środek do czyszczenia szkiców
- 03. Anima
- 04. Reaguj Sketch.app
- 05. Wtyczka Git Sketch
- 06. ImageOptim
- 07. Magic Mirror
- 08. Więcej eksportu
- 11. Marketch
- 12. Okręgi podzielone na segmenty
- 13. Sketch Runner
- 14. Czcionka ikony
- 15. Znajdź i zamień
Wtyczki Sketch pomagają ulepszyć Sketch. Sketch to narzędzie do projektowania interfejsu użytkownika dla wielu osób, a częścią tego, co sprawia, że jest tak dobra, jest społeczność ludzi pracujących nad rozszerzeniem jego funkcjonalności i funkcji poprzez tworzenie niestandardowych wtyczek.
Zarządzanie wtyczkami Sketch jest teraz łatwiejsze niż kiedykolwiek. Wtyczki aktualizują się automatycznie, a przestarzałe są wyłączone. Jeszcze bardziej użytecznym ekosystemem wtyczek jest Sketch Cloud, usługa udostępniania plików, w której każdy może się zarejestrować, w której można przeglądać, pobierać i komentować dokumenty Sketch, które zostały udostępnione publicznie lub prywatnie bezpośrednio z Sketch.
Przyjrzyjmy się więc najlepszym wtyczkom Sketch - tym, które mogą drastycznie zmienić sposób projektowania interfejsów użytkownika. Gdy już znajdziesz taki, który Ci się podoba, przeczytaj, jak zainstalować wtyczki Sketch. Jeśli uwielbiasz swoje narzędzia internetowe, nie przegap naszych ulubionych narzędzi do projektowania stron internetowych, narzędzi do tworzenia witryn internetowych i możliwości przechowywania w chmurze. Pamiętaj, że wybór dostawcy usług hostingowych ma kluczowe znaczenie dla sukcesu Twojej witryny (nasz przewodnik pomoże).
01. Kopiuj i wklej przewodniki
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Kopiuj, wklejaj lub usuwaj prowadnice z obszarów roboczych
Każdy projektant ma stosunek miłości / nienawiści do przewodników. Czasami są absolutnie niezbędne, a przez resztę czasu po prostu przeszkadzają. Jeśli używasz przewodników zamiast opcji układu Sketch, zmiana ich dla wielu obszarów roboczych może być koszmarem, ale dzięki tej wtyczce możesz łatwo kopiować, wklejać i usuwać prowadnice ze wszystkich obszarów roboczych.
02. Środek do czyszczenia szkiców
- Pobierz tutaj
- Cena £: $2
- Streszczenie: Spraw, aby Twoje pliki projektowe były tak czyste jak gwizdek
Każdy projekt programu Sketch, który przeszedł kilka iteracji, musi po drodze zebrać trochę śmieci, takich jak ukryte warstwy, niespójne pozycje obramowań i nieużywane style warstw.
Chociaż bałagan w pliku Sketch nie jest końcem świata, może to wpłynąć na przekazanie i ułatwi życie każdemu, kto musi to zrozumieć. Zamiast robić wszystko ręcznie, użyj narzędzia do czyszczenia szkiców, aby automatycznie rozwiązać wszystkie typowe problemy.
03. Anima
- Pobierz tutaj
- Cena £: Bezpłatne w górę
- Streszczenie: Twórz responsywne, wierne prototypy
Wcześniej dostępne jako osobne darmowe wtyczki - Auto Layout i Launchpad - Anima jest teraz uniwersalną wtyczką zaprojektowaną, aby pomóc Ci tworzyć responsywne układy z pinami, stosami i wypełnieniem oraz prototypami o wysokiej wierności, które pasują do wszystkich ekranów. Wciąż istnieje bezpłatna wersja obsługująca jeden projekt; w przypadku nieograniczonej liczby projektów cena zaczyna się od 25 USD miesięcznie.
04. Reaguj Sketch.app
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Renderuj komponenty Reaguj na szkic
Zarządzanie zasobami projektowymi w Sketch może być trudne. Ta poręczna wtyczka Sketch zapewnia łatwiejszy i bardziej niezawodny sposób zarządzania zasobami. Zaimplementuj swoje projekty w kodzie jako komponenty React, a następnie użyj tej wtyczki, aby wyrenderować je w szkicu. Ułatwia również pobieranie i wdrażanie rzeczywistych danych do plików Sketch.
Aplikacja React Sketch.app została opracowana przez Airbnb do użytku z jego systemem projektowania, aby pomóc wypełnić lukę między projektantami a programistami.
05. Wtyczka Git Sketch
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Klient Git wbudowany w Sketch
Ta wtyczka ma na celu wprowadzenie kontroli wersji do Sketch. Działa poprzez eksportowanie obrazu dla każdej części projektu, a następnie generowanie ładnych różnic, aby było jasne, jakie zmiany zostały wprowadzone. Dokumentując każdy etap procesu projektowania, każdy członek zespołu może zobaczyć, jak postępował projekt.
Wtyczka Git Sketch została stworzona przez Mathieu Dutoura, który od tego czasu zajął się tworzeniem bardziej wszechstronnego, płatnego systemu kontroli wersji o nazwie Kactus.
06. ImageOptim
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Optymalizacja obrazu w Sketch
Chociaż Sketch oferuje własne rozwiązanie do optymalizacji plików SVG, nie ma szeregu opcji kompresji obrazów JPG i PNG. Ponieważ ImageOptim od wielu lat oferuje solidną usługę, ma sens, aby wprowadził tę funkcjonalność do Sketch.
Każdy projektant, któremu zależy na czasie wczytywania i optymalizacji obrazu (powinni to robić wszyscy projektanci), powinien dodać ImageOptim do swojego zestawu narzędzi. Zwróć uwagę, że oprócz wtyczki będziesz potrzebować podstawowej aplikacji ImageOptim (bezpłatnej) zainstalowanej w systemie macOS i nadal musisz oznaczać warstwy jako eksportowalne w programie Sketch (przejdź do „Eksportuj i optymalizuj wszystkie zasoby”, aby rozpocząć).
07. Magic Mirror
- Pobierz tutaj
- Cena £: Od 4 $ / mies
- Streszczenie: Narzędzie do przekształcania perspektywy obrazu
Jeśli próbujesz tworzyć imponujące makiety produktów, ale musisz wskakiwać do Photoshopa, aby poradzić sobie z trudnymi sprawami, Magic Mirror może uratować Ci życie. Jest to narzędzie do przekształcania perspektywy obrazu, które umożliwia tworzenie makiet perspektywicznych i innych zniekształconych efektów bez opuszczania programu Sketch.
08. Więcej eksportu
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Automatycznie generuje obrazy zastępcze
Dodawanie obrazów zastępczych do projektu jest niezbędną częścią tworzenia prototypów, ale znalezienie rzeczywistych obrazów może być uciążliwe. Więc zamiast marnować na to czas, zostaw to Day Player. Umożliwia to dodawanie niestandardowych obrazów zastępczych do dowolnego dokumentu Sketch, z wielu różnych usług obrazów zastępczych, więc najważniejszą decyzją, jaką musisz podjąć, będzie to, czy chcesz użyć Billa Murraya, Nicolasa Cage'a czy kociąt.
11. Marketch
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Wygeneruj stronę html, która może mierzyć i pobierać style CSS
Jeśli chcesz pobrać style CSS z projektów Sketch, wtyczka taka jak Marketch jest absolutnie niezbędna. Umożliwia wyeksportowanie obszarów roboczych Sketch jako pliku zip pełnego dokumentów HTML, które można następnie wyodrębnić w celu wyciągnięcia wielu słodkich CSS, gotowych do pracy.
12. Okręgi podzielone na segmenty
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Twórz precyzyjne okrągłe grafiki
Oto szybki sposób tworzenia podzielonych kręgów na wykresy i diagramy. Ta wtyczka może tworzyć różne style diagramów kołowych, w tym okręgi przerywane i znaczniki, a grubości są kontrolowane za pomocą prostej listy wartości oddzielonych przecinkami.
13. Sketch Runner
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Wyróżnione do wyszukiwania
Sketch jest lubiany ze względu na minimalistyczny przepływ pracy na klawiaturze. To powiedziawszy, zawsze istnieją dwa lub trzy skróty klawiaturowe, o których zawsze wydaje się zapominać lub mylisz z inną aplikacją do projektowania, taką jak Photoshop - i nie zapominajmy o tych mniej popularnych narzędziach i funkcjach, które nie mają skrótu klawiaturowego i są ukryte głęboko w Menu szkicu.
Sketch Runner rozwiązuje te problemy i robi to w sposób znany użytkownikom macOS - Sketch Runner to macOS Spotlight, ale dla Sketch.
14. Czcionka ikony
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Zarządzaj czcionkami ikon
Czcionki ikon to bardzo skuteczny sposób używania ikon w projektach internetowych bez konieczności eksportowania i optymalizowania mnóstwa zasobów graficznych. Zazwyczaj odwołujemy się do czcionek ikon w głowa> sekcji stron HTML, tak jak robimy to z CSS i JavaScript. Jednak używanie ich w Sketch jest trochę bardziej skomplikowane. Na szczęście Icon Font to ułatwia.
Po pobraniu i zainstalowaniu Sketch IconFont pobierz pliki czcionek SVG lub pobierz ten pakiet czcionek, który zawiera pliki czcionek FontAwesome, Material Design Icons, Ion Icons i Simple Line Icons. Kiedy skończysz, przejdź do Wtyczki> Czcionka ikon> Zainstaluj pakiet czcionek, wybierz pobrane czcionki z okna dialogowego Otwórz plik, a następnie przejdź do Wtyczki> Czcionka ikony> Wstaw siatkę> [żądana czcionka ikony], aby wstawić Ikona.
Nawet jeśli zamierzasz zaprojektować niestandardowy zestaw ikon do swojego projektu, posiadanie gotowych ikon do dyspozycji może pomóc w szybkim prototypowaniu na wczesnych etapach projektowania, dodając nieco więcej klarowności / wierności makietom o niskiej wierności .
15. Znajdź i zamień
- Pobierz tutaj
- Cena £: Wolny
- Streszczenie: Znajdź i zamień tekst na wybranych warstwach
Edytory tekstu to nie jedyne miejsce, w którym musisz znajdować i zamieniać - jest to również przydatne w programie Sketch. Ta wtyczka ma wiele zaawansowanych opcji i umożliwia wyszukiwanie wystąpień określonych słów lub fraz w tekście na wybranych warstwach (i wszystkiego, co zawiera), a następnie łatwo je zastępować.
Następna strona: Więcej oszczędzających czas wtyczek Sketch
