@Fabbrucci
Welcome
@Fabbrucci
@Fabbrucci
6 volontari da formare 2 team di 3 persone
@Fabbrucci
Cominciamo con un GIOCO
@Fabbrucci
Una meravigliosa estate
Si disegna in silenzio
Seguite le istruzioni che vi darò su un foglio
Avete tutti gli s...
@Fabbrucci@Fabbrucciicona di Samuel Q. Green - the Noun Project
@Fabbrucci
Squadra A
Disegnare una meravigliosa estate con
fiori rossi e blu in un prato verde, alcune
mucche e degli uccel...
@Fabbrucci
Squadra B
• 10 fiori blu con 5 petali ciascuno

• 5 fiori blu con 6 petali ciascuno

• 13 fiori rossi con 6 petali...
@Fabbrucci
La vision era la stessa
Disegnare una meravigliosa estate …
@Fabbrucci
Quale vi piace di più?
Disegno A? [su le mani]
Disegno B? [su le mani]
@Fabbrucci
@Fabbrucci
I dettagli aiutano a raggiungere la vision?
Quando sviluppate un task

vi ricordate la vision del progetto/prod...
@Fabbrucci
Lean UX Development
Approach and toolkit
@Fabbrucci
Codemotion 2014, Roma
@Fabbrucci
Ciao, sono Fabio
Dipendente, imprenditore, startupper; ora freelancer
Frontend Developer presso GNV & Partners
...
@Fabbrucci@Fabbrucci
Vision di questo talk
Condividere con voi la mia esperienza 

nell’intento di fornivi strumenti 

