... w naszym laboratorium

Instalowanie template’ów w Joomla 2.5.4

admin — Fri, 04 May 2012 20:47:44 +0000

O ile we wcześniejszych wersjach Joomla nie występowały praktycznie żadne problemy przy instalowaniu templatek – tak w najnowszym, na tą chwilę wydaniu (2.5.4) instalacja nowego szablonu to droga przez mękę. Mówię tu szczególnie o sytuacji, kiedy nowe templatki wrzucamy bezpośrednio na serwer przez FTP czy po prostu kopiujemy sobie na serwer lokalny do katalogu – wcześniej wystarczył taki przerzut i wszystko działało od kopa… a teraz?

Teraz mamy do dyspozycji nową funkcję DISCOVER (Extensions -> Extensions manager -> Discover -> Discover button (górny prawy róg jeśli ktoś nie zauważył), która wykrywa nowe dodatki i pozwala je dodać/zainstalować: buton Install (po uprzednim zaznaczeniu odpowiedniego dodatku). Nie wiem jak funkcja sprawuje się z innymi dodatkami, ale przy dodawaniu nowej templatki wywala się powodując następujące błędy:

Undefined variable: lang in .../libraries/joomla/installer/adapters/template.php on line 543

oraz często

Call to a member function setDebug() on a non-object in /Users/username/Sites/sitename/libraries/joomla/installer/adapters/template.php on line 543

Po czym i tak znajdziemy naszą templatkę w Template Manager … jednak próba jej wybrania kończy się zazwyczaj komunikatem:

There are no styles installed

I tak oto jesteśmy w wielkiej D, z pomocą przychodzą dopiero developerzy J! sugerując następujące zmiany:

Edycja pliku powodującego błąd tj. /libraries/joomla/installer/adapters/template.php, odnalezienie w nim funkcji discover_install() i dołożenie jednego wiersza deklarującego zmienną lang, czyli mamy coś takiego:

...
   public function discover_install()
   {
      $lang = JFactory::getLanguage();
      // Templates are one of the easiest
...

Sprawdzone i działa, przy okazji warto pamiętać o nazewnictwie szablonów ( w templateDetails.xml) – wpisana tam nazwa MUSI bezwzględnie być identyczna jak nazwa folderu, a do tego prawdopodobnie pisana zawsze małymi literkami… ot taki ciekawy wymysł .

SEO: Tytuły stron – najczęstsze błędy.

admin — Mon, 30 Aug 2010 12:37:27 +0000

Jednym z najważniejszych czynników wpływających na pozycję strony w wynikach wyszukiwania, nad którymi mamy kontrolę jest jej tytuł (page title). Niestety często właściciele witryn lub osoby zarządzające nimi nie korzystają z tego prostego i skutecznego sposobu podniesienia rankingu strony popełniając błędy. A jakie to błędy? O tym poniżej.

Czym jest Page Title?

Dla formalności na wstępie wspomnieć należy czym jest tytuł strony, więc do dzieła.
Tytuł strony w języku HTML znajduję się w znacznikach umieszczonych w sekcji <head> strony, prezentuje się to mniej więcej tak:</p> <pre><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"></pre> <pre><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl-pl" lang="pl-pl"></pre> <pre><head></pre> <pre> <base href="http://e13.pl/" /></pre> <pre> <meta http-equiv="content-type" content="text/html; charset=utf-8" /></pre> <pre> <meta name="robots" content="index, follow" /></pre> <pre> <title>Strony i sklepy internetowe - Kraków - strony www :: E13.pl | Strona główna

Powyższy kod w popularnych przeglądarkach wyświetli frazę „Strony i sklepy internetowe – Kraków – strony www :: E13.pl | Strona główna” w co najmniej dwóch miejscach.. na belce przeglądarki u góry i na zakładce (tabie) poniżej pola adresu w przeglądarce. Istotnym jest też fakt, że ta sama nazwa firmować będzie również link do strony w wynikach wyszukiwania w Google i innych wyszukiwarkach.

Po szybkim wstępie dotyczący nazw stron i omówienia miejsca ich występowania przejdźmy do najczęstszych błędów pojawiających się na stronach.

Brak tytułu

Istnieje bardzo duża ilość stron, które nie posiadają tytułu lub używają domyślnego tytułu strony (untitled document czy standardowego tytułu stworzonego przez zainstalowany system CMS). To podstawowy błąd, który nie pozwala na odnalezienie naszej strony w gąszczu informacji, problem z indeksowaniem strony jest znaczny bowiem występują setki jak nie miliony podobnych stron, a użytkownik bez odpowiednich informacji nie znajdzie naszej strony w wynikach wyszukiwania.

Tytuł strony – zazwyczaj zbyt krótki lub zbyt długi

Stworzenie dobrego tytułu to podstawa jak już wspomnieliśmy. Dlatego długość jest tu istotnym elementem, bo kto z nas będzie czytał zbyt długie i zawiłe tytuły? Prosto i konkretnie to jest to co trafia do internautów. Nie można oczywiście popaść w skrajność i tworzyć tytułu z zaledwie kilku słów, ponieważ wtedy ograniczamy znów możliwość sklasyfikowania naszej witryny w Google. Jednak zbyt duża ilość słów wpływa także na zmniejszenie znaczenia poszczególnych wyrazów, tzw. ‘rozcieńczenie’ tytułu. Czym się zatem kierować? Przede wszystkim:

należy brać pod uwagę ograniczenie nakładane przez Google, którego silniki wyświetlają maksymalnie 70 znaków z tytułu strony.
nie należy stosować zbyt wieli słów kluczowych w tytule ponieważ prowadzi to do kanibalizacji (o tym będzie później).
należy pamiętać, że słowo im znajduje się bliżej początku tytułu tym ma większe znaczenie.

Zaprezentujemy tutaj prosty przykład poprawnego konstruowania tytułu strony, na której znajdziemy informację dotyczące naprawy dysku w laptopie Dell. Tytuł wyglądać mógłby zatem następująco:

HOWTO: Jak <strong>naprawić </strong>zepsuty dysk twardy w laptopie <strong>Dell C722</strong>

Mogło by to jednak wyglądać również tak:

<strong>Naprawa</strong> <strong>Dell C722</strong> - zepsuty dysk twardy laptopa

Drugie zestawienie jest krótsze, a ponadto najważniejsze pojęcia, słowa są na początku tytułu. Takie podejście do tytułu da nam nie tylko wyższą pozycję w rankingu, ale jest zarówno bardziej czytelne i proste dla wyszukiwarek i internautów.

„Pożeranie” słów kluczowych

To sytuacja, w której tytuły stron nadziewane są zbyt dużą ilością słów kluczowych. Ta taktyka stosowana przez licznych specjalistów SEO, polega na umieszczaniu bez skrupułów słów, które podwyższą ranking strony ich klientów.
Dobrze pozycjonująca się strona powinna mieć unikalne, niepowtarzalne treści oraz odróżniać się od innych – tymi samymi zasadami powinniśmy kierować się również przy tworzeniu tytułów. Powtarzanie tych samych słów kluczowych na stronach niezależnie od ich zawartości, nie pomoże głównie z dwóch powodów:

Pomimo indeksowania się źle opisanych stron (tytuł napchany słowami kluczowymi) w wynikach wyszukiwania, posiadać będą one wysoki współczynnik odrzuceń, gdyż internauta nie znajdzie na nich informacji, których poszukuje. Wysoki współczynnik odrzuceń powodował będzie coraz niższy ranking strony
Działania takie naruszają jedną z głównych zasad Google: „don’t be evil”.

Używanie nazwy serwisu lub firmy na wszystkich podstronach

Jak wcześniej wspomnieliśmy Google wyświetla tylko 70 znaków danego tytułu strony. Nie oznacza to oczywiście, że nie widzi więcej niż 70 znaków tytułu, dlatego też specjaliści nie widzą problemu w ustalaniu dłuższych tytułów niż ten limit co nie jest najlepszym zabiegiem ponieważ powinno się dobrze zastanowić co ma pojawić się, a co nie w tytule strony.
Wielu właścicieli witryn zwykle umieszcza w tytule nazwę swojej firmy, pomimo, że często są to dość długie wyrażenia. Co więcej, często jest tak, że wspomniana nazwa znajduje się jako pierwsza na każdej podstronie.
Umieszczanie nazwy firmy w tytule strony nie jest konieczne i związane jest z błędami, o których wspominaliśmy wcześniej.
Zasadnym może być jeszcze wyświetlanie nazwy firmy na stronie startowej, na stronie kontaktowej i w informacjach na temat strony, ale należy unikać ich w tytułach innych podstron.

Kopiowanie tytułów stron

Następnym dużym błędem jest kopiowanie tytułów stron. Zachowanie takie utrudnia znalezienie strony w wynikach wyszukiwania co zrozumiałe przekłada się na pozycję strony. Jak wspomnieliśmy wcześniej każda strona powinna być unikatowa, więc logicznie myśląc tytuły stron również powinny takie być.

Webowe karuzele – rozeznanie.

admin — Wed, 03 Mar 2010 19:58:50 +0000

Przesuwane panele z tekstami, zdjęciami, poziomy suwak czy karuzela – ciężko znaleźć polską nazwę na popularne na zachodzie skrypty określane jako: Carousel czy Horizontal slider. Niuansami polskiego języka zajmować się nie będziemy, a czym prędzej zobaczymy jak takie skrypty wyglądają w akcji. Poniżej lista naj.. ciekawszych, prostszych, fajniejszych.. itd. :

http://www.queness.com/post/923/create-a-simple-infinite-carousel-with-jquery – Tutorial, jak zrobić prostą zapętloną karuzele na JQuery.

http://www.agilecarousel.com/examples/jqueryui_example – Bardzo fajna karuzela – również na JQuery. Znakomita pod popularne dzisiaj boksy z aktualnościami (News box’y).

http://sorgalla.com/projects/jcarousel/ - Chyba najpopularniejszy z karuzelowych pluginów opartych na JQuery, prosty, dostępny i świetnie udokumentowany.

http://www.gmarwaha.com/jquery/jcarousellite/index.php – Karuzela o wadze zaledwie 2KB! Wersja Lite funkcjonująca okay.

http://buildinternet.com/2009/03/sliding-boxes-and-captions-with-jquery/ – Bardzo fajne animowane podpisy/slajdy na boksach czy obrazkach. Warto zastostować .

http://bugsoftware.co.uk/jQuery/Flash3DCarousel/ – Efektowna karuzela 3D z dosyć dużymi możliwościami, określonymi w prametrach. Wygląda naprawdę nieźle.

http://www.enova-tech.net/eng/lab/jMyCarousel/1 – Karuzela z przesuwaniem na najazd myszki, klikanie już jest zbędne. Polecamy.

http://basicverbs.com/here-it-is-the-best-jquery-carousel-eva/ – Prosta, ładna .. nic tylko używać.

A przy okazji wykopałem skrypt PHP pozwalający w łatwy sposób dodać odbicia do zdjęć – http://reflection.corephp.co.uk/v3.php

Pliki graficzne – małe kompedium skryptów.

admin — Fri, 26 Feb 2010 13:33:08 +0000

Sieć przepełniona jest różnymi obrazami, zdjęciami, miniaturkami i wszelkiego rodzaju grafiką rastrową, co wymaga od nas – programistów – skryptów zmniejszających, ucinających, modyfikujących te pliki. Zebraliśmy kilka klas i skryptów, które zdecydowanie ułatwiają pracę z obrazkami.

Resize an Image (on the fly) & Keep its Aspect Ratio using PHP and GD

image_to_resize))
{
  exit("File ".$this->image_to_resize." does not exist.");
}

