Wireframes Rulez - Santangelo

504 views
419 views

Published on

Slides from Mirko Santangelo talk @ codemotion roma 2014

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
504
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
16
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Wireframes Rulez - Santangelo

  1. 1. @mirkosantangelo Hello World visual designer
  2. 2. photocredit by brief Design DEVELOP DEPLOY
  3. 3. …bozza strutturale di un sito, applicativo web o software. I wireframe sono estremamente utili in quanto permettono di individuare subito le dinamiche del progetto in termini di usabilità 
 ed utilizzo pratico, i punti critici e quelli che richiedono uno sviluppo più accurato 
 o miglioramenti…. Wikipedia
  4. 4. prototype wireframe mockup COST FIDELITY L H L H sketch
  5. 5. Tell a Story
  6. 6. modulo
  7. 7. modulo componenti
  8. 8. modulo componenti contenuti
  9. 9. Costruire un sistema, non screenshot.
  10. 10. E1 eo 63 ro 4 o 47 o 0-1-2 1 2 3 4 5 Stupore, Sorpresa Ammirazione, Fiducia Gioia, Serenità Fierezza, Orgoglio E1 eo 79BA63 Cinabro Chiaro -2 -1 0 1 2 3 4 5 426636 649951 79BA63 70DB42 83EB46 8EF760 A5FF82 DBFFD1 F7B134 Giallo Indiano -2 -1 0 1 2 3 4 5 664814 996E20 F7B134 FFC142 FFCA5F FFD37B FFE5B0 FFEDCA EA5C47 Vermiglione Chiaro -2 -1 0 1 2 3 4 5 66281F 993B2E EA5C47 FF765E FF8A76 FF9D8D FFC3B9 FFD6CF 4EADE1 Blu Ceruleo -2 -1 0 1 2 3 4 -2 -1 0 1 2 3 4 79BA63 Cinabro Chiaro -2 -1 0 1 2 3 4 F7B134 Giallo Indiano -2 -1 0 1 2 3 4 EA5C47 Vermiglione Chiaro
  11. 11. I wireframes sono degli strumenti di comunicazione.
  12. 12. DESIGNER DEVELOPERVS
  13. 13. CLICK
  14. 14. definire il flusso
  15. 15. best practices non devono essere esteticamente perfetti for wireframes
  16. 16. best practices comunicare le scelte sull’organizzazione, priorità e navigazione dei contenuti for wireframes
  17. 17. best practices impiegati nei team come documentazione per feedback e analisi for wireframes
  18. 18. how to Balsamiq Mockups Omnigraffle Sketch KeynoteIllustrator Axure
  19. 19. how to Pop AppInVision App
  20. 20. Wireframes e UX?
  21. 21. Interazioni Complesse Emotional Design Responsive Web
  22. 22. Grazie! @mirkosantangelo

×