The document discusses the concept of design and structure. It defines design as the human activity of inventing a new structure for utility. It discusses different types of structures, including physical, informational, logical, temporal, and social structures. It emphasizes that for a structure to be well-designed, it must have both environmental fitness and internal fitness - fitting with its external context and having coherence between its internal elements.

1. Alex (Jun) Zhu , User Experience Manager, SAP

2. The physicist who is only a physicist can still be a first-class physicist and a most valuable member of society. But nobody can be a great economist who is only an economist - and I am even tempted to add that the economist who is only an economist is likely to become a nuisance if not a positive danger. “ ” Friedrich Hayek The Dilemma of Specialization

3. Multidisciplinary Landscape of Design: Design Business Technology Architecture Urban Planning Economics Linguistics Art System Dynamics Literature Philosophy Psychology Sociology Anthropology Biography Ethics Politics

4. What Is Design ?

5. My Personal Definition of Design: Design refers to the human activity to invent a new structure for utility “ ” Note: This is a very general definition, and should apply to all kinds of design activities, including UX design, industrial design, architectural design, urban design, process design, organization design, you name it.

6. “ Human Activity”: Structure created by design (Mercedes-Benz Bionic Concept Car) Structure created by nature (Boxfish) Please note that I didn’t use “artificial” here. Human activity does not necessarily create artificial design, but can also create so-called natural design or organic design. To be introduced later… Design Non-design

7. “ New”: New structure created by design Existing structure materialized and copied Design Non-design

8. “ Structure”: Structured elements Unstructured (or loosely structured) elements Design Non-design In year 2007, our revenue is 8.2M in manufacturing industry, 3.2M in professional service industry, 1.4M in wholesale/retail, and 1.2M in High-Tech. Please note that “structured/unstructured” is a fairly relative judgment. Finally you can find a structure in almost everything in the world.

9. “ Utility”: Structure created for utility (Schroder House, Gerrit Rietveld) Structure created for expression (Composition in Red, Yellow and Blue, Piet Mondrian) Design Non-design (Art)

10. How Structure Is Structured: Boundary: border with its environment Entities Substructures Ties between entities or substructures Structure of Solar System

11. Environment/Context External Force External Force Tie between substructures Entity with attributes Substructure Boundary Tie between substructures

12. Types of Structures (by Entity): Structure of Physical Entities Structure of Informational Entities (visual elements, data, etc.) Structure of People Structure of Time Structure of Logic Structure of Behaviors/Events/Activities Structure of Mind Structure of Economy Etc.

13. Structure of Physical Entities: Keyboard Layout of BlackBerry The Giant Swiss Army Life

14. Structure of Informational Entities: Typology Map of Metro Line A Typical Portal Layout

15. Structure of People: Organization Hierarchy Social Network Visualization (Jon Kleinberg & Lars Backstrom, Cornell University)

16. Structure of Time: Gantt Chart Outlook Calendar

17. Structure of Logic: A Process Flow If-Else Logic Structure Function show_hide_dynamicpane () { if (!show_flag) { dynamicpane.visibility = “visible”; } else { dynamicpane.visibility = “invisible”; } }

18. Structure of Mind: Taxonomy of “Cognitive Domain” (Professor Bloom, 1956) What’s On A Man’s Mind? (Image source: crazy-jokes.com)

19. Structure of Economy: GDP Structure of Year 2005 (Data Source: National Statistics Bureau) SAP Financial Performance from Google Finance

20. A Few Types of Structure (By Form): Linear Structure Unipolar Network Structure Multipolar Network Structure Matrix Structure Network Structure Nonpolar Network Structure

21. Linear Structure: Guided Activity (Wizard) Linear Structure

22. Matrix Structure: Matrix Structure Horizontal/Vertical Information Architecture Product Mgt. Design Development Product A Product B Product C Function/Product Matrix Org Structure

23. Unipolar Network Structure: Web Portals See Themselves as Hub of Internet Urban Structure of Beijing (image source from Google Map) Unipolar Network Structure

24. Multipolar Network Structure: Typical Information Architecture of A Website Urban Structure of Shanghai (image source from Google Map) Multipolar Network Structure

25. Multipolar Network Structure: Social Network Semantic Network (e.g. Wikipedia) Nonpolar Network Structure Design User Experience Architecture Human Scale Prototype

27. The word ‘ universe ’ is derived from the Old Greek univers, from Latin universa, which combines uni- (the combining form of unus, or ‘one’) with versus (perfect passive participle of vertere, or ‘turn’). The word, therefore, means ‘ all turned into one ’ or ‘ revolving as one ’ or ‘ orbiting as one ’. “ ” Etymology of The Term "Universe” Wikipedia

28. Mathematic Formulas of Tao: Absolute Formula: Pragmatic Formula: M = 6.5

29. Proposed 6.5 Philosophies for UX Design: 1. The city creates the theater and is the theater 2. This is a semi-structured world 3. Goodness of fit: Environmental Fitness 4. Goodness of fit: Internal Fitness 5. The ecosystem, gene, invisible hand, and supply chain 6. Talk, write, and imagine using language 6.5. To design or not design, this is a question

31. Mistério e melancolia de uma rua (Giorgio de Chirico, 1914) Kashgar , 2005 Delhi, 2007 Trastevere, Rome, 2004

32. ” Lewis Mumford The Culture of Cities, 1937 The essential physical means of a city's existence are the fixed site, the durable shelter, the permanent facilities for assembly, interchange, and storage; the essential social means are the social division of labor, which serves not merely the economic life but the cultural process. The city in its complete sense, then, is a geographic plexus, an economic organization, an institutional process, a theater of social action, and an esthetic symbol of collective unity. … The city creates the theater and is the theater . It is in the city, the city as theater, that man’s more purposive activities are formulated and worked out, through conflicting and cooperating personalities , events , groups , into more significant culminations “