$info = GetImageSize($this->image_to_resize);

if(empty($info))
{
  exit("The file ".$this->image_to_resize." doesn't seem to be an image.");
}

$width = $info[0];
$height = $info[1];
$mime = $info['mime'];

/*
Keep Aspect Ratio?

Improved, thanks to Larry
*/

if($this->ratio)
{
// if preserving the ratio, only new width or new height
// is used in the computation. if both
// are set, use width

if (isset($this->new_width))
{
$factor = (float)$this->new_width / (float)$width;
$this->new_height = $factor * $height;
}
else if (isset($this->new_height))
{
$factor = (float)$this->new_height / (float)$height;
$this->new_width = $factor * $width;
}
else
exit(â€neither new height or new width has been setâ€);
}

// What sort of image?

$type = substr(strrchr($mime, '/'), 1);

switch ($type)
{
case 'jpeg':
    $image_create_func = 'ImageCreateFromJPEG';
    $image_save_func = 'ImageJPEG';
	$new_image_ext = 'jpg';
    break;

case 'png':
    $image_create_func = 'ImageCreateFromPNG';
    $image_save_func = 'ImagePNG';
	$new_image_ext = 'png';
    break;

case 'bmp':
    $image_create_func = 'ImageCreateFromBMP';
    $image_save_func = 'ImageBMP';
	$new_image_ext = 'bmp';
    break;

case 'gif':
    $image_create_func = 'ImageCreateFromGIF';
    $image_save_func = 'ImageGIF';
	$new_image_ext = 'gif';
    break;

case 'vnd.wap.wbmp':
    $image_create_func = 'ImageCreateFromWBMP';
    $image_save_func = 'ImageWBMP';
	$new_image_ext = 'bmp';
    break;

case 'xbm':
    $image_create_func = 'ImageCreateFromXBM';
    $image_save_func = 'ImageXBM';
	$new_image_ext = 'xbm';
    break;

default:
	$image_create_func = 'ImageCreateFromJPEG';
    $image_save_func = 'ImageJPEG';
	$new_image_ext = 'jpg';
}

	// New Image
	$image_c = ImageCreateTrueColor($this->new_width, $this->new_height);

	$new_image = $image_create_func($this->image_to_resize);

	ImageCopyResampled($image_c, $new_image, 0, 0, 0, 0, $this->new_width, $this->new_height, $width, $height);

        if($this->save_folder)
		{
	       if($this->new_image_name)
	       {
	       $new_name = $this->new_image_name.'.'.$new_image_ext;
	       }
	       else
	       {
	       $new_name = $this->new_thumb_name( basename($this->image_to_resize) ).'_resized.'.$new_image_ext;
	       }

		$save_path = $this->save_folder.$new_name;
		}
		else
		{
		/* Show the image without saving it to a folder */
		   header("Content-Type: ".$mime);

	       $image_save_func($image_c);

		   $save_path = '';
		}

	    $process = $image_save_func($image_c, $save_path);

		return array('result' => $process, 'new_file_path' => $save_path);

	}

	function new_thumb_name($filename)
	{
	$string = trim($filename);
	$string = strtolower($string);
	$string = trim(ereg_replace("[^ A-Za-z0-9_]", " ", $string));
	$string = ereg_replace("[ tnr]+", "_", $string);
	$string = str_replace(" ", '_', $string);
	$string = ereg_replace("[ _]+", "_", $string);

	return $string;
	}
}
?>

