Jak zrobić panoramiczne zdjęcie (efekt planety) w Photoshopie

27 kwietnia 2017


Na pewno wszystkim znane są zdjęcia panoramiczne, które posiadają efekt planety PRZYKŁAD TUTAJ. Dziś pokażę Wam jak taki efekt wykonać w Photoshopie, jest to bardzo proste i co najważniejsze - szybkie do wykonania.

Mała informacja przed przejściem do instrukcji: 

Jak możecie zauważyć nie było takiej instrukcji w GIMPie, to jest pierwsza instrukcja Photoshopowa na moim blogu, która nie odtwarza tych GIMPowych - powód jest prosty, zauważyłam, że więcej osób jest zainteresowanych instrukcjami w Photoshopie. Jeśli jednak są tu osoby, które były by zainteresowane tą instrukcją w GIMPie - napiszcie o tym w komentarzu ;)

1. Otwieramy nasze zdjęcie w Photoshopie (plik-otwórz / ctrl+o (PC) / cmd+o (MAC))
2. Odwracamy nasze zdjęcie "do góry nogami". Obraz - obracanie obrazu - 180॰.

























3. Wybieramy filtr - zniekształcenie - współrzędne biegunowe

























4. Pojawi nam się ramka, w której musimy mieć zaznaczone "Kartezjańskie na biegunowe" i klikamy ok.


5. Jak widzicie, efekt już jest gotowy, ale pozostała nam brzydka linia łączenia, którą musimy usunąć, aby efekt był taki jak być powinien. Z okna narzędzi wybieramy "punktowy pędzel korygujący" i "zamalowujemy" nasze łączenie.

Efekt: 




Czytaj dalej »

Zmiana koloru poszczególnych elementów w Photoshopie

16 kwietnia 2017


Jakiś czas temu, był omawiany ten temat, ale robiliśmy to wtedy w programie GIMP. Teraz zajmiemy się tym samym, ale w Photoshopie. Jeśli jednak interesuje Was instrukcja w GIMPie - nic straconego, poniżej macie odnośnik do tej instrukcji.

Przejdź do wpisu z instrukcją w GIMPie

1. Otwieramy zdjęcie w Photoshopie i tak jak robiliśmy to w GIMPie, wybieramy zaznaczenie, które najbardziej nam będzie pasować.


2. Zaznaczamy element, który będzie miał zmieniany kolor.






















3. Jeśli nasze elementy są już zaznaczone - wybieramy: obraz - dopasowanie - barwa/nasycenie 

























4. Pojawi nam się ramka z suwaczkami, którymi zmieniamy kolor naszego elementu.


Efekt:


UWAGA! Jest to zmiana kolorów na szybko i najlepiej wychodzi na symetrycznych kształtach. Ta metoda nie nadaje się do dokładnego zmieniania koloru np. włosów. 
Czytaj dalej »

Jak wstawić instagramowy wpis do wpisu na blogu

14 kwietnia 2017

Nie ukrywam, że sama z tej opcji nie korzystam, bo po prostu nie mam po co, ale na wielu blogach widziałam już, że niektórzy, przy podsumowaniach, zaprezentowaniu czegoś wstawiają zrzuty ekranu z Instagrama, a przecież można to zrobić w inny, bardziej (według mnie) estetyczny sposób. Mówię tutaj o wrzuceniu aktywnego wpisu z Instagrama do wpisu na blogu. Jest to bardzo proste do zrobienia, więc nie macie się czego bać :)

1. Zaloguj się na Instagram przez komputer.























2. Wybieramy sobie konkretne zdjęcie/wpis z Instagrama. Klikamy trzy kropeczki na dole.























3. Pojawi nam się kolejne okno z opcjami takimi jak: Kod osadzania/Anuluj. Wybieramy "Kod osadzania".






















4. Pojawi nam się kolejna ramka, wybieramy "kopiuj kod osadzania".























5. Kiedy skopiujemy kod, przechodzimy do wpisu na blogu, w którym chcemy umieścić nasze zdjęcie/wpis z Instagrama. Wybieramy opcje HTML i wklejamy kod.
























6. Efekt:
Czytaj dalej »

Animowana data wpisu

7 kwietnia 2017


Dzisiaj mam dla Was kolejny wpis ze stylem dla dat. Animowana data - po najechaniu myszki może nam się zmienić kolor tła, kształt daty lub font. Taki efekt uzyskacie za pomocą kodu CSS.

1. Przechodzimy do motyw - dostosuj - zaawansowane - dodaj arkusz CSS
2. Wklejamy kod:

STYL 1

h2.date-header span {
background-image: url(LINK DO OBRAZKA)
width: 50px;
cursor:pointer;
padding: 20px 8px;
color: #fff;
font-family: Open Sans;
text-align:center;
letter-spacing:2px;
font-size:7.5px;
text-transform:uppercase;
z-index:5;
position: absolute;
top: -15px;
left: -75px;
box-shadow: #fff -3px -3px 0px inset ;
border-radius: 0px 90px 90px 90px ;
transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
}
h2.date-header span:hover {
font-family: Open Sans;
box-shadow: inset 0px 20px 0px #a64d79 , inset 0px -50px 0px #a64d79;
color: #fff ;
}