da ...
@Fabbrucci
No!
@Fabbrucci
@Fabbrucci
Fonti
@Fabbrucci
Cos’è #leanux
Roadmap
Approcci alla #leanux
Cosa posso fare io come Developer
@Fabbrucci
@Fabbrucci
Donald Arthur “Don” Norman
Cos’è #leanux @Fabbrucci
User experience
encompasses
all aspects of the end-user's
i...
@FabbrucciCos’è #leanux
Jeff Gothelf
Lean UX is the practice
of bringing the true nature
of a product to light faster,
in ...
@FabbrucciCos’è #leanux
Lean UX significa
progettare UX
applicando
principi lean.
dal tizio qui presente
Fabio Fabbrucci
@Fabbrucci
Roadmap
Cos’è #leanux
Approcci alla #leanux
Cosa posso fare io come Developer
@Fabbrucci
@Fabbrucci
Proposte e azioni
Approcci alla #leanux
@FabbrucciApprocci alla #leanux
Trasparenza e vision
@Fabbrucci
Codesign
Approcci alla #leanux
@Fabbrucci
Divergere e convergere
Approcci alla #leanux
@Fabbrucci
Trovare il giusto linguaggio
Approcci alla #leanux
@Fabbrucci
Interruzioni e urgenza
http://www.hanselman.com/blog/ScottHanselmansCompleteListOfProductivityTips.aspx
Approcc...
@Fabbrucci
Delega
Approcci alla #leanux
@Fabbrucci
Parliamo un po’
di iterazioni …
Approcci alla #leanux
@Fabbrucci
Utenti Team
Approcci alla #leanux
@Fabbrucci
Utenti Cliente
Team
Approcci alla #leanux
@Fabbrucci
Iterazioni: primo approccio
http://bit.ly/1mOepcT
Approcci alla #leanux
No fallimento e “ni” opportunità
Milest...
@Fabbrucci
Si possono prioritizzare per:
Valore finanziario
Costo
Conoscenza
Riduzione del rischio
User stories
Sono un req...
@FabbrucciApprocci alla #leanux
Incertezza
Tempo
Certezza
@FabbrucciApprocci alla #leanux
Esplorazione
How
What
How
What
@FabbrucciApprocci alla #leanux
Quick but
unsustainable
wins
I
Enduring
success
II
Slow failure
III
Fast failure
IV
Right ...
@FabbrucciApprocci alla #leanux
Iterazioni: secondo approccio
Framework di ipotesi
Roadmap condivisa
Iterazioni “retroatti...
@Fabbrucci
https://twitter.com/Icelord/status/423739304691912705/photo/1
Approcci alla #leanux
Coaching
@Fabbrucci
Soft Linking
Approcci alla #leanux
Business vision
Execution
Strategy
@Fabbrucci
Paura di perdere il controllo
Approcci alla #leanux
@Fabbrucci
Roadmap
Cos’è #leanux
Approcci alla #leanux
Cosa posso fare io come Developer
@Fabbrucci
@Fabbrucci
Cosa posso…
cosa dovrei
Cosa posso fare io come Developer
@Fabbrucci
Uscire allo scoperto
Cosa posso fare io come Developer
Deploy automatico #continuous-delivery
Setting dell’envi...
@Fabbrucci
Ridurre gli sprechi
Styleguide Development
Cosa posso fare io come Developer
@Fabbrucci
È un dizionario
Designer
Developer
Cliente
Cosa posso fare io come Developer
Styleguide
@Fabbrucci
https://github.com/styleguide
Cosa posso fare io come Developer
@Fabbrucci
https://ux.mailchimp.com/patterns
Cosa posso fare io come Developer
@FabbrucciCosa posso fare io come Developer
Un esempio di interazione
Frontender campiona testo
Designer crea PSD
Frontend...
@FabbrucciCosa posso fare io come Developer
Problemi
Il design rischia di esplodere negli stili
Il design rischia di blocc...
@Fabbrucci
Proviamo
un approccio
più semantico …
Cosa posso fare io come Developer @Fabbrucci
@FabbrucciCosa posso fare io come Developer @Fabbrucci
@FabbrucciCosa posso fare io come Developer
Caratteristiche
Manutenibile
Accessibile
Azionabile
@Fabbrucci
@FabbrucciCosa posso fare io come Developer
Accessibile
Capistrano + EC2
Multistage
Customized:
Silex + Twig + Yeoman + Bo...
@FabbrucciCosa posso fare io come Developer
Manutenibile
Testing
CSS ad oggetti o modulare
@Fabbrucci
@FabbrucciCosa posso fare io come Developer
CSS Modulare
OOCSS
Precompilatori (LESS, SASS)
Atomic Design
BEM, SMACSS
@Fabb...
@FabbrucciCosa posso fare io come Developer
Testing
Testing CSS: Phantom CSS
Testing JS: Phantom JS
http://csste.st
@Fabbr...
@FabbrucciCosa posso fare io come Developer
@FabbrucciCosa posso fare io come Developer
Come developer posso…
aiutare a rimuovere gli sprechi
uscire allo scoperto
@Fa...
@FabbrucciCosa posso fare io come Developer
Come developer dovrei…
lavorare sulle mie soft-skill
sviluppare un dizionario ...
@FabbrucciCosa posso fare io come Developer
Alzare lo sguardo
Agile non è un framework.

Che cos’è? Se lo cerco, per quale...
@Fabbrucci
Grazie a queste aziende
@Fabbrucci
Grazie a tutti
Domande?

http://fabbrucci.me

fabio.fabbrucci@gmail.com
@Fabbrucci
Upcoming SlideShare
Loading in …5
×

Lean UX Development - Approach and toolkit - Fabbrucci

509
-1

Published on

Slides from Fabio Fabbrucci talk @Codemotion Roma 2014

Published in: Technology
1 Comment
1 Like
Statistics
Notes
No Downloads
Views
Total Views
509
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
12
Comments
1
Likes
1
Embeds 0
No embeds

No notes for slide