33. ” Italo Calvino Chapter 1, Invisible Cities In vain, great-hearted Kublai, shall I attempt to describe Zaira, city of high bastions. I could tell you how many steps make up the streets rising like stairways, and the degree of the arcades' curves, and what kind of zinc scales cover the roofs; but I already know this would be the same as telling you nothing . The city does not consist of this, but of relationships between the measurements of its space and the events of its past : the height of a lamppost and the distance from the ground of a hanged usurper's swaying feet; the line strung from the lamppost to the railing opposite and the festoons that decorate the course of the queen's nuptial procession; the height of that railing and the leap of the adulterer who climbed over it at dawn; the tilt of a guttering and a cat's progress along it as he slips into the same window; the firing range of a gunboat which has suddenly appeared beyond the cape and the bomb that destroys the guttering; the rips in the fish net and the three old men seated on the dock mending nets and telling each other for the hundredth time the story of the gunboat of the usurper, who some say was the queen's illegitimate son, abandoned in his swaddling clothes there on the dock. “

34. ” Italo Calvino Chapter 1, Invisible Cities 宽宏大量的忽必烈汗啊，无论我怎样描述采拉这个有许多巍峨碉堡的城，都是徒劳无功的。 我可以告诉你，像楼梯一样升高的街道有多少级，拱廊的弯度多大，屋顶 上铺着怎样的锌片； 可是我已经知道，那等于什么都没有告诉你 。组成这城市的并不是这些东西而是它的 空间面积 与 历史事件 之间的 关系 ：灯柱的高度、被吊死的篡朝者摆荡的脚与地面的距离；系在灯柱与对面铁栏之间的绳索、女皇大婚巡行时沿路张结的彩带；栅栏有多高、偷情的男子如何在黎明时分跃起爬过它；檐槽的斜度、他闪进窗子时一头猫怎样沿着檐槽走过；突然在海峡外出现的炮艇的火器射程有多远、炮弹怎样轰掉檐槽；鱼网的裂口、坐在码头上的三个老人怎样一面补网一 面交换已经讲过一百次的炮艇和篡朝者的故事 —— 有人说他是在襁褓时就给遗弃在这码头上的、女皇的私生子。 “

35. In order to define this quality in buildings and in towns, we must begin by understanding that every place is given its character by certain patterns of events that keep on happening there . “ ” Christopher Alexander The Timeless Way of Building

36. Now, let’s go back to my definition of design: Design refers to the human activity to invent a new structure for utility. “ ”

37. “ Ends” and “Means” of Design: Structure of Physical Objects Structure of Informational Objects Structure of Logic Structure of Time Structure of Mind Structure of Economy + + + Structure of Behaviors/Events/Activities Structure of People = = + Direct Manipulation Influence Ends

38. Example: Architecture Direct Manipulation Influence Goal  

39. Example: BlackBerry Direct Manipulation Influence Goal  

40. Conclusion: The mission of design is to improve the human emotion (structure of mind), and economic outcome (structure of economy) To achieve this mission, we have to influence the “ structure of events ” (e.g. the process flow) and the “ structure of people ” (e.g. social network), by manipulating the controls, screens, behaviors, information architecture, etc. This also determines the design process : “define the mission” -> “design the stories” -> “design the UI”

42. The “Hard” Part and The “Soft” Part in Cosmos: Three Nebulae in Narrow Band (Source: NASA Website)

43. The “Hard” Part and The “Soft” Part in Our Life: Solid Organization Managership Database Law Engineering BBS Process Browse Left Brain Reality Science Explicit Knowledge Analytic Thinking Quantitative Structuralism … Relatively “Soft” Part Relatively “Hard” Part Liquid Community Leadership Documents Morality Design Wiki Practice Search Right Brain Dream Art/Philosophy Tacit Knowledge Intuition Qualitative Deconstructionism …

44. The Benefit and Cost of “Structure”: Benefit: Regularity & Stability Controllability Predictability Internal force to balance with external force Out-of-the-box Utility Etc. Cost: Cost to construct, deploy, and maintain Inflexibility Diversity Lose: opportunity cost to become other structures

45. Example: In-house Recruiting System Think about what are the benefits and costs for a company to develop an in-house system to manage their recruiting process. Benefit: Regularity & Stability: process standardization Controllability: accountability, policy reinforcement, etc. Predictability: process transparency Internal force: work flow, status management Out-of-the-box Utility: best practices Cost: Cost to construct, deploy, and maintain: development cost, implementation cost, maintenance cost, etc. Inflexibility: what if the process changes dramatically? what a big re-organization happens? What if the approver is on vacation? … Diversity lose: people are forced to use the same process and methods without exceptions

46. Metaphor: A Restaurant That Only Serves Combo Benefit: No need to order one by one Seems to reflect the best practice Etc. But: I like everything but the meat soup, since I am vegetarian!!!

47. The problem, like all those with which we are concerned, is one of balance. Too little liberty brings stagnation and too much brings chaos . “ ” Bertrand Russell

48. Conclusion: Be cautious not to over-structure or over-design . Reach a good balance between being structured and being flexible (unstructured) through: Componentization and Configuration “ Soft Control ” by offering guidance and best practices Leave a “ hole ” to accommodate unstructured activities, and provide a convenient link if possible and necessary. Highly dynamic activities Medium dynamic activities Fixed activities ? Design Time Run Time Link

