kategoria -Webdesign

Jak zrobić portfolio ?

grafik komputerowyDzisiejszy post kieruję przede wszystkim do grafików. Z pewnością wielu z Was tak jak i ja do portfolio zabierało się bardzo długo. Nie jest to łatwe bo w końcu portfolio grafika musi być idealne 🙂 znam to z autopsji i doświadczenia innych grafików. Po wielu przymiarkach w 2005 roku stworzyłem swoje pierwsze portfolio, a teraz przeszedł czas na coś świeżego.

Przy okazji projektowania własnego portfolio odnotowałem najważniejsze spostrzeżenia, które mogą być pomocne dla Ciebie i ustrzegą Cię od błędów. Mam doświadczenie jako grafik i osoba zatrudniająca grafików (na zlecenie), więc  znam temat z dwóch stron. Najpierw opiszę Ci swoje doświadczenie z robienia własnego portfolio, a później w punktach podam Ci kilkanaście porad dotyczących stworzenia dobrego portfolio.

czytaj dalej

VN:F [1.9.22_1171]
Rating: 4.9/5 (21 votes cast)

Projektowanie grafiki do strony internetowej, czyli jak zrobić layout

projektowanie grafiki do stron wwwZ sondy jaką umieściłem kilka miesięcy temu na blogu  wynikło, że chcielibyście zobaczyć tutorial jak stworzyć layout. Ostatnio miałem okazję tworzyć layout do odsprzedaży do serwisu ThemeForest i w trakcie jego tworzenia zrobiłem kilka print screenów, aby pokazać Ci w jaki sposób tworzę takie layouty. W razie czego świetną alternatywą będzie bardzo znany TemplateMonster.
W skrócie postaram Ci opisać jak stworzyć taki layout, a jak już znajdę odpowiednie oprogramowanie do zgrywania obrazu video to postaram się stworzyć video tutorial.

1. Co to za projekt?

Pierwsze od czego zaczynam to zbieranie informacji o tematyce tworzonego layoutu, przeglądam strony konkurencji, często też biorę pod uwagę NOA czego wynikiem jest zebranie elementów jakie powinny znaleźć się na stronie głównej.
czytaj dalej

VN:F [1.9.22_1171]
Rating: 4.6/5 (47 votes cast)

Optymalizacja grafiki na potrzeby stron www

Kiedyś (przy łączach modemowych) bardzo pilnowano, aby wielkość strony nie przekraczała 100kb jednak od kiedy stałe łącza internetowe stały się w Polsce popularne wielu webmasterów nie zwraca na to uwagi i ponosi ich wyobraźnia. Nie mówię o optymalizacji strony do 100kb :), ale w ogóle zwracaniu uwagi na wielkość strony. Graficy często pchają w projekty bezmyślnie technologie flash, która często nic nie wnosi do projektu. W wielu stronach przeładowanie grafiki powoduje, iż strona wygląda jak "choinka". Ważne, żeby "coś latało", "się działo" bo tak sobie zażyczył prezes firmy. Nie zwraca się jednak uwagi na użyteczność strony czy też optymalizację grafiki. Internauta wchodząc na naszą stronę z reguły szuka informacji, a nie efektów specjalnych. Takie "bajery" często tylko przeszkadzają w zapoznaniu się z treścią strony. Prosta, schludna, elegancka użyteczna i dobrze zoptymalizowana strona to podstawa. Strona chodzi szybko, nie trzeba instalować żadnych dodatków, tego właśnie oczekują internauci. czytaj dalej

VN:F [1.9.22_1171]
Rating: 4.8/5 (19 votes cast)

Jak stworzyć własny avatar?

Avatar jest to niewielkich rozmiarów ikona graficzna używana na forach, blogach w grach (często przedstawiająca osobę). Własny avatar postanowiłem stworzyć na potrzeby portfolio, aby nie wstawiać standardowego zdjęcia. Swojego czasu na facebook'u znalazłem ciekawą aplikację do tworzenia avatarów jednak dziś nie mogłem jej znaleźć i ruszyłem na poszukiwania do wujka Google. Pod względem graficznym najciekawsze generowane avatary znalazłem na stronie faceyourmanga.com. Aplikacja jest we flashu. Na stronie mamy masę możliwości konfiguracji swojego avatara. Od wyboru kształtu twarzy, uszu, nosa, ust poprzez kolor oczu, włosów, brwi, wąsów… Stworzenie avatara jest bardzo proste i trzeba postępować według instrukcji na stronie. Po zakończeniu konfiguracji swojego avatara klikamy finish, wypełniamy formularz i avatar jest wysyłany na nasz e-mail.

Jeśli ten artykuł pomógł Ci, masz co do niego jakieś wątpliwości lub pytania "Zostaw komentarz", a na pewno na niego odpowiem.
VN:F [1.9.22_1171]
Rating: 4.3/5 (16 votes cast)

Paleta kolorów RGB

Podczas projektowania grafiki zdarza się, że klient oczekuje od nas użycia konkretnego koloru czcionki, tła, menu… Niestety, ale trafienie w kolor jakiego klient oczekuje potrafi graniczyć z cudem 🙂 w związku z czym wykorzystuję palety kolorów RGB dostępne w internecie i proszę klienta o wskazania konkretnego koloru. To potrafi zaoszczędzić nam masę czasu i nie porozumień.

Poniżej umieściłem tabelę kolorów RGB.

czytaj dalej

VN:F [1.9.22_1171]
Rating: 5.0/5 (5 votes cast)

Silk icon set 1.3

Dawno nie było żadnych ikon więc zapraszam to nowego zbioru Silk icon set 1.3.

