Pomoc i kontakt

Koszyk

Zaloguj się

strefakursów.pl Projektowanie

Kurs Photoshop dla web designera:Trailer

Naucz się projektować strony internetowe w programie Photoshop

Kurs Photoshop dla web designera:Eksport pliku z przezroczystością

Naucz się projektować strony internetowe w programie Photoshop

Kurs Photoshop dla web designera:Generator zasobów - wprowadzenie

Naucz się projektować strony internetowe w programie Photoshop

Kurs Photoshop dla web designera:Formularz - dodawanie przycisku

Naucz się projektować strony internetowe w programie Photoshop

DARMOWE FRAGMENTY

Ten kurs jest częścią ścieżki:

UX/UI Designer

9381 użytkowników podnosi swoje kwalifikacje w tej ścieżce kariery.

Opinie użytkowników

Paweł Wilczek

5.0

Bardzo dobry kurs, który rewelacyjnie prezentuje jak można przygotować przykład strony nie tylko w postaci statycznego pliku będącego tak jakby zrzutem ekranu danej strony, ale również przekuć ten przykład w coś bardziej interaktywnego. Można w ten sposób pokazać… Czytaj więcej

Jakub Strzelecki

5.0

Kurs jak najbardziej w porządku posiada podstawą wiedzę i prowadzi do chęci dalszego rozwoju. Kurs jest warty swojej ceny. Czas spędzony na kursem nie był zmarnowaniem czasu gdyż rozwinęły się moje umiejętności.

Zobacz wszystkie

Znasz podstawy Photoshopa, ale brakuje ci umiejętności niezbędnych web designerowi?
Potrzebujesz wiedzy, która pozwoli ci swobodnie projektować nowoczesne witryny?
Chcesz dowiedzieć się jak samodzielnie tworzyć banery, menu, przyciski, preloadery oraz inne elementy stron internetowych?
Wiesz już co chcesz zaprojektować, ale brakuje ci wiedzy, która pozwoli osiągnąć ten cel?

Sprawdź w jaki sposób Ci pomożemy

Pobierz darmową wersję

Ucz się korzystając z bezpłatnej wersji tego programu

Dowiedz się więcej

Czego się nauczysz z kursem?

Po ukończeniu tego szkolenia będziesz w stanie samodzielnie tworzyć niezwykłe projekty stron dla siebie lub dla swoich klientów. Zdobędziesz wiedzę na temat obecnych trendów i technik, które nie tylko pozwolą ci łatwo osiągnąć zamierzony efekt, ale również sprawią, że twoje prace wzbudzą zachwyt wśród odbiorców.

Jak to działa?

Kurs zawiera ponad 70 filmów instruktażowych z komentarzem lektora, który wyjaśni ci wszystkie zagadnienia w prosty i przejrzysty sposób. Do kursu dołączyliśmy wszystkie niezbędne pliki – nawet jeśli natrafisz na jakiś problem to zawsze możesz się do nich odwołać i powtórzyć każdą czynność pokazaną na ekranie.

Najciekawsze dodatki dla web designera

W kursie omawiamy wiele przydatnych dodatków. Poznasz cały zestaw rozszerzeń dedykowanych dla web designerów. Za ich pomocą zrealizujesz wiele funkcjonalności, które nie są dostępne za pomocą standardowych narzędzi. Poznasz również podstawy projektowania z użyciem siatki kolumn (tzw. Grid). Jest to niezwykle ważna umiejętność, w zasadzie niezbędna przy projektowaniu stron responsywnych oraz opartych na wszelkiego rodzaju frameworkach (np. Bootstrap).

Eksport zawartości i cięcie layoutu

Na tym etapie poznasz przydatne techniki eksportu zawartości. Omówimy narzędzie Generator zasobów, które w wielu wypadkach może z powodzeniem zastąpić pracochłonne cięcie z użyciem plasterków. Omówimy także mniej znaną, ale niezwykle interesującą technikę pracy z wykorzystaniem zmiennych i zewnętrznych danych. Za jej pomocą możesz szybko stworzyć wiele wariantów i odmian jednego projektu. Nie zapomnimy także o bardziej tradycyjnych metodach eksportu. Plasterki wciąż mogą być bardzo przydatne zwłaszcza jeśli wiemy jak wykorzystać w pełni ich możliwości.

Czym to szkolenie różni się od innych?

Nasz kurs to starannie przygotowany, kompleksowy produkt, który jak na tacy podaje ci praktyczną wiedzę i przydatne umiejętności. Jedyne co musisz zrobić to po prostu rozpocząć naukę.

