Chimera - Firefox Plugin

In attesa della creazione di un nuovo sito web, postiamo qui sul "vecchio e tralasciato" blog un video dell'ultima creazione di eqepa: Chimera.
Chimera è un'estensione per il browser Mozilla Firefox che mette a disposizione dell'utente un'interfaccia semplice ed intuitiva per la creazione di progetti JavaScript. L'estensione si trova adesso in una versione da testare profondamente quindi non è ancora iscritta nella repository Mozilla.
Le features di questa versione:

• Creazione di progetti in MooTools.
• 3 Preset disponibili: "Fx.Morph", interfaccia all'omonima classe MooTools, "New/Edit Element" che permette la creazione e l'editing via JavaScript di elementi nella pagina, "FunctionCall" che permette di richiamare funzioni definite dall'utente.
• DOM - Inspector. Strumento per la visualizzazione della pagina corrente e utilizzato dall'intera applicazione quando è necessaria la selezione di elementi.

Ecco il video:

Se siete interessati a partecipare alla fase di testing fatecelo sapere!

Continua...

Torna al riassunto...

Web Roundup Giugno: 10 tutorial per creare icone in photoshop e illustrator

Il mese scorso abbiamo raccolto 10 set di icone totalmente gratuite per uso personale e commerciale. Questo mese scaviamo leggermente più a fondo.
Esiste un metodo migliore per non pagare per ottenere una cosa se non farsela da soli?
Questo mese quindi riproponiamo il problema dell'inserimento delle icone nella nostra applicazione/sito web dall'altro lato: come fare da soli icone di effetto.

Di seguito vi proponiamo 10 tutorial per photoshop ed illustrator utili non solo per creare l'icona che fa al caso nostro ma anche, se siamo alle prime armi, per prendere dimestichezza con gli strumenti offerti da tali programmi e le tecniche usate.
Naturalmente questa non è una classifica, i tutorial sono presentati in ordine sparso.

1.Anatomy of an Icon

In questo tutorial per photoshop viene spiegata la tecnica di realizzazione di icone semplici ma efficaci come quella che vedete in alto. A partire da questo si possono realizzare icone raffiguranti qualsiasi cosa, mantendo sempre lo stesso stile.

2.Beginner Illustrator Tutorial - Create a Vector RSS Icon

Tutorial per Illustrator molto dettagliato per la creazione di un'icona di feed RSS. La guida spiega passo passo le tecniche e gli strumenti utilizzati.

3. Vista Error Icon

In questa guida l'autore prende la vera icona di errore di vista e ne crea una simile in photoshop. Utilissimo per apprendere le tecniche utilizzate da grafici professionisti.

4. How to Create an Alarm Clock Icon

Da VectorTuts una guida passo passo per realizzare l'icona di una sveglia in Illustrator. Da notare il livello di dettaglio dell'immagine realizzata, il tutorial infatti è composto da ben 36 passi da seguire per realizzare gli effetti di riflesso, luci ed ombre.

5. Craft a Delicious Chinese Food Icon

Il tema non è dei più utilizzati (non ho visto molti siti in giro con icone del genere...) ma quello che interessa è che in questa guida vengono utilizzate una quantità industriale di tecniche di disegno vettoriale in Illustrator.

6. How to Make a Folder Icon

Tutorial per creare icone raffiguranti cartelle in photoshop. La guida è molto ben fatta, ma mancano gli screenshot di esempio propri del programma: ad esempio l'autore si limita a dire "utilizzate queste caratteristiche di gradiente" senza far vedere come fare...un pò di "googlate" ed il gioco è fatto!

7. How to Design a Set of Multicolored Buddy Icons

Questo tutorial sfrutta tool basilari come le shapes o i gradienti in Illustrator per realizzare icone da utilizzare come avatar di default degli utenti delle vostre applicazioni.

8. Carbon Style Icon

Come realizzare icone in stile "fibra di carbonio" in photoshop.

9. 100% Satisfaction Guaranteed Seal/Badge Photoshop Tutorial

Realizziamo una icona in stile coccarda molto utile nei siti di e-commerce. A partire da questa se ne possono realizzare di tutti i tipi. Tutorial per photoshop.

10. How to Create a Transparent Battery Icon

Un'altro tutorial di tutto rispetto da parte di VectorTuts. Il risultato finale è semplicemente d'impatto e utilizzabile in qualsiasi tipo di design. Inoltre le tecniche che si imparano da questo tutorial sono utilissime.

Fine
Anche questo mese a stento siamo riusciti a postare il nostro appuntamento con il web design.
Alcuni avranno notato che il blog è poco "vivo" ultimamente...La spiegazione sta sempre dietro gli impegni universitari.
Inoltre abbiamo intenzione di spostarci su una piattaforma più potente di blogspot (un hosting serio insomma) che ci permetta di offrirvi un'esperienza migliore.

Dunque, cosa ne pensate di questi tutorial?
State cominciando a "smanettare" con photoshop ed illustrator?
Fateci vedere i vostri risultati!

Continua...

Torna al riassunto...

Web Roundup Maggio: 10 set di icone free

Ecco il primo della serie di Web RoundUps mensili sul web design. Ogni mese cercheremo di trovare nella rete tutorial, freebies ed articoli sugli argomenti che interessano i web designer.
Il mese di maggio lo dedichiamo alle icone.
"Ora mi servirebbe una bella icona a forma di cavatappi" oppure "Qui starebbe bene proprio una bella freccia marrone": quanti di noi non hanno mai pronunciato una frase del genere almeno una volta? Ebbene eccovi una bella raccolta di frecce marroni e icone a forma di cavatappi da utilizzare nel vostro bel blog/sito/programma!

A parte gli scherzi qui di seguito troverete i link alle raccolte di quasi 600 icone (sinceramente non le ho contate bene, è un numero indicativo).
E' bene precisare che tutto il materiale linkato è tutto gratuito per scopo personale o commerciale, riteniamo sia inutile farvi scaricare set ad uso prettamente personale in quanto potrete utilizzarle in progetti commerciali incappando in problemini non banali. E' comunque sempre richiesto (naturalmente) dai creatori dei set un link al loro sito/blog.

1. Onebit Free IconSet

Una raccolta che comprende 50 icone di alta qualità, molto professionali ed indubbiamente carine. Queste icone sono utilizzabili in praticamente tutti i tipi di design.
Dimensioni: 48x48px
Formato: png

2. Handycons 2 from Janko at warp speed

Set di 20 icone in stile "hand drawn" rappresentanti i loghi dei social network e dei principali portali web. Il set contiene i loghi di Facebook, Blinklist, Feedburner, Flickr, FriendFeed, Furl, Gmail, Google, Heart, Last FM, Linked IN, Magnolia, Newsvine, PayPal, Skype, Sphinn, Twitter, Vimeo, Yahoo e You Tube.
Dimensioni: 16x16, 32x32, 64x64 e 12x128px
Formato: png

3. Free Hand Drawn Doodle Icon Set for Bloggers

Set che contiene 14 icone sempre "hand drawn" specificatamente pensato per i blogger.
Dimensioni: variabili, dai 150x120px ai 150x155px
Formato: png

4. Function icon set

Set di ben 128 icone in stile "glossy" utilizzabili per applicazioni desktop e per il web design. Sono gratuite per ogni tipo di progetto solo con il vincolo di linkare la pagina http://wefunction.com/2008/07/function-free-icon-set/.
Dimensioni: 48x48px
Formato: png

5. Image Editing Icons

40 icone utilissime per la creazione di applicazioni di editing di immagini o semplicemente per creare pannelli di strumenti per web apps avanzate.
Formato: unico file per Illustrator CS2 oppure in SVG (alta qualità, disegni vettoriali).

6. Vector Arrow Icons

In questo set possiamo trovare 64 frecce di tutti i tipi, tutte in un unico file ad alta qualità in vettoriale.
Formato: unico file per Illustrator CS2 oppure in SVG.

7. Sweetie Icons

Icone molto ben fatte di svariati generi. Nel link sopra riportato si possono scaricare 2 versioni del pacchetto. La versione "BasePack" contiene 182 icone, mentre la versione "WebComunication" ne contiene 37.
Formato: png-8 bit, png-24 bit e file photoshop.
Dimensioni: dagli 8x8px a 24x24px.

8. GrayScale Icon

Un set di 40 icone in scala di grigi raffiguranti frecce, simboli di più, meno e delete, simboli di cd/dvd ecc ecc...
Formato: 1 file png ed un file gif contenente tutte le 40 icone più 40 file gif con un'icona a file.
Dimensioni: 34x34px.

9. Smashing Retro Icon Set

Uno dei cosidetti "freebies" da parte di SmashingMagazine (sito segnalato nel roundUp precedente riguardante le sorgenti migliori per tutorial e freebies) presenta 10 spettacolari icone in alta qualità nel tema "retrò".
Dimensioni: 128x128px e 512x512px
Formato: Ico e png.

10. Markup Icon set

9 set di icone da utilizzare per blog e siti. Ritengo che questo tipo di iconcine faccia la differenza, in particolare se usato accanto agli elementi di menù a tendina o liste di argomenti.
Dimensione: 20x20px
Formato:gif

Allora, che ne pensate? Si accettano suggerimenti per migliorare la lista, condividete le vostre conoscenze!

Continua...

Torna al riassunto...

Mootools - cap 2 - gli Elements

Gli Elements
I Browser implementano quello che è conosciuto come DOM(Document Object Model), Javascript non è direttamente legato ai browser (falsa opinione comune) che sono solo il luogo dove gli sviluppatori solitamente usano questo linguaggio per accedere a questa struttura. I browser stessi d’altro canto, estendono il linuaggio di base aggiungendo metodi e proprietà agli oggetti Javascript ( nativi del linguaggio stesso) che sono la rappresentazione dei tag html utilizzati per definire la grafica di una pagina web(e non solo).



I metodi nativi degli oggetti Element, come molti altri metodi nativi di Javascript, lasciano a desiderare e non pemettono la scrittura di un codice pulito e ben strutturato in oltre, per le motivazioni enunciate in precedenza, dipendono direttamente dai browser in cui il codice viene eseguito limitandone la portabilità.

MooTools, il cui scopo è quello di mettere un web developer nella condizione di produrre un codice riusabile e di ingegnerizzare un mondo in cui la buona progettazione è un argomento tabù, mette a disposizione un tipo di oggetto Element e molti metodi che estendono le potenzialità base del linguaggio offrendo la possibilità di migliorare la qualità del lavoro prodotto.

Istanziare un Element MooTools
Istanziamo un element che rappresenta un tag img

var myImg = new Element('img',
{
src: '/foo.jpg',
alt: 'this is foo',
'class': 'fooClass',
events: {
click: function(){ alert('click!');}
},
styles: {
border: '1px solid blue',
marginTop: '10px'
}
});

la sintassi è molto piu simile a quella di un linguaggio OO class-based, all’element istanziato vengono associati in fase di creazione anche altri attributi come gli styles ed events che vedremo in seguito.

Al costruttore viene passato come parametro, una stringa identificativa del tag html che l’element deve rappresentare e un oggetto Javascript che rappresenta le options dell’element cioè gli attributi aggiuntivi che ne descrivono lo stile e la reazione a particolari eventi, quindi possiamo generalizzare e scrivere

Var element=new Element(
‘HtmlTag’,
{
Src:’bla bla’
// insomma oggetto javascript che ha come attributi
// gli attributi da passare al nuovo element al
// momento dell’istaziazione
//options del nuovo element
},
Styles
{
//stile dell’element che si sta istanziando
} );

la dichiarazione di un elemento può essere anche divisa dalla sua caratterizzazione usando i metodi degli Element definiti da mootools come generalizzazione di quelli forniti dal linguaggio.

Element.set(property,value);
metodo che permette di settare qualsiasi proprietà di un element accettando in ingresso parametri nella forma chiave valore.

Element.setStyle(attribute,style);
metodo che permette di modificare lo stile associato ad un particolare Element.

Element.get(property);
Element.getStyle(attribute);
Relativi metodi get che tornano ripettivamente il valore di una proprietà associata all’element o di un attributo css;
grazie all’utilizzo di questi metodi possiamo creare e modificare interamente la struttura di un element.
In aggiunta ai metodi precedenti nella libreria è presente anche il metodo

Element.erase(property);
che permette di cancellare un attributo associato in precedenza ad un element.

Quello che è stato fatto fino ad ora riguarda come istanziare e modificare la struttura di un element, questo però non avrà un effettivo valore fino a quando non sarà inserito nel dom per questo analizziamo i metodi che MooTools mette a disposizione per adempiere a questo compito.


Injection and Removal

Element.inject(newElement,position);
Questo metodo sposta o inserisce l’oggetto di invocazione nella posizione specificata,inoltre prevede la possibilità di specificare la posizione di inserimento:

• "before" inserisce l’elemento come fratello precedente;



• "after" inserisce l’elemento come fratello successivo;



• "top" inserisce l’elemento come padre;



• "bottom" inserisce l’elemento come ultimo figlio.

Element.grab, Element.adopt assolvono allo stesso compito con piccole differenze quindi per la loro trattazione si rimanda alla documentazione ufficiale.

Element.empty();
elimina tutti i figli dell’ elemento su cio è invocato.

Element.destroy();
elimina l’elemento dal dom e ne libera lo spazio di memoria occupato.

Element.dispose();
rimuove l’elemento dalla posizione occupata senza però rimuoverlo dalle strutture di memoria permettendo un suo futuro reinserimento.

Ora conosciamo gli strumenti principali per creare,modificare e eliminare Elements, nei prossimi post analizzaremo caratteristiche piu avanzate degli Elements che mootools ci mette a disposizione come Events e Storage.

Continua...

Torna al riassunto...

Mootools - cap 1 - Il pane quotidiano

Il Pane quotidiano - funzioni $ e gli Element
Javascript è un linguaggio di scripting che fondamentalmente svolge la funzione di dare logica a quello che è la grafica data da HTML e CSS in una pagina web.
Il pane quotidiano quindi di un "programmatore web" è prendere un elemento dalla pagina, manipolarlo e fare computazione. Vediamo come Mootools ci viene in aiuto nella stesura del nostro codice.



Le funzioni $ e $$
Dicevamo che "accattarsi" un elemento dalla pagina e manipolarlo è un'operazione presente forse in ogni script javascript. Javascript ci mette a disposizione la funzione document.getElementById('id') fortunatamente cross-browser (con un solo piccolo problema) ma eccessivamente scomoda (troppo lunga! ricordiamoci che 'ctrl+c' + 'ctrl+v' = 'problemi') e limitata (limitata lo direte dopo aver letto quest'articolo...).
Mootools ci mette a disposizione la funzione $ che ha la duplice funzione di restituirci un elemento a partire dal suo id e restituirci quell'elemento come oggetto nativo di tipo Element (nel prossimo paragrafo).

• Funzione $
  var myElement=$('myElementId');
  Restituisce un Element se ne esiste uno con quell'id, null altrimenti.
  var div=document.getElementById('myElementId');
div=$(div);
  Restituisce un Element a partire dall'element nella pagina. Attenzione, non ho sbagliato a scrivere la frase precedente (cerco di mettervi un pò di curiosità sugli Element, o ci sto riuscendo o vi sto creando confusione in testa...fatemelo sapere).


• Funzione $$
  $$('a'); //Ritorna tutti i tag a nella pagina (i link per capirci).
$$('a', 'b'); //Ritorna tutti i tag a e tutti i tag b nella pagina.
  Restituisce un Array contenente tutti gli Element che "matchano" con i criteri inseriti tra le virgolette. I criteri sono i selettori utilizzati per definire il css nella pagina quindi:
  $$('.classe'); //Ritorna tutti gli elementi del dom con class="classe"
$$('#unId .unaClasse'); //Ritorna tutti gli elementi del dom figli dell'elemento con id="unId" e con class="unaClasse".
$$('#unId a.unAltraClasse'); //Ritorna tutti i tag a figli dell'elemento con id="unId" ma con class="unAltraClasse".
  

Grazie a queste due funzioni "si ha il dom in mano" (questa è una citazione...) con una sintassi estremamente ridotta e facile da ricordare.

Gli Element
A questo punto almeno uno dei lettori di quest'articolo mi starà maledicendo dicendo "ma questi Element cosa sono?"... ci penso subito caro lettore!
Gli Element sono un'estensione del tipo nativo element del dom grazie al quale è possibile invocare tutti i metodi definiti dalla libreria.
Tratteremo il tipo Element bene nel prossimo capitolo ma giusto per darvi un piccolo assaggio vi facciamo vedere un esempietto.

Un bel div 100x100px

Premimi

Beh, il codice (una sola riga) vedetelo con firebug XD...

Continua...

Torna al riassunto...

Mootools - Introduzione al framework - Sommario dei tutorial

Mootools è un framework di sviluppo object oriented modulare per javascript. I vantaggi principali nell'utilizzo di tale "libreria" sono quindi quelli che si hanno nel passare dalla programmazione procedurale a quella ad oggetti ma non solo. Mootools offre una quantità enorme di classi (appunto) già pronte e (attenzione attenzione) cross-browser che rendono la stesura di codice javascript molto più agevole, veloce ed intuitiva e permettono l'utilizzo di effetti grafici efficaci ed efficenti.


Una volta presa dimestichezza con il modo di pensare, con la sintassi e le classi principali di Mootools, sarà un gioco da ragazzi (sempre relativamente XD) creare richieste Ajax, effetti da "wow!" e, cosa più importante di tutte (molti diranno di no, ma è così), definire classi ed istanziare oggetti nelle creazione delle nostre web application (ho scritto web application e non siti web non a caso).

Tendo a sottolineare che chi scrive non è un esperto del settore, nè un esperto in nulla, ma solo uno studente di ingegneria informatica (non ancora laureato tra l'altro) che sta scoprendo un mondo di tecnologie nuove, le sta studiando ed ha voglia di condividere i suoi studi.

Iniziamo con i link utili.
Sul sito ufficiale Mootools.net è possibile scaricare la libreria in vari formati includendo magari solo i moduli necessari alle nostre esigenze (ricordiamoci infatti che tutto andrà a finire sul client ed è buona norma alleggerire il più possibile le nostre pagine). Sempre sul sito ufficiale troviamo una reference guide molto dettagliata e ben fatta.
Il mastodontico e onniscente Html.it presenta una percorso dettagliato e fondamentale per l'apprendimento qui.
La cosa forse indispensabile per realizzare (in generale) pagine web dinamiche è utilizzare firefox con il suo plugin firebug; se ancora non lo avete istallato fatelo immediatamente, è un ordine! XD

Ah, non vi ho detto che il creatore di Mootools si chiama Valerio Proietti e che (come molti furboni avranno capito, volponi!) è italiano.
Inoltre non vi ho detto che cosa significa Mootools, beh My Object Oriented Tools.
Sempre per curiosità vi consiglio di leggere l'intervista che html.it ha fatto al creatore di questo strumento straordinario.

Ecco quindi tutti i capitoli del nostro viaggio.

Il pane quotidiano
Si tratteranno le funzioni indispensabili a qualsiasi uso di mootools e il tipo nativo Element.

Lavoriamo con gli Element
I metodi principali per istanziare, manipolare ed eliminare Element.

Il costruttore Class
Vedremo come definire, istanziare ed estendere classi javascript grazie a mootools.

Gli eventi
Scateniamo, definiamo e associamo nuovi e catastrofici eventi alla nostra pagina XD.

Effetti grafici
Una panoramica generale sugli effetti che mootools ci rende pronti per essere utilizzati.

Creiamo richieste asincrone - AJAX con Mootools
Utilizzo della classe Request.HTML che rende AJAX semplice da utilizzare.

Costruttori nativi
Brevissima panoramica sull'utilizzo dei costruttori nativi quali Array, Hash e String.

Continua...

Torna al riassunto...

Terremoto in Abruzzo

Stanotte farò molta fatica a dormire e quindi ecco un piccolo ma dovuto off topic. L'Aquila, la città che ha donato a tutto il nostro gruppo (e a tantissimi altri studenti) anni ricchi di esperienza, divertimento e conoscenza è stata colpita da una tragedia. Quindi non posso che esprimere la mia vicinanza ai parenti delle vittime della furia della natura e a tutte le famiglie rimaste senza nulla che passeranno la notte senza un tetto sulla testa. Mentre scrivo ho sentito un'altra scossa, non so se vera o immaginaria(sono ad Avezzano e la cittadinanza è colpita da un terrore che mi ha pervaso nonostante cercavo di resistere) non oso neanche immaginare cosa stanno provando tutti gli sfollati ora.

Posso quindi segnalarvi alcune delle gare di solidarietà che tentano di donare un sorriso alle facce stanche e addolorate dei cittadini aquilani e abruzzesi.

-Le compagnie di telefonia mobile italiane, d'intesa con il Dipartimento della Protezione Civile, hanno attivato la numerazione solidale 48580 per raccogliere fondi a favore della popolazione dell'Abruzzo gravemente colpita dal terremoto. Ogni Sms inviato contribuirà con 1 euro, che sarà interamente devoluto al Dipartimento della Protezione Civile per il soccorso e l'assistenza. Sarà possibile anche donare 2 euro attraverso chiamata da rete fissa di Telecom Italia, utilizzando lo stesso numero: 48580. Il Dipartimento della Protezione Civile fornira' tutte le indicazioni sull'utilizzo dei fondi raccolti

-MEDIAFRIENDS
Terremoto in Abruzzo
per donazioni tramite bonifico bancario:
Conto Corrente intestato a: Mediafriends
IBAN: IT41 D030 6909 4006 1521 5320 387
Causale: terremoto Abruzzo

-CORRIERE DELLA SERA
“Un Aiuto subito per L’Abruzzo”
BONIFICO BANCARIO:
Intesa-San Paolo, ABI 3069, CAB 05061, conto corrente n. 1000/144, intestato a: “Un aiuto subito – Terremoto dell’Abruzzo”.
Cod. IBAN: IT 03 B 03069 05061 100000000144
VERSAMENTI CON CARTE DI CREDITO
(CartaSì, MasterCard, Visa, American Express)
Numero Verde di Cartasì: 800 317800 (da alcuni cellulari è necessario digitare il 12 prima del numero)
Dall’estero: 02 34980235
Tenere la carta di credito a portata di mano e seguire le istruzioni del sistema.

-SKY
SKY Per l’Abruzzo
Versamento sul conto:
IBAN IT 22 O 03226 01606 000500074972

Grazie.

Continua...

Torna al riassunto...

Creazione componenti in Joomla - Tutorial, presentazione, ed esempio

La creazione di componenti in Joomla! richiede passaggi non molto intuitivi e senza una buona documentazione è difficile capire come fare.

Vi mettiamo in allegato la presentazione di una lezione-seminario tenuta dal nostro coetaneo dott. Stefano Giuliani. Stefano ha svolto una interessante tesi di laurea sfruttando Joomla! per creare un servizio online di appoggio a ricercatori e professori delle varie facoltà d'Italia. In questa tesi come in un'altro progetto nel quale siamo stati coinvolti anche io ed Emilio è stato necessario creare componenti Joomla ad-hoc per l'applicazione da realizzare. Nella cartella allegata è presente una presentazione PowerPoint che spiega l'architettura da rispettare, un esempio di componente ed un video. Ringraziamo Stefano per averci fornito questo materiale. Stiamo anche tenendo in considerazione la redazione di un paio di articoli proprio sullo sviluppo in Joomla, in particolare sull'utilizzo di Ajax. Stay Tuned!
Download

Continua...

Torna al riassunto...

Tutorial, brushes, pattern e immagini vettoriali per Adobe Photoshop e Illustrator - 10 risorse online

Tutti sappiamo che l'utente finale delle applicazioni che creiamo giudicherà quest'ultime in primis per la grafica che presentano.
Dopo aver rinvigorito il layout del blog vi posto quindi 10 tra i siti che ho trovato per prendere un pò la mano con Adobe Photoshop ed Illustrator. Questi siti contengono non solo tutorial per creare grafiche eccezionali ma anche risorse (gratuite e non) come brushes, pattern e disegni vettoriali già pronti. Penso che questo post sia utile anche a chi vuole avvicinarsi al mondo della grafica computerizzata e non sa come iniziare. Attenzione, questa non è una classifica, l'ordine è casuale.

1. PsdTuts+
PsdTuts+ fà parte del network Tuts+. I tutorial proposti sono di alta qualità in quanto i relatori sono pagati abbastanza per ogni tutorial($150 a post e non è necessario essere dentro al network per presentare un post). Nelle sezioni freebies del sito sono disponibili set da scaricare di brushes, pattern e background.

2. VectorTuts+
Stesso discorso del fratello PsdTuts+ ma riguardo grafica vettoriale

3. Webdesigner Depot
Fondamentalmente un sito sul web design nel quale si possono trovare molti articoli utili per trovare un'ispirazione.

4. Best PhotoShop Tutorials
Qui possiamo trovare un'infinità di tutorial e Brushes per Photoshop.

5. Smashing Magazine
Un magazine di web design con risorse e tutorial per grafica ma anche per programmazione lato server e lato client.

6. Vectors
Fonte molto fornita di immagini vettoriali gratis da scaricare ed utilizzare in Illustrator. Notevole la divisione in categorie che rende la ricerca molto più agevole.

7. PSHero
Anche qui parliamo di photoshop e web design.

8. 1stwebDesigner
Un ragazzo di venti anni che gestisce un ottimo sito con molti tutorial per photoshop.

9. Naldz Graphics
Raccolta di tutorial per photoshop, presenta post su raccolte di font.

10. DaFonts.com e UrbanFonts.com
Non c'entrano nulla con Photoshop e Illustrator ma presentano centinaia di fonts divisi in categorie, indispensabili per creare loghi ed illustrazioni originali.

Continua...

Torna al riassunto...

Di nuovo online!

Questo è un post che rassicurerà tutti i nostri lettori ( XD ), siamo ancora vivi e torniamo online alla grande.

Nello svolgere i progetti di ingegneria del software e programmazione per il web stiamo portando avanti due progetti. Il primo, M3, vi era stato già presentato e, dopo un'attenta ri-progettazione secondo le norme dell'ingegneria del software, è quasi arrivato alla fase di testing che comincerà appena presentato il progetto all'esame.





M3 è un software realizzato in modo da rendere agevole e veloce la gestione del magazzino di piccole aziende quali alimentari e negozi. Se siete interessati a vedere una prima release del nostro prodotto o a commissionarci una versione specifica per la vostra attività vi preghiamo di contattarci (inserire un commento al post non richiede registrazione).
Per gli sviluppatori in erba interessati allo sviluppo di funzionalità per un software gestionale quale M3, posteremo a breve tutorials che guideranno passo-passo nell'implementazione di funzioni quali l'interfacciamento di java con mysql o la realizzazione di interfacce grafiche con java.

Il secondo progetto rappresenterà (forse) il nostro cavallo di battaglia. Il suo nome è Desk!theWay (deskdewuei XD)e si può inserire nella categoria dei social bookmarking services. L'utente che si iscrive ha a disposizione un "desktop" online nel quale inserire ed organizzare i propri segnalibri. Il servizio presenta anche funzionalità di application server e a questo livello stiamo lavorando per poter rendere la vita facile agli sviluppatori esterni di applicazioni.
Il servizio è ancora in fase (mega)-alpha quindi presenta ancora molti bugs. Abbiamo però deciso di metterlo online sul servizio di hosting gratuito altervista.org per vedere come si comporta l'applicazione su un server online.





Le feature già implementate sono:

-aggiunta e gestione (eliminazione e organizzazione ad icone) dei segnalibri;
- plugin per mozilla firefox (che attualmente è l'unico browser completamente supportato), mancano ancora funzionalità di ricerca ma è possibile aggiungere segnalibri dal plugin.
- lettore di video youtube: quando un utente salva un segnalibro riguardante youtube, quest'ultimo può scegliere se entrare direttamente nel sito youtube oppure far leggere il video sul desktop trascinando la relativa icona sull'applicazione (per ora in basso a destra sul desktop).
-lasciata aperta agli sviluppatori la prospettiva per la creazione di applicazioni in php, flash e jsp che ogni utente potrà visualizzare in maniera agevole ed intuitiva.

Questo progetto ha il duplice scopo di organizzare in modo indipendente dal sistema operativo tutti i segnalibri e le risorse che gli utenti della rete utilizzano usualmente, nonchè di agevolare lo sviluppo di applicazioni online.

Il servizio è accessibile qui.
Ricordiamo che il servizio è in fase di testing aperta, aspetti quali la grafica o l'ottimizzazione delle interfacce non sono stati trattati con la massima cura, saremmo molto felici di ricevere suggerimenti ed impressioni sul progetto.

Continua...

Torna al riassunto...