<autoreklama>
Rewolucyjne Witryny Internetowe tani CMS szablony dla stron www retusz zdjec
</autoreklama>

Jakie kroje czcionek w konkretnym użyciu?

2 marca 2017

Wśród nas (grafików, projektantów, osób związanych z designem) są osoby, dla których fonty są fetyszem. Te osoby chętnie oglądają galerie krojów, cmokają z uznaniem nad stylem, wymową formy, krzywiznami, podobieństwami itp. a jednocześnie… sami w swoich projektach używają co najwyżej 10 rodzajów fontów. Niestety (a może stety :)) zaliczam się do tych osób. Na blogu Abduzeedo istnieje osobna seria postów prezentujących czcionki, które oglądam często z wywalonym jęzorem.

Wywiad ze mną

1 września 2015

Sam nie mogę w to do końca uwierzyć, ale na oficjalnym polskim blogu legendarnego serwisu Template Monster pojawił się wczoraj wywiad ze mną. Starałem się odpowiadać szczerze i obszernie. Jest trochę o życiu, o drodze do celu, o oczekiwaniach i błądzeniach. Ale i o grafice, webmasterce, traktowaniu Klientów i o pracy.
Myślę że wyszło dość ciekawie, dlatego zapraszam do przeczytania. :)

Sposób na testowanie mobilnych www

23 lipca 2015

browserstackTechnologie i techniki tworzenia mobilnych stron, mimo że są i działają, charakteryzują się jeszcze niedojrzałością i siermiężnością. No bo jak napisać złożoną stronę która będzie wyświetlała w 100% (i ani o 1% mniej) szerokości absolutnie na każdym urządzeniu mobilnym? Rzeź, przynajmniej na razie. Przeliczanie rozdzielczości natywnych, symulowanych, faktycznych i bóg wie jakich jeszcze, na niemal każdym urządzeniu działa inaczej. A do tego ta przeglądarka obsługuje viewport, a tamta nie, a jeszcze ina – częściowo i nie zawsze. Temat jest do ogarnięcia, ale pochłania mnóstwo czasu i pracy.

Najgorzej jest z testowaniem na różnych urządzeniach. Byłoby dobrze mieć pod ręką wszystkie typowe fizyczne sprzęty, ale to ze względów głównie finansowych – niemożliwe. Z pomocą przychodzą nam więc aplikacje/emulatory i symulatory. Nie dość dokładne -prawie wszystkie. Prawie – bo jest wyjątek. BrowserStack oferuje testowanie działania i wygladu stron na wielu popularnych sprzętach z iOSem i Androidem. Usługa jest płatna, ale (na ten moment) można za darmo testować działanie (na dokładnym, natywnym emulatorze) przez kilkadziesiąt minut oraz wykonać kilkadziesiąt screenshotów.

Każdy mobilny webdeveloper powinien znać to narzędzie. ;) A może są jakieś inne, podobne, o których nie wiem?

Gry w przeglądarce i Orc Attack

20 grudnia 2014

Ponieważ lubię także pograć w prste gry, najlepiej bez instalowania niczego na komputerze, postanowiłem stworzyć na tym blogu nowy tag „gry-przeglądarkowe. Pod tym tagiem będę wrzucał linki do gier które mi się spodobały, odprężają i są po prostu fajne. Z tym że nie należy się spodziewać linków do flashówek, jakich pełno w sieci. Owszem – gry flash także moga się pojawić, ale jedynie te najlepsze, przy których posiedziałem przynajmniej kilka godzin. Będę za to faworyzował gry 3d, korzystające z WebGL i HTML5. Takich można się spodziewać najczęściej.

orc attackNa pierwszy ogień gierka którą znalazłem dziś: The Hobbit – Orc Attack. Jesteś elfem i walisz z łuku do orków. Ładna oprawa i całkiem dobry flow w grze sprawiają że ten – w sumie – point’n’shoot – jest całkiem grywalny. :)

Isotope

3 grudnia 2014

isotopeŚwietny mechanizm graficznego filtrowania/sortowania przedstawia sobą skrypt Isotope. Wygląda to przefajnie, a możliwości ma wiele. Jesli nie do końca kumasz o co mi chodzi (bardzo możliwe – trudno w krótkim wpisie obrazowo opisać działanie Isotope) – kliknij i sprawdź sam(a).