Photoshop

Dreamweaver

CSS3Ps

Bootstrap

Projektowanie witryn

Nowoczesny Flat Design

Następna cześć kursu pozwoli ci zdobyć bardzo obszerną wiedzę na temat projektowania nowoczesnych layoutów. Będziemy tworzyli krok po krok stronę utrzymaną w modnym ostatnio stylu określanym jako Flat Design. Dowiesz się m.in. jak rozplanować zawartość, jak zorganizować swój projekt, jak narysować główne elementy, jak dodać nawigację, formularze itd. To świetna okazja do zdobycia praktycznych umiejętności, które znajdą zastosowanie praktycznie w każdym twoim projekcie.

Automatyzacja i współpraca

Photoshop umożliwia zautomatyzowanie wielu często wykonywanych zadań. I jest to kolejny temat jakim zajmiemy się w kursie. Opanujesz kilka interesujących funkcji programu m.in tworzenie tzw. Droplet’ów. Projektowanie stron internetowych to nie tylko Photoshop. W nastepnej części zajmiemy się szeroko pojętą współpracą z innymi programami firmy Adobe. Nauczysz się przenosić grafikę z Photoshopa do programu Muse oraz Dreamweaver.

Optymalizacja grafiki

Kolejny etap szkolenia poświęciliśmy na omówienie bardzo ważnego tematu czyli eksportu oraz optymalizacji grafiki na potrzeby Internetu. To doskonała okazja aby poznać w praktyce różnice pomiędzy poszczególnymi formatami oraz interesujące techniki, które pozwolą na zmniejszenie rozmiaru pliku. Dowiesz się kilku ważnych rzeczy na temat eksportu dokumentu z przeźroczystością oraz optymalizacji formatu PNG.

Praca z kolorami

Na początku szkolenia pokażemy ci jak dostosować program pod kątem pracy z projektami webowymi. Przygotujemy własną przestrzeń roboczą, zdefiniujemy własne skróty klawiszowe i zapiszemy presety, które ułatwią nam tworzenie nowych dokumentów. W drugim rozdziale poznasz kilka kluczowych zagadnień dotyczących pracy z kolorami. Wyjaśnimy ci zasady zapisu koloru w formacie HTML (szesnastkowym), pokażemy bardzo interesujące narzędzia do generowania barw i oraz nauczymy się tworzyć własne próbki koloru.

Co jeszcze znajduje się w kursie?

Photoshop dla web designerów

Jeśli chodzi o szeroko pojęty web design to program Photoshop jest cały czas najpopularniejszym wyborem. Mnogość narzędzi i możliwości sprawia, że jego zastosowania w tej dziedzinie są nieograniczone. Wielu doświadczonych designerów używa go nie tylko do projektowania kompletnych witryn, ale również do tworzenia pojedynczych elementów strony, optymalizacji grafiki dla Internetu oraz do projektowania wszelkiego rodzaju aplikacji webowych. Oczywiście do swobodnej pracy w programie niezbędna jest znajomość wielu technik i narzędzi, które możesz bez problemu opanować korzystając z naszego kursu.

Animacje i eksport na różne urządzenia

To doskonała okazja aby poznać możliwości oferowane przez kompozycje warstw. Dowiesz się m.in. jak użyć tej funkcji do stworzenia różnych wariantów projektu oraz jak na podstawie utworzonych kompozycji stworzyć ciekawą prezentację w formie pliku PDF. Kolejny temat to tworzenie od podstaw animowanego preloader’a. Zdobędziesz kluczowe umiejętności obejmujące zarówno przygotowanie grafiki, tworzenie animacji oraz eksport gotowego projektu. Następny etap kursu obejmuje eksport grafiki na różne urządzenia. Będziemy mówili m.in. o tworzeniu kilku wariantów obrazka (np. dla telefonów oraz tabletów). Opowiemy również o tworzeniu grafiki na wyświetlacze o dużej gęstości pikseli (HDPI, Retina itp.), które zdobywają coraz większą popularność.

CSS sprite i generowanie stylów w programie Photoshop