49. Componentization and Configuration: Service Oriented Architecture: SAP NetWeaver SAP NetWeaver™ Composite Application Framework PEOPLE INTEGRATION Multichannel access Portal Collaboration INFORMATION INTEGRATION Bus. Intelligence Master Data Mgmt Knowledge Mgmt PROCESS INTEGRATION Integration Broker Business Process Mgmt APPLICATION PLATFORM J2EE DB and OS Abstraction ABAP Lifecycle Management

50. Soft Control (Semi-Structure): Graphic Navigation in SAP Profitability Modeling Tool Business Process Foundation in SAP Consolidation Solution

51. Linked “Hole”: Date: xxx City: xxx Purpose: xxx … ? Attach emails Upload receipts Structured Data Unstructured Data Attach scanned receipts Company Expense Policy Ask For Clarifications Print out Paper Receipts + Save as PDF Submit

52. Linked “Hole”: Copy as a link/Paste Automatically determined by Word using Smart Tags Productive Applications (Unstructured) Transaction Systems (Structured)

53. Linked “Hole”: Outlook (Unstructured) Adobe Interactive Form (Semi-structured) Database (Structured)

54. Linked “Hole”: Duet™ - Seamless integrates Microsoft® Office and SAP Backend

55. Linked “Hole”: SAP Performance Mgt. System Customer-Uploaded Image (unstructured) System-generated Data (structured)

57. Fallingwater ( Frank Lloyd Wright, 1936)

58. Fitness: A well-designed structure needs to have 2 different kinds of fitness Environmental Fitness (balance with external forces): Fitness between the structure and its environment/context Internal Fitness (balance with internal forces): Fitness between the elements, substructures, and their ties.

59. Environmental Fitness: Environment/Context External Force External Force

60. Example: BlackBerry New Structure Existing Structure (Environment/Context) Influence Constraint

61. Example: Ross Lovegrove’s Organic Design “ Go” Chair ( Ross Lovegrove ) Ty Nant Water Bottle ( Ross Lovegrove )

62. Example: Natural Language Search Normal Search Engine Natural Search Engine Environment has to adapt to the new structure Good Environmental Fitness Usability Venders China Search Virtual Company A Virtual Company A is a Beijing-based usability service vender… Virtual Company B Virtual Company B was established in 2004 and now has 12 FTEs… Search Engine 1 List me the top 5 usability venders in China Search Virtual Company A Virtual Company A is a Beijing-based usability service vender… Virtual Company B Virtual Company B was established in 2004 and now has 12 FTEs… Search Engine 2

63. There is a quality even meaner than outright ugliness or disorder, and this meaner quality is the dishonest mask of pretended order, achieved by ignoring or suppressing the real order that is struggling to exist and to be served . “ ” Jane Jacobs Urban Thinker

64. The rightness of the form depends, in each one of these cases, on the degree to which it fits the rest of the ensemble. “ ” Christopher Alexander Notes on the Synthesis of Form

65. Challenges: Indefinite possibilities are available to define the boundary between the structure and its environment/context Usually the environment/context is ambiguous to the designers (consider the regularities and irregularities in the world) Usually the environment/context changes over instances Sometimes the environment/context evolves over time

66. Solutions: Find an appropriate scope of the design ( define an appropriate boundary ) An adapted “Reductionism” approach to solve ambiguity: Understand -> Generalize -> Imagine -> Scope -> Model -> Design -> Trial & Error -> Solve Four mindsets: Skeptic -> Dreamer -> Architect -> Scientist Adaptability of the structure, in terms of localization, customization, and personalization (e.g. the surface of sofa can always adapt to the people sitting there) Provide an organic structure that emerges , adapts , and grows (to be addressed later)

67. 1. Define The Border with The Environment

68. Indefinite Possibilities to Set Boundary: Indefinite Possibilities to Set Borders Environment/Context ?

69. He who defines the problem , declares the solution . “ ” Bob Baxley Design Vision Conversation The greatest challenge to any thinker is stating the problem in a way that will allow a solution . “ ” Bertrand Russell Design Vision Conversation

70. Example: Improve the efficiency of my production and distribution Improve the efficiency of my supply chain Result A Result B Supply Chain Efficiency: Vender Managed Inventory Outsourcing Information sharing RFID Internal Production Efficiency: Production Process & Technology Distribution Center Agile manufacturing, JIT (kanban) Etc.

71. Example: Find new technologies to reduce the CO 2 emission Reinvent the ecosystem to reduce the greenhouse gas emission Solve or relieve the “global warming” problem Result A Result B Result C Policies (regulations, taxes, accounting, etc.) Incentives Market/Industrialization Public awareness Alternative Energy CO 2 -reducing Technologies CO 2 Capturing and Reuse (e.g. plastic production, cryogen, petroleum mining, etc.) Or even wilder idea: use CO 2 as cryogen to cool down our planet?

72. Example: Improve the usability of the registration form of our website Improve the registration process of our web site Improve the internet registration experience in general Full Name: * Alex Zhu Email Address: * [email_address] Password: * XXXXXX Repeat Password: * XXXXXX Mailing Address: Line 1: * Other fields… # 1293, Pudong South Manual Registration Shopping Cart Place Order (enter name, email, mailing address, etc.) Automatic Registration Non-registered user Google Toolbar Result A Result B Result C New User Registration Form:

73. A More Radical Solution to Reduce “Transaction Cost”? User Repository Register once for all Website A Call Return Website B Visit Visit Call Return Transaction History recorded Transaction History recorded Credibility Transaction History Favorites Preferences Profile etc. Register Now Register Now

