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

Klikalna mapa polski w jQuery

12 kwietnia 2012

Piotrek, kumpel z pracy, znalazł coś fajnego – kompleksowe rozwiązanie problemu wykonania interaktywnej mapki europy, polski i innych obszarów, z klikalnymi województwami.

O, proszę: winstonwolf.pl/clickable-maps/polska.html. Oczywiście free. Za niewielką opłatą. Oszczędność czasu i pracy. Polecam.

Skomodorkuj siebie :)

1 kwietnia 2012

Bezużyteczna zabawka znaleziona na Wykopie jakiś czas temu: Za pomocą tej prostej aplikacji każde zdjęcie / obrazek możesz bardzo szybko przerobić na taką, która będzie wyglądać jak wyświetlana na kościach graficznych legendarnego komputera C=64.

C64 Yourself to fajna rzecz, może kiedyś komuś przyda się w jakimś awangardowym projekcie. :)

Jak działa nasz demotywator?

26 marca 2012

Jakiś czas temu trafiłem na świetny artykuł, opisujący bardzo trafnie mechanizmy autodemotywacji działające w naszych głowach – i opisujący do zagadanienie od strony biologicznej. Naprawdę warto przeczytać przynajmniej raz – gwarantuję że po przeczytaniu każdy Twój cel będzie łatwiejszy do osiągnięcia. http://www.isel.edu.pl/blog/wpis.php?nw=94

Nowy szablon www: ITnet

21 marca 2012

Zagapiłem się i zapomniałem wrzucić na bloga info o nowym szablonie na grx.pl … i właśnie naprawiam błąd. Zobaczcie:

Sprawdzacz headerów

19 marca 2012

Kolejna pchełka: web-sniffer.net do narzędzie do sprawdzania i testowania informacji nagłówkowych wysyłanych przez podstronę przed jej wyświetleniem. Serwis umożliwia również podgląd interpretacji takich headerów przez różne silniki/przeglądarki (i boty), i w zależności od używanej wersji protokołu HTTP i typu żądania (get, post, …).

Taki web-sniffer może się komuś przydać… :)

CSS Inline Styler

17 marca 2012

Kiedyś takiego narzędzia szukałem, ale odniosłem porażkę i straciłem godzinę na konwersję ręczną.

Dzisiaj McBarlo podrzucił mi linka: inlinestyler.torchboxapps.com . Jest to pchełka, konwertująca zewnętrzne/osobno zdefiniowane definicje stylów – do stylów opisanych w atrybucie style, czyli do stylów „inline”. Właściwie trudno napisać coś więcej, bo to taki przydaś. :)

Neon flames – kolejny generator teł

11 marca 2012

Pamiętacie Silk? Była to zabawka/eksperyment – mini aplikacja graficzna, w której można było generować trójwymiarowe półprzezroczyste „materie”. Efektem kilkunastu sekund bezładnego machania myszką jest obrazek wart zastosowania jako tło w dowolnej aplikacji rozrywkowej lub na stronie internetowej … lub jako tło na pulpit.

Otóż teraz mamy do czynienia z podobną zabawką – „Neon Flames” to webaplikacja (btw., napisana w HTML5 przez szwacarskiego programistę, który popełnił wiele innych ciekawych eksperymentów webowych) umożliwiająca stworzenie form graficznych, których wygląd można porównać do widoku galaktyk i mgławic. Wychodzi toto świetnie, a zabawa jest przednia, tym bardziej że do dyspozycji mamy, oprócz kolorów, także inne parametry „pędzla”.

ColorHexa – kolorystyczny kombajn

25 lutego 2012

<a href=”http://www check this link right here now.colorhexa.com/”>Narzędzi kolorystycznych w Sieci jest wiele, i na tym blogu ten temat był już poruszany wielokrotnie (jeśli nie wierzysz – przeklikaj się przez powiązane tagi). jednak to narzędzie – ColorHexa – zasługuje na wzmiankę głównie ze względu na swoją przejrzystość i użyteczność. Niby jest to kombajn – można mieszać kolory, palety, generować gradienty i kombinować na wiele innych sposobów. A jednak, mimo mnogości funkcji – aplikacja przedstawia się i działa bardzo funkcjonalnie. Wszystko co potrzebne – jest na swoim miejscu, dostępne wtedy gdy powinno być dostępne. Po prostu witryna napisana w sposób przemyślany i przetestowany. Korzystanie z takich rozwiązań przyspiesza tworzenie twoich projektów, a więc pozwala Ci więcej zarabiać. decydowanie warto porzucić kilka innych narzędzi, dla ColorHexy.

Generator plików .htaccess

13 lutego 2012

http://htaccess.lapti.pl/. Brzydki, nieostylowany, ale funkcjonalny i bardzo użyteczny. Reguły generowane przez ten generator działają, w przeciwieństwie do wielu procedur i porad na forach internetowych. Dobre są też gotowe rozwiązania predefiniowalne, których ludzie najczęściej szukają. Krótko mówiąc – rzecz godna polecenia :)

Szablon www: Network

28 stycznia 2012

Na grx.pl wrzuciłem kolejny szablon, tym razem dla branży IT – zapraszam do oglądania (a chociaż do zerknięcia):

PNEB: e-Kioski, czyli e-sklepy w bannerach

26 stycznia 2012

Pewnego wieczoru, tuż przed zaśnięciem wpadł mi do głowy pomysł na nową możliwość handlu w Internecie. Oczywiście już nie zasnąłem, ale rozpisałem sobie ideę na kartce. A teraz się nią z Wami podzielę. :)

Wymyśliłem coś, co roboczo nazwałem „e-kiosk”. Być może coś takiego już istnieje, jednak żadnym podobnym rozwiązaniem się nie inspirowałem. E-kiosk byłby to mały sklep internetowy, w którym (jak w zwykłym e-sklepie) są kategorie, w kategoriach są produkty. Ogląda się je, a potem kupuje (często za pośrednictwem modułu „koszyka”), płacąc przelewem przez Internet, PayPalem lub innym portfelem. Rzecz w tym, że cały taki sklep możnaby umieścić w pojedynczej jednostce reklamowej, i umieścić takie gotowe „instancje” sklepu w bardzo wielu miejscach Internetu, w bardzo wielu portalach, w cenie reklamy właśnie. Można więc łatwo dotrzeć do dużego grona odbiorców.

