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

Wpisy otagowane ‘rozwiązania’

Clippy – narzędzie do tworzenia kształtów

piątek, 18 Styczeń 2019

Clippy to wdzięczna nazwa dla bardzo przydatnego narzędzia, które jest kreatorem wizualnym kształtów/masek generującym za pomocą polecenia css clip-path (i odpowiednich prefixów) kod kształtu. Potrzebne, używane, zapisane w ulubionych.

Wycinanie tła

poniedziałek, 10 Grudzień 2018

Jakiś czas temu opisywałem już webappkę Clippingmagic, która wycina tło.
Ta opisywana teraz webappka – Remove.bg – jest jednak o trochę lepsza, choć nie idealna (gdy tło jest różnorodne i kolorystycznie zbliżone do obiektu wycinanego – raczej nie działa). Nic nie zastąpi ręcznego szparowania w fotoszkopie, ale zawsze warto adres remove.bg znać. Może kiedyś się do czegoś przyda…

Style dla map Google

sobota, 18 Sierpień 2018

Snazzymaps.com umożliwia stylowanie map googlowych. Można w zasadzie dopracować mapę tak, żeby była dokładnie w stylu strony na której jest prezentowana. To tyle – tylko tyle i aż tyle :)

Fancybox pozamiatał wszystkie lightboxy

piątek, 18 Sierpień 2017

To zdarzyło się już dawno temu, ale pomyślałem że warto to mieć na blogu. Otóż jakiś (długi) czas temu porównałem kilka óczesnych rozwiązań overlayerowych dla stron www.
Dzisiaj król jest tylko jeden, a jego nazwa to Fancybox. Ten magiczny skrypcik potrafi w zasadzie wszystko co mógłby potrafić. Jest świetny.

Jak najszybciej znaleźć ikonę? Nabazgrać!

środa, 12 Kwiecień 2017

Gugiel wybuścił dziś nową apkę webową – autodraw. Pomysł jest prosty – algorytm bada co bazgrzesz, zgaduje ostateczny kształt i czasie rzeczywistym proponuje gotowe ikony – ładne i równe szkice zamiast Twojego bazgroła. Działa to bardzo dobrze:

Ale ja widzę genialne zastosowanie dla grafików/projektantów. Ile razy traciłeś cenne godziny minuty żeby odnaleźć ikonkę? Wpisujesz w wyszukiwarkę ikon (tą czy inną) tagi, synonimy szukanego słowa itp. To trwa. A tak – Google Autodraw, maz-maz – i odnalezione!
Googlu, kolejny raz przedłużasz mi życie! ;)

Sposób na testowanie mobilnych www

czwartek, 23 Lipiec 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?

Isotope

środa, 3 Grudzień 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

czwartek, 20 Listopad 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

niedziela, 2 Listopad 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

wtorek, 7 Październik 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.

Justowanie wszystkich linii

piątek, 25 Lipiec 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…?

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

sobota, 15 Luty 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

środa, 1 Styczeń 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

wtorek, 20 Sierpień 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

niedziela, 28 Lipiec 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ć.

Obrazek w kodzie strony

środa, 26 Czerwiec 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ą.

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

poniedziałek, 10 Czerwiec 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 :)

Ikonowy krój czcionek – Awesome!

poniedziałek, 21 Styczeń 2013

Kolejne rozwiązanie przyspieszające prace nad wszelkiego rodzaju panelami, podstronami ustawień (i nie tylko). Genialne w swojej prostocie – krój czcionek będący po prostu ikonkami. Rewelka, bo ikony wyświetlane w ten sposób są skalowalne, cieniowalne itp – można z nimi robić w przeglądarce dokładnie to, co ze zwykłym tekstem. A dzisiejsze technologie przecież umożliwiają implementację dowolnego kroju czcionek na stronie… Nic tylko korzystać.

Ikonek w Awesome Font są setki, jeśli nie tysiące. Jeśli nie znalazłeś/aś poszukiwanej ikonki – poszukaj jeszcze raz, na pewno gdzieś tam jest.

Tajemnicą dla mnie jest, jak autoarzy wykonali animowaną (!!!) czcionkę… postaram się to zgłębić, a na razie  – polecam.

Filtrowanie obrazków w locie

środa, 16 Styczeń 2013


CanvasQuery jest biblioteką dla elementu HTML5 ‚Canvas’, która pozwala na stosowanie z jQuery. Umożliwia stosowanie różnych metod manipulacji na grafikach, przeznaczonych co prawda dla developerów gier, ale moze webdesignerzy też coś z tym zrobią… Można na przykład w locie zapodać efekt grafiki z C64 :)

Na stronie CanvasQuery znajdziemy full-wypas rozpiskę, jak stosować tą sztuczkę, gdzie stosować, oraz wdrożenia popularnych efektów.

Fajna sprawa – zerknij na demo, aby się przekonać. ;)

Typo-efekty

niedziela, 30 Grudzień 2012

Nie wiem jakim cudem dopiero teraz „wpadłem” na ten generator… no ale cóż, tak już jest, Internet jest wielki. Jako uzupełnienie do wpisu o innej, podobnej webaplikacji:

Typoeffects.com to witryna z dwoma rewelacyjnymi generatorami grafik składających się ze słów. Mamy opcję generatora ascii-art, lub napisów ułożonych w kształt obrazka. Opcji i ustawień pracy generatora jest bardzo dużo, a efekty często są po prostu powalające. Warto zajrzeć, chociaż po to żeby się pobawić…

Pokaz animacji CSS

środa, 17 Październik 2012