Użycie:

new_width = 200;
$image->new_height = 200;

$image->image_to_resize = "/home/mysite.com/public_html/images/sunset_wallpaper.jpg"; // Full Path to the file

$image->ratio = true; // Keep Aspect Ratio?

// Name of the new image (optional) - If it's not set a new will be added automatically

$image->new_image_name = 'sunset_wallpaper_thumbnail';

/* Path where the new image should be saved. If it's not set the script will output the image without saving it */

$image->save_folder = 'thumbs/';

$process = $image->resize();

if($process['result'] && $image->save_folder)
{
echo 'The new image ('.$process['new_file_path'].') has been saved.';
}
?>

Cropping a Rectangle Image to Square using GD

source_image);

$width = $info[0];
$height = $info[1];
$mime = $info['mime'];

if($width == $height)
{
echo 'The source image is already a square.';
}
else
{
// What sort of image?

$type = substr(strrchr($mime, '/'), 1);

switch ($type)
{
case 'jpeg':
    $image_create_func = 'ImageCreateFromJPEG';
    $image_save_func = 'ImageJPEG';
	$new_image_ext = 'jpg';
    break;

case 'png':
    $image_create_func = 'ImageCreateFromPNG';
    $image_save_func = 'ImagePNG';
	$new_image_ext = 'png';
    break;

case 'bmp':
    $image_create_func = 'ImageCreateFromBMP';
    $image_save_func = 'ImageBMP';
	$new_image_ext = 'bmp';
    break;

case 'gif':
    $image_create_func = 'ImageCreateFromGIF';
    $image_save_func = 'ImageGIF';
	$new_image_ext = 'gif';
    break;

case 'vnd.wap.wbmp':
    $image_create_func = 'ImageCreateFromWBMP';
    $image_save_func = 'ImageWBMP';
	$new_image_ext = 'bmp';
    break;

case 'xbm':
    $image_create_func = 'ImageCreateFromXBM';
    $image_save_func = 'ImageXBM';
	$new_image_ext = 'xbm';
    break;

default:
	$image_create_func = 'ImageCreateFromJPEG';
    $image_save_func = 'ImageJPEG';
	$new_image_ext = 'jpg';
}

// Coordinates calculator

   if($width > $height) // Horizontal Rectangle?
   {
	   if($location == 'center')
       {
       $x_pos = ($width - $height) / 2;
       $x_pos = ceil($x_pos);

       $y_pos = 0;
	   }
	   else if($location == 'left')
	   {
	   $x_pos = 0;
	   $y_pos = 0;
	   }
	   else if($location == 'right')
	   {
	   $x_pos = ($width - $height);
	   $y_pos = 0;
	   }

       $new_width = $height;
       $new_height = $height;
   }
   else if($height > $width) // Vertical Rectangle?
   {
	   if($location == 'center')
       {
       $x_pos = 0;

       $y_pos = ($height - $width) / 2;
       $y_pos = ceil($y_pos);
       }
	   else if($location == 'left')
	   {
	   $x_pos = 0;
	   $y_pos = 0;
	   }
	   else if($location == 'right')
	   {
	   $x_pos = 0;
	   $y_pos = ($height - $width);
	   }

       $new_width = $width;
       $new_height = $width;

   }

$image = $image_create_func($this->source_image);

$new_image = ImageCreateTrueColor($new_width, $new_height);

// Crop to Square using the given dimensions
ImageCopy($new_image, $image, 0, 0, $x_pos, $y_pos, $width, $height);

if($this->save_to_folder)
		{
	       if($this->new_image_name)
	       {
	       $new_name = $this->new_image_name.'.'.$new_image_ext;
	       }
	       else
	       {
	       $new_name = $this->new_image_name( basename($this->source_image) ).'_square_'.$location.'.'.$new_image_ext;
	       }

		$save_path = $this->save_to_folder.$new_name;
		}
		else
		{
		/* Show the image (on the fly) without saving it to a folder */
		   header("Content-Type: ".$mime);

	       $image_save_func($new_image);

		   $save_path = '';
		}

// Save image 

$process = $image_save_func($new_image, $save_path) or die("There was a problem in saving the new file.");

return array('result' => $process, 'new_file_path' => $save_path);
}
}