Ponieważ obszar na aplikację sklepu byłby niewielki (choć forma reklamowa musiałaby być jedną z większych – np. podwójny billboard lub szeroki skyscraper) – sam sklep (i jego funkcjonalności) można też zminiaturyzować, okroić, uprościć – w stosunku do tradycyjnego e-sklepu identycznym, jak stosunek między fizycznym supermarketem a kioskiem ruchu.

Wyobrażam sobie, że zakup w takim e-kiosku musiałby być superłatwy – szybko wybieramy (lub bardzo łatwo wyszukujemy) produkt, klikamy „Kup teraz” i płacimy (najlepiej za pomocą zmniejszenia salda na jakimś prepaidzie).

Zalety: Właściwie jest jedna, ale za to potężna: Tani (bo w cenie reklamy) i łatwy dostęp do bardzo dużej ilości Klientów.

Wady: Mały obszar aplikacji implikuje użycie niewielkich rozmiarowo elementów, mniejszych czcionek itp. – nie każdy to lubi. Poza tym, aby odróżnić taki e-kiosk od zwykłego bannera – trzeba by go jakoś oznaczyć. No i zbudować u ludzi świadomość istnienia e-kiosków i umiejętność z nich korzystania.

Zastosowań takiego rozwiązania są setki, biorąc pod uwagę technologie takie jak geolokalizacja (szybkie zamówienie pizzy), metody płatności lub nowoczesne technologie webowe. Myślę że to mogłoby się sprawdzić.

Na testowanie stron – Browserling

28 grudnia 2011

<a title=”Browserling” href=”http://browserling atorvastatin online.com/” rel=”http://browserling.com/” target=”_blank”>Browserling to ostateczne i idealne rozwiązanie problemów z testowaniem stron pod różnymi przeglądarkami.

„Przeglądarniątko” działa genialnie prosto i skutecznie – za każdym zapytaniem odpalają cały system operacyjny i w nim wybraną przez nas przeglądarkę, a w niej – pobrany adres strony. Całość jest „używalna” w 100% – czyli nie dostajesz screenshotu, ale otrzymujesz w pełni funkcjonalną stronę odpaloną w wybranym browserze, którą możesz przetestować także pod kątem interakcji i realnej użyteczności.

Strony testować można za pomocą przeglądarek IE, Firefox, Chrome, Opera i Safari, we wszystkich pełnych wersjach + najnowsze wersje prototypowe (nightly, itp.).

Łatwe, proste, przyjemne, szybkie – i o to chodzi. Jest tylko jedno „ale” – narzędzie nie jest do końca darmowe. Za free można używać do woli, ale sesja testowania jednej strony w jednej przeglądarce może trwać max 5 minut, a po opłaceniu $20 miesięcznie – czas testowania jest nieograniczony. Myślę jednak że wersja darmowa powinna wystarczyć wszystkim.

[aha: za cynk dziękuję mcbarlo i pośrednio grxmrx’owi]

PNEB: kojarzenie par na podstawie IQ

24 listopada 2011

Ten pomysł opisywałem już w kilku miejscach, rozmawiałem też o nim z kilkoma osobami, dlatego może już gdzieś jest opisany. Jednak, jako że uważam, że jestem jego autorem – opiszę go też tutaj…
Jak zwykle postaram się opisać całość krótko i zwięźle.

Pomysł zakłada stworzenie nieco nietypowego portalu randkowego. Nietypowego dlatego, że będzie zawierał algorytm dobierający pary na podstawie odpowiedzi na test na inteligencję. Nie – nie chodzi o dobieranie ludzi na podstawie wyników testu, ale na podstawie samych odpowiedzi. Bo wynik jest tak naprawdę nieważny.

Jeśli rozwiazaywałaś/eś kiedykolwiek test na inteligencję (szczególnie te trudniejsze zadania) – wiesz, że „ścieżek myślowych” może być kilka – i żadna z nich nie musi prowadzić do rozwiązania oficjalnie uznanego za prawidłowe.

I właśnie to można wykorzystać – kojarzyć osoby, które tworzą właśnie podobne „ścieżki myślowe”. A sprawdzać to można porównując wybrane odpowiedzi w każdym z zadań. Czyli, jeśli dwie osoby mają – powiedzmy – 80% zadań o tych samych odpowiedziach (nieważne, czy prawidłowych, czy nie) – to te osoby prawdopodobnie myślą podobnie. Czyli z dużym prawdopodobieństwem się dogadają – czyli byłyby dobrą parą.
Ot – i cała idea. :)

Zalety:  (Prawdopodobnie) dość trafne kojarzenie podobnie myślących osób, (chyba) nowatorskie podejście do tematu, (dodatkowo) kojarzone będą osoby o podobnym współczynniku iq (ale to ma znaczenie drugorzędne)

Utrudnienia: Odnalezienie odpowiedniego, obszernego „tematycznie”, dostępnego, legalnego i taniego szablonu testu iq do wykorzystania

(Ten pomysł bardzo mi się podoba, choć nie mam czasu na jego realizację – zatem jeśli ktoś zdecyduje się go wykorzystać – zapraszam do współpracy:)).

Synestezja

20 listopada 2011

Na szybko, taka ciekawostka, w sumie trochę graficzna, a więc w pewien naciągany sposób korespondująca z tematyką bloga:

Synestezja – to zjawisko odczuwania jednym zmysłem tego, co odbieramy innym zmysłem. Czyli na przykład smakowanie kolorów, słyszenie zapachów itp. Do tej pory myślałem, że to ciekawostka dotycząca tylko osób z taką właśnie przypadłością. Ale okazuje się, że u „standardowych” ludzi, też może działać. Dobrym i poniekąd oczywistym przykładem jest powiązanie zmysłów smaku i powonienia (można posmakować zapachu i powąchać smak), ale znalazłem inne, lepsze zjawisko, które u mnie działa:

Bo patrząc na poniższą animację, naprawdę „słyszę” ten filmik, mimo że to animgif, zatem jest na 100% niemy. Słyszę ciche, ale wyraźne „bum” gdy ziemia w animacji się trzęsie. Niesamowite. Też to macie? Jeśli tak, to doświadczanie właśnie synestezji.