74. General Principles: The broader you defines the boundary, the more likely your solution will have a strategic impact. This is where innovation often occurs. However, this is an economic decision which means you need first consider the capacity (production possibility curve), feasibility, and then do an ROI evaluation A B C D E F 5 4 3 2 1 0 1 2 3 4 5

75. 2. An Adapted “Reductionism” Approach to Solve Ambiguity

76. Architectural design problems can also be referred to as being ‘ wicked problems ’ in that they have no definitive formulation , no explicit ‘stopping rule’ , always more than one plausible explanation , a problem formulation that corresponds to a solution and vice versa, and that their solutions cannot be strictly correct or false. “ ” Peter Powel

77. René Descartes Discourse on the Method of Rightly Conducting the Reason The first was never to accept anything for true which I did not clearly know to be such ; that is to say, carefully to avoid precipitancy and prejudice, and to comprise nothing more in my judgment than what was presented to my mind so clearly and distinctly as to exclude all ground of doubt. The second, to divide each of the difficulties under examination into as many parts as possible , and as might be necessary for its adequate solution. The third, to conduct my thoughts in such order that, by commencing with objects the simplest and easiest to know , I might ascend by little and little, and, as it were, step by step, to the knowledge of the more complex; assigning in thought a certain order even to those objects which in their own nature do not stand in a relation of antecedence and sequence. And the last, in every case to make enumerations so complete, and reviews so general, that I might be assured that nothing was omitted. “ ”

78. Reductionism Methodology: Filter away all that may be in doubt. Divide difficulties to as small pieces as necessary. Start with the simplest problems. Make Lists, Tables, Diagrams. Source: Wikipedia (Term: “Discourse on the Method”)

79. Definition of Reductionism: In philosophy, reductionism asserts that the nature of complex things is reduced to the nature of sums of simpler or more fundamental things. Practical Benefits: Break down complex problems into smaller parts which are more understandable and operable. In this way, specialization and collaboration are possible, and the problem can be solved in a progressive manner Select an order to solve these parts step by step , depending on the complexity of each part and its dependency with other parts. Though reductionism has been criticized a lot in the past 2 centuries (mainly by Holism, Structuralism, and Emergentism who believe “the whole is more than the sum of its parts” ), this is still a very pragmatic approach to solve complex issues regardless of its limitations.

80. Non-human animals could be reductively explained as automata (De Homines 1622) Paul Cézanne believed that all objects can be abstracted as cylinders, spheres, and cones.

81. Constraints of Reductionism: Study a part in isolation , ignoring the interplay between the part and its context Proven to be error-prone by biography science, linguists, chemistry, and many other disciplines (e.g. Being isolated from their contexts, words will lose their meaning; Water has totally different quality with oxygen or hydrogen)

82. An Adapted “Reductionism” Approach: Understand Generalize/ Filter Model Imagine Design Trial & Error Solve Scope ? ? ? x x

83. General Principles: Macro -> Micro Backbone -> Flesh Enumeration: Abundance -> Choice “ Damped” Iteration

84. Macro -> Micro, Backbone -> Fresh Three perspectives to understand a new city: Bird View (Macro thinking, big picture) Night View (Noise filtering, structure, backbone, pattern identification) Attendance (Micro thinking, experience, empathy, validate) Bird View Night View Attendance

85. ” Su Dongpo Handwriting on The Wall of Xilin Looks like a ridge from one perspective, Looks like a peak from another, Knowing not the true face of Lushan Mountain, For I am in its midst . “

86. Metaphor: The Development Process of Baby Week 1 Week 4 Week 6 Week 14 Week 18 Week 22 Week 24 Week 30 Birth 1 year old Product Vision Blueprint Low-Fidelity High-Fidelity Product Delivery Adaptation Image source: http://www.pregnancy.org

87. Seven Bridges of Königsberg: Leonhard Euler Chapter 1, Invisible Cities

88. A “Micro -> Macro” Process: Macro Level Micro Level SM Deliverables UX Deliverables Virtual Company <-> Model Company Role Specifications Personas System-level Requirements Function tree System-level use cases <-> System-level design: Information Architecture Screen flow (very low-fi) UI specs for Common Behaviors Detailed use cases <-> Use Scenarios + UI Mockups + UI Specifications

89. Design Portal: Modal Company FutureTech System Personas Browse by name Browse by organization Search Business Processes Browse Modal Company Company intro Industries Customers & Competitors Organization Structure Information Landscape Now, you are here: Design Portal > Modal Company > Organization Structure

90. Design Portal: Persona FutureTech System Now, you are here: Modal Company Portal > Personas > Kate Zhang Organizational data: Name: Kate Zhang Company: FutureTech Position: Sales Manager Department: Office New York Direct Manager: Feng Tang Subordinates: Nancy Wang , Tony Lee, Xiaoyan Liu, Other information: Computer Skills: Professional Working Environment: shared office Equipments: Laptop, Blackberry, Fax, Printer, Telephone Software: SAP CRM, Outlook, Excel, Word, Powerpoint, WebEx, etc. Responsibilities: As a sales manager in Akron’s office in NY, Kate not only takes care of the sales performance in the east coast, but also needs to… Goals: Wants to maintain a healthy opportunity pipeline in her team Wants to achieve the sales quota Wants the team to be motivated Etc. Business Processes involved: Order to Cash Hire a new employee Expense Reimbursement Management Personas Browse by name Browse by organization Search Business Processes Browse Modal Company Company intro Industries Customers & Competitors Organization Structure Information Landscape

