web

web, html, css, flash, fonts e news su internet

10K apart

10 k apart javascript demo


10K apart raccoglie demo di codice javascript che entro 10K (circa 10.000 caratteri) devono riuscire a finalizzare una visualizzazione, magari anche interattiva.

Può sembrare sciocco imporre un vincolo del genere in un epoca nella quale si va in giro con i dati contenuti nella biblioteca d'Alessandria infilati in una schedina nel proprio smartphone, ma un limite del genere ispira nella scrittura di codice più furbo, efficace, efficiente, costringe ad essere creativi e ad adottare soluzioni ben ponderate.



Esempi di CSS3



CSS3 ovvero come creare tre bottoni colorati in modo parametrico con angoli smussati e look glossy, senza usare nemmeno una immagine.
Click su uno a caso per scoprire come si realizzano.



Gooreader

gooreader
gooreader è un programma da scaricare che permette di cercare e visualizzare i libri di google books come se fossero in una libreria, come succede spesso in questo genere di software quando gira su OSX.

Sembra essere stata posta particolare cura nella leggibilità e i volumi (e le riviste) si presentano in un formato scorrevole e adeguato ad una lettura anche prolungata.
Infine è anche possibile salvare in locale i documenti trovati (che lo permettono).

Non sarà l'ipad ma è pur sempre free. E probabilmente in futuro migliorerà ancora.



Supercharge your clicks: Quix !

quix bookmarkletQuix è una bookmarklet, ovvero semplicemente un po' di codice javascript dentro ad un link. Se ben scritto e nel giusto ambiente (firefox, chrome ecc.) questo oggettino che non occorre nemmeno installare aumenta la velocità di navigazione a livello curvatura grazie a quelle che sono delle efficaci keyboard shortcuts.

Tra le funzioni ci sono la navigazione di base (g cerca su google, f cerca su flickr, tr traduce), i comandi "social" (fb condivide la pagina su facebook, yt cerca su youtube), le funzioni SEO (linkcheck verifica i link), le funzioni per webmaster (font mostra i font, w3c valida, xray passa ai raggi X) e molto molto altro.

Guarda il video introduttivo di quix



Il web ancora più bello: google web fonts

google web font
Google ha rilasciato una lista di font per il web liberamente utilizzabili nelle pagine di qualunque sito. Alcuni sono eleganti, altri ricercati, non ne manca uno monospace e nemmeno uno stile script.

Gli effetti di questa piccola grande rivoluzione si faranno sentire già dalle prossime settimane quando faranno la loro comparsa pagine ancora più belle grazie all'uso creativo dei migliori web designer.

Ecco la google font directory

Per usarli c'è già la google font API ed un apposito webfont loader.

UPDATE: Stesso servizio anche con webink



Tipografia Cinetica: Mad as Hell! (1976)

Mad As Hell! Kinetic Typography from Aaron Leming on Vimeo.

UPDATE: E per chi si chiedesse con quale programma si può realizzare una cosa del genere la risposta è After Effects oppure Flash. Ma chi ha un browser basato su webkit può pensare di farlo anche solo con CSS e un pizzico di javascript: The man from hollywood (chrome & safari only)



il nuovo web: HTML5

html 5
Lo scopo delle nuove caratteristiche sviluppate nel linguaggio HTML 5, presto supportato su tutti i browser degni di questo nome (no, internet explorer, non stiamo parlando di te), è quello di diminuire la presenza di plugin di terzi come flash, silverlight e java ma mantenere le funzionalità delle "rich internet applications" (RIA).

Un po' di demo preliminari, complete di lista di compatibilità.
Cosa dice Wikipedia.
L'immancabile HTML5 gallery
I 101 siti più belli
Color Cycle Demo by Mark Ferrari

ma la cosa che farà breccia nel cuore di molti:

sublime player



Shelfari

shelfari neil gaiman's library


Un servizio online, accessibile da ovunque (ci sia una connessione) che permette di costruirsi gratuitamente la propria libreria virtuale.
La possibilità di disporre i libri su uno scaffale e di poter navigare liberamente tra copertine, titoli ed autori, per il piacere di risvegliare memorie di buone letture e belle sensazioni.
La descrizione della trama o del contenuto di ciascun libro semplicemente indicandolo con il puntatore.

E' Shelfari.

Bonus: ficcanasare clamorosamente nella libreria di Neil Gaiman.

[via Neilgaimania]



Una super web gallery free ed integrata: Cooliris


cooliris è un plugin per firefox che permette di realizzare meravigliose web gallery e di guardare le foto e video sul proprio computer. E un nuovo, fantastico modo di godere di youtube, picasa, flickr e deviantart ecc.