[godzina później] Znalazłem kolejny obrazek, który słyszę. Poniżej. Wy też słyszycie „Pszszsz” ?

PNEB: wirtualny hipermarket 3D

16 listopada 2011

Pomysł powstał w mojej głowie z połączenia idei Google Street View i spożywczych sklepów internetowych, które działają prężnie w Polsce już nawet w małych miejscowościach. Pomysł nie jest stricte internetowy, i wymaga sporego nakładu „fizycznej” pracy, a także dość specjalistycznego sprzętu i prawdopodobnie specyficznych umów z hipermarketami. Aczkolwiek jest wykonywalny i jest (chyba) nowatorski.

Już opisuję:
Codziennie wcześnie rano zatrudnieni pracownicy zakładają na głowę specjalne kaski z kamerami dookoła, zdolnymi rejestrować obraz panoramiczny w 3d, i idą do hipermarketów, przechodząc obok wszystkich półek i produktów, rejestrując zdjęcie 3d całej oferty handlowej w danym momencie. Pracownicy Ci odwiedzają taki hipermarket w tym samym celu jeszcze kilka razy w ciągu każdego dnia. Za każdym razem otrzymujemy zdjęcie 3d, które (automatycznie lub nie) ląduje w serwisie internetowym. Użytkownicy tego serwisu wirtualnie „chodzą” po takim hipermarkecie i po prostu zaznaczają produkty, które chcą nabyć. następnie zlecają zamówienie, podają adres i za pół godzinki odbierają zakupy w progu swojego domu.
To właściwie już koniec „trzonu” pomysłu, ale można go oczywiście rozszerzyć. Niewątpliwą zaletą takiego serwisu byłaby intuicyjność obsługi i zbliżony do naturalnego sposób robienia zakupów. Można by było jeszcze zrobić w jakiś sposób (automatyczny lub manualny) identyfikację każdego z produktów, z dodatkowym opisem, ceną itp. To umożliwiłoby stworzenie wyszukiwarki.
Takie rozwiązanie zakupowe dodatkowo umożliwia ludziom sprawdzenie, czy dany produkt jest jeszcze w sklepie (a raczej był w momencie ostatniej rejestracji zdjęcia 3d) bez wychodzenia z domu… są jeszcze inne możliwości – sprzężenie z porównywarkami cen, lepsza niż tylko telefoniczna pomoc mężowi w zakupach samodzielnych ;), wersja na telefony/smartfomy… itp.

Na pewno problemem byłaby umowa z hipermarketami. Jak wiemy w hipermarketach zdjęć robić raczej nie wolno (a przynajmniej można za takie działanie stracić z życia kilkadziesiąt minut na bezsensowną rozmowę z ochraniarzami/kierownictwem), z drugiej strony dla sklepu takie rozwiązanie to więcej sprzedanych produktów, mniejszy tłok w sklepie no i nowatorskie rozwiązanie sieciowe…

Pomysł na pewno do dopracowania, co już zostawiam Czytelnikom. :)

Pomysły na e-biznes [PNEB]

14 listopada 2011

Postanowiłem rozszerzyć tematykę bloga o jeszcze jedną sferę, której zagadnienia (jak – prawdopodobnie – każdemu parającemu się webmasterką) gęsto chodzą mi po głowie. Mówię o moich pomysłach na serwisy internetowe lub/i na (częściowo-) internetowe rozwiązania mogące być przydatnymi w życiu każdego, lub po prostu takie, które są mniejszą lub większa inwestycją, po czasie mogącą przynieść mniejszy lub większy zysk.

Jeszcze wczoraj byłem przekonany, że takich idei nie wolno publikować, w obawie o przywłaszczenie ich sobie przez kogoś, kto pomysł zrealizuje zamiast mnie i zgarnie zysk. Prawda jest taka że 99% takich idei nie zrealizuję nigdy i pozostaną one na zawsze w mojej głowie/notatniku. Dlatego wychodzę z założenia że po opublikowaniu pomysłu na taki e-biznes większy zysk osiągnę przez ściągnięcie na bloga nowych czytelników. Poza tym naprawdę ucieszę się, jeśli ktoś pomysł wykorzysta i zrobi z tego biznes służący jemu i/lub innym osobom.

Inspiracją do tej decyzji są dla mnie dwa miejsca w Internecie:

Zatem – już w kolejnym wpisie, w serii pod tagami „pomysły” i „e-biznes” – będę opisywał co mi po głowie chodzi… Zapraszam. :)

Znaki do kopiuj/wklej

4 listopada 2011

<a href=”http://copypastecharacter.com” rel=”http://copypastecharacter simvastatin tablets.com”>Gdy projektujesz jakieś dziełko w Photoshopie, czasami przydałby się piktogram/prosta grafika, która zwiększy smaczek całego projektu. Wiesz że taka grafika/kształt jest gdzieś w klawiaturze – wystarczy jedynie znać kombinację klawiszy… otóż nie :) – bo wystarczy znać stronę copypastecharacter.com, na której zebrano wszystkie nietypowe znaki tego rodzaju, gotowe do użycia po skopiowaniu. Rzecz prosta i przydatna :)

Tagxedo – kreatywna grafika w kilka chwil

27 października 2011

<a href=”http://www.tagxedo buy atorvastatin online.com/” rel=”http://www.tagxedo.com/”>Nie lubię Silverlighta i dlatego jeszcze nigdy nie pisałem o żadnych narzędziach z wykorzystaniem tej technologii. Myślę że Microsoft wyskoczył jak Filip z konopii, tworząc i rozwijając klon Flasha w momencie, gdy flash odchodzi w zapomnienie.

Jednak teraz zrobię wyjątek i zaprezentuję webaplikację stworzoną w tej właśnie technologii. Nie jest to jakieś niezbędne narzędzie, ale może być przydatne dla wszelkich grafików/projektantów w momentach, kiedy po prostu nie ma pomysłów na coś kreatywnego.

Chcę pokazać Wam Tagexedo – webaplikację, którą pokazał mi Kumpel/Klient Grzesiek (pozdro!).