91. Design Portal: System-Level Use Case FutureTech System Personas Browse by name Browse by organization Search Business Processes Browse Company Overview Company intro Industries Customers & Competitors Organization Structure Information Landscape Now, you are here: Design Portal > Business Processes > ERM Process

92. “ Abundance -> Choice” Image source: www.blog.speculist.com

93. “ Damped Iteration”: Field Research Ad-hoc Research Lab Research “ Damped” Iteration Understand ? ? ? x x

94. 3. Four Mindsets For Designers

95. Categorization of Classical Epistemology Realist Some things are independent of mind Idealist Everything is mind dependent Rationalist Some knowledge of the world is independent of our own experience Architect The structure of the mind matches, in some respects, the structure of the world Plato Descartes Dreamer Our mind structures the world Kant Empiricist All knowledge of the world comes from experience Scientist We can gain knowledge of the world, but only through experience Aristotle Locke Russell Skeptic We have no better insight into the workings of our minds than into the world itself Hume Berkeley

96. What Mindsets Are Required in Design? Architect Dreamer Scientist Skeptic Understand Generalize/Filter Imagine Scope Model Design Validate

97. General Principles: Since very few people really have all of these 4 very different mindsets, certain level of specialization in the design process seems to be necessary However, the cost of specialization also needs to be evaluated (e.g. how to make sure the information fidelity across the researchers and designers, etc.). Refer to next section regarding internal fitness “ Focus with context ” approach might be the best option

98. 4. Adaptability to deal with individual differences across instances

99. Different Levels of Adaptability: Localization Industrialization Customization Personalization Country Scale Industry Scale Company Scale Human Scale

100. Example: CSCW Design High Power Distance Culture (mono-nuclear) Medium Power Distance Culture (poly-nuclear) Low Power Distance Culture (semi-homogenous) Centralized Model (hierarchical communication) Decentralized Model (hierarchical + collaboration) Distributed Model (Non-centered, social networking, clique) Organization Structure (Environment) Collaboration Structure (Design) Environmental Fitness

101. Metaphor: Roadway Design in Urban Planning Mono-nuclear (e.g. Beijing) Poly-nuclear (e.g. Shanghai) Low Power Distance Culture (semi-homogenous) Centralized Model Decentralized Model Distributed Model Urban Structure (Environment) Roadway Structure (Design) Environmental Fitness

103. Internal Fitness: Solomon Guggenheim Museum, New York ( Frank Lloyd Wright, 19 59 )

104. This is a cutting board in your kitchen. It is built into the kitchen counter. When you are not using the cutting board it slides into the counter (Picture A). When you need to use it, you slide it out (Picture B). It is very convenient. But wait…you got a new problem. Reason: When you design a structure, you need to consider how all parts work together. Internal Fitness: Source: http://www.baddesigns.com

105. Form ever follows function. “ ” Louis Henri Sullivan Lippincott's Magazine Form follows function - that has been misunderstood. Form and function should be one, joined in a spiritual union. “ ” Frank Lloyd Wright

106. Interplay between Form and Function: Function is the origin of the form Form is constrained by the function, but not deterministic (the same function can be satisfied by various forms) Diversity of forms embodies uniqueness (culture, personality, aesthetics, etc.) Form can also have an influence over function and make the latter evolve

107. Internal Fitness: External Force Internal Force External Force Internal Force

108. What’s Internal Fitness? Balance among internal forces: Conceptual Integrity (different goals and strategies) Connection and communication (silos, misunderstandings, etc.) Consistency (functional, behavioral, visual, mental model, etc.)

109. Challenges: For complex systems, reductionism approach seems to be the only pragmatic way to make specialization & collaboration possible Parts are studied and solved apart from the whole (context), and therefore there is a potential fallacy of composition (whole does not equal to the sum of parts) A part’s neighbors are changing over time Dilemma of specialization: different organizations, goals, knowledge, experience, skills, locations, culture, languages, personality, you name it Hard to balance the efficiency and the communication intenseness among the people who work on these parts

110. A “Fallacy of Composition” Example in Economics: If an individual farmer adopts a new cultivation technique , he will earn more from the improved production efficiency. What happens if all famers adopt this new technology? D 1 P 1 A S 1 S 2 B P 2 Q 1 Q 2 Quantity Price Answer: The famers will earn less if all of them adopt the technology!

111. Any organization that designs a system (defined broadly) will produce a design whose structure is a copy of the organization's communication structure. “ ” Melvin Conway Datamation, 1968

112. Solutions: Introduce systems thinking to understand the overall system landscape and interdependencies. This might be done by a few architects but with the whole group involved and informed Carefully break down the whole into the parts, to avoid over fragmentation. Standards , guidelines , governance , etc. Patterns: share the same language (to be addressed later) “ Focus with context ” when studying the parts Try to align the organization structure with the system structure Improve communication model in the entire organization, across disciplines (design, research, development, PM, marketing, support, etc.) and across functional parts (products, components, etc.)

113. If you wish to influence or control the behavior of a system, you must act on the system as a whole . Tweaking it in one place in the hope that nothing will happen in another is doomed to failure—that’s what connectedness is all about. “ ” Dennis Sherwood Systems Thinking

114. Systems Thinking: Systems Thinking , also known as System Dynamics, focuses on how the thing being studied interacts with the other constituents of the system. Therefore instead of isolating smaller and smaller parts of a system, systems thinking involves a broader view , looking at larger and larger numbers of interactions.

115. Systems Thinking Diagram: Example: Visualize a more completed landscape of the farmer’s problem. Technology Advancement Quantity Revenue Unit Price + + + - +