function new_image_name($filename)
	{
	$string = trim($filename);
	$string = strtolower($string);
	$string = trim(ereg_replace("[^ A-Za-z0-9_]", " ", $string));
	$string = ereg_replace("[ \t\n\r]+", "_", $string);

	$string = str_replace(" ", '_', $string);
	$string = ereg_replace("[ _]+", "_", $string);

	return $string;
	}
}
?>

Oraz sposób użycia:

source_image = 'my_rectangle_image.jpg';

$crop->save_to_folder = 'square_images/';

/* left, center or right; If none is set, center will be used as default */
$process = $crop->crop('right');

if($process['result'])
{
echo 'The rectangle image ('.$process['new_file_path'].') was cropped.';
}
?>

How to Create Mirror Images using GD

source_image);

if(empty($info)) {
	exit("The file from the requested path doesn't see to be an image");
}

$width = $info[0];
$height = $info[1];

$mime = $info['mime'];

// What sort of image?

$type = substr(strrchr($mime, '/'), 1);

switch ($type)
{
case 'jpeg':
    $image_create_func = 'ImageCreateFromJPEG';
    $image_save_func = 'ImageJPEG';
	$new_image_ext = 'jpg';
	$quality = 100; // best quality
    break;

case 'png':
    $image_create_func = 'ImageCreateFromPNG';
    $image_save_func = 'ImagePNG';
	$new_image_ext = 'png';
	$quality = 0; // no compression
    break;

case 'bmp':
    $image_create_func = 'ImageCreateFromBMP';
    $image_save_func = 'ImageBMP';
	$new_image_ext = 'bmp';
    break;

case 'gif':
    $image_create_func = 'ImageCreateFromGIF';
    $image_save_func = 'ImageGIF';
	$new_image_ext = 'gif';
    break;

case 'vnd.wap.wbmp':
    $image_create_func = 'ImageCreateFromWBMP';
    $image_save_func = 'ImageWBMP';
	$new_image_ext = 'bmp';
    break;

case 'xbm':
    $image_create_func = 'ImageCreateFromXBM';
    $image_save_func = 'ImageXBM';
	$new_image_ext = 'xbm';
    break;

default:
	$image_create_func = 'ImageCreateFromJPEG';
    $image_save_func = 'ImageJPEG';
	$new_image_ext = 'jpg';
}