Kliknij na obrazek, aby zobaczyć pełny podgląd.

Ilość ikon: ponad 700

Wymiary ikon: 16x16px

Rodzaj pliku: png

Licencja: Creative Commons Attribution 2.5 License (informacja o licencji).

Więcej informacji na stronie producenta: https://www.famfamfam.com/lab/icons/silk/

Pobierz

VN:F [1.9.22_1171]
Rating: 5.0/5 (1 vote cast)

Tango Icon

Dzisiejszy zbiór ikon to Tango Icon.

Kliknij na obrazek, aby zobaczyć pełny podgląd.

Ilość ikon: 208

Wymiary ikon: 16x16px, 22x22px

Rodzaj pliku: png

Licencja: GNU

Więcej informacji na stronie producenta: https://tango.freedesktop.org/Tango_Icon_Library

Pobierz – do samodzielnego wycięcia z png

VN:F [1.9.22_1171]
Rating: 0.0/5 (0 votes cast)

Jesteś ciekaw kto korzysta z Twoich prac?

Kiedyś wspominałem o kupowaniu zdjęć do projektów w istockphoto, shuterstock i tym podobnych serwisach. Jest to bardzo dobre posunięcie bo pozwala nam zaoszczędzić masę czasu i pieniędzy, a prace z tych stron są na naprawdę wysokim poziomie.

Z drugiej strony jest to także bardzo ciekawy sposób na zarabianie pieniędzy jednak podejrzewam, że nie lada problemem osób zajmujących się robieniem zdjęć, projektujących grafikę, którzy umieszczają swoje prace w tych serwisach jest piractwo. Wszystkie prace kupowane są do jednorazowego użytku (jeden zakup=jeden projekt, oczywiście droższe licencje dają większe możliwości), a z pewnością znajdą się takie osoby, które korzystają ze zdjęć wielokrotnie.

Od znajomego pseudonim Zeber, otrzymałem jakiś czas temu link do strony tineye.com. Stronka służy do sprawdzania gdzie dana praca została użyte. Z jednej strony jako artysta jesteśmy w stanie sprawdzić czy nie jesteśmy robieniu w “konia”. Przykładowo sprzedaliśmy zdjęcie 10 razy, a w sieci znajduje się na 50 stronach www. Kolejną ciekawą rzeczą jest możliwość zaprezentować swojego portfolio i pokazania, że z naszych zdjęć skorzystało xxx firm.

Z drugiej zaś strony dla takich osób jak ja projektantów www jest to ciekawa informacja na temat tego czy dane zdjęcie jest popularne w sieci. Jak pisałem jakiś czas temu o wadach istocków ich popularność nie jest dla nas zbyt dobra z tego względu, iż zdjęcia bardzo często powtarzają się na wielu projektach co nie jest korzystne dla klienta. Więcej o tym w poście “Wady istock?ów”.

czytaj dalej

VN:F [1.9.22_1171]
Rating: 0.0/5 (0 votes cast)

Led Pixel Icon Set

Pierwszy z prezentowanych przeze mnie zbiorów ikon to Led Pixel Icon Set.

Kliknij na obrazek, aby zobaczyć pełny podgląd.

Ilość ikon: 512

Wymiary ikon: 16x16px

Rodzaj pliku: png

Licencja: creativecommons (wymagany link zwrotny do użytku komercyjnego – pełny opis w pliku tekstowym wraz z ikonami)

Więcej informacji na stronie producenta: https://led24.de/iconset/

Pobierz

VN:F [1.9.22_1171]
Rating: 0.0/5 (0 votes cast)

Dodatek do Firefoxa analizujący szybkość strony

Dziś chciałbym zaprezentować wam dodatek do przeglądarki FireFox “YSlow”, który wskazuje jak zoptymalizować, przyspieszyć witrynę www.
Aby dodatek działał należy mieć zainstalowany dodatek “FireBug” (więcej o nim pod tym linkiem). Wtyczka analizuję stronę pod względem kilku czynników wpływających na czas jej ładowania się.

Przykładowo pokazuje nam jakie elementy powinny znaleźć się w części head, a jakie nie, informacje o plikach CSS czy JS.
I tak np. sprawdzając pewną stronę otrzymałem informację:
– że nie należy skalować plików graficznych poprzez html,
– css powinien się znaleźć w sekcji head,
– brak przygotowanej strony 404,
– favicon powinien znajdować się w katalogu głównym,
– zbyt dużo odwołań do plików JS,
– … i wiele innych ciekawych rzeczy.

Wtyczka może okazać się bardzo pomocna przy testowaniu prędkości ładowania  stron.
Test taki trwa zaledwie kilka sekund po czym otrzymujemy pełny raport. Po zastosowaniu się do informacji z raportu możemy otrzymać znaczne przyspieszenie działania serwisu. Podejrzewam, że gdyby chciało się zrobić samodzielnie tego typu audyt trwałby on o wiele dłużej i byłby kosztowny.

Wtyczkę można pobrać ze strony: https://addons.mozilla.org/en-US/firefox/addon/5369

Jeśli ten artykuł pomógł Ci, masz co do niego jakieś wątpliwości lub pytania “Zostaw komentarz”, a na pewno na niego odpowiem.
VN:F [1.9.22_1171]
Rating: 4.8/5 (4 votes cast)

Wszelkie prawa zastrzeżone. Zabrania się wykorzystywania jakichkolwiek treści bez zgody autora.

Sławek Gdak Specjalista ds. seo
Jeśli potrzebujesz mojej pomocy, masz jakiekolwiek pytanie wypełnij poniższy formularz.
[contact-form-7 id="11895" title="Formularz 1"]