Co ta pchełka potrafi? Otóż automatycznie tworzy ładne grafiki, używając odpowiednio ułożonych słów pobranych z jakiegoś źródła (np. z pliku, kanału Twittera, strony internetowej itp.). Wyniki są bardzo efektowne i zaciekawiające – na pewno przyciągną niejeden wzrok, gdy użyć ich w jakiejś publicznej publikacji. Warto zainstalować Silverlighta chociażby po to, żeby się tym cackiem pobawić.

Gra w kerning

20 października 2011

Kerning to regulowanie odległości pomiędzy konkretnymi parami znaków w danym kroju pisma. Jeśli jesteś typografem, grafikiem lub projektantem, to znasz to pojęcie, a różne rodzaje krojów czcionek widziałeś/aś setki razy. Kerning dla różnych czcionek różnych krojów powinieneś/powinnaś mieć w głowie. Ale czy tak jest? Teraz to możesz sprawdzić!

Kern.me to prosta gra przeglądarkowa pozwalająca użytkownikowi na przesuwanie liter wewnątrz wyrazów, a następnie obliczająca procent zbieżności tak ustawionych znaków z ich rzeczywistym miejscem. Fajna zabawka, wykorzystująca silnik nowych technologii dla www. Świetna rzecz na przerywnik w pracy.

[Przydaś] Konwerter Word -> HTML

14 października 2011

Jakiej jakości kod HTML generuje program Word – każdy wie, ale napiszę to: Fatalnej. A niektórzy Klienci wysyłają treść właśnie w docach/xdocach. Jeśli treść jest skomplikowana (punktatory, zagnieżdżone tabelki, inne bajery) – ręczne przekształcanie takiego dokumentu na HTML jest bardzo czaso/praco/nerwo-chłonne.

Z pomocą przychodzi mała webaplikacja word2cleanhtml.com. Jej działania można się domyślić po nazwie. Może nie generuje on rewelacyjnego kodu gotowego do wstawienia na stronę, ale na pewno oszczędza dużo czasu/pracy/nerwów. Przydaś.

Naprawianie poruszonych zdjęć

12 października 2011

Król w branży, aby się utrzymać, musi co rusz zadziwiać Świat nowymi/nowatorskimi cechami – tak, żeby każdy czuł respekt i nikt go nie zdetronizował. Dokładnie tak „zachowuje się” Adobe Photoshop – Od kilku wersji daje nam niedostępne nigdzie indziej narzędzia, wręcz „magicznie” wykonujące zadania, czasem wydawałoby się – niewykonywalne. Tajemnica leży w zaawansowanych algorytmach obliczeniowych, na które można sobie pozwolić przy dzisiejszych mocach obliczeniowych.

Nowa wersja Photoshopa będzie zawierała bardzo przydatną funkcję – naprawianie poruszonych zdjęć. Jak widać na poniższej prezentacji – działa to bardzo dobrze. Algorytm nie wyostrzy nieostrej fotki (to chyba nawet teoretycznie niemożliwe), ale zdecydowanie poprawi jakość zdjęcia poruszonego. Magia. :)

Arial vs Helvetica

26 września 2011

Szybkie info: Dzięki wykopowi przeczytałem genialny artykuł, a potem zapoznałem się z całym blogiem, na którym został zamieszczony.
Ten artykuł to „<a href=”http://typografia.ogme why not try these out.pl/index.php?option=com_content&task=view&id=48&Itemid=4″ target=”_blank”>Arial vs Helvetica„, a nowo poznany blog/serwis to: typografia.ogme.pl. Polecam.

Adobe popiera HTML5!

1 sierpnia 2011

To się musiało stać, chociaż dziwi mnie, że to właśnie Adobe, właściciel technologii Flash, wypuścił narzędzie – Adobe Edge wizualny edytor HTML5, CSS3 i JS. Na razie to początki, ale dla mnie to wyraźny znak, że flash odchodzi, a na jego miejsce wkraczają nowe technologie.

Humble Indie Bundle 3

26 lipca 2011

Dostępna jest już trzecia edycja pakietu świetnych gier na każdą platformę – The Indie Humble Bundle, w cenie dowolnej (serio – sam ustalasz cenę którą zapłacisz za te 5 gier, a także jej część która pójdzie na różne cele, w tym charytatywne). Sam pewnie kupię teraz, a pogram za rok (albo i później), ale polecam :)

Kartki CSS3

24 czerwca 2011

To taki dodatek do poprzedniego wpisu – bo w tym samym temacie znalazłem podobny materiałs. Oto Pure CSS3 Frame Boxes, czyli świetnie wykonane projekty kartek pojedyńczych lub wielu, z zawiniętymi rogami, przyklejonych w różnych miejscach taśmą, itd. Efekt robi wrażenie, szczególnie gdy uświadomisz sobie, że te grafiki zostały w całości wygenerowane w CSS3… BTW. Czy jest już jakiś wizualny edytor grafiki, który efekt zapisuje w kodzie CSS? :)

Efektowne cienie warstw w CSS

18 czerwca 2011

Nowy CSS umożliwia dodanie każdej warstwie cienia – wewnętrznego lub zewnętrznego, o określonym rozmiarze, natężeniu, kolorze i przesunięciu. Ale już przy minimalnej wyobraźni i stosunkowo niewielkich modyfikacjach w samym kodzie CSS – możemy uzyskać o wiele bardziej efektowne efekty cieni. Udowodnił to w swoim blogu Nicolas Gallagher, opisując dokładnie (acz po angielsku) tworzenie takich wypaśnych cieni i serwując smakowity przykład.

Layer Styles

16 czerwca 2011

Oszukałem Was – przepraszam.

Ale bezwiednie. :) Bo pisząc notkę o Ultimate CSS Gradient Generator (dwie notki niżej) jako o rewelacyjnym narzędzi do tworzenia gradientów css, nie wiedziałem o webaplikacji Layer Styles more info here.

A Layer Styles potrafi o wiele więcej – możesz edytować cień zewnętrzny i wewnętrzny, gradient tła, obwiednię i zakrzywienie rogów. To wszystko ze wszystkimi możliwymi opcjami, z podglądem w czasie rzeczywistym, i w megawygodnej formie przesuwalnego okna efektów, takiego samego jak w Photoshopie. I to jest naprawdę rewelacja. Wygoda, intuicja, szybkość działania. Tego szukamy. :)

Silk – zabawka, czy generator grafiki?

13 czerwca 2011

