RDFa: bring some meaning to your site!

If you’re wondering how to make your site look better in Google’s search result page you are in the right place.

You have probably seen all these fancy recipes, that are available through Google. You can have that kind of attractive links to your site too. How to do that? Let the search engine (SE) understand what is the actual meaning of the information you have on your site. We will use RDFa for this purpose.

So the thing you need to do to help SE understand your site is mark specific type of information. For example if your site contains some information about certain people:

<div>
Mr. Bob Henderson is the CFO of Fiction Ltd. Friends call him Bob.
</div>

There is a huge amount of valuable information in these short sentences. For now, this information is not explicitly visible to SE.

<div xmlns:v="http://rdf.data-vocabulary.org/#" typeof="v:Person">
<span property="v:title">Mr.</span> 
<span property="v:name">Bob Henderson</span> 
is the <span property="v:role">CFO</span> of 
<span property="v:affiliation">Fiction Ltd</span>. 
Friends call him <span property="v:nickname">Bob</span>.
</div>

After inserting the code above not only human but also any good SE understands what is the meaning of the key words (like “CFO”, “Bob”) and their relationship to Bob Henderson. The semantic metadata is added in order for the SE to achieve better understanding of information.

This is only the very first step. Some say that it is the hardest step to make, but you should judge that on your own after studying these:

• Google’s information about rich snippets,
• The definition of things we used in the example,
• numerous blog posts about the whole concept.

Enjoy!

Neon lights inspiration

I realized how inspiring neon lights can be.

Maybe it was because I recently watched Ridley Scott’s Blade Runner with it’s extraordinary lighting. Or perhaps it is because of the never ending dark winter in my town allowing neon lights to shine twice as long as usual?

Anyway, look at the pictures:

Pixel Bender Filters and Algorithms (via Professional Papervision3D Book)

This post is an introduction to Pixel Bender and it’s basic capabilities. It has a lot of useful links to other important sites.

Intro Lee Brimlow has two really good video tutorials that will help you get over the hump of learning pixel bender – so I won’t repeat those. Check them out below! Learn Pixel Bender Putting Filters into Flash 10 But in this post, I’ll give you a ton of pixel bender filter algorithms and programs. Keep in mind pixel bender is extremely easy to use and extremely easy to learn!!! I once took a filters class, never thought I’d ever use it. I was up … Read More

via Professional Papervision3D Book

Pixel Bender: Blur with Linear Focus (via Pixelero)

Nice, clean and inspiring article about creating interesting effect in Pixel Bender. Truly awesome

An old effect in photography I wanted to check out as a custom shader for Flash 10 Astro – beta version needed for this demo to show correctly: Pixel Bender -bytecode. Pixel Bender -source. LinearBlurFilter.as. It works with three parameters: one float3 for line equation where the picture appears sharp (coefs like in Ax+By+C=0, in the demo there’s two dragable blue blocks to modify that), two scales for the blur radius, in parallel and perpendicu … Read More

via Pixelero

Pixel Bender tutorial: circular blur shader

There is one particular thing missing in the standard AS3 filters library. The circular blur filter. That kind of a filter would surely come in handy if you wanted to animate rotating elements. If it’s not there, then we have to implement it ourselves. Using Pixel Bender.

What should be the input data of our shader?

• First of all the image to process.
• Then we must know where is the center of our circular blur.
• It would be nice to know the blur level.
• Since our effect will be used along with animation we should also know the rotation’s direction.

Wymiar fraktalny

Kiedy zaczynałem się uczyć o fraktalach zawsze, gdy wspominałem ich definicję, wpadałem w pewną konsternację . Definicja to coś co jest jasne, spójne, jednoznaczne. Jednak definicja fraktala (za Wikipedią) jest taka:

[...] zbiór, który:

• ma nietrywialną strukturę w każdej skali,
• struktura ta nie daje się łatwo opisać w języku tradycyjnej geometrii euklidesowej,
• jest samo-podobny, jeśli nie w sensie dokładnym, to przybliżonym lub stochastycznym,
• jego wymiar Hausdorffa jest większy niż jego wymiar topologiczny,
• ma względnie prostą definicję rekurencyjną,
• ma naturalny (“poszarpany”, “kłębiasty” itp.) wygląd.

Na pierwszy rzut oka nic nie jest tutaj jednoznacznie określone. Wszystko opiera się na intuicji. Może oprócz punktu piątego.

Tutorial: Komunikacja Flex – php – MySQL poprzez ZendAMF