116. Example: Travel Management Cultural Model From SAPEnjoy Project (joint project with InContext, Enterprise)

118. Plants in The Nature (Alex) Prosperity in A Market (Bab)

119. Challenges: Environment changes over time Mechanic structure does not scale For complex problems, chaos ubiquitously exists in both environment and the internal organization, which makes up-front and centralized design/control impossible We are witnessing a “ Unipolar –> Multipolar –> Nonpolar” paradigm shift in the structure of our world in a lot of areas (which may be explained the Entropy theory), and design has to match in many cases

120. Environment Changes Over Time: For example, after a company has deployed an enterprise application: The legal requirements may change Business environment may change Business process may change Company policy may change Organization structure may change IT landscape may change Etc.

121. Chaos (deterministic, unpredictable): ” A butterfly's wings might create tiny changes in the atmosphere that ultimately cause a tornado to appear. “ Edward Lorenz Image source from Wikipedia

122. Langton’s Virtual Ant: A 4-state 2-dimensional Turing machine invented in the 1980s. The ant starts out on a grid containing black and white cells, and then follows the following set of rules. If the ant is on a black square, it turns right and moves forward one unit. If the ant is on a white square, it turns left and moves forward one unit. When the ant leaves a square, it inverts the color. Result from the Computational Simulation

123. Our World Is Getting More Homogeneous! Monopoly Economy /Command Economy Corporate Economy Consumer Economy (Liberalism) Multipolar World (after 1990) Bipolar World (before 1990) Globalization (till ?) Modernism Realism Post-modernism Web 1.5 (Integration) Web 1.0 (Centralized Production) Web 2.0 (Mash-up, Collective Intelligence, etc.) Economy World Politics Art Internet

124. Solutions: Embrace the complexity, irregularity, and unpredictability of the environment. Shift from the “ machine ” metaphor to “ organism ” metaphor and “ market ” metaphor. “ Organism” metaphor: Ecosystem Seed Gene Evolves, adapts, and grows “ Market” metaphor: “ The Invisible Hand” Self-interest and Incentive Supply Chain Specialization and Transaction cost

125. 1. The “Organism” Metaphor

126. ” Frank Lloyd Wright An Organic Architecture Let the design: be inspired by nature and be sustainable, healthy, conserving, and diverse. unfold, like an organism, from the seed within . exist in the &quot;continuous present&quot; and &quot; begin again and again &quot;. follow the flows and be flexible and adaptable . satisfy social, physical, and spiritual needs. &quot; grow out of the site &quot; and be unique. celebrate the spirit of youth, play and surprise. express the rhythm of music and the power of dance. “

127. “ Organism” Metaphor: Seed Cell Gene

128. Sophistication Achieved by Genetic Algorithm: Complex or sophisticated outcomes derived from groups of individuals following simple rules. Craig Reynolds’s Computational Model “Boids” Simple Rules: Separation Alignment Cohesion

129. Organic Model: Environmental Fitness at Time Point 1 T 1 Environmental Fitness at Time Point 2 T 2 T 1 T 2 Environmental Fitness at Time Point 1 Environmental unfitness at Time Point 1 Inorganic Structure Organic Structure Environment Environment Environment Environment

130. Man-made Creature by Theo Jansen by using Genetic Algorithm

131. Wikipedia: A self-organized encyclopedia that grows everyday

132. Tagging: an emerging structure with no up-front planning or central control Tags , Semi-structured , Collective Intelligence , Evolve , Flexibility , Democracy , Organic , Discoverability , Information Visualization , Decentralized

133. Amazon’s Recommendation Engine: Intelligence based on simple algorithms

134. Social Network: Another example of growing structure

135. 2. The “Market” Metaphor

136. He generally, indeed, neither intends to promote the public interest, nor knows how much he is promoting it. … He intends only his own gain , and he is in this, as in many other cases, led by an invisible hand to promote an end which was no part of his intention. … By pursuing his own interest he frequently promotes that of the society more effectually than when he really intends to promote it. “ ” Adam Smith The Wealth of Nations

137. Motivation is the art of getting people to do what you want them to do because they want to do it. “ ” Dwight D. Eisenhower The Wealth of Nations

138. Order Achieved by Self-Interest: Complex or sophisticated outcomes derived from groups of individuals following simple rules (self-interest in this case). Free Market (Order Under The Chaos) Simple Rules: Buy more when price goes down Sell more when price goes up D S 1

139. Market-driven Modal: Environment Environment Environmental Fitness at Time Point 1 Environment Environmental Fitness at Time Point 2 T 2 T 1 T 2 Environmental Fitness at Time Point 1 Environmental unfitness at Time Point 1 Ego-centered Structure Open Structure and Open Market Environment T 1 Environment

140. Supply Chain in Different Paradigms: Value Supply (Design Time) Value Consumption (Run Time) Unipolar paradigm (e.g. web 1.0) Multipolar paradigm (e.g. web 1.5) Nonpolar paradigm (e.g. web 2.0)

141. Specialization and Marketplace: Each supplier only needs to take care of a much smaller scope of problem and with much more regularity Each supplier is more responsive and adaptable to its local environment change (self-interest driven), and therefore the whole market is more adaptable The mission of design is to reduce the transaction cost and reach the best economic efficiency

142. Transaction Cost Reduced by SOA: High Transaction Cost (n=10) Lower Transaction Cost (n=5) SOA

143. Open Source Example: Firefox’s Extensions

144. Yahoo Widget