Wpadłem ostatnio na webaplikację „Silk”, dzięki której można kilkoma kliknięciami i pociągnięciami myszy wygenerować efektowną, kolorową grafikę. Grafika „rysuje się” w ciekawy sposób, podczas której istnieje możliwość sterowania wiatrem (shift+ruchy myszką) a efekt możemy zapisać. Można też powtórzyć animację. Zabawa przednia, przynajmniej na kilka minut. Lubię takie interaktywne dema, pokazują one moc komputerów i Internetu jako narzędzi.

Jednak zastanawiam się, czy grafik wygenerowanych za pomocą „Silka” nie użyć przy projektowaniu stron. A jak wygląda sprawa praw autorskich? Co prawda pierwszą kreskę narysowałem ja, ale resztę wykonał algorytm, który zaprojektował twórca narzędzia. Tak czy owak – rzecz ciekawa przynajmniej do obejrzenia.

Rewelacyjny generator gradientów CSS

11 czerwca 2011

Jak wiadomo, tworzenie zaawansowanych gradientów „z palca” nie jest łatwe. Dlatego szukałem dobrego generatora. I w końcu znalazłem czego szukałem.

Webnarzędzie do generowania różnorakich gradientów kolorystycznych dla elementów CSS3, ze wszystkimi przydatnymi opcjami i bajerami. Intuicyjne, łatwe w obsłudze, szybkie i skuteczne. Oparte na rozwiązaniach GUI znanych z programów graficznych. Generujące w czasie rzeczywistym kod CSS kompatybilny ze wszystkimi nowoczesnymi przeglądarkami. Umiejące także importować gradient z kodu CSS, a nawet z obrazka. No i posiadające zbiór predefiniowanych  gradientów – rewelacja. Są tam także gradienty z efektem szkła, odbić, gładkie delikatne przejścia kolorystyczne (trudne do uzyskania i „wyczucia”) itp. cuda. Można także zapisać swoje gradienty.

Zdecydowanie przyda się każdemu tworzącemu nowoczesne strony WWW.

Ale o czym mowa? O narzędziu Ultimate CSS Gradient Generator. Polecam.

Nietypowe kształty w CSS

10 czerwca 2011

Nowa generacja języka CSS daje nam bardzo dużo możliwości – między innymi generowanie różnych kształtów boksów za pomocą jedynie kodu CSS. Możliwości jest naprawdę wiele – od prostokątów, rombów, równoległoboków, poprzez koła, elipsy, różnorakie trójkąty, wielokąty, gwiazdy, do kształtu kropli, symbolu nieskończoności lub innych (nawet wymyślnych) kształtów.

Dzięki tym (i innym nowym) możliwościom nowego CSS (i HTML5) – tworzenie stron staje się bardziej programowaniem niż projektowaniem. Ale to temat na inny wpis :)

Wracając do tematu: Jak na razie znalazłem dwa miejsca gdzie opisane są przykłady tworzenia nietypowych kształtów. Jedno z nich to odpowiednia sekcja niezawodnego kursu HTML  i CSS Pawła Wimmera. Drugie źródło, o nieco innej formie i podejściu – to The Shapes of CSS – Wpis na stronie css-tricks.com. Treść obu tych źródeł każdy szanujący się webmajster powinien sobie przyswoić w stopniu znacznym. ;)

Wyostrzanie obrazków w PHP

11 maja 2011

Gdy za pomocą biblioteki graficznej GD, skalujemy w PHP obrazek w dół – staje się on po prostu nieostry. Jeśli dodać do tego kompresję JPG (która często dla miniaturek ustawiana jest na sporą wartość) – mamy mdłą miniaturkę, niezachęcającą do kliknięcia w nią tak jak powinna zachęcać. Czy jest na to sposób? Owszem – wystarczy przed zapisaniem miniaturki wyostrzyć ją. Początkowo chciałem taki skrypt sam napisać, ale przerosło mnie to. Zatem, po kilkudziesięciu minutach googlowania – znalazłem działające rozwiązanie, tutaj: adamhopkinson.co.uk/blog/2010/08/26/sharpen-an-image-using-php-and-gd

A na bloga wklejam, bo może komuś oprócz mnie też się przyda… Jeśli znasz podobne rozwiązania/tricki, śmiało daj znać w komentarzu.

(Obrazek zapożyczony z docelowego linku)

3 sprawdzone generatory przycisków CSS3

4 maja 2011

(Mały trick na początek, z tych oczywistych: To, że są to generatory przycisków, wcale nie oznacza, że można je stosować tylko do generowania przycisków. :) Przecież wystarczy w niewielkim stopniu zmienić kod, a można stworzyć np. bardzo ładne pole tekstowe lub boks na treść…)

W momencie, gdy większość nowoczesnych przeglądarek obsługuje już nowe definicje CSS3, ich użycie zaczyna nabierać sensu. A jest w czym wybierać.
Poprzednio było tylko jednokolorowe tło, ramka, definicja kroju czcionek i jego atrybutów. Teraz dochodzą: dowolne gradienty tła, cienie lub poświaty zewnętrzne lub/i wewnętrzne, dowolny krój czcionek (dla samej czcionki również cienie/poświaty), zaokrąglenia, przekrzywienia, obracanie, a do tego jeszcze animacje (transitions) przy przejściu do/do róznych stanów przycisków. Aż trudno wymyślić coś więcej…

W takiej mnogości opcji nie dziwota że zaczęły pojawiać się generatory. Poniżej zaprezentuję trzy dobre generatory przycisków dowolnych elementów „boksowych” CSS3. Od dobrego do najlepszego.

Na pierwszy ogień, najbardziej popularny:
CSS Tricks Button Maker
Zalety: Prosty, czysty, czytelny, intuicyjny. Przycisk można stworzyć bardzo, ale to bardzo szybko. Pokazuje podgląd na żywo i ustawianie podstawowych opcji: krój czcionki (tylko trzy do wyboru), wielkość czcionki, margines wewnętrzny, zaokrąglenia, kolory gradientu, tekstu i tła dla stanów aktywnego i naciśniętego.
Czego mu brakuje: Niestety brak mu wielu rzeczy. Przede wszystkim precyzyjnej edycji wartości, poza tym ustalania cienia/poświaty, większej ilości czionek do wyboru, definicji wyglądu gradientu, animacji, gradientów i innych opcji dla stanów aktywnego i naciśniętego…. No i wkurza mnie że np.  cień dla napisu jest „na sztywno” zdefiniowany. Kod żródłowy przycisku otrzymujemy po jego naciśnięciu – wbrew pozorom nie musi to być oczywiste.