Fluidy w WebGL

20 listopada 2014

fluidwebglPamiętacie Silk? To taka zabawka kolorową plazmą.

Teraz czasy się trochę zmieniły, mamy do dyspozycji zaawansowany silnik graficzny w przeglądarkach – WebGL. I zaczyna się „dziać”. Jedną z zabawek o której warto wspomnieć, jest Fluid Experiment. Zasadniczo to też zabawka, ale się animuje i zachowuje jak płyn. Powiadam Wam – power drzemie w waszych browserach! :)

Parallax na Twojej stronie www

2 listopada 2014

Ostatnio modne są „nowoczesne” strony, w których podczas przewijania, pojawiają się i znikają paski z ilustracjami/tekstem. To tak zwany parallax effect – „fragment strony przesuwa się z inną prędkością niż pozostałe, co daje pewne złudzenie trójwymiarowości„.

U Webmastaha od jakiegoś czasu jest pożyteczny tutorial, jak taki efekt w prosty sposób wykonać. Warto się chociaż przeklikać.

Wyszukiwanie podobnych obrazków

7 października 2014

Podczas pracy przy webdeveloperce dość często, z różnych powodów, zdarza się, że potrzebujemy wyszukać obrazek podobny do tego który już mamy. Najczęściej Klient podsyła mi do projektu jakąś ilustrację do której nie ma praw, a moim zadaniem jest odnaleźć możliwie podobną, którą mogę zakupić wraz z prawami do użycia.

W Chrome sposób na to jest prosty. Wczytuje obrazek do przeglądarki, nasiskam klawisz „s” i klikam na obrazku prawym przyciskiem myszki. Powoduje to wyszukiwanie przez Google obrazków podobnych. Ale to wyszukiwanie nie jest idealne.

tineyeDlatego warto skorzystać z dedykowanej wyszukiwarki tego typu, jaką jest na przykład TinEye. Działa szybko, prosto, intuicyjnie, a wyniki wyszukiwania są bardzo zadowalające.

Spin! czyli kręciołek w JavaScript

30 września 2014

spinjsJuż dwa razy poruszałem temat generatorów loaderów: tutaj i tutaj. jednak w obu przypadkach generatory te produkowały grafikę/animację.

Tym razem jest inaczej. Spin.JS to skrypt który tworzy animację ładowania przez kod JS. Animację co prawda słabo konfigurowalną (chociaż – czy słabo? Zobacz ile suwaczków! :)), ale lekką, przyjemną, bez plików, skalowalną, i przyjazną wszystkim przeglądarkom.

Justowanie wszystkich linii

25 lipca 2014

justified-textPod tym adresem znalazłem fajne rozwiązanie justowania także ostatniej linii. Działa dobrze więc wklejam tutaj dla potomnych (i dla siebie ;)). No chyba że ktoś zna lepsze rozwiązanie tego problemu…?

Kupię stronę www – nowy projekt

1 kwietnia 2014

kupiestroneCoraz częściej zdarza mi się kupować gotowe strony www od osób które chcą je z róznych względów sprzedać. Na szybko stworzyłem ostatnio prostą stronę trochę oszczędzającą mój czas – zamiast wysyłać pytania każdemu kto jest zainteresowany sprzedażą swojego serwisu, teraz będę podawał adres witrynki służącej mi do zbierania takich informacji: KupieStrone.pl , a tam jest już odpowiedni formularz…

Dodatkowo, jest możliwość dopisania się do newslettera i także otrzymywania ofert sprzedaży stron www.

Na GRX.pl kilka nowych szablonów www…

15 marca 2014

Poniżej cztery smaczki spośród kilkunastu nowych. Po więcej zapraszam na GRX.pl :)

Sposób na linie w js – dowolnie pochyłe

15 lutego 2014

Szybciutka funkcja do rysowania dowolnych linii z punktu A do punktu B :)