145. Commonalities Between Wal-Mart & Yahoo Widget? Supply Chain of Wal-Mart Supply Chain of Yahoo Widget RFID VMI Information Sharing EDI Protocol XML Widget Repository Customer (One-stop Shopping Experience) User (Integrated User Experience) SDK Wal-Mart P&G Yahoo Google

146. “ SOA” As A “Dissection Table”: Beautiful as the chance encounter of a sewing machine and an umbrell a on a dissection table . “ ” Comte de Lautreamont Maldoror

147. EBay: Order Achieved by Reputation Mechanism (self-interest)

148. Market-driven Approach to Relieve Global Warming: Greenhouse Gas Emission Trading

149. Second Life: self-created and self-organized society

150. Google: A Market Place for Websites to Attract Customers

151. Mash-up: Google Map as a service + Smugmug as photo sharing service

153. Language As The Greatest Invention of Human Beings: Key functions of language: Communicate Document Learn Think and develop new knowledge: people subconsciously use language to construct ideas in mind Why I think language as the greatest human invention: The indefinite and complex world can be represented and understood by our finite and less complex language , maybe not 100% completely and accurately. How could? The structure of the language somehow represents the structure of the world The language finds the regularities in the irregularities , or in other words, the patterns of the complex . Language evolves, adapts, and grows over time, contributed by collective intelligence of people across generations

154. Commonality Between Language and Design? Key functions of design: Communicate Innovate Why language is needed in design: External Fitness: design should reflect the structure of the environment (or the world); design should communicate with users in an understandable manner Internal Fitness: the parts need to communicate with each other; designers who work on these parts need to communicate with each other in an understandable manner Organicism: to create an organic structure that evolves, adapts, and grows , a common language should be provided, to enable the collective intelligence

155. Etymology of “Design” in Chinese Language: The Word “Design” in Chinese This component means “language”

156. Etymology of “Design” in Chinese Language: Etymology of These 2 Chinese Characters by Xu Shen (100 AC) Control people by using language Count numbers by using language Language Control, drive, employ Language Ten

157. How Chinese Characters Are Structured: Word finally composited (meaning: design, create) High-level Composited Building Blocks (meaning: speak, language) Atomic Building Blocks (no meaning) Low-level Composited Building Blocks (meaning: mouth) Metaphor, Symbolize Metaphor, logical aggregates, pictophonetics Layout Algorithm Layout Algorithm Metaphor, logical aggregates, pictophonetics

158. How Words, Sentences, and Paragraphs Are Structured: Character (meaning: design, create) Character (meaning: ideas) Action + Object Algorithm Word with more complete but fixed meaning (meaning: design) Metaphor, Reference Metaphor, Reference Grammar Sentence with situational meaning (meaning: help me to design) Metaphor, Reference, Express Context, Style Paragraph with more situational and dynamic meaning (context more important than words)

159. How Chinese Character Evolves: “Horse” Oracle Bone Script Bronze Script Seal Script Clerical Script Regular Script (Traditional) Regular Script (Simplified) 1950 ~200 AC ~221 BC Concrete, irregular, inconsistent, complex Abstract, regular, consistent, simple ~1200 BC

160. Some Facts About Chinese Language: Synchronic study as of 2001: 8 basic strokes (atomic building blocks) ~214 composited building blocks ~80,000 Chinese characters in total, with ~3,500 of them commonly used, and ~2000 frequently used in daily life Infinite sentence and paragraph compositions Diachronic study: The basic strokes almost never changed The building blocks and characters evolve gradually from concrete to abstract, from irregular to regular The number of characters commonly used today does not increase much compared with the “Oracle Bone Script” period (3000 years ago) The composited building blocks were simplified and reduced a few times (latest change is the Simplified Chinese revolution in mainland China)

161. Structure Elements in Language: Different Levels of Building Blocks Configurable Building Blocks Composition Layout Algorithms Polysemy Grammar to define relationships and rules Metaphors and References link to the real world Cross-referencing Constrained Freedom Complex, Irregular Simple, Regular Fixed, Restricted, Consistent Dynamic, Free, Stylish, Expressive

162. Design As Language – Perfect Match! Different Levels of Building Blocks Configurable Building Blocks Composition Layout Algorithms Polysemy Grammar to define relationships and rules Metaphors and References link to the real world Cross-referencing Constrained Innovation Complex, Irregular, Infinite Simple, Regular, Less Fixed, Restricted, Consistent Dynamic, Free, Stylish, Expressive UI Controls Pattern Elements Patterns Screens Flows Applications

163. How to Design As Language: Unspecific Problem UI Dictionary ( Language Best Practices ) ? Narrate and Express: (Composite the structure in an innovate way) Metaphor, Reference Metaphor, Reference Specific Problem Reference, Invoke, Configure Solution emerges Environmental Fitness Model Companies/Personas Internal Fitness + - Є F(x)

164. Benefits of This Approach: Liberate designers from trivial activities , but shift the focus to more design activities (e.g. process, application) Enable designers, and potentially partners, customers, and users in the “Multipolar” or “Nonpolar” model, by sharing the language , and therefore the structure can grow Internal fitness reached by using the same language (building blocks and grammar) Solution emerges when the problem is narrated in a natural manner , and therefore both environmental fitness and internal fitness can be achieved Innovation reached by narrating the problem in a creative way Uniqueness reached by “writing styles” Best practices Economic efficiency and scalability (lower marginal cost)