Kolejny etap to omówienie popularnej techniki CSS Sprite, która pozwala zminimalizować liczbę obrazków wczytywanych na stronie internetowej. Dowiesz się jak przygotować taką grafikę oraz jak korzystać z ciekawych internetowych generatorów spriteów. Potem zajmiemy się interesującą i chyba mało znaną funkcjonalnością programu Photoshop. Będziemy generowali style CSS na podstawie zawartości projektu PSD. Teoretycznie powinno nam to zapewnić możliwość szybkiego ostylowania niemal każdej witryny. W praktyce można jednak natrafić na różne pułapki, o których zresztą będziemy mówili. Przy okazji poznasz ciekawy plugin, który zazwyczaj pozwoli ci osiągnąć lepsze rezultaty przy generowaniu CSS niż standardowe narzędzia programu.

Ciekawe techniki pracy i przydatne zasoby w Internecie

Przedostatni etap obejmuje aż dziewięć filmów. Będziemy w nich tworzyli od podstaw różne elementy strony utrzymanej w stylu określanym zazwyczaj jako Retro. To doskonały pretekst do omówienia wielu praktycznych i uniwersalnych technik pracy. Na koniec naszego szkolenia poznasz kilka bardzo ciekawych rozwiązań powszechnie stosowanych w nowoczesnych witrynach internetowych. Zajmiemy się m.in. techniką znaną pod nazwą Icon Font. To doskonały wybór w sytuacji gdy potrzebny jest nam obszerny i jednocześnie bardzo lekki zestaw ikon. Kolejny ciekawy temat poruszany w tym rozdziale to wykorzystanie gotowych zestawów elementów interfejsu użytkownika (tzw. UI Kit).

Co jeszcze warto wiedzieć?

W kursie używamy Photoshopa w polskiej wersji

W naszym szkoleniu używamy programu Photoshop CC w polskiej wersji językowej. Praktycznie całą wiedzę możesz również wykorzystać do pracy ze starszymi wersjami Photoshopa.

Zobacz szczegółową recenzję naszego kursu na blogu graficzny.com.pl

ZOBACZ WIĘCEJ

Program nauczania

1 Wprowadzenie

Wstęp 0m 42s

Jak korzystać z plików? 0m 51s

2 Webdesign w Photoshop

Najważniejsze preferencje 4m 50s

Zapisywanie presetów nowego dokumentu 2m 16s

3 Praca z kolorem

Praca z kolorami HTML 4m 29s

Narzędzie Adobe Kuler 4m 47s

Zapisywanie własnych próbek 3m 32s

4 Eksport grafiki na potrzeby Internetu

Zapisz dla Internetu - ogólne zagadnienia 5m 22s

Optymalizacja plików JPEG 5m 56s

JPEG - wykorzystanie siatki pikseli 4m 47s

Optymalizacja plików GIF 4m 14s

Optymalizacja plików PNG 4m 13s

5 Eksport przezroczystości

Obcinanie transparentnych pikseli 2m 13s

Eksport pliku z przezroczystością Podgląd 3m 37s

6 Tworzenie nowoczesnego layoutu

Omówienie projektu 2m 35s

Przygotowanie nowego dokumentu 4m 03s

Rysowanie głównych bloków 4m 43s

Organizowanie zawartości projektu 1m 55s

Rysowanie głównego menu 4m 20s

Elementy odtwarzacza wideo 5m 45s

Dodawanie obrazków do layoutu 4m 09s

Wykorzystanie stylów tekstu 5m 14s

Projektowanie formularza 4m 16s

Wykorzystanie kompozycji warstw 2m 10s

7 Eksport za pomocą generatora

Generator zasobów - wprowadzenie Podgląd 4m 04s

Dodatkowe opcje eksportu 3m 06s

8 Projektowanie z użyciem zmiennych

Definiowanie zmiennych 3m 56s

Wprowadzanie danych wewnętrznych 2m 58s

Użycie zewnętrznego źródła danych 5m 02s

Eksport na podstawie danych 3m 12s

9 Cięcie i plasterki

Plastry - wstęp do tematu 6m 49s

Plastry bazujące na warstwach 3m 10s

Plastry na podstawie prowadnic 2m 18s

10 Techniki wykorzystujące Sprite

Sprite - zasada działania 3m 05s

Sprite - tworzenie grafiki 4m 43s

Użycie zewnętrznych generatorów 3m 07s

11 Generowanie CSS na podstawie PSD

Skuteczne kopiowanie koloru 3m 31s

Generowanie stylu tekstu 5m 15s

Generowanie stylu dla grafiki 4m 10s

Tworzenie CSS na podstawie stylu warstwy 2m 56s

Omówienie pluginu CSS3Ps 5m 14s

12 Przydatne narzędzia i dodatki

Plugin Cut&Slice me 5m 48s