Lean UX Development - Approach and toolkit - Fabbrucci

  1. 1. @Fabbrucci Welcome @Fabbrucci
  2. 2. @Fabbrucci 6 volontari da formare 2 team di 3 persone @Fabbrucci Cominciamo con un GIOCO
  3. 3. @Fabbrucci Una meravigliosa estate Si disegna in silenzio Seguite le istruzioni che vi darò su un foglio Avete tutti gli strumenti che servono 1 minuto di tempo per disegnare insieme http://blog.crisp.se/2009/02/18/davidbarnholdt/1234986060000
  4. 4. @Fabbrucci@Fabbrucciicona di Samuel Q. Green - the Noun Project
  5. 5. @Fabbrucci Squadra A Disegnare una meravigliosa estate con fiori rossi e blu in un prato verde, alcune mucche e degli uccelli in volo mentre il sole splende
  6. 6. @Fabbrucci Squadra B • 10 fiori blu con 5 petali ciascuno • 5 fiori blu con 6 petali ciascuno • 13 fiori rossi con 6 petali ciascuno • 2 mucche con 3 macchie nere • 1 mucca con 5 macchie nere • 2 uccelli nell’angolo in alto a sinistra • 3 uccelli nel centro • 1 sole con cinque raggi solari Disegnare una meravigliosa estate con
  7. 7. @Fabbrucci La vision era la stessa Disegnare una meravigliosa estate …
  8. 8. @Fabbrucci Quale vi piace di più? Disegno A? [su le mani] Disegno B? [su le mani] @Fabbrucci
  9. 9. @Fabbrucci I dettagli aiutano a raggiungere la vision? Quando sviluppate un task vi ricordate la vision del progetto/prodotto? Trovate delle analogie con il vostro lavoro? Riflettiamo @Fabbrucci
  10. 10. @Fabbrucci Lean UX Development Approach and toolkit @Fabbrucci Codemotion 2014, Roma
  11. 11. @Fabbrucci Ciao, sono Fabio Dipendente, imprenditore, startupper; ora freelancer Frontend Developer presso GNV & Partners Agile practitioner presso Avanscoperta Mi piace mangiare, conoscere le persone, Scrubs @Fabbrucci
  12. 12. @Fabbrucci@Fabbrucci Vision di questo talk Condividere con voi la mia esperienza nell’intento di fornivi strumenti da sperimentare nel vostro team
  13. 13. @Fabbrucci No! @Fabbrucci
  14. 14. @Fabbrucci Fonti
  15. 15. @Fabbrucci Cos’è #leanux Roadmap Approcci alla #leanux Cosa posso fare io come Developer @Fabbrucci
  16. 16. @Fabbrucci Donald Arthur “Don” Norman Cos’è #leanux @Fabbrucci User experience encompasses all aspects of the end-user's interaction with the company, its services, and its products.
  17. 17. @FabbrucciCos’è #leanux Jeff Gothelf Lean UX is the practice of bringing the true nature of a product to light faster, in a collaborative, cross-functional way that reduces the emphasis on through documentation while increasing the focus on building a shared understanding of the actual product experience being designed.
  18. 18. @FabbrucciCos’è #leanux Lean UX significa progettare UX applicando principi lean. dal tizio qui presente Fabio Fabbrucci
  19. 19. @Fabbrucci Roadmap Cos’è #leanux Approcci alla #leanux Cosa posso fare io come Developer @Fabbrucci
  20. 20. @Fabbrucci Proposte e azioni Approcci alla #leanux
  21. 21. @FabbrucciApprocci alla #leanux Trasparenza e vision
  22. 22. @Fabbrucci Codesign Approcci alla #leanux
  23. 23. @Fabbrucci Divergere e convergere Approcci alla #leanux
  24. 24. @Fabbrucci Trovare il giusto linguaggio Approcci alla #leanux
  25. 25. @Fabbrucci Interruzioni e urgenza http://www.hanselman.com/blog/ScottHanselmansCompleteListOfProductivityTips.aspx Approcci alla #leanux Do it now I Decide when to do it II Delegate it III Dump it IV Urgency Importance
  26. 26. @Fabbrucci Delega Approcci alla #leanux
  27. 27. @Fabbrucci Parliamo un po’ di iterazioni … Approcci alla #leanux
  28. 28. @Fabbrucci Utenti Team Approcci alla #leanux
  29. 29. @Fabbrucci Utenti Cliente Team Approcci alla #leanux
  30. 30. @Fabbrucci Iterazioni: primo approccio http://bit.ly/1mOepcT Approcci alla #leanux No fallimento e “ni” opportunità Milestones
  31. 31. @Fabbrucci Si possono prioritizzare per: Valore finanziario Costo Conoscenza Riduzione del rischio User stories Sono un requisito Approcci alla #leanux espressione di un bisogno
  32. 32. @FabbrucciApprocci alla #leanux Incertezza Tempo Certezza
  33. 33. @FabbrucciApprocci alla #leanux Esplorazione How What How What
  34. 34. @FabbrucciApprocci alla #leanux Quick but unsustainable wins I Enduring success II Slow failure III Fast failure IV Right Way RightThing Rischio
  35. 35. @FabbrucciApprocci alla #leanux Iterazioni: secondo approccio Framework di ipotesi Roadmap condivisa Iterazioni “retroattive” https://twitter.com/search?q=how%20spotify%20build%20a%20product&src=typd
  36. 36. @Fabbrucci https://twitter.com/Icelord/status/423739304691912705/photo/1 Approcci alla #leanux Coaching
  37. 37. @Fabbrucci Soft Linking Approcci alla #leanux Business vision Execution Strategy
  38. 38. @Fabbrucci Paura di perdere il controllo Approcci alla #leanux
  39. 39. @Fabbrucci Roadmap Cos’è #leanux Approcci alla #leanux Cosa posso fare io come Developer @Fabbrucci
  40. 40. @Fabbrucci Cosa posso… cosa dovrei Cosa posso fare io come Developer
  41. 41. @Fabbrucci Uscire allo scoperto Cosa posso fare io come Developer Deploy automatico #continuous-delivery Setting dell’environment #devops Comunicazione al resto del team
  42. 42. @Fabbrucci Ridurre gli sprechi Styleguide Development Cosa posso fare io come Developer
  43. 43. @Fabbrucci È un dizionario Designer Developer Cliente Cosa posso fare io come Developer Styleguide
  44. 44. @Fabbrucci https://github.com/styleguide Cosa posso fare io come Developer
  45. 45. @Fabbrucci https://ux.mailchimp.com/patterns Cosa posso fare io come Developer
  46. 46. @FabbrucciCosa posso fare io come Developer Un esempio di interazione Frontender campiona testo Designer crea PSD Frontender crea CSS
  47. 47. @FabbrucciCosa posso fare io come Developer Problemi Il design rischia di esplodere negli stili Il design rischia di bloccare la prototipazione Il designer si dimentica i line-height
  48. 48. @Fabbrucci Proviamo un approccio più semantico … Cosa posso fare io come Developer @Fabbrucci
  49. 49. @FabbrucciCosa posso fare io come Developer @Fabbrucci
  50. 50. @FabbrucciCosa posso fare io come Developer Caratteristiche Manutenibile Accessibile Azionabile @Fabbrucci
  51. 51. @FabbrucciCosa posso fare io come Developer Accessibile Capistrano + EC2 Multistage Customized: Silex + Twig + Yeoman + Bower + Grunt @Fabbrucci http://demo.patternlab.io/
  52. 52. @FabbrucciCosa posso fare io come Developer Manutenibile Testing CSS ad oggetti o modulare @Fabbrucci
  53. 53. @FabbrucciCosa posso fare io come Developer CSS Modulare OOCSS Precompilatori (LESS, SASS) Atomic Design BEM, SMACSS @Fabbrucci
  54. 54. @FabbrucciCosa posso fare io come Developer Testing Testing CSS: Phantom CSS Testing JS: Phantom JS http://csste.st @Fabbrucci
  55. 55. @FabbrucciCosa posso fare io come Developer
  56. 56. @FabbrucciCosa posso fare io come Developer Come developer posso… aiutare a rimuovere gli sprechi uscire allo scoperto @Fabbrucci
  57. 57. @FabbrucciCosa posso fare io come Developer Come developer dovrei… lavorare sulle mie soft-skill sviluppare un dizionario cross-funzionale lavorare in team non è scontato… e infine… @Fabbrucci
  58. 58. @FabbrucciCosa posso fare io come Developer Alzare lo sguardo Agile non è un framework. Che cos’è? Se lo cerco, per quale motivo? Proviamo a capire ed ascoltare prima di infamare La nostra felicità non è un side-project Alleniamoci ad ottenere il meglio da ciò che abbiamo, e a sfruttare le differenze @Fabbrucci
  59. 59. @Fabbrucci Grazie a queste aziende
  60. 60. @Fabbrucci Grazie a tutti Domande? http://fabbrucci.me
 fabio.fabbrucci@gmail.com @Fabbrucci
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×