// Source Image
$image = $image_create_func($this->source_image);

$new_image = ImageCreateTrueColor($width, $height);

// Set a White & Transparent Background Color (PHP 4 >= 4.3.2, PHP 5)
$bg = ImageColorAllocateAlpha($new_image, 255, 255, 255, 127);
ImageFill($new_image, 0, 0 , $bg);

if($flip == 1)
{
   $dst_y = 0;
   $src_y = 0;

   $coordinate = ($width - 1);

   foreach(range($width, 0) as $range)
   {
   $src_x = $range;
   $dst_x = $coordinate - $range;

   ImageCopy($new_image, $image, $dst_x, $dst_y, $src_x, $src_y, 1, $height);
   }
}
elseif($flip == 2)
{
   $dst_x = 0;
   $src_x = 0;

   $coordinate = ($height - 1);

   foreach(range($height, 0) as $range)
   {
   $src_y = $range;
   $dst_y = $coordinate - $range;

   ImageCopy($new_image, $image, $dst_x, $dst_y, $src_x, $src_y, $width, 1);
   }
}

if(isSet($this->save_to_folder))
		{
	       if($this->new_image_name)
	       {
	       $new_name = $this->new_image_name.'.'.$new_image_ext;
	       }
	       else
	       {
$basename = basename($this->source_image);
$new_name = $this->new_image_name($basename).'_mirror.'.$new_image_ext;
	       }

		$save_path = $this->save_to_folder.$new_name;
		}
		else
		{
		/* Set the right header for the image */
		   header("Content-Type: ".$mime);

		   $save_path = '';
		}

