Structured User Interface Design Methodology

1. Author’s update on this presentation This was the first presentation of the Structured User Interface Design – SUID – methodology ever given. Current author’s affiliation and email is: Leonel Morales Díaz Ingeniería Simple leonel@ingenieriasimple.com To keep the presentation as it was presented in CHI 2001’s Development Consortium all the slides that follow have not been changed and the original author’s affiliation remains but does not hold. Actualización de información del autor de esta ponencia Esta presentación fue la primera que alguna vez se dio sobre la metodología Diseño Estructurado de Interfaces de Usuario – DEIU. La afiliación actual del autor y su email es: Leonel Morales Díaz Ingeniería Simple leonel@ingenieriasimple.com Para mantener la ponencia tal y como fue presentada en el “Development Consortium” de CHI 2001, las diapositivas que siguen a esta no se han modificado, incluyendo la que contiene la afiliación original del autor, pero esa afiliación ya no se mantiene.

2. Structured User Interface Design Methodology Leonel Morales Díaz - litomd@usa.net Universidad Francisco Marroquín Guatemala, C.A. Development Consortium: anyone. anywhere. In Latin America. Seattle, Washington March 31st - April 2nd, 2001

3. Esta presentación requiere el tipo de letra Tempus Sanz ITC

4. Interactions Design - General • The usability engineering paradigm Solution E B Build A D E B A D E B Evaluate Design A D E B A D Iterative prototyping or spiral design Analyze

5. Design and Engineering Science: the seeing of where you are Design: the exploration of where you would like to be Engineering: the getting from where you are to where you’d like to be

6. Structured User Interface Design • Specification of ten layers of design • Designs complete when all layers are specified • One application-specific start point • The set of objects to be handled • Main assumption: “Every information system or information appliance is devoted to handling a set of objectsor things from the real world”

7. reality SUID Overview access organization representation action  destruction creation reaction capture update change

8. SUID: Representation • Representation • To represent the real world objects • with the needed attributes • as exactly as possible • recognizable (intuitive) • easy to associate with the real object • if not intuitive then formal

9. SUID: Representation • There is an implied reduction Only some aspects can be considered in the system Every being has multitude of aspects The aspects considered have to be represented

10. SUID: Organization • Organization • There are multiple objects in the system • the order, grouping, separation, location, etc. • decided by the designer • to help the user acquire information “the user should be capable of recognizing the underlying organization”

11. “the user should be capable of recognizing the underlying organization” SUID: Organization

12. SUID: Access • Access • Allow the user to access the objects... • methods for getting to the objects • easy to learn (better: intuitive) • every object should be accessible • with role considerations • ...and their properties and attributes • Example: the open/close/save file paradigm

13. SUID: Access “Access methods should be easy to learn, or better, intuitive”

14. SUID: Access Diagram Any object “A” Outside the system No object Any object “B”

15. SUID: Capture • Capture • Introduce new objects in the system • easy to use and learn (intuitive) • produces a representation of the object • lead the user to associate both • the capture and the captured object • able to capture all needed objects

16. SUID: Update • Update • Maintain the object and the representation consistent • if one change the other should also change • works both ways • automatic, if possible

17. update capture SUID: Capture and Update

18. SUID: Creation • Some objects begin to exist in the human mind • products of creativity • The user must “create” their representation • Creation • Allow the user to “create” new objects • easy and intuitive • providing “raw material”

19. SUID: Destruction • Destruction • Allow the user to “destroy” representations • dispose of the representation or... • ...physically affect the corresponding object • Backup alternatives

20. SUID: Creation and Destruction

21. SUID: Action • Action • The user “acts” over the objects • Methods for acting must be designed • easy to learn, easy to use (intuitive) • all necessary actions • Methods for objects to act over other objects

22. SUID: Reaction • Reaction • The response of objects to actions • Must be designed • the user should be capable of • associating the response with the object • associating the response with the actions that caused it • predict the possible set of reactions

23. SUID: Action and Reaction

24. SUID: Change • Change • Advice users about changes in objects • things change... • due to the user • due to other agents • due to the object’s nature • made the user aware of those changes • immediately or afterwards • initial, subsequent and final states

25. SUID: Change

26. reality The SUID Diagram access organization representation action  destruction creation reaction capture update change

27. Using SUID • Main use: • Design user interfaces (structured) • redesign is possible for individual layers • complete specification can be generated • may be used as part of UCD, PD, etc.

28. Using SUID • Other uses: • Evaluate user interfaces • evaluation goes layer by layer • Compare user interfaces • comparing layer by layer “This structureexists in every user interface already designed”

29. Why SUID? • A method to teach to developers • If they have a method they will design • better than not to design at all • ER d., state d., flow d., etc. • design of the UI tends to blur • SUID alone can do something • help produce complete designs

30. Structured User Interface Design Methodology Leonel Morales Díaz - litomd@usa.net Universidad Francisco Marroquín Guatemala, C.A. Development Consortium: anyone. anywhere. In Latin America. Seattle, Washington March 31st - April 2nd, 2001