Drugi generator, ten już umie więcej:
CSS3 Button Generator
Zalety: Wszystkie opcje widoczne od razu, podgląd w real-time, ustawienia ładnie pogrupowane:  tło, ramki, cienie/poświaty, kolor i wielkość napisu, cienie/poświaty dla napisu, biblioteka gotowych przycisków.
Czego mu brakuje: Brak definicji kroju i atrybutów czcionek, określania jakiegokolwiek wyglądu przycisku w stanie naciśnięcia/po naciśnięciu, suwaki lub nawet zwykłe pola tekstowe byłyby wygodniejsze niż listy select (którymi posługujemy się w przypadku tego generatora) – przez to definiowanie wymarzonego przycisku może potrwać trochę dłużej…

Przypadek trzeci:
DVIA Button Generator (beta)

Zalety: mimo że jeszcze „w betach”, to właściwie wszystkoumiejący. Edycja w zakładkach w osobnym oknie – IMO wygodnie i praktycznie. Definiujemy chyba prawie możliwe wartości na wszystkie możliwe sposoby. Podgląd oczywiście w real-time. Na uwagę zasługuje genialny edytor gradientu, który ja osobiście traktuję jako osobne narzędzie w narzędziu.
Czego mu brakuje:
Jako że beta, potrafi czasem (rzadko ale zawsze) sypnąć błędem. Poza tym denerwujące jest to, że wygląd pseudoklasy :hover i :click projektujemy rozpoczynając od domyślnych ustawień, a nie od projektu określonego dla normalnego wyglądu przycisku. Przydałaby się też osobna edycja ramki na każdej z krawędzi, podobnie dla zaokrągleń narożników.

To tyle na dziś… mam nadzieję że się komuś przydałem.
Gwoli przypomnienia: O (innym, prostszym) generatorze przycisków pisałem już tutaj.

Pomysł na tło – „gazetowe” kropki

28 kwietnia 2011

Bywa tak, że tło strony decyduje o jej atrakcyjności. Jeśli nie mamy na nie pomysłu – z pomocą przychodzą webaplikacje, takie jak Stripe Generator, którego już opisałem.

Ale dzisiaj nie o paskach, a o kropkach – bo spodobała mi się aplikacja Pixelknetes Background Dotter.
Jest to bardzo prosty interfejs umożliwiający stworzenie tła dla strony www ze zmniejszających się kropek (jak w powiększonym druku gazetowym) – w tym z jedną lub dwiema warstwami. Po chwili zabawy można uzyskać bardzo ciekawe, inspirujące efekty. Jedynym minusem jest brak „ludzkiej” wybierajki kolorów – trzeba wpisywać ręcznie kod hex. Ale z drugiej strony co to za grafik który takich kodów nie ma w głowie (a jeśli nie ma – odsyłam do nauki grając w What The Hex).

Moje metody na zmuszenie się do pracy

26 kwietnia 2011

Każdy freelancer to zna – gdy nie ma się nad sobą bicza (szefa), pojawiają się ciężkie godziny „niechceniamisię”. To wbrew pozorom bardzo trudna sprawa, bo zmusić się nie jest łatwo, a gdy na siłę zmusimy się bez chęci do pracy nad projektem częściowo artystycznym – będziemy podczas jego realizacji iść na skróty, co wpłynie zdecydowanie ujemnie na jego jakość.

Może Ameryki nie odkryję, ale pomyślałem, że wymienię tu kilka moich sposobów na takie chwile. Zrobię to choćby sam dla siebie.

Tak więc, gdy nie możesz się się przemóc, wykonuj następujące czynności (od najbardziej do najsłabiej działającego):

  1. Odpuść. Na 15-30 minut rób coś innego. Nie – nie coś „trochę innego” ale coś całkowicie innego. Im bardziej odległą czynność od Twojej niechcianej pracy będziesz robił(a), tym szybciej zachce Ci się pracować nad tymże niechcianym zadaniem. Zatem, najlepiej, odejdź od komputera, znajdź sobie czynność jak najbardziej „odcyfrowioną”. Obierz ziemniaki na obiad albo pogap się przez okno na pracę mechaników w zakładzie naprzeciwko (u mnie to działa rewelacyjnie, szczególnie jak się kłócą z jakimś ich klientem ;)).
  2. Pomarz sobie. Pamiętasz jakie fantazje miałeś/aś jako dziecko? To było coś! Spróbuj to przywołać, pomarzyć o czymkolwiek – na maksa popuścić wodze wyobraźni i po prostu puścić się na głębokie wody świata w którym absolutnie wszystko jest możliwe. 5 minut takiej sesji znakomicie relaksuje i pobudza chęć pracy.
  3. Wizualizuj. Masz zrobić projekt? Dobrze. Odejdź od komputera, połóż się na wznak i zrób go w myślach. Krok po kroku, w jak największych detalach. Zobaczysz, że w pewnym momencie nie będziesz mógł/mogła się powstrzymać od zasiądnięcia do realnej pracy, tym razem z przyjemnością.
  4. Rozdrobnij się. Wiem że to może wbrew wszystkim szkołom motywacji, ale u mnie to działa. O co chodzi? Otóż każdy ma mnóstwo małych spraw do uprzątnięcia/posegregowania/dokończenia itp. Takie małe prace „głupiego”. Zamień się na chwilę w pedanta i poukładaj i podokańczaj te małe sprawunki. Mój umysł takimi drobnostkami w niewiadomy sposób nakręca się do pracy nad większym dziełem. Może u Ciebie to też zadziała?
  5. Przyśpiesz sobie tętno. To oczywiste, powtarzane w wielu mądrych publikacjach. Zamiast zmuszać się do wysiłku psychicznego – zmuś się do fizycznego. Po chwili pojawi się niechęć do pracy fizycznej, i chęć pracy psychicznej. :)
  6. (gdy już nic nie działa a termin jutro) Zafunduj sobie krótką drzemkę. Max 40 minut. Nawet jeśli nie zaśniesz, zmuś się do leżenia przez ten czas z zamkniętymi oczami. Po wstaniu praca powinna przyjść łatwiej
  7. Rozruszaj umysł. Zadaj sobie stosunkowo skomplikowane zadanie matematyczne i spróbuj rozwiązać je w myślach. Albo postaraj się bez żadnych pomocy przetłumaczyć na obcy (znany Ci) język sens bardzo skomplikowanego, branżowego zdania. Po kilku takich operacjach mózg będzie zmęczony ciężką pracą i uzna za odpoczynek pracę, której wcześniej nie chciał wykonywać.
  8. Napisz wpis na bloga o Twoich metodach na zmuszenie się do pracy ;)