// Show/Save image 

if(isSet($quality))
	{
	$process = $image_save_func($new_image, $save_path, $quality);
	}
	else
	{
	$process = $save_path ? $image_save_func($new_image, $save_path) : $image_save_func($new_image);
	}

return array('result' => $process, 'new_file_path' => $save_path);
	}

function new_image_name($filename)
{
		$ext = strrchr($filename, ".");

	if($ext)
	{
	$strlen = strlen($ext);
	$filename = basename(substr($filename, 0, -$strlen));
	}

	$string = trim($filename);
	$string = strtolower($string);
	$string = trim(ereg_replace("[^ A-Za-z0-9_]", " ", $string));
	$string = ereg_replace("[ \t\n\r]+", "_", $string);
	$string = str_replace(" ", '_', $string);
	$string = ereg_replace("[ _]+", "_", $string);

	return $string;
}

}
?>

Całość domyka: http://www.bitrepository.com/image-cropping-with-jquery-mootools-prototype-scriptaculous.html

Zadzwiające przykłady grafiki 3D

admin — Tue, 23 Feb 2010 15:40:32 +0000

Postacie realne i te z kreskówek – wszystkie stworzone niemalże jako realistyczne zdjęcia.
Zapraszamy do chwili relaksu przy pokazie możliwości dzisiejszych programów, a może pokazie możliwości współczesnych grafików? Patrz i podziwiaj.

Jimi Hendrix – The Guitar Legend by Marcin Klicki

Elmer Fudd by Magdalena Dadela

Old Man by Cristian Patrasciuc

Will smith by Mrpeculiar

Mr T by Lee Davies

Jennifer by Jonathan Simard

Wizualizacje – tylko demonstracja nowych technologii czy już sztuka?

admin — Mon, 15 Feb 2010 23:42:32 +0000

Dzisiaj zadziwiające efekty pracy różnej maści zapaleńców – tworzonych technologią rodem z XXI wieku. Piękne i nowoczesne wizualizacje porażają kreatywnością, zresztą tak samo jak znajdujące się na samym końcu dwie strony. Odnośnie wizualizacji, większość z nich powstała dzięki wsparciu darmowego oprogramowania! Zapraszamy do lektury.

Pokaz odbył się w Turcji na głównym budynku Centrum Kultury i Sztuki. Jest to audiowizualny pokaz animowanych monochromatycznych brył – stylizowanych na czworoboczne bloki aluminium. Naprawdę robi wrażenie.

QUADRATURE from Griduo on Vimeo.

Ciekawa instalacja na wyspach stworzona ze wsparciem openFrameworks oraz openCV – wycinamy i przenosimy przechodniów, ot tak!

Hand from Above from Chris O’Shea on Vimeo.

Coś pięknego jest w tej wizualizacji, trwa kilkadziesiąt sekund, a renderowanie scenki praktycznie dobę, ale czyż nie jest miła dla oka?

bubbletrouble_2 from Leander Herzog on Vimeo.

A tak budzi się świat – analiza przeprowadzona na podstawie wpisów na Twitterze. Zielony kolor to tweety z wczesnego rana, pomarańczowy około 9 rano.. i tak dalej. Czarne bloki nie są określone czasowo. Piękna wizualizacja.