Wiem że zaczynam być nudny w tym temacie, ale to trzeba zobaczyć, aby wyobrazić sobie możliwości. Google opracował prostą prezentację ukazującą wszystkie podstawowe możliwości animacji i ruchu realizowanego za pomocą HTML5, CSS3 (no i JS, SVG, WebGL). I (prawie) wszystko staje się możliwe… tylko czekać na jakiś profesjonalny edytor takich animacji…

Konwerter fontów TTF do EOT

środa, 26 Wrzesień 2012

Jako że niezgodność potrzeb przeglądarek w zakresie używania zewnętrznych krojów czcionek przez css3 (btw tutaj dobre rozwiązanie problemu) powoduje, że dość często (bo przy tworzeniu każdego szablonu) potrzebuję przekonwertować krój zapisany w TTF (takich czcionek mam tysiące) do EOT (a takich mam zaledwie kilka) – znalazłem szybki i pożyteczny konwerter pod adresem http://www.kirsle.net/wizards/ttf2eot.cgi . Używam już kilka miesięcy z powodzeniem, zatem polecam.

GDrive – dysk wirtualny od Google

wtorek, 24 Kwiecień 2012

Czekałem na to chyba ze dwa lata. Myślałem już że to legenda, że Google nie stworzy swojego dysku chmurowego…. no i dziś wystartował Google Drive ! :) Duży, stabilny, tani, przejrzysty system plików od Google, który prawdopodobnie będzie moim docelowym siedliskiem. Za $5 miesięcznie (czyli za około 16 zł miesięcznie) planuję zakup 100GB dysku i powolne przesiadanie się (w całości) z dysku stacjonarnego na wirtuala.
Mimo marudzenia wielu użytkowników, mnie firma Google przekonuje do siebie bardzo. Wszystkie jej produkty są dopracowane, solidne, polityka i regulaminy jasne i przejrzyste.  W przeciwieństwie do innych firm – w GDrive nie będę bał się trzymać żadnych danych.

Nabiera też sensu mój (na razie tworzony w głowie) projekt stworzenia zaawansowanej strony www od podstaw bez użycia desktopowych aplikacji. Już niedługo!

Klikalna mapa polski w jQuery

czwartek, 12 Kwiecień 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.

Jak działa nasz demotywator?

poniedziałek, 26 Marzec 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

Sprawdzacz headerów

poniedziałek, 19 Marzec 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

sobota, 17 Marzec 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ś. :)

ColorHexa – kolorystyczny kombajn

sobota, 25 Luty 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

poniedziałek, 13 Luty 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 :)

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

czwartek, 26 Styczeń 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

środa, 28 Grudzień 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

czwartek, 24 Listopad 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:)).

PNEB: wirtualny hipermarket 3D

środa, 16 Listopad 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]

poniedziałek, 14 Listopad 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

piątek, 4 Listopad 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

czwartek, 27 Październik 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ć.

[Przydaś] Konwerter Word -> HTML

piątek, 14 Październik 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ęć

środa, 12 Październik 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. :)

Kartki CSS3

piątek, 24 Czerwiec 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

sobota, 18 Czerwiec 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

czwartek, 16 Czerwiec 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. :)

Rewelacyjny generator gradientów CSS

sobota, 11 Czerwiec 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

piątek, 10 Czerwiec 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

środa, 11 Maj 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)

Moje metody na zmuszenie się do pracy

wtorek, 26 Kwiecień 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 ;)

Google Web Fonts z polskimi znakami

sobota, 2 Kwiecień 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

CSS3 w Internet Explorer 6

sobota, 21 Sierpień 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.

Kolejne nietypowe wykorzystanie CSS

niedziela, 13 Czerwiec 2010

Uwielbiam takie zabawy, kojarzy mi się to z kombinowaniem amigowym (typu „jak to podłączyć żeby działało„), scenowym (przerabianie rutynki milion razy, żeby wycisnąć więcej klatek), albo haxorowym/phreakingowym („ej! przecież do tego możemy użyć jeszcze mocy obliczeniowej procesora stacji dyskietek i drukarki!„).

Ale do rzeczy: Pod tym linkiem jest strona prezentująca zwykły tekst… ale zaraz, zaraz. Czy zwykły? A jeśli go zaznaczymy? :) Takie porno dla ubogich ;)

Jak znaleźć odpowiedni krój czcionek?

środa, 9 Czerwiec 2010

Temat przewija się już któryś raz, ale tym razem droga do rozwiązania jest nietypowa, choć nieco schematyczna:

Nietypowe wykorzystanie CSS

piątek, 15 Styczeń 2010

Jestem i zawsze byłem fanem nietypowych, oryginalnych i niepowtarzalnych projektów, wykonywanych przy użyciu powszechnych technologii. Takie twórcze pomysły (jak na przykład ten, prezentowany jakiś czas temu na Subiektywie) bardzo mnie motywują.

Poniżej przedstawiam przykład ciekawego wykorzystania CSS w celu zaprogramowania interaktywnej animacji. Pomysł jest bardzo prosty (chociaż wykonanie żmudne i pracochłonne), a efekt moim zdaniem powala. Powtórzmy: Żadnego Javascriptu, tylko HTML i CSS (najedź na poniższe zdjęcie aby zobaczyć efekt):

http://www.romancortes.com/ficheros/meninas.html
Zdaję sobie sprawę że dla niektórych to odgrzewany kotlet – ten link pojawił się na Wykopie już jakiś czas temu – jednak chciałem po prostu to mieć na swoim blogu ;)