25 zasobów szkicu dla projektantów motywów WordPress i wtyczek

Sketch to popularne, ale niestety specyficzne dla komputerów Mac narzędzie do projektowania, które naprawdę odeszło w ciągu ostatnich kilku lat. Chociaż możesz go używać do wszelkiego rodzaju projektów, jednym ze sposobów, w jaki projektanci używają Sketch, jest tworzenie projektów motywów i wtyczek WordPress.

Aby pomóc projektantom WordPress, którzy korzystają ze Sketch, pomyśleliśmy, że zebraliśmy niektóre z naszych ulubionych zasobów Sketch dla projektantów motywów WordPress i wtyczek. Tutaj są!

25 zasobów szkicu dla projektantów WordPress

Poniższe zasoby będą obejmować różne kategorie. Ale oto przybliżony zarys tego, co znajdziesz:

• Szablony administracyjne specyficzne dla WordPress
• Zestawy ikon
• Zestawy UI dla różnych stylów projektowania
• Koncepcje projektowania stron internetowych, z których możesz czerpać
• Określone elementy, takie jak odtwarzacze wideo lub treści na Facebooku
• Kilka zasobów do tworzenia prototypów/makiet

Zanurzmy się!

1. Zasób szkicu szablonu administratora WordPress

Zacznijmy od czegoś, co zna każdy użytkownik WordPressa – Edytora WordPressa. Dopóki edytor Gutenberg nie zostanie wydany i nie zmieni wszystkiego, możesz użyć tego szablonu administratora WordPress, aby szybko zaprojektować część wtyczki lub motywu, który pojawi się w edytorze WordPress.

Cena : Za darmo | Więcej informacji

2. Zasób szkicu szablonu WordPress Backend Post

Jeśli potrzebujesz innego spojrzenia na pulpit WordPress, ten zasób Sketch pokazuje ogólną listę postów zamiast indywidualnego edytora WordPress. Ponownie jest to pomocna opcja, jeśli chcesz zaprojektować coś, co pojawi się gdzieś w backendzie WordPress.

Cena : Za darmo | Więcej informacji

3. Ikony materiałów Google do szkicu

Ten zasób zawiera ponad 900 ikon pobranych prosto z witryny ikon Google Material i gotowych do wykorzystania w projektach.

Cena : Za darmo | Więcej informacji

4. Elementy interfejsu użytkownika

Stylowy zestaw darmowych elementów UI od Piotra Adama Kwiatkowskiego. Te elementy mają wiele zastosowań, od formularzy po listy produktów i nie tylko.

Cena : Za darmo | Więcej informacji

5. Materiałowy zestaw UI

Wybierasz się do projektowania materiałów dla swojego motywu lub interfejsu wtyczki? Te materialne elementy projektu Sergiu Firez mogą się przydać podczas tworzenia projektu.

Cena : Za darmo | Więcej informacji

6. Szablon siatek Bootstrap3

Budujesz swój motyw za pomocą Bootstrap? Ten zasób siatek Bootstrap 3 od Gauthier Eloy może się przydać podczas konfigurowania układów.

Cena : Za darmo | Więcej informacji

7. Darmowy płaski zestaw UI

Jeśli planujesz użyć płaskiego stylu dla swojego motywu lub wtyczki, ten wspaniały darmowy zestaw płaskiego interfejsu użytkownika od Pavela Kreewtsova jest dobrą opcją, aby rozpocząć pracę z niektórymi typowymi elementami interfejsu.

Cena : Za darmo | Więcej informacji

8. Kompletny zestaw 519 ikon w czcionce Awesome 4.3 dla szkicu

Font Awesome to dość popularny zestaw ikon dla użytkowników WordPress. Napisaliśmy nawet cały post o tym, jak zintegrować ikony Font Awesome z WordPress.

Jeśli chcesz użyć tych samych ikon w Sketchu, Sasha Lantukh był na tyle uprzejmy, aby je przekonwertować. Chociaż Font Awesome 5.0 może sprawić, że będzie nieco przestarzały, ten nadal powinien być bardzo pomocny.

Cena : Za darmo | Więcej informacji

9. Zestaw Bootstrap 3 Vector UI

Potrzebujesz elementów interfejsu Bootstrap 3 do sparowania z siatkami Bootstrap 3 od góry? Ten zestaw interfejsu użytkownika zawiera wszystkie elementy sterujące interfejsu Bootstrap 3 w formacie wektorowym, a także glify i dodatkowe elementy interfejsu użytkownika.

Wszystko to jest dostępne w plikach Sketch, Adobe Illustrator i PDF. Więc jeśli kiedykolwiek znudzi Ci się Sketch, nadal możesz korzystać z tych elementów!

Cena : Za darmo | Więcej informacji

10. Zestaw UI dla e-commerce

Pracujesz z WooCommerce, Easy Digital Downloads lub innym rozwiązaniem eCommerce WordPress? Ten wspaniały eCommerce UI Kit od Five Agency może ci pomóc. Zawiera ponad 50 ekranów, wszystkie gotowe na urządzenia mobilne.

Cena : Za darmo | Więcej informacji

11. 40 ikon społecznościowych

Nie ma tu nic nadzwyczajnego – po prostu poręczny zestaw 40 ikon mediów społecznościowych w 3 różnych stylach. Rzadko zdarza się znaleźć witrynę WordPress bez ikon mediów społecznościowych, więc na pewno będziesz w stanie je dobrze wykorzystać.