GoodMorning! Full Render #2 from blprnt on Vimeo.

Grajmy obrazem! Świetne i pomysłowe – może wkrótce zobaczymy to na koncertach?

Sonic Camera from Dmtr.org on Vimeo.

Kolejny świetny projekt. Może już niebawem ta cyfrowa tapeta zastąpi znane nam od dzieciństwa papierowe wersje? Jeśli nie nam to z pewnością naszym dzieciom…

Hirzberger Events – Digital Wallpaper from Gregor Hofbauer on Vimeo.

I tak na koniec proszę dwie stronki, które zrobiły na mnie kolosalne wrażenie. Pierwsza z nich to strona produktowa Verbatim’a, gdzie z produktów tworzymy robota do walki – http://www.verbatim.jp/senshuken/ . Wzrastające skills’y i historia walk to powodują, że strona staje się niezwykła zupełnie.

Druga pozycja to strona zespołu muzycznego, jeśli się nie mylę – świetny sposób by zatrzymać internautów i zmusić ich do wysłuchania kompozycji. Kreatywność ponad normę – http://soytuaire.labuat.com/ .

W wolnej chwili

admin — Sun, 24 Jan 2010 11:31:02 +0000

W ten leniwy niedzielny poranek powstał właśnie pierwszy wpis z serii ‘W wolnej chwili’, w końcu zrelaksować też się kiedyś trzeba . Na początek polecam kilka komiksów Jerry’ego King’a, jednego z najbardziej utalentowanych, płodnych i wszechstronnych rysowników na świecie. Jego krótkie acz treściwe komiksy znajdziemy też na polskich stronach, choćby na joemonsterze. Poniżej kilka lepszych rysunków, ze wspomnianego joe oraz webdesignerdepot.com:

Na deser polecam wpis dot. super kalendarza – wkrótce postaramy się przedstawić naszą wersję kalendarza na 2010r. – gdzie ściągnąć może projekt w .psd .eps, a nawet zobaczyć filmik ilustrujący montaż tego cudu:
Super kalendarzyk z cartonus.com

Pod tym linkiem znajdziecie wszelkie potrzebne informacje: http://cartonus.com/calendar-hexahedral

Rok 2010 i trendy w dizajnie

admin — Fri, 22 Jan 2010 01:29:16 +0000

Jakie trendy w dizajnie panować będą w 2010 roku?
Tytuł troszkę przekorny, choćby z racji spolszczenia słowa design, jednakże ostatnio czytając Newsweeka napotkałem polską wersję tego słowa więc… chyba to poprawna opcja, co zresztą potwierdza Słownik Poprawnej Polszczyzny z roku 2004 i będę starał się tej formy używać w miarę możliwości.

Przekorny również dlatego, że ciężko jednoznacznie i nieomylnie takie trendy przewidzieć – ale co tam:) natknąwszy się na taki materiał w sieci (http://www.webdesignerwall.com) w pełni poparłem przemyślenia bogatszego doświadczeniem kolegi z branży i postanowiłem opublikować je w wielkim skrócie u nas na blogu.

Zatem zaczynamy:

Szeryfowe czcionki
Przez ostatnią dekadę praktycznie niepodzielnie na stronach królowały czcionki bezszeryfowe takie jak Verdana czy Arial, lecz od dłuższego czasu zauważalny jest trend, że czcionki bardziej „pozawijane” wracają do łask czego przykładem jest coraz większa liczba serwisów stosujących je, dla przykładu choćby nowa strona – tok.fm czy cała masa szablonów do WordPress’a.
Duże nagłówki / tytuły
Duże czcionki w tytule strony – umieszczane w topie serwisu – projektowane już jako część interfejsu użytkowego zdobędą jeszcze większą popularność w roku 2010.
Osadzanie nietypowych czcionek
Z czasem liczba darmowych czcionek dobrej jakości powiększa się, co popycha projektantów do skorzystania z tych dobrodziejstw sieci i urozmaicenia stron nowymi krojami pisma. Dla przykładu mógłbym podać naszą stronę główną gdzie takowe fonty się znajdują – oo.. albo orange.pl.
Teksturowe i delikatne tła strony.
Duże i ciężkie tła odchodzą w niepamięć – teraz zaczynają panować subtelne i oparte na teksturach lekkie tła.
Minimalistyczny i oparty na siatkach (gridach) dizajn
W sumie strony tworzone zgodnie z tym zamysłem pojawiają się w sieci od ładnych paru lat – i wg ludzi związanych z branżą ilość takich rozwiązań będzie rosła także w następnym ups.. następnych latach.
Nowe możliwości CSS3
Nowa wersja kaskadowych arkuszy stylów co prawda nie jest jeszcze obsługiwana przez wszystkie przeglądarki jednak projektanci stron co raz częściej eksperymentują z nowymi atrybutami i selektorami tj.: zaokrąglanymi narożnikami, kilkoma obrazkami tła, obramowaniami obrazów czy animacjami. Kolejna wersja arkuszy daje wiele możliwości, które już są stosowane i z pewnością na stałe zagoszczą na stronach: zaokrąglone narożniki i cienie boksów, cienie pod tekstami oraz przezroczystość dzięki RGBA (A – od alpha) to faworyci w tym rankingu.
„Mobilny” dizajn
Ciężko nazwać inaczej ten wyróżniony trend, ale mam nadzieję że termin ten oddaje kierunek, w którym podążają projekty czy funkcjonalności stron. Większe telefoniczne wyświetlacze, css i javascript obsługiwany przez mobilne przeglądarki i … nie oszukujmy się spadające ceny za mobilny czy komórkowy internet (nie wiem czy jest jakaś różnica między tym;) ) wymagają by strony internetowe posiadały dizajn dostosowany do przeglądania w telefonie. Może nie wszystkie strony takie możliwości posiadają, ale możemy być spokojni, że rok 2010 jedynie wzmocni istniejący już trend.

