web

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

From backstage: Google Reader

google reader
Ci sono molti modi di navigare in rete, si può affidarsi ai dadi (stumbleupon), ai propri contatti (facebook), ai link dei propri siti preferiti. Ma esiste un modo più efficiente, più veloce, più affidabile: Google Reader, l'aggregatore approntato dal team di geniacci di Mountain View.

A ben vedere usare il termine "navigare" per il reader è improprio, perchè è l'equivalente del teletrasporto. Inoltre le due feature "ordina per magia" e "suggerisci simili" valgono da soli il prezzo del bigl... ah, è pure gratis.

Per chi non fosse ancora convinto ecco, dopo anni e anni di attente aggiunte, elucubrate valutazioni e draconiane eliminazioni, la lista completa (?) dei feed per masayume.it:

google-reader-subscriptions.xml
Basta caricare il file xml dentro al reader e il gioco è fatto.

categorie: 

Una potente libreria javascript per HTML5: EaselJS

javascript library easeljs HTML5

EaselJS è la libreria che ha reso possibile l'eccellente Pirates Love Daisies, e sul sito originale sono presenti convincenti effetti con sprite, particelle, grafica vettoriale ecc.

HTML5 è finalmente maturo e questo tipo di librerie sono assolutamente da non perdere per gli sviluppatori.

Ecco alcuni esempi di quello di cui è capace.

C'è perfino un tool che esporta le animazioni flash (quindi realizzabili con molti strumenti anche free) nel formato Easel.

UPDATE: molto interessanti anche tweenjs e pixijs

TweenJS
pixijs
pixijs docs
html 5 game devs
a complete tutorial: part 1, part 2, part 3

categorie: 

Roozz

roozz

Roozz è una interessante tecnologia che consente di trasportare gran parte delle applicazioni desktop direttamente online, in modo da poterne usufruire via browser. Quello che sembra un esercizio di stile in realtà apre nuove frontiere e permette ad esempio agli utenti mac l'uso di software altrimenti difficile da far girare su OSX.

Il progetto è partito da non molto e per ora ci sono alcuni vincoli che limitano ad un 50% il software che può subire il trattamento con successo, ma quando funziona l'applicazione web gira molto velocemente e viene ospitata direttamente sui server di roozz.

Alcune delle applicazioni online disponibili da subito (senza quindi installazione locale, ma usando il plugin roozz):
PhotoScape
IrfanView

E ci sono anche giochi:
Serious Sam
Duke Nukem 3D

tech compare chart

categorie: 

Canvas Rider - canvasdemos

Canvas Rider


Canvas Rider è l'ennesimo arrivato della fortunata serie line rider. Il tutto come sempre gira perfettamente nel browser e fa uso dell'elemento canvas, probabilmente il più supportato dalla moderna generazione di web browser.

Il gioco è reso disponibile da canvasdemos, un bel sito che raccoglie un sacco di esercizi di stile, giochi, tutorial ecc

[via]

categorie: 

un altro mondo di riviste: issuu

issuu free web magazine publish search download

Dopo un mondo di riviste un'altro eccellente sito dove è possibile cercare, scovare e scaricare magazines di vari argomenti, ed è addirittura possibile crearne e caricarne di propri: issuu.com

Una ottima occasione per diventare direttore, caporedattore ecc. del proprio giornale e pubblicare online per raggiungere un numero di lettori incalcolabile.

categorie: 

toodledo e todoist

toodledo web app 2.0 todo list
toodledo è un servizio online, free e in bello stile 2.0 che permette di orgnizzare liste di cose da fare e raggrupparle per tempi e priorità e addirittura sottoliste.

Si rivela un utility essenziale per non perdere traccia delle cose davvero cruciali, delle scadenze e di tutto quello che c'è da fare in una vita che che oramai come ritmo - grazie a computer, pda e overdosi di caffeina - ha messo il turbo.

The best to-do apps

forse ancora meglio: todoist per Google Chrome


categorie: 

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.

categorie: 

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.

categorie: 

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

An introduction to Quix from Joost de Valk on Vimeo.

categorie: 

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.

UPDATE: Stesso servizio anche con webink

Per creare un font: myscriptfont.com
google fonts github repository


categorie: 

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)

UPDATE: V for Vendetta
UPDATE: designyourway
UPDATE: making of
UPDATE: quora


Kinetic Typography Quick Tutorial

categorie: 

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
HTML5 doctor
HTML5 & CSS3 tools
5 top HTML5 resources
10 best HTML5 tools

Demo ufficiali da Mozilla

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

10 Best JavaScript And HTML5 Presentation Frameworks

Ecco una ottima demo delle caratteristiche salienti
Un po' di utili bookmarklets per sviluppatori.
Develop the Next Generation of Applications for the Web
HTML cheatsheet/
Dive into HTML5 (great start)
Esempi di HTML5

categorie: 

(?≤=^|>)[^>≤]+?(?=≤|$)\be(\w*)s\b

xkcd regular expressions
Ebbene si, le espressioni regolari (per gli amici regexp) sono il metodo più efficace per risolvere problemi di varia natura con il testo, che si debba sostituire tutte le occorrenze del nome della ex con un improperio oppure modificare migliaia di parole in una lista di qualche megabyte.

Purtroppo la loro natura astrusa tende ad essere un po' scoraggiante per i più, e gli avventurosi che si inoltrano oltre la conoscenza dei primi metacaratteri sono destinati ad imbattersi nella vera coscienza di quanto un semplice simbolo possa assumere i comportamenti più disparati in presenza di qualche suo amichetto adiacente.

Occorre provare provare provare, e quindi ben venga il: Online Regular Expression Testing Tool

Regular expressions: how do they work?
Altri Online Regular Expression Testing Tools
Regular Expression Testing
Regex tutorial — A quick cheatsheet by examples

[via: il più recente vincitore del masayumino d'oro]

categorie: 

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]

categorie: 

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.

UPDATE: HTML5 version (Chrome only)

categorie: 

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 !

categorie: