web

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

UX e UI

UX e UI
Il design dell'UX va oltre il design dell'interfaccia utente, infatti il design dell'esperienza utente è un concetto molto più ampio di qualsiasi altro aspetto. Di conseguenza la progettazione dell'interfaccia utente è il sottoinsieme della progettazione dell'esperienza utente.

Sia l'UX che l'interfaccia utente sono fondamentali per costruire un prodotto software di alto livello e poi interagire. Ma i ruoli sono sostanzialmente diversi. UX Design si occupa maggiormente degli aspetti analitici e tecnici che affondano le radici nelle funzionalità del prodotto software, mentre UI Design si occupa maggiormente dell'aspetto dell'applicazione.

Volendo fare una analogia, la progettazione dell'UX è come progettare un edificio. Il design dell'interfaccia utente è come la decorazione di interni.

Why UX Design Must Be the Foundation of Your Software Product
wikipedia UX
wikipedia UI
Beautiful and functional interfaces


categorie: 

Headless Chrome

headless chrome

A cosa può servire un browser senza la parte grafica (GUI) ? Ci permette di avere un tool in più nel nostro arsenale, per aumentare il livello di automazione e integrarsi nei propri workflow. Un browser che viene governato via CLI (command line interface) permette di cancellare i task tediosi e ripetitivi, come il testing, e ci mette a disposizione tutte le capacità di un software così complesso e potente, concatenarle per inventarsi modi di fare totalmente nuovi, che sarebbero immediatamente scartati se dovessero essere compiuti manualmente.

Headless Chrome: DevOps Love It, So Do Hackers, Here’s Why

Examples

headless chrome VS phantomJS
headless chromium
puppeteer - Headless Chrome Node API
introduction to headless browsers


categorie: 

Lo stato delle community artistiche su internet

artsy art communities
Loish ha parlato con Kelsey Ables di Artsy della parabola delle community artistiche su internet.

Dal 1992, anno del caricamento della prima foto sul web, c'è stata una esplosione di immagini, opere e capolavori accessibili istantaneamente da ogni parte del mondo, la scoperta di artisti altrimenti nascosti e forse impossibili da scovare, ma ora le cose si stanno ingarbugliando e stiamo assistendo ad una netta involuzione.

La commercializzazione e gli inevitabili meccanismi economici dietro ai "big player" hanno fatto sì che l'apprezzamento e le interazioni (engagement) spesso si riducano a meri "like" e vuoti cuoricini, e le opere vengano esposte in mezzo a piatti di pasta e foto delle vacanze. Lo spazio per una critica costruttiva e commenti sensati si è ridotto e viene oscurato dal rumore assordante di internet.

[via]

categorie: 

Muuri

Muuri


Muuri (significa "muro" in finlandese, github, demo online) è una libreria JS che implementa responsive, sortable, filterable and draggable grid layouts. Tutte le feature necessarie per il funzionamento di una buon catalogo web interattivo. Con Muuri è facile, per chi smanetta un po' in javascript, costruirsi liste interattive dei propri oggetti, di cui può aver perso quasi irrimediabilmente traccia nella frenesia consumistica del XXI secolo.

E' basata su packery, masonry, isotope e sortable.

E' dotata anche di una sua API.

tutorial

[via]

categorie: 

Video Tutorial con Des Herbert

Des Herbert
Des Herbert è il Salvatore Aranzulla del video making.

Sul suo canale youtube Des spiega in modo diretto, sintetico, chiaro ed efficace quali sono i migliori tool per realizzare video per il web. E molto altro !

Per quanto il testo scritto, meglio ancora se su carta, rimanga assolutamente uno dei modi migliori di comunicare, nel terzo millennio ognuno ha una TV in tasca ed è molto interessante imparare la grammatica del mezzo. Anche se non si aspira a diventare "influenzatori".

Ma per farlo occorre anche saper "impugnare la penna", ed è qui che conoscere i tool giusti può davvero fare la differenza.


Patricia Lockwood - La mente comune

Qualche anno fa, improvvisamente ci siamo accorti che internet era un luogo che non potevamo più lasciare. Patricia Lockwood ha iniziato a tenere un diario di come ci si sentiva ad essere lì, nei giorni della sua disintegrazione, che corrispondeva anche alla disintegrazione della sua mente. Il suo interesse non era accademico. Non le interessava la Singolarità, o l'aumento delle macchine, o altro.

Le interessava la sensazione che i suoi pensieri fossero dettati da qualcuno o qualcosa. Le importava della "mente collettiva", che sembrava avere la febbre. Se riuscissimo a fuggire, a uscire dal grande cranio e a respirare l'aria fresca, se Twitter fosse chiuso per crimini contro l'umanità, cosa staremmo perdendo?

Il flusso sanguigno delle notizie, il consenso entusiasta, la danza al ritmo del tempo. Il portale che ci ha detto, ogni volta che l'abbiamo aperto, esattamente quello che stava succedendo ora. Le è sembrato opportuno scriverlo in terza persona perché non si sentiva più come se stessa. Ecco come è cominciato.

[via]

Jen Simmons: il web che ci aspetta

Jen Simmons è una esperta di web design per Mozilla. In questo video di 50 minuti racconta gli ultimi 25 anni di storia dei siti e dei browser partendo dal "flow" layout degli anni '90, poi i siti realizzati con tabelle rigide e immagini fatte a pezzi, l'era di flash e così via.

E tutto sta per cambiare ancora una volta.

podcast: the web ahead
github
codepen
mozilla hacks
youtube
twitter


categorie: 

masayume Boardgame Collector (isotope)

masayume Boardgame Collector (isotope)


Il progettino di questa settimana si chiama Boardgame Collector.

E' una semplicissima front-end webapp per la gestione della propria collezione di giochi da tavolo. E' basata su isotope, che le permette filtraggio e ordinamento dei giochi, al momento in base a nome, anno, complessità e durata. Ma sono possibili funzioni più complesse.

Per inserire i giochi occorre destreggiarsi un po' con JSON, in particolare con il file boardgames.json, e poi occorre popolare manualmente la directory img per poter visualizzare anche le immagini dei giochi.

Con una serie di personalizzazioni è possibile usarlo per visualizzare qualsiasi tipo di collezione o insieme di dati in generale.


categorie: 

High Availability e Scaling Best Practices

High Availability e Scaling Best Practices
High Availability e Scaling Best Practices è una di quelle pagine su repository con versioning che è un elenco aggiornato di articoli selezionati per illustrare le best practice nella costruzione di sistemi di back-end ad alta scalabilità, alta disponibilità, alta stabilità, alte prestazioni e alta intelligenza.

I concetti sono spiegati negli articoli degli ingegneri più rinomati del settore e che sono dei riferimenti affidabili. I casi d'uso sono presi da sistemi testati in produzione che servono da milioni a miliardi di utenti concorrenti.


Webassembly - Tiny Emus

Tiny Emus 8 bit
Ben sei emulatori a 8-bit, tutti scritti in C e compilati su WebAssembly, una tecnologia che consente di eseguire codice non JavaScript nel browser.

E questo è vero, ma c'è molto di più. La specifica è scritta in un modo molto interessante. WebAssembly ("wasm") è completamente indipendente dal web. Il web è un ambiente particolare in cui Wasm è inserito, ma non è in realtà necessario utilizzare wasm. Altre API possono essere create, con le loro interfacce, per fare varie cose. Sul web, è possibile scrivere un programma che disegna grafica utilizzando WebGL. Ma si può anche scrivere un programma desktop che incorpora un interprete di WebAssembly e fornisce una API OpenGL (o qualsiasi altra API) per la grafica sullo schermo. E quindi il programma WebAssembly può andare in esecuzione sul desktop.

WebAssembly
Running C# Inside the Browser
examples
Andre Weissflog github
webassembly experiments
WebAssembly is more than the web
YAKC (Yet Another KC Emulator)
twitter

tiny8bit
twitter
github

webassembly è il target ufficiale per export in WebGL in Unity 2018.2

[via]

categorie: 

Slant - La community delle raccomandazioni

Slant - La community delle raccomandazioni
Slant è una comunità online che raccomanda prodotti con l'obiettivo di rendere facile trovare la scelta migliore per app, giochi e articoli di vario genere. Un posto facile che raccoglie le informazioni essenziali che ci risparmia di consultare schede, post nei forum e recensioni.

Slant è una rielaborazione completa del funzionamento di questo tipo di ricerche che fa leva su tre principi fondamentali:

- I contenuti sono scritti da persone che si aiutano a vicenda per essere informati, senza marketing che cerca di imporre marche.
- Ognuno dovrebbe avere la possibilità di scegliere il prodotto migliore senza che questo richieda competenze specifiche.
- Le informazioni sono organizzate sulle domande del cliente che sta cercando di informarsi (es. i migliori computer portatili per gli studenti di design sotto i 1000 euro), non singoli prodotti come sui grandi store online.

Building Slant
What is Slant
Get Started


categorie: 

Codeply

codeply logo
Codeply è un Responsive Design Playground (stile Codepen) ed un Frontend Editor. Si possono scegliere e usare i responsive framework, trovare snippet di codice ed utili esempi.

Nella sua homepage sono già in bella mostra alcuni template bootstrap per la realizzazione di carrelli, card layout, barre di navigazione, animazioni e molto altro.

twitter
Codepen vs Codeply
medium


categorie: 

Pages