Problem z Iphonem – zawieszka Cydii

admin — Mon, 18 Jan 2010 14:45:45 +0000

Ostatnimi czasy wpadł mi w ręce znany telefon firmy Apple, z którym chciałem zrobić coś więcej ponad zwyczajne dzwonienie. Niestety przy sprawdzaniu jego możliwości zepsułem tą elegancką zabawkę, a dokładniej rzecz biorąc jedną z ważniejszych aplikacji tzn. Cydia.

Dzięki niej możemy doinstalować sobie troszkę więcej oprogramowania niż samym AppStorem – tymczasem uruchamiając Cydię pojawiał mi się komunikat „Loading Data” po czym nagle program kończył swoje działanie wracając do Springboard’u. Przeszukałem mnóstwo wątków, próbowałem reinstalacji i innych wyszukanych czarodziejskich trików – no może oprócz ponownego wrzucenia firmware’u czego chciałem uniknąć. Rozwiązanie znalazłem po kilku dniach, a problem leżał w pobieranych przez Cydię danych, które w jakiś sposób były nie prawidłowe (uszkodzone, źle spakowane czy źle ściągnięte).

W każdym razie rozwiązanie polega na dostaniu się do tych plików i usunięciu ich. Do przeglądania struktury plików na iphonie jest dość dużo aplikacji np. IPhone Browser czy Iphone PCsuite, ja sam używałem iFunBox. Po podłączaniu telefonu i uruchomieniu oprogramowania kierujemy się do katalogu var/lib/apt/lists/ gdzie znajdują się ściągnięte przez Cydie pliki – musimy je skasować (wcześniej radzę backup) zostawiając jedynie katalog partial – po tym zabiegu wyłączamy i włączamy telefon i już, Cydia powinna działać!

AS3 – prosta akcja do przycisku

admin — Tue, 22 Dec 2009 22:36:24 +0000

W nowym actionscript cie dodawania akcji do obiektów nie wygląda już jak dawniej – dlatego poniżej zamieszczamy kilka linijek, które pozwolą co poniektórym mniej wprawionym w rzemiośle, a dokładniej flashu dodać link do butona co by przeszedł gdzie trzeba . Zatem do dzieła, zaznaczamy i nadajemy mu nazwę (instance name) a następnie dodajemy coś takiego:

import flash.events.Event;
import flash.events.MouseEvent;
oferta.addEventListener(MouseEvent.CLICK, ofertaClick);
//Funkcja działająca na klika pozostałe to np. MouseEvent.MOUSE_OUT czy MouseEvent.MOUSE_OVER
function ofertaClick(event:MouseEvent):void {

 var url:String="http://domena.pl/oferta-wozkow.html";
 var request:URLRequest=new URLRequest(url);
 try {
 navigateToURL(request, '_self');// drugi argument to standardowy znany target
 } catch (e:Error) {
 trace("Wystąpił błąd!");
 }

}