Designing the Industrial Internet
IxDA SF Design Doing
August 8, 2013
Dane Petersen
@thegreatsunra
@GEDesign
GE is huge
GE is huge
121 years old
GE is huge
121 years old
300,000 employees
GE is huge
121 years old
300,000 employees
14,000 developers
GE is huge
121 years old
300,000 employees
14,000 developers
$147 billion revenue
GE is huge
121 years old
300,000 employees
14,000 developers
$147 billion revenue
$13 billion income
GE is huge
121 years old
300,000 employees
14,000 developers
$147 billion revenue
$13 billion income
All these industrial things run on software
All these industrial things run on software
Connected to the internet
All these industrial things run on software
Connected to the internet
Generating gobs of data
All these industrial things run on software
Connected to the internet
Generating gobs of data
For their (benevolent) human...
machines
machines
analytics
machines
analyticspeople
machines
analyticspeople
The Industrial Internet
function(){
};
Design Systems
The Industrial Internet Design System (IIDS)
The Industrial Internet Design System (IIDS)
A code-based design framework that
establishes visual and interactive pattern...
When I prototype in IIDS, I am
prototyping in the same code
used by our software engineers.
When I prototype in IIDS, I am
prototyping in the same code
used by our software engineers.
It gets better.
<!DOCTYPE html>
♥
♥ Bootstrap
♥
♥
♥
♥ D3.js
♥
♥
♥
Bootstrap
DataTables
express
{D3.js
Font Awesome
How I Work
How I Work
I don’t start in code
How I Work
I don’t start in code
Code is not always the best place to design
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
Gotchas
Gotcha #1 — Production Code
Gotcha #1 — Production Code
Writing it is way harder than you think
Gotcha #1 — Production Code
Writing it is way harder than you think
Unless you set expectations, your code
will be impleme...
Gotcha #1 — Production Code
Writing it is way harder than you think
Unless you set expectations, your code
will be impleme...
Gotcha #2 — The Uncanny Valley
Gotcha #2 — The Uncanny Valley
Code can make it feel too real
Gotcha #2 — The Uncanny Valley
Code can make it feel too real
The worst that can happen is that your
prototype gets implem...
Gotcha #2 — The Uncanny Valley
Code can make it feel too real
The worst that can happen is that your
prototype gets implem...
Gotcha #3 — Whiplash
Gotcha #3 — Whiplash
As the designer, your job is to account for
the strategy as well as the execution
Gotcha #3 — Whiplash
As the designer, your job is to account for
the strategy as well as the execution
You are responsible...
Gotcha #3 — Whiplash
As the designer, your job is to account for
the strategy as well as the execution
You are responsible...
Set expectations
Set expectations
Establish clear boundaries
Set expectations
Establish clear boundaries
Communicate early and often
Remember
Remember
You are an advocate for the user
Questions? Get in touch!
@thegreatsunra
@GEDesign
dane@ge.com
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Designing the Industrial Internet
Upcoming SlideShare
Loading in...5
×

Designing the Industrial Internet

2,277

Published on

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

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

No notes for slide

Transcript of "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.

×