function linedraw(ax,ay,bx,by)
{
    if(ay>by)
    {
        bx=ax+bx;  
        ax=bx-ax;
        bx=bx-ax;
        by=ay+by;  
        ay=by-ay;  
        by=by-ay;
    }
    var calc=Math.atan((ay-by)/(bx-ax));
    calc=calc*180/Math.PI;
    var length=Math.sqrt((ax-bx)*(ax-bx)+(ay-by)*(ay-by));
    document.body.innerHTML += "
<div id='line' style='height:" + length + "px;width:1px;background-color:
black;position:absolute;top:" + (ay) + "px;left:" + (ax) + "px;
transform:rotate(" + calc + "deg);-ms-transform:rotate(" + calc + "deg);
transform-origin:0% 0%;-moz-transform:rotate(" + calc + "deg);
-moz-transform-origin:0% 0%;-webkit-transform:rotate(" + calc  + "deg);
-webkit-transform-origin:0% 0%;-o-transform:rotate(" + calc + "deg);
-o-transform-origin:0% 0%;'></div>"
}

Generator trójkątów CSS

1 stycznia 2014

triangleKolejne proste, łatwe i przydatne narzędzie – CSS Triangle Generator – do tworzenia prostych trójkatów z borderów CSS’owych. Osobiście używam często, działa wysmienicie. Warto znać.

DetURL

20 sierpnia 2013

Krótko, za Strimsem:
Wprowadź „deturl.com/” przed adres filmu na YouTube itp. lub dowolnego obrazka, aby w szybki sposób uzyskać narzędzia do pobrania danego klipu, przerobienia zdjęcia, odczytania danych EXIF, możliwości wyszukania podobnych obrazów i wiele więcej.

Łatwe wycinanie tła online

28 lipca 2013

Clippingmagic.com to prosty onlajnowy program graficzny, odpalany w przeglądarce, używający zaawansowanych funkcji które w prosty sposób można wykorzystać do wycinania obiektów z tła zdjęć. Moim zdaniem rewelka, działa szybko, sprawnie i dokładnie. Przetestowałem i będę używał, chyba nawet Fotoszkopa porzucę w tego rodzaju zadaniach, na rzecz Clippingmagic. Na pewno warto znać.

Konwerter dźwięków

15 lipca 2013

Szybki, prosty, skuteczny konwerter dźwięków. Osobiście używam do przemianowania dźwięków z nagrań telefonu (w formacie totalnie kosmicznym) na mp3. Polecam. Dodatkowo po skonwertowaniu wielu dźwięków można zasiorbać wszsytkie razem, w jednym pliku spakowane. Mniam.

Obrazek w kodzie strony

26 czerwca 2013

Base64 to sposób kodowania danych do ciągu znaków. Używany przez wiele portali do kompresowania/ukrywania danych lub części kodu, jednak jego najfajniejsze i najważniejsze zastosowanie jest inne. Można kodować pliki graficzne. Całe. I umieszczać bezpośrednio w html, jako kod strony. Zastosowane dla ikon i innych małych elementów strony, takie rozwiązanie znakomicie przyspiesza wczytywanie się całości (ładuje się z htmlem, jednocześnie nie blokując kanału przeglądarki). Warto używać, acz zważać trzeba na umiar – ładowanie wszystkich obrazków tym sposobem raczej stronkę zamuli, niż przyspieszy.

Czym to ugryźć? Na przykład tym: base64-image.de. Prosty enkoder, działa wyśmienicie. Takie pchełki fajnie przyspieszają pracę nad stroną.

Kolejne 6 świeżych layoutów dla www

14 czerwca 2013

6 nowych szablonów www. Zobacz więcej na GRX.pl. Zapraszam!

Przekonaj Klienta, że „u mnie działa”

10 czerwca 2013

Screenr. Prosta rzecz – webaplikacja z javowym appletem umożliwiającym szybkie, łatwe i darmowe nagranie filmiku z określonego obszaru pulpitu (tzw. screencast) i wrzucenie owego filmiku na www, razem z playerem. Do czego to przydatne? Do wykonania szybkiego szkolenia/instruktażu dla Klienta z panelu administracyjnego, który właśnie wdrożyliśmy, do umożliwienia Klientowi zobrazowania nam, o co mu chodzi, co nie działa, a co działa nie tak jak powinno, lub do tego, o czym w temacie niniejszego posta :)