W jednym z poprzednich postów opisałem jak można się komunikować z php poprzez klasę LoadVars w actionscript 2.0. Szczerze mówiąc jest to trochę pokraczny sposób komunikacji. Komunikacja poprzez AMF (Action Message Format) jest dużo wygodniejsza i zapewnia większą przejrzystość kodu. Poprzez AMF nie przekazujemy sobie żadnych Stringów ani dokumentów XML ale całe obiekty.

Ten tutorial jest poświęcony Flexowi, ale oczywiście da się to zrobić i dla aplikacji flashowej (będzie to pewnie pokazane w kolejnej notce).

Zrobimy sobie prosty komponent będący po prostu listą linków, którą można zamieścić na stronie internetowej. Lista linków będzie pobierana z bazy danych.

Tutorial Flash i PHP oraz MySQL w AS 2.0

Dzisiaj krótki opis tego jak połączyć te trzy technologie. Dlaczego akurat te trzy? Bo tak naprawdę Flash jest fajny a php i MySQL są za darmo

Komunikacja przebiega w kilku etapach:

1. Flash wysyła żądanie do skryptu php.
2. Skrypt php łączy się z bazą danych MySQL i wysyła do niej zapytanie w SQL.
3. Baza zwraca wynik do skryptu.
4. Skrypt generuje z wyniku dane w formacie strawnym dla Flasha.
5. Flash odczytuje dane i je wyświetla.

Flash CS4: problem ze skalowaniem i obrotem 3D

Kiedyś miałem do zrobienia małą animację, która miała polegać na obrocie obrazka wokół osi Y (w trójwymiarze). Obrazek oczywiście wcześniej było trzeba zeskalować. Właściwie była to moja pierwsza styczność z nowymi możliwościami Flasha CS4 co do trójwymiaru. Więc kod, który służył do skalowania i obrotu wyglądał tak:

obrazek.scaleY=0.6; //         skalowanie
obrazek.scaleX=0.6; //         skalowanie
TweenLite.to(obrazek, 3, {rotationY:360, ease:Strong.easeIn});
// animacja polegająca na zmianie atrybutu rotationY
// wykorzystuje GreenSock TweenLite

Wydaje się to wszystko bezproblemowe: zmniejszam obrazek i obracam. Tak to wygląda w przeglądarce.

Fajne, ale czemu w ogóle o tym piszę? Bo kiedy w środowisku Flasha kliknę “Test movie” wyświetlane jest to inaczej! Tak samo jak wtedy, gdy Flash Playerem otworzę plik swf znajdujący się u mnie na dysku, albo uruchomię plik Windows Projector z tą animacją. Wtedy podczas obrotu wokół osi Y obrazek skaluje płynnie się do swojej początkowej wartości scaleX (jest analogicznie, kiedy obraca się wokół osi X). O co w ogóle chodzi? Przecież nie zmieniam scaleX!

Czemu inaczej wyświetla w Projectorze i w przeglądarce? Różne wersje Flash Playera? Nie wiem. Ale sprawa skalowana jest z pewnością spowodowana tym, że obiekty są domyślnie we Flashu dwuwymiarowe. Ich pozycja jest opisana macierzą przekształceń liniowych dla 2 wymiarów (w takim wypadku jest to macież 3×3). Obiekt staje się trójwymiarowy wtedy, kiedy np zaczniemy zmieniać jakiś jego atrybut związany z trójwymiarem (np. rotationX). Wtedy macierz dla 2 wymiarów jest przekształcana na taką dla trzech. Do macierzy można się dostać tak:

obrazek.transform.matrix; // macierz dla 2D
obrazek.transform.matrix3D; // macierz dla 3D

Problemem jest to, że nie ustawiliśmy scaleZ. Można go uniknąć wymuszając przejście do macierzy 3D przed skalowaniem. Np. w taki sposób:

obrazek.transform.matrix = null;
// automatycznie tworzy się macierz 3D
obrazek.scaleX = 0.5;
obrazek.scaleY = 0.5;
obrazek.scaleZ = 0.5;
// skalowanie

dokumentacja

Trzeba też pamiętać, że jeżeli chcemy równomiernie powiększać nasz obiekt, to musimy robić to nie tylko za pomocą scaleX i scaleY, ale również scaleZ!

Więcej o macierzach znajdziecie tutaj.

Wykrywanie linii za pomocą transformaty Hough’a

Wykrywanie kształtów na obrazie jest chyba najbardziej klasycznym problemem analizy obrazów. Jednym z najprostszych i zarazem najbardziej użytecznych kształtów do wykrycia są linie proste, które w łatwy sposób można wyznaczyć używając transformaty Hough’a (TH). Swoją drogą Hough czyta się (jak poucza nieoceniona wikipedia) podobnie do angielskiego słowa rough, czyli z grubsza “haf”.