Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Made by Many: On Collaborative Design

3,390 views

Published on

This presentation covers an introduction to the principles of Collaborative Design. It was presented at the phpDay2009 in Verona, the focus therefore is web-development. The ideas presented though apply to any area of work where artefacts are created in teams.

The original abstract:
Any application contains many different elements of design, from application architecture to the display on the screen. Whenever an application is planned and/or implemented by a team Collaborative Design is inevitably an integral part of the process. This session explores the dynamics of Collaborative Design and the risks and chances it poses.

Published in: Design

Made by Many: On Collaborative Design

  1. 1. Memi Beltrame Made by Many On Collaborative Design phpday, may 15th 2009 Verona Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  2. 2. Who I am: Memi Beltrame • Developping websites since 1997 • Using php since 2000 • 2003-2007 Study of cinematography • 2007 to present: specialising in frontend and interaction design • Since 2008 for Liip Agile Web Development • Movie enthusiast • 1st feature film in preparation... some day... Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  3. 3. Why am I here? To raise awareness and to show the dynamics of collaborative design Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  4. 4. Argh! Design! Go away, I am a Developer! Design is not only pushing pixels Designing means arranging stuff: Pixels, Databases, Code, Processes Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  5. 5. Collaborative Design takes place whenever an artefact is planned and/or implemented by two or more participants. Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  6. 6. Typical Collaborative Design Areas Architecture Software Movies! Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  7. 7. The Internet is (probably) the biggest single instance of Collaborative Design Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  8. 8. Collaborative Design is a reality. It is the inevitable process that emerges when you build something as a team. Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  9. 9. Unlike UCD or TDD it is nothing you choose, it just happens, nolens volens. UCD: User centered design TDD: Test driven development Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  10. 10. It just happens, ok. Understand it. Control it. Embrace it. Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  11. 11. Even the simplest Customer < > Contractor Relationship involves Collaborative Design Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  12. 12. It involves is a network of participants Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  13. 13. The goal is a common product with a high overall utility Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  14. 14. Every participant can propose solutions for design issues Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  15. 15. In theory a Design should move towards an optimum of utility Utility Time Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  16. 16. In theory. Not in reality. Utility Time Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  17. 17. Why does collaboration not automatically mean improvement? Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  18. 18. Participants are inter-dependent. Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  19. 19. Participants are inter-dependent. Inter-dependency means „I need something“ Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  20. 20. Every participant has a self-interest Customer: Affordable yet magic Developer: solid, stable and performing Designer: beautiful and usable Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  21. 21. Fulfilling self-interest means Reaching a local optimum of utility Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  22. 22. Are participants willing to compromise their self interest for the sake of a global optimum? Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  23. 23. A B C D global Utility Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  24. 24. A B C D global Utility Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  25. 25. The system can become very complex php-Developer Grafics Webserver admin Management Proxy guy Usability guy Mobile Services admin DB Specialist DB Admin Project Lead Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  26. 26. It's hard to keep track of the interactions and design decisions Grafics Webserver admin Management php-Developer Proxy guy Usability guy Mobile Services admin DB Specialist DB Admin Project Lead Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  27. 27. Subsytems can emerge Grafics Webserver admin Management php-Developer Proxy guy Usability guy Mobile Services admin DB Specialist DB Admin Project Lead Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  28. 28. Subsytems also have a local optimum utility plus they are loyal! Grafics Webserver admin Management php-Developer Proxy guy Usability guy Mobile Services admin DB Specialist DB Admin Project Lead Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  29. 29. Every new participant brings a shift in the oveall utility. Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  30. 30. Every old participant must be aware of this and accept it. Otherwise the team is possibly ripped apart. Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  31. 31. Successful Collaborative Design is based on the commitment of each participants to achieve an optimum of overall utility. Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  32. 32. How is that achieved? Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  33. 33. ● Raising awareness ● Remove barriers between you and the customer to form a team ● High iteration in the workflow ● Elaboration of interdisciplinary patterns ● Talk, talk, talk, talk! Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  34. 34. An example of interdisciplinary patterns: The Undo Dilemma Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  35. 35. A list of users to be administered Edit Delete Edit Delete Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  36. 36. The Undo dilemma Edit Delete Edit Delete Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  37. 37. What happens if you hit Delete? Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  38. 38. What happens if you hit Delete? Usually: a pop up! Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  39. 39. Pop ups are Bad! Avoid them! Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  40. 40. Use Undo! Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  41. 41. Because: UNDO • is the rescuer of users in distress. • encourages exploration. • eliminates sensless confirmation-dialogs ! Don‘t ask, do and UNDO ! Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  42. 42. Pop Ups are easy to implement, Undo is not. It requires a well planned process Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  43. 43. Frontend and backend people must decide on a pattern of implementation. This is a collaborative design decision. Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  44. 44. Possible patterns of implementation of undo in the database: 1) Through a Flag 2) Through a history table Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  45. 45. Implementation of Undo 1) Through a FLAG TABLE users VIEW view_users ------------------------------------- ------------------------ | ID | name | surname | is_deleted | | ID | name | surname | ------------------------------------- ------------------------ | 1 | Pio | Polli | 0 | | 1 | Pio | Polli | ------------------------------------- ------------------------ | 2 | Enzo | Enzi | 1 | | 3 | Toni | Marroni | ------------------------------------- ------------------------ | 3 | Toni | Marroni | 0 | ------------------------------------- SELECT * From `users` WHERE is_deleted = 0 • simple • Ideal to undo deletions • Downside: data may be materialized twice Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  46. 46. Implementations of undo 2) Through a history table TABLE users TABLE users_history ------------------------ ---------------------------------- | ID | name | surname | | ID | ID_users | name | surname | ------------------------ ---------------------------------- | 1 | Pio | Polli | | 1 | 1 | Pio | Polli | ------------------------ ---------------------------------- | 2 | Enio | Enzi | | 2 | 2 | Enzo | Enzi | ------------------------ ---------------------------------- | 3 | Toni | Marroni | | 3 | 3 | Toni | Marroni | ------------------------ ---------------------------------- | 4 | 2 | Enio | Enzi | ---------------------------------- Table users: every change is Table users_history: every change an UPDATE also executes an INSERT Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  47. 47. Implementations of undo 2) Through a history table Pros • Allows endless undo • Works as a history • Is not limited to a single data entry • allows „edit in place“ on a high level Cons • Needs a more complex system • Executes more SQL queries and creates more traffic and data Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy
  48. 48. Thank you! Slides: http://slides.liip.ch Memi Beltrame: Made by Many – On Collaborative Design 6th phpDay – May 15th/16th 2009 Verona - Italy

×