Cena : Za darmo | Więcej informacji

12. Nowy odtwarzacz YouTube

Chcesz uwzględnić w swoim projekcie odtwarzacz YouTube? Może dla formatu posta lub elementu wtyczki? Nicolas Carey przygotował ten bezpłatny zasób szkiców do odtwarzacza YouTube.

Cena : Za darmo | Więcej informacji

13. Kolekcja makiety urządzeń

Ta pomocna kolekcja makiet od zespołu Facebooka zawiera różnorodne urządzenia, których możesz używać do tworzenia makiet swoich projektów. Chociaż wątpię, czy będziesz używać smartwatchy do projektów WordPress, inne elementy powinny się przydać.

Cena : Za darmo | Więcej informacji

14. Kasa Zobacz zasoby szkicu

Ten jest kolejnym pomocnym źródłem dla każdego, kto pracuje z WordPress w zakresie eCommerce. Jest w całości poświęcony widokowi kasy.

Cena : Za darmo | Więcej informacji

15. Zasób szkicu skórki odtwarzacza wideo Wistia

Podobnie jak YouTube, Wistia to kolejny odtwarzacz wideo, który zobaczysz w wielu witrynach WordPress. Ten zasób szkicu Mikey Casalaina zawiera pełny odtwarzacz Wistia, a także niektóre określone elementy.

Cena : Za darmo | Więcej informacji

16. Logo płatności

Ten prosty zasób Sketch zawiera logo płatności dla różnych metod płatności, w tym najnowsze aktualizacje uwzględniające zmiany w logo Mastercard.

Logotypy płatności mają zastosowanie do różnych typów projektów, więc to powinno być dość uniwersalne.

Cena : Za darmo | Więcej informacji

17. Zestaw 1800 ikon

Potrzebujesz jeszcze więcej ikon gotowych do szkicowania niż oferuje zestaw Font Awesome? Alexandru Stoica zebrał ten ogromny zestaw ponad 1800 ikon obejmujących różne zastosowania (i podobnie zorganizowanych według użycia w celu łatwego wyszukiwania).

Cena : Za darmo | Więcej informacji

18. Post na Facebooku

Posty na Facebooku to coś, co prawdopodobnie pojawi się zarówno na paskach bocznych WordPress, jak i w treści. Jeśli chcesz umieścić post na Facebooku w swoim projekcie, ten prosty zasób od Pedro Ribeiro pomoże Ci zaoszczędzić trochę czasu.

Cena : Za darmo | Więcej informacji

19. Zestaw UI lądowania

Jeśli potrzebujesz stworzyć dedykowaną stronę docelową jako część swojego motywu, ten ogromny zestaw interfejsu użytkownika do strony docelowej z lstore.graphics może Ci pomóc z mnóstwem różnych elementów. To dobra opcja do stworzenia dedykowanej strony głównej lub czegoś podobnego.

Cena : Za darmo | Więcej informacji

20. Szkic 3 Ściągawka

Ok – ten nie jest specyficzny dla WordPressa. Ale jest to przydatna ściągawka, która pomoże Ci wydajniej pracować ze Sketchem i myślę, że jest to bardzo pomocne!

Cena : Za darmo | Więcej informacji

21. Moja najlepsza restauracja

Jeśli pracujesz z czymkolwiek związanym z branżą restauracyjną, ten bezpłatny zasób Sketch od Vivien Bocquelet może się przydać. Zawiera elementy menu, informacje kontaktowe i nie tylko.

Cena : Za darmo | Więcej informacji

22. Niezbędny szablon prototypowania

Zbiór stylów i symboli, które pomogą Ci szybko stworzyć prototypy wtyczki lub motywu.

Cena : Za darmo | Więcej informacji

23. Zestaw UI Helium

Kolorowy zestaw UI firmy Karl Schmidt. Ten zdecydowanie nie będzie działał dla każdego stylu, ale jest całkiem wspaniały.

Cena : Za darmo | Więcej informacji

24. Strona docelowa aplikacji Kanbio

Przestronny zasób strony docelowej, który pomoże Ci zacząć na właściwej ścieżce. Ponownie, ten jest świetny na dedykowaną stronę główną.

Cena : Za darmo | Więcej informacji

25. Elastyczny zestaw UI

I na koniec dopełnijmy ten wspaniały zestaw interfejsu użytkownika od Kristaps Elsins, który obejmuje wiele różnych zastosowań, w tym popularne elementy, takie jak formularze rejestracyjne, tabele cenowe, kalendarze i inne.

Cena : Za darmo | Więcej informacji

Jakie są twoje ulubione zasoby szkiców?

Zrobiłem co w mojej mocy, aby znaleźć jedne z najlepszych zasobów Sketch dla projektantów WordPress. Ale dostępnych jest mnóstwo zasobów Sketch i nie ma możliwości, abym mógł spojrzeć na każdy z nich.

Więc jeśli przegapiłem świetny zasób, który Twoim zdaniem pomoże innym projektantom, chciałbym, aby udostępniłeś go w komentarzach. W ten sposób wszyscy możemy skorzystać ze zbiorowej wiedzy wszystkich!

Obraz miniatury artykułu autorstwa Nub1 Iconsdesign / shutterstock.com