165. How Narrative Design Works: Problem: Design an application for a regional sales manager to manage the sales activities and performance in his region. Narrative Design: Tony , sales manager of FutureTech , comes to the office in the morning. He logs into the system. The first thing he wants to do is to check whether there are some exception s in his area of responsibility . The system messages him that there is an opportunity moving very slowly in the pipeline in the past month, and therefore Tony wants to drill down to see the reasons behind , and check who is the responsible person to respond to this problem. He realizes that the price set in the quotation is too high. The sales rep of this opportunity is Bob . Since the customer BigMoney is very strategic to the company’s growth, and therefore Tony creates a task for Bob to adjust the price in the quotation . …

166. How Narrative Design Works: Problem Narration: The sales rep of this opportunity is Bob . Since the customer BigMoney is very strategic to the company’s growth, and therefore Tony creates a task for Bob to adjust the price in the quotation . Design Dictionary ( Language Best Practices ) Model Companies, Personas Noun. Noun. + - Є F(x)

167. Question: Does this approach lead to “design determinism”? Does this approach kill design freedom and room for creativity? Can design be automated by the computer this way, if the artificial intelligence is sophisticated enough? Does this mean designer becomes less necessary?

168. No!!! To narrate the problem accurately, you have to understand the problem accurately , which is the most important and difficult job in most cases. The same problem can be narrated in very different way (next slide shows a different version of story adapted for “high power distance” culture) Great creativity is not to reinvent the wheel, but reinvent the car Designers become more strategic because they are moving to the upper end of the food chain .

169. Adapted Version of The Story: Problem Narration: The sales rep of this opportunity is Bob . Since the customer BigMoney is very strategic to the company’s growth, and therefore Tony opens the corresponding quotation by himself, overwrites the price , and then informs Bob about this decision. Design Dictionary ( Language Best Practices ) Noun. Noun. Model Companies, Personas + - Є F(x)

170. How Should Design Language Evolve: As suggested by the diachronic study of the Chinese language, the following principles/recommendations may apply to the design dictionary : Number of UI controls should be relatively quite stable As atomic building blocks, UI controls should not change much over time New UI patterns can be invented only when necessary Very infrequently used UI patterns should fade out over time You can keep a relatively large screen repository, but hold the assumption that less than 20% of these screens are frequently used . Spend 80% of your effort on this 20% screens according to Pareto’s rule

172. On One Hand: African photos by Kevin Carter An Undesigned Life: poverty, suffer, unsatisfied demand, fight with environment A Designed Life: abundance, enjoy, sufficient supply, utilize the environment Chicago photos (Alex)

173. On The Other Hand: Shangri-la, Kashgar (Alex) An Undesigned Life: natural, alive, diversity, free, relax, emotional, sustainable Anonymous images searched from internet A Designed Life: artificial, isolated, commodity, restricted, incursion, cold, environmental damaging

174. The Ultimate Questions: How do designers (as a whole) impact the world and the human life ? Does our work really create value ? Are we spending money, time, and effort doing right things? Does design sometimes become a “ surplus of intellect ” or “ show-off of creativity ”? Are we solving the complexity or rather contributing to the complexity? To design, or not design?

175. My Speculation How Complexity Evolves in Human Society: Intents to solve Problem 2 Intents to solve Intents to solve Problem 1 Generates new problem Generates new problem Solution 1 Generates new problem Intents to solve Conflict and then generate new problem Problem Solution Intents to solve Generates new problem Conflict and then generate new problem P1 S3 S1 S2 Starting Point

176. A Critical View of Our Civilization: Phenomenon: In the very beginning , we only have a few basic problems (food, shelter, disease, sex, etc.) In the end, we get thousands of millions of solutions , as well as thousands of millions of new problems ! Some of the basic problems are relatively better solved, but the others are even getting worse (e.g. freedom in life, happiness, environment, etc.) Example: The ultimate intention for human to invent computer is NOT to increase productivity, but to serve people and liberate people from the work But now, how many people (including you and me) are serving the computer, and working even harder than before?

177. Some Explanations: Too many solutions intent to solve the same problem , driven by self-interest (think about the furious competition in the market) Well-designed solutions may solve the problem completely (without generating new problems), but only in an ideal world Badly-designed solutions create more problems ( negative value ) There might be more badly-designed solutions than well-designed solutions in the world There are conflicts, inconsistencies, incompatibilities between solutions, and therefore new problems are generated Endless cycle , and exponential increase Unfortunately the complexity itself is an organic structure like the virus that scales, grows, and spreads Can be explained by the chaos theory (chaos can emerge by a group of individuals interacting with simple rules)

178. Why I Count This As “Half” Philosophy: What we are able to improve (the pragmatic part): Try to leverage systems thinking to avoid creating “negative value” Improve interoperability both internally and externally, to reduce the “conflict and generate new problems” phenomenon. The SOA concept can apply to not only the software arena, but also many other areas (e.g. physical products) Ask the “to design, or not design” question first before you design Find somewhere else to consume our “surplus of intellect” …  Leave some creativity to the Buddha/God/Brahma/nature/etc., depends on what ever religion you believe…  What we are not able to change (the non-pragmatic part): Self-interest (companies survive by “solving” solutions) Never-ending demands of human being Now we really have a lot of problems to solve (e.g. global warming problem, etc.)

179. Plurality should not be posited without necessity. “ ” Occam's razor William of Ockham

181. The man who grasps principles can successfully choose his own methods. The man who tries methods, ignoring principles, is sure to have trouble. “ ” Ralph Waldo Emerson

182. We must first learn a discipline which teaches us the true relationship between ourselves and our surroundings. Then, once this discipline has done its work, we will be ready to give up the discipline, and act as nature does. This is the timeless way of building: learning the discipline - and shedding it . “ ” Christopher Alexander The Timeless Way of Building