12 ładnych (?) szablonów

12 kwietnia 2011

Na moim blogu dawno nie prezentowałem moich dziełek. Co prawda przewijają się po lewej, ale ktoś mógłby przegapić, więc nadrabiam – poniżej przedstawiam kilkanaście stosunkowo nowych projektów mojego autorstwa, które mi się najbardziej podobają. Co sądzicie?

Po więcej – zapraszam na GRX.pl.

BTW – zapraszam też do zapisania się do newslettera na GRX.pl – http://www.grx.pl/newsletter.php – dzięki temu będziesz otrzymywać informacje o każdym nowym szablonie.

Google Web Fonts z polskimi znakami

2 kwietnia 2011

Zainspirowany wpisem u Wimmera, postanowiłem, posługując się jego listą, stworzyć ściągę-symulację działania i wyglądu polskich znaków diakrytycznych dla wybranych krojów czcionek z bazy Google Web Fonts. Może komuś się przyda.

http://uranik.pl/GoogleWebFontsPL.html

Gra muzyczna w Eska Rock

25 marca 2011

Eska Rock udostępniła świetną grę flashową, w której odgaduje się nazwę zespołu i nazwę kawałka po usłyszeniu tegoż kawałka lub po zobaczeniu fragmentu zdjęcia zespołu. Wciąga niesamowicie, polecam! :)

Ten blog zaczyna migrować w tematykę zbyt rozrywkową… ale spokojna głowa, mam plan jak przywrócić go na właściwe tory…

Najprostsza interakcja ze stroną www

10 stycznia 2011

… to jej przewijanie. Po prostu.

A niektórzy twórcy stron www potrafią tę funkcję niesamowicie kreatywnie wykorzystać.

Było już o stronie ze spływającą farbą.

Dzisiaj coś nowego: benthebodyguard.com. Tutaj przewijanie sprowadzono do postaci całej animacji. Świetny pomysł, skutecznie zachęca do oglądnięcia całej strony. Dodatkowo teksty w „chmurce” głównego bohatera służą informacyjnie.

I jeszcze jedno znalezisko w tym temacie, dzięki freszkomnikebetterworld.com – strona przewija się niejako „wielowarstwowo” – można przewijać tradycyjnie, ale lepszy efekt daje klikanie w kropki nawigacyjne po prawej stronie. Ogląda się świetnie.

Najlepsze webaplikacje roku 2010

3 stycznia 2011

Krótko, treściwe, obiektywne i konkretne zestawienie. Na pewno będę użytkownikiem co najmniej 3 z tej dziesiątki.

The Humble Indie Bundle 2

15 grudnia 2010

(tylko szybka depesza)
Jak donosi Kosciak, powstała druga część inicjatywy sprzedaży pakietu dobrych (i barrrdzo grywalnych) gier za kwotę, którą ustalasz Ty. Na tej stronie za dokładnie tyle, ile dasz, możesz zakupić 5 super gier na długie zimowe wieczory (i noce, i poranki, i dnie :)). Polecam.

Minecraft

21 listopada 2010

Na co dzień nie jestem typem gracza. Poza grami z serii „Cywilizacja” (które uwielbiam i wszystkie części przeszedłem wielokrotnie) i poza sporadycznymi pojedynkami w „Need for speed” z moją Żoną – nie gram w nic i raczej nic mnie do gier nie przyciąga.

Jednak kilka tygodni temu, wiedziony nudą jaka mnie dopadła, i zaciekawiony filmikiem znalezionym na Wykopie (do obejrzenia poniżej), zarejestrowałem się i kupiłem konto do wersji alpha (!) gry Minecraft. Zagrałem i… wsiorbało mnie na całego.

Nigdy wcześniej nie grałem w taką grę. Wydaje się bez sensu – jesteś sam, nie masz przeciwników, masz nieskończoną liczbę żyć… słowem: gra bez celu. Tym, co tak wciąga jest sam świat gry – nieskończony, bardzo urozmaicony, wciąż rozbudowywowany i, co najlepsze – taki, który możesz bez końca eksplorować i rozbudowywać. Klimatu nie da się do końca opisać – jest to po prostu PRZYGODA.
Jak dla mnie rewelka.

Jeśli nie okaże się to słomianym zapałem – ta gra będzie mi towarzyszyć przez jakiś czas. Z Minecraftem związane jest bardzo wiele ciekawostek i możliwości. Przez jakiś czas chciałem założyć specjalny blog, ale po co, jeśli mam ten. :) Zatem założę specjalny tag i być może będę publikował minecraftowe wpisy.

8-bitowe, pikselowe życie w realu

10 listopada 2010

Z (nowej) serii „lubię_to” – pikselowate przedmioty dnia codziennego.

Na początku znalazłem krawat prawdziwego 8-bitowca:

… a do kompletu fajna maska na bal przebierańców:

potem żona podrzuciła mi jeszcze linka z zegarkiem w podobnym stylu:

… a potem połknąłem bakcyla szukałem już sam. Znalazłem wieszak/uchwyt:

… rękawicę kuchenną:

… genialne oprawki okularowe:

… śmietnik (co prawda papierowy, ale wygląda cool):

… pudełko z „bonusami”:

… i nie tylko przedmioty. Rewelacyjny makijaż:

A na koniec akcent ślubny – oryginalne zaproszenie:

…figurki na tort:

… i bukiet ślubny:

… i na dzisiaj to tyle 8-bitowych smaczków.
Więcej już niedługo!

Gra w HTML5

7 listopada 2010