Zobacz efekt


STYL 2

h2.date-header span {
background: #a64d79;
width: 50px;
cursor:pointer;
padding: 20px 8px;
color: #fff;
font-family: Open Sans;
text-align:center;
letter-spacing:2px;
font-size:7.5px;
text-transform:uppercase;
z-index:5;
position: absolute;
top: -15px;
left: -75px;
border-radius: 90px 90px 90px 90px ;
transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
}
h2.date-header span:hover {
font-family: Open Sans;
box-shadow: inset 30px 0px 0px #d5a6bd , inset -40px 0px 0px #d5a6bd;
color: #fff ;
}

Zobacz efekt


Link do obrazka, który będzie pełnił rolę tła/Kolor tła
Szerokość
Marginesy wewnętrzne
Kolor fontu
Rodzaj fontu
Położenie tekstu
Odstęp między literami
Wielkość fontu
Transformacja tekstu
Położenie - góra
Położenie - lewa strona
Cienie
Zaokrąglone rogi
Font po najechaniu na niego myszką
Kolor tła po najechaniu myszką
Kolor fontu
Czytaj dalej »

4 pędzle bokeh do Photoshopa za darmo

26 marca 2017


Wiecie, że wszystkie posty Photoshopowe pokrywają się z tymi, które zostały opublikowane już dla GIMPa, jednak ten będzie małym odstępstwem, bo postu z darmowymi pędzlami do GIMPa jeszcze nie było :)

W dzisiejszym wpisie mam dla Was do pobrania za darmo 4 pędzle, dzięki którym będziecie mogli stworzyć efekt bokeh.


Pobierz pędzle


Zasady pobierania

  1. Udostępnienie pliku w postaci oryginalnej lub zmienionej jest zabronione. Chcesz się z kimś podzielić - podaj link do wpisu. 
  2. Plik pobierasz tylko na użytek własny 
Czytaj dalej »

Jak zmienić wygląd gadżetu "obserwuj przez e-mail" - część 3 - okno newslettera

14 marca 2017


Na blogu już były dwa wpisy poświęcone gadżetowi "obserwuj przez e-mail". Dziś pokażę Wam jak w prosty sposób, bo za pomocą kodu CSS, zmienić wygląd tego gadżetu tak, aby przypominał okienko newslettera. Dzięki tej instrukcji, będziecie mogli dodać tekst do Waszego gadżetu "obserwuj przez e-mail", który zaprosi Waszych potencjalnych czytelników do subskrypcji.

1. Motyw (kiedyś szablon) - dostosuj - zaawansowane - dodaj arkusz CSS
2. Wklejamy kod:

.widget.FollowByEmail {
text-align: center;
padding: 0 !important;
}
.FollowByEmail h2.title{
display: none;
}
.FollowByEmail .widget-content {
background: #fafafa;
padding: 20px;
}
.FollowByEmail .widget-content:before {
content: "Newsletter";
color: #161616;
text-align: center;
font: normal bold 14px 'Playfair Display', serif;
font-size: 20px;
font-style: normal;
}
.FollowByEmail .follow-by-email-inner {
display: block;
overflow: hidden;
}
.FollowByEmail .follow-by-email-inner:before {
content: "TU WPISZ TEKST";
color: #161616;
font-size: 13px;
font-style: italic;
line-height: 1.7;
margin: 10px;
display: block;
opacity: .7;
}
.FollowByEmail .follow-by-email-inner td {
display: block;
width: 100%;
}
.FollowByEmail input.follow-by-email-address {
display: block;
padding: 10px;
width: 100% !important;
font-style: italic;
border: 0 !important;
}
.FollowByEmail .follow-by-email-inner .follow-by-email-submit {
margin-right: 0;
padding: 0;
border: 0;
color:#ffffff;
background-color: #000;
font:normal normal 12px Open Sans !important;
text-transform: uppercase;
letter-spacing: 2px;
height: 42px;
z-index: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
font-size:90% !important;
margin: 0 -1% 0px;
width: 100%;
}
.follow-by-email-inner .follow-by-email-submit:hover {
background: #fbe2dd;
color: #4e4d4c;
}

Tło całego okienka 
Marginesy wewnętrzne całego okienka
Tytuł 
Kolor tytułu
Font tytułu
Wielkość fontu
Tekst, który ma się pojawiać nad okienkiem wpisywania maila
Kolor tekstu
Wielkość tekstu
Styl tekstu 
Odstęp między liniami w tekście 
Margines
Marginesy wewnętrzne okna do wpisywania maila 
Kolor tekstu przycisku "subskrybuj" 
Kolor tła przycisku
Font przycisku 
Transformacja tekstu 
Odstęp między literami
Wysokość przycisku 
Kolor tła po najechaniu na przycisk myszką 
Kolor tekstu po najechaniu na przycisk myszką 

Efekt:



Czytaj dalej »