Witam! Dzisiejszy wpis ze względu na obszerność tematu, postanowiłem podzielić na dwie części. Dziś chciałbym zwrócić waszą uwagę na narzędzia pomocne front-end deweloperom, zaś w następnej części artykułu, przedstawię wam zbiór narzędzi przydatnych back-end deweloperom. W tym krótkim cyklu, skupiłem się głównie na zaprezentowaniu rozwiązań bezpłatnych, open sourcowych, zarówno desktopowych jak i aplikacji internetowych. Oczywiście niemożliwym jest ujęcie w tym wpisie wszystkich przydatnych aplikacji, dlatego też chciałbym, zaprosić was do podzielenia się ze mną swoimi zasobami oraz wartymi uwagi według was narzędziami. Zachęcam również do wyrażania własnej opinii na temat zamieszczonych tu aplikacji, narzędzi. Zapraszam do lektury!
Wireframe/Prototypowanie
Pencil Project — darmowa aplikacja przeznaczona do prototypowania oraz projektowania elementów GUI. Aplikacja dostępna jest w dwóch wariantach, jako wtyczka do Firefoxa oraz jako aplikacja desktopowa. Narzędzie jest stosunkowo proste w obsłudze, wystarczy krótka chwila aby swobodnie poruszać się w programie. Aplikacja dostępna na licencji GPL 2.
Lumzy — internetowa aplikacja do szybkiego tworzenia makiet www z możliwością grupowej współpracy z innymi użytkownikami w czasie rzeczywistym. Lumzy umożliwia interaktywną symulację budowanego prototypu. Jest całkowicie bezpłatny. Wymagana jest rejestracja.
Mockup Builder — wszechstronna aplikacja wyposażona w liczne funkcje umożliwiające prototypowanie elementów UI, stron internetowych, aplikacji desktopowych oraz mobilnych. Jest całkowicie bezpłatna.
iPhone Mockup — prosta w obsłudze aplikacja internetowa przeznaczona głównie do tworzenie makiet dla telefonu iPhone. Umożliwia szybkie dzielenie się danym projektem z innymi użytkownikami. Interesującym aspektem jest fakt, iż zmiany dokonane w projekcie są natychmiast widziane u innych użytkowników pracujących nad danym zadaniem. Dzieje się to w sposób zsynchronizowany. Aplikacja jest darmowa, nie wymaga rejestracji.
Frame Box — bardzo prosta aplikacja pozwalająca na proste oraz szybkie tworzenie makiet stron www. Jest bezpłatna, wymaga rejestracji.
Projektowanie
Edytory Graficzne
Gimp — darmowa aplikacja, którą z powodzeniem można wykorzystywać zarówno do obróbki zdjęć jak i do tworzenia grafiki na potrzeby internetu.
Pixlr — webowy edytor graficzny. Posiada wiele funkcji znanych nam ze szlagierowego Photoshopa. Dostępny w polskiej wersji językowej. Jest całkowicie darmowy.
Inkscape — open sourcowy edytor grafiki wektorowej o możliwościach podobnych do znanych nam z życia aplikacji takich jak Illustrator, CorelDraw lub Xara X.
Color Scheme Designer — darmowa aplikacja internetowa pozwalająca nam w prosty sposób dobrać paletę kolorów do projektowanej przez nas strony www.
JPEGmini — narzędzie pozwalające na dość dobrą kompresje naszych zdjęć. Przydatne gdy nie mamy Photoshopa pod ręką.
Generatory
Placehold.it — prosty w użyciu generator obrazków mających na celu wypełnienie miejsc, gdzie w przyszłości w projekcie, powinny znaleźć się finalne ilustracje.
Favicon.cc — narzędzie służące do projektowania ikon wyświetlanych w pasku przeglądarki. Za plus tej aplikacji można uznać możliwość tworzenia animowanych favicon.
Preloaders.net — internetowa aplikacja służąca do generowania obrazków animacji ładowania, wykorzystywanych z technologią AJAX.
BgMaker, BgPatterns, Pixelknetes oraz PatternCooler — ciekawe aplikacje umożliwiająca generowanie powtarzalnych teł. Przydatne gdy brak nam czasu na stworzenie własnego tła.
Typografia
Typetester.org — internetowa aplikacja służąca do porównywania czcionek.
WhatTheFont — aplikacja pomagająca zidentyfikować czcionkę, na podstawie uploadowanego obrazu.
Wordmark.it — narzędzie pozwalające na podgląd zainstalowanych w naszym systemie czcionek.
Lipsum.com — przydatny generator tekstu. Pomocny w trakcie projektowania aplikacji webowych.
Kodowanie
Web Developer — świetna wtyczka dostępna zarówno dla Firefoxa jak i przeglądarki Chrome. Narzędzie to dodaje naszej przeglądarce dodatkowej funkcjonalności, przydatnej podczas projektowania strony www.
HTML Validator — kolejna wtyczka, bez której nie da się obejść. Nazwa sama wskazuje jaki jest jej zakres działania
DOM Inspector — typowa wtyczka przydatna dla koderów JavaScript. Dzięki niej możemy podejrzeć drzewo obiektów które tworzą naszą stronę.
Firebug — kolejna wtyczka, którą należy posiadać w swych zasobach. Przydatna nie tylko do modyfikowania kodu (HTML, CSS, JavaScript) w czasie rzeczywistym ale nie zastąpiona również w sprawdzaniu wydajności naszej witryny.
Browsershot.org — narzędzie pozwalające na sprawdzenie kompatybilności projektowanej przez nas witryny z innymi przeglądarkami jak i systemami operacyjnymi.
Cleancss.com — narzędzie do formatowania i optymalizowania plików CSS. Dzięki licznym opcjom, jakie mamy do wyboru, możemy dany arkusz CSS zoptymalizować do własnych potrzeb.
Wdrożenie
Htaccessredirect.net — prosty generator plików .htaccess.
Mcanerin.com — narzędzie do generowania plików ?robots.txt?.
Sitemaps-builder.com — narzędzie do generowania map serwisu (sitemap.xml)
FileZilla — darmowy klient FTP dostępny na licencji GNU.
Google Analytics — przydatne narzędzie dla wszystkich, którzy pragną śledzić statystyki swojego serwisu www.
SeoQuake — popularne narzędzie analityczne SEO dla przeglądarek Firefox, Chrome, Opera oraz Safari. Wtyczka ta pomaga w uzyskaniu informacji o każdej witrynie. Dzięki niej możemy zapoznać się z takimi parametrami jak Page Rank, ilość za indeksowanych stron, ranking Alexa i wiele innych.
