Designing the Industrial Internet

2,722
-1

Published on

IxDA SF Design Doing Event
August 8, 2013
San Francisco, CA

Published in: Design, Technology
2 Comments
26 Likes
Statistics
Notes
No Downloads
Views
Total Views
2,722
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
103
Comments
2
Likes
26
Embeds 0
No embeds

No notes for slide

Designing the Industrial Internet

  1. 1. Designing the Industrial Internet IxDA SF Design Doing August 8, 2013 Dane Petersen @thegreatsunra @GEDesign
  2. 2. GE is huge
  3. 3. GE is huge 121 years old
  4. 4. GE is huge 121 years old 300,000 employees
  5. 5. GE is huge 121 years old 300,000 employees 14,000 developers
  6. 6. GE is huge 121 years old 300,000 employees 14,000 developers $147 billion revenue
  7. 7. GE is huge 121 years old 300,000 employees 14,000 developers $147 billion revenue $13 billion income
  8. 8. GE is huge 121 years old 300,000 employees 14,000 developers $147 billion revenue $13 billion income
  9. 9. All these industrial things run on software
  10. 10. All these industrial things run on software Connected to the internet
  11. 11. All these industrial things run on software Connected to the internet Generating gobs of data
  12. 12. All these industrial things run on software Connected to the internet Generating gobs of data For their (benevolent) human operators
  13. 13. machines
  14. 14. machines analytics
  15. 15. machines analyticspeople
  16. 16. machines analyticspeople The Industrial Internet
  17. 17. function(){ };
  18. 18. Design Systems
  19. 19. The Industrial Internet Design System (IIDS)
  20. 20. The Industrial Internet Design System (IIDS) A code-based design framework that establishes visual and interactive patterns for all of GE’s industrial internet software.
  21. 21. When I prototype in IIDS, I am prototyping in the same code used by our software engineers.
  22. 22. When I prototype in IIDS, I am prototyping in the same code used by our software engineers. It gets better.
  23. 23. <!DOCTYPE html>
  24. 24.
  25. 25. ♥ Bootstrap
  26. 26.
  27. 27.
  28. 28.
  29. 29. ♥ D3.js
  30. 30.
  31. 31.
  32. 32.
  33. 33. Bootstrap DataTables express {D3.js Font Awesome
  34. 34. How I Work
  35. 35. How I Work I don’t start in code
  36. 36. How I Work I don’t start in code Code is not always the best place to design
  37. 37. How I Work I don’t start in code Code is not always the best place to design It is a single design medium among many
  38. 38. Gotchas
  39. 39. Gotcha #1 — Production Code
  40. 40. Gotcha #1 — Production Code Writing it is way harder than you think
  41. 41. Gotcha #1 — Production Code Writing it is way harder than you think Unless you set expectations, your code will be implemented as-is, and you will be asked to support it
  42. 42. Gotcha #1 — Production Code Writing it is way harder than you think Unless you set expectations, your code will be implemented as-is, and you will be asked to support it Are you the right person to code for IE8?
  43. 43. Gotcha #2 — The Uncanny Valley
  44. 44. Gotcha #2 — The Uncanny Valley Code can make it feel too real
  45. 45. Gotcha #2 — The Uncanny Valley Code can make it feel too real The worst that can happen is that your prototype gets implemented as you built it
  46. 46. Gotcha #2 — The Uncanny Valley Code can make it feel too real The worst that can happen is that your prototype gets implemented as you built it Idiosyncrasies and all
  47. 47. Gotcha #3 — Whiplash
  48. 48. Gotcha #3 — Whiplash As the designer, your job is to account for the strategy as well as the execution
  49. 49. Gotcha #3 — Whiplash As the designer, your job is to account for the strategy as well as the execution You are responsible for the 10,000-foot view and the 10-inch view
  50. 50. Gotcha #3 — Whiplash As the designer, your job is to account for the strategy as well as the execution You are responsible for the 10,000-foot view and the 10-inch view Switching between these contexts is hard, and you need to get good at it
  51. 51. Set expectations
  52. 52. Set expectations Establish clear boundaries
  53. 53. Set expectations Establish clear boundaries Communicate early and often
  54. 54. Remember
  55. 55. Remember You are an advocate for the user
  56. 56. Questions? Get in touch! @thegreatsunra @GEDesign dane@ge.com
  1. A particular slide catching your eye?

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

×