<a href=”http://www.phoboslab simvastatin price.org/biolab/”>Jeszcze jedna zaległość, którą chciałem opublikować: Grywalna i nawet wciągająca gra, napisana w całości w HTML5 (plus javascript oczywiście). Może szaef Apple’a ma trochę racji, mówiąc że flash nie będzie już potrzebny… Zapraszam do gry :)

25 narzędzi dla użyteczności stron www

4 listopada 2010

Na blogu Hongicat.com jakiś czas temu znalazłem listę 25 narzędzi poprawiających użyteczność stron internetowych. Przynajmniej połowa z nich jest zdecydowanie warta uwagi. Prawdopodobnie niektóre narzędzia omówię w przyszłości na stronach bloga…

Układ okresowy tagów HTML5

2 listopada 2010

Ciekawy sposób na przedstawienie elementów HTML5 – w postaci układu okresowego pierwiastków tagów zastosowano na stronie joshduck.com/periodic-table.html. Tagi podzielone są na kategorie, a każdy element ma swój opis – widoczny po kliknięciu. Podoba mi się to, świetnie zrobione. :)
Można także przetestować dowolną stronę, dzięki czemu podświetlone zostaną wszystkie elementy html5 na niej użyte.

Znalezione na Wykopie, jak zwykle podczas porannej poniedziałkowej kawy :)

Favikony świata

1 listopada 2010

Ciekawostka webmasterska – na podstawie danych z Alexy stworzono „mapę” przedstawiającą popularność światowych serwisów internetowych miarą powiększenia ich faviconek. Fajna rzecz. A tu można browsować i wyszukiwać :)

Za darmo dla projektów komercyjnych

13 września 2010

W Sieci można znaleźć bardzo dużo darmowych materiałów dla webmasterów, webdesignerów, webdeveloperów i tym podobnych osób – wystarczy znać choć trochę język angielski i wpisać w google.com „free templates” lub „free icons” lub „free whatever”. Jednak w przypadków większości tak znalezionych freebiesów jest jedno duże ale: można używać do woli, ale tylko na potrzeby własne/niekomercyjne. Licencja w takich przypadkach nie pozwala na użycie takiego elementu, pobranego za darmo, na stronie projektowanej i sprzedawanej Klientowi, lub chociażby takiej, która zarabia (w ten czy inny sposób). Ograniczenia są też często innego rodzaju – możesz użyć gdzie chcesz, ale musisz umieścić info o autorze lub link do jego strony.

Na szczęście są też (rzadkie, ale są) przypadki miejsc w Sieci, które pozwalają na pobranie materiałów wyzbytych powyższych ograniczeń. Postaram się od dziś publikować takie linki na blogu. Szukaj ich pod tagiem darmowe_dla_komercyjnych (wiem że głupia nazwa tagu, jak wymyślę inną, bardziej chwytliwą i krótszą – podmienię. :)

Zatem – jako się rzekło – dziś pierwsze dwa linki tegoż typu:

andreasviklund.com/templates/kilkanaście szablonów stron (niższego lotu, ale znajdzie się kilka perełek), z którymi możesz robić dokładnie to co chcesz – także używać w projektach komercyjnych. Autor – Andreas Viklund  – prosi o pozostawienie linka zwrotnego (do czego i ja namawiam), ale to prośba, a nie żądanie ani oblig. Wiele osób jednak takiego linka zostawia, o czym świadczy PageRank w/w strony (8). Świadczy to o tym, że warto dać coś społeczności totalnie za darmo.

voooz.com/2010/03/03/free-design-style-templates-for-commercial-use/ – znalazłem jeszcze jeden szablon za free bez ograniczeń. Nie wygląda może rewelacyjnie, ale moje sokole oko widzi, że po lekkim liftingu może to być świetny layout.

CSS3 w Internet Explorer 6

21 sierpnia 2010

Ostatnio bardzo dużo pisze się w Sieci o nowych standardach HTML5 i CSS3. Osobiście cieszę się, że te technologie się rozwijają, ale co do ich szybkiego upowszechnienia – jestem sceptykiem. Dużo kodu jeszcze upłynie, zanim programiści definitywnie przerzucą się na te na-wpół-nowe techniki.
Jednak z drugiej strony CSS3 jest coraz częściej używany i zaczyna się zdarzać, że odwiedzam strony, które z CSS3 korzystają „po całości”, tak jakby nie istniały wcześniejsze wersje języków webowych. W zawiązku z tym jakiś czas temu zastanawiałem się, czy byłoby możliwe napisanie systemu, który jakimś sposobem poprawnie wyświetla definicje CSS3 na przeglądarkach ich nie obsługujących (mam tu na myśli głównie IE6-7). Zrobiłem mały research i okazało się (a jakże), że rozwiązanie tego typu już istnieje – co prawda pozwala na implementację jedynie części dobrodziejstw CSS3 na IE6, ale dobre i to.

Mowa o CSS3 Pie – aplikacji, która za pomocą odpowiedniego pliku .htc pokazuje Explorerowi, jak wyświetlać nowe style. Mowa o zaokrągleniach rogów boxów, obsłudze cienia i gradientów  w tle – czyli o najważniejszych funkcjach. Moim zdaniem – ewenement i rzecz bardzo w dzisiejszych czasach przydatna. Dlatego ląduje na tym blogu.

Darmowe szablony dla WWW na GRX.pl

14 lipca 2010

Śpieszę poinformować, że na stronę www.grx.pl powrócił dział z totalnie darmowymi szablonami dla stron WWW. Znajduje się on pod adresem: http://www.grx.pl/darmowe-szablony.php. Zapraszam do korzystania!

Jak stworzyć PDF ze strony WWW?

24 czerwca 2010

Można zrobić zdjęcie strony, edytować je w jakimś programie graficznym i zapisać jako PDF… ale to będzie po prostu obrazek zapisany w dokumencie PDF, podczas gdy  sieciowa aplikacja pdfmyurl.com po prostu konwertuje stronę WWW do pliku PDF.

Wygenerowany plik PDF nie jest idealny – gdzieniegdzie „odstają” gradienty i nie „chwyta” wstawek flashowych… ale za to wszystkie teksty są zaznaczalne i edytowalne. Ta webaplikacja na pewno zasługuje na wzmiankę, toteż to robię. ;)