In questo esempio le immagini provengono dall'account ufficiale di masayume su picasa.



Una tempesta elettronica: Sion


SiON Kaospad - wonderfl build flash online

Sion è un vero e proprio strumento musicale, un sintetizzatore in flash 10 che gira su wondrfl. Nel riquadro qui sopra basta usare il mouse per spostare il cursore e generare musica dance/elettronica.

Alcune altre applicazioni:
kaoscillator
Super Mario synth
FM synth WF-1
Il Tenori-on !

Approfondimenti e informazioni varie.

E quando si mette tutto insieme ecco il risultato !



Una gallery dinamica 3D: tiltviewer


tiltviewer masayume
Una delle gallery più interessanti disponibili free sul web è senz'altro tiltviewer che permette di navigare in 3D molto velocemente e con accattivanti animazioni dinamiche. Si può fare zoom sulle singole immagini per vederle a tutto schermo e le informazioni sono riportate sul retro.

Per vederla in azione c'è la nuova gallery di tutte le immagini di masayume.



Google Street

Ecco come Google Street viene presentato in Giappone.



La mascotte giapponese di Firefox


firefox mascotte foxkeh


Foxkeh è la mascotte disegnata in stile tipicamente kawaii (giapponese) che aiuta la diffusione di firefox nel mondo.

Sono ovviamente disponibili i wallpapers.



Blue Typography


we love typography ama la tipografia (sorpresa sorpresa !), ma il discorso è esteso anche al lettering e alle insegne.

E' possibile lanciarsi in mirabolanti esplorazioni nell'uso di caratteri anche per colore: blu, marrone, rosso, bianco, verde, grigio, arancione, giallo, nero e viola.

"Offset" by Ale Paul



Moo Tools


mootools

MooTools è un framework compatto in javascript che offre moltissime possibilità agli sviluppatori web.

Questo approfondito articolo di Smashing Magazine svela parecchi trucchi partendo dal livello per non programmatori e passando per confronti, esempi e tutorial.



color rotate


colorotate color rotate palette
Colorotate è un interessante approccio web in flash alla navigazione nelle palette di colori che offre un modo molto originale e "tridimensionale" di operare variazioni, confrontare, affiancare e sperimentare le varie tonalità.

E possibile anche cambiare tutta la palette contemporaneamente agendo sui vari controlli e partire da una serie di tavolozze predefinite che derivano da siti famosi.



masayume su Drupal

In occasione del 6° compleanno finalmente masayume passa al digitale terr... ehm cambia piattaforma. Abbandona l'obsoleto blosxom, uno script perl che però fino a qui ha fatto bene il suo dovere, e per la sua terza incarnazione si converte alla goccia (drupal, in olandese), che continua a vincere premi come CMS dell'anno.

I commenti sono di nuovo abilitati (per ora moderati) e finalmente è possibile navigare in lungo e in largo avanti e indietro nei più di 1700 sogni divenuti realtà. Non tutte le funzioni sono ancora operative ma quello che c'è basta e avanza per l'inaugurazione ufficiale.

Speriamo che non sia la goccia che fa traboccare il vaso.



Google Squared



Google squared e' un nuovo interessante approccio alle ricerche sul web. Invece di mirare al miglior risultato singolo si ottiene una tabella con vari elementi che corrispondono alle parole chiave, arricchiti da voci aggiuntive in colonna. Il bello e' che si possono espandere sia in verticale richiedendone altri che in orizzontale con l'aggiunta di nuove voci, che vengono riempite automaticamente.

Giusto un paio di esempi: anime, compositori classici. Questa nuova funzione e' in via di perfezionamento. Ecco una breve presentazione ufficiale: Introducing google squared.



Shutterborg

Shutterborg e' un tool web free che permette di editare una pagina web come se fosse un documento. E' possibile iniziare da una pagina qualsiasi e modificarne il testo senza alcuna spiegazione e intervenire sulle immagini e la struttura in modo molto intuitivo.

Nell'esempio a sinistra una pagina ricca di testo tratta dal gabinetto delle meraviglie di Heather McDougal.



Tone Matrix - Andre Michelle lab

Tonematrix somiglia molto al "tenori on", ma e' solo uno dei tanti esperimenti diAndre Michelle.

Sul sito abbondano dimostrazioni di effetti molto curati come fuoco, acqua, pioggia ed anche frammenti di videogame classici con mode 7. Le demo sono decine e si possono trovare suddivise per argomento: 3d, audio, Bezier, filtri, giochi, particelle, fisica e molto altro.



Syndicate content