Open With Photoshop 1m 30s

Plugin Guide Guide 3m 43s

Punchcut - zestaw elementów 4m 30s

13 Projektowanie z użyciem siatek

Projektowanie z użyciem Bootstrap 7m 11s

Generowanie własnej siatki kolumn 3m 05s

14 Kompozycje warstw

Zapisywanie stanów witryny 2m 58s

Symulowanie efektu Rollover 5m 39s

Eksport kompozycji do PDF 3m 33s

15 Projektowanie Preloaderów

Preloader - elementy graficzne 7m 59s

Tworzenie animacji poklatkowej 4m 08s

16 Eksport grafiki w różnych rozmiarach

Definiowanie obszarów przycinania 4m 06s

Tworzenie wariantów grafiki 4m 26s

Eksport na ekrany HDPI 4m 37s

17 Automatyzacja

Operacje i polecenie Zmieść obraz 3m 15s

Droplet - przykład użycia 4m 35s

18 Współpraca z innymi programami

Przenoszenie grafiki do Dreamweavera 3m 21s

Współpraca z programem Muse 3m 14s

19 Projekt retro

Definiowanie własnego wzorku 6m 00s

Wzorek bazujący na kształcie 4m 18s

Wstążka - zaawansowana edycja kształtów 7m 51s

Wstążka - cień i obramowanie w stylu retro 4m 29s

Wypełnianie własną teksturą 4m 11s

Praca z liniami i kreskami 4m 36s

Formularz - styl retro 6m 29s

Formularz - dodawanie przycisku Podgląd 6m 29s

Projektowanie plakietki 8m 12s

20 Różne techniki i zagadnienia

Icon Fonts - omówienie 4m 47s

Icon Fonts - przykład użycia 3m 21s

Użycie gotowych elementów interfejsu 4m 23s

Cienie w stylu Flat 5m 27s

Zakończenie 0m 45s

Ocena uczestników

93%

Recenzje użytkowników (121)

Weronika Kolberg 13 stycznia 2021

Bardzo fajny kurs, polecam :)

Bartłomiej Siwicki

10 stycznia 2021

Super praktyczne spojrzenie ne wykorzystanie mnie Photoshopa w tworzeniu stron

Robert Krzyżański 9 stycznia 2021

Kurs przejrzysty i zrozumiały. Super!

Krzysztof Grzelak

27 grudnia 2020

Świetny kurs, który pomoże użytkownikowi zrozumieć wszystko nawet bez podstawowej znajomości Photoshopa. Polecam w 100%

Agnieszka Koprowska

25 grudnia 2020

Jak zwykle w przypadku kursów autorstwa Pana Ksawerego - przejrzysty, przyjazny dla słuchacza kurs. Wszystko wytłumaczone krok po kroku prostym językiem, filmik w każdej chwili można cofnąć czy przyspieszyć. Autor mówi zawsze jakich skrótów używa w danej chwili, więc… Czytaj więcej

WIĘCEJ RECENZJI

Ksawery Kargól

Full Stack Developer

4.9

(121 ocen)

Kurs Photoshop dla web designera

Naucz się projektować strony internetowe w programie Photoshop

Poziom: Średniozaawansowany

69zł

41zł

Taniej o 41%

00 : 14 : 45 : 29

dni godz min sek

Oferta dla firm i zespołów

Nasz produkt obejmuje:

Bezterminowy dostęp

5 godzin szkolenia

73 wykładów

pytań testowych

Mobilny dostęp 24/7

Certyfikat ukończenia

Testy i zadania

Rekomendacje na LinekdIn

Ten kurs jest częścią ścieżki

4.8

UX/UI Designer

Opanuj kluczowe techniki projektowania wizualnego oraz projektowania zorientowanego na użytkownika. Zbuduj solidne podstawy, które umożliwią Ci łatwy start w tej bardzo popularnej i ważnej dziedzinie.

452 wykładów

9381 uczestników

Dowiedz się więcej

strefakursów.pl korzysta z plików cookie, aby dostosować usługi do Twoich preferencji. Niektóre pliki cookie są zaś niezbędne do prawidłowego działania witryny. Dzięki nim możemy wyświetlać Ci spersonalizowane oferty i informacje o promocjach, zarówno w witrynach strefakursów.pl, jak i na innych stronach. Oczywiście to Ty decydujesz. Możesz w każdej chwili określić warunki przechowywania lub dostępu do plików cookies w Twojej przeglądarce.

AKCEPTUJĘ PLIKI COOKIE