������������������������� ������������������������������� Source: Interface Hall of Shame Fall 2004 6.831 UI Design and Implementation 1 Fall 2004 6.831 UI Design and Implementation 2 ����������������"����#�����������$�������� ����� ����!��� %���������&���� � Iterative Design Requirements Design Design Implement Evaluate Code Integration � Task Analysis Acceptance Release Fall 2004 6.831 UI Design and Implementation 3 Fall 2004 6.831 UI Design and Implementation 4 1
����'��(��������%���������&���� %���������&��������)���������������� � User interface design is risky Requirements � So we � re likely to get it wrong Design � Users are not involved in validation until acceptance testing Code � So we won � t find out until the end Integration � UI flaws often cause changes in requirements and design Acceptance � So we have to throw away carefully-written Release and tested code Fall 2004 6.831 UI Design and Implementation 5 Fall 2004 6.831 UI Design and Implementation 6 �������*�������� �������*�������������%�����%�� � Every iteration corresponds to a release Design � Evaluation (complaints) feeds back into next version � s design � Using your paying customers to evaluate your usability Evaluate Implement � They won � t like it � They won � t buy version 2 Fall 2004 6.831 UI Design and Implementation 7 Fall 2004 6.831 UI Design and Implementation 8 2
#�����$������!�����������������'������ �!�����&���� $��'���� Design Implement Evaluate Fall 2004 6.831 UI Design and Implementation 9 Fall 2004 6.831 UI Design and Implementation 10 �������*�+��������������������� �!�����&���������,-./0�$��1��� � Early iterations use cheap prototypes 1. Task analysis � Parallel design is feasible: build & test multiple 2. Design sketches prototypes to explore design alternatives 3. Paper prototype Design � Later iterations use richer implementations, 4. In-class user testing after UI risk has been mitigated 5. Computer prototype 12 � Every prototype is evaluated 6. Heuristic evaluation 4 3 5 7. Implementation � Users involved in all iterations 6 7 8. User testing � More iterations generally means better UI 8 Implement � Only mature iterations are seen by the world Evaluate Fall 2004 6.831 UI Design and Implementation 11 Fall 2004 6.831 UI Design and Implementation 12 3
������������2���!���&������������� �����3����(�4������� � Cheap prototypes � First step of user-centered design � Scenarios � User analysis: who is the user? � User guides � Task analysis: what does the user need � Simulation (Wizard of Oz) � Prototyping tools (IBM Voice Toolkit) to do? � Iterative design � 200 (!) iterations for user guide � Evaluation at every step � You are not the user � Non-English speakers had trouble with alphabetic entry on telephone keypad Fall 2004 6.831 UI Design and Implementation 13 Fall 2004 6.831 UI Design and Implementation 14 5��"��������� &����!������������������� � Identify characteristics of target user � Many applications have several kinds of population users � Age, gender, ethnicity � Example: Olympic Message System � Education � Physical abilities � Athletes � General computer experience � Friends & family � Skills (typing? reading?) � Telephone operators � Domain experience � Sysadmins � Application experience � Work environment and other social context � Relationships and communication patterns Fall 2004 6.831 UI Design and Implementation 15 Fall 2004 6.831 UI Design and Implementation 16 4
��"������������4������� #6��!������������*����7�����������(��� � Who are the users? � Techniques � Grocery shoppers � Questionnaires � Wide range of ages (10-80) and physical abilities (height, � Interviews mobility, strength) � No computer experience � Observation � No training: walk up and use � Obstacles � Knowledge of food, but not about supermarket inventory � Developers and users may be systematically techniques � Supermarket shoppers often ask each other for help finding isolated from each other things � Tech support shields developers from users � Major user classes � Marketing shields users from developers � Family shopping is often done by women, often � Some users are expensive to talk to accompanied by small children � Store clerks who need to help shoppers � Doctors, executives, union members Fall 2004 6.831 UI Design and Implementation 17 Fall 2004 6.831 UI Design and Implementation 18 ���(�4������� #���������$�����������(�4������� � Identify the individual tasks the program � What needs to be done? might solve � Goal � Each task is a goal ( what , not how ) � What must be done first to make it possible? � Often helps to start with overall goal of the � Preconditions system and then decompose it hierarchically � Tasks on which this task depends into tasks � Information that must be known to the user � Overall goal: shoppers pay for their own groceries � What steps are involved in doing the task? � Tasks: � Subtasks � Enter groceries into register � Subtasks may be decomposed recursively � Bag groceries � Pay Fall 2004 6.831 UI Design and Implementation 19 Fall 2004 6.831 UI Design and Implementation 20 5
#6��!������������*����7�����������(��� 2�����8������������4�(�4'���������( � � Goal Where is the task performed? � Front of supermarket, standing up � � Enter groceries into register How often is the task performed? � At most a few times a week � Preconditions � What are its time or resource constraints? � A minute or two � All the groceries you want are in your cart � How is the task learned? � By trying it � Subtasks � By watching others � By being shown how by store personnel � Enter prepackaged item � What can go wrong? (Exceptions, errors, emergencies) � Barcode is missing or smudged � Enter loose produce � Shopper wants to buy alcohol or cigarettes � Who else is involved in the task? Fall 2004 6.831 UI Design and Implementation 21 Fall 2004 6.831 UI Design and Implementation 22 ��"������������(�4������� ��������������(�4������� � Interviews with users � Duplicating a bad existing procedure in � Direct observation of users performing software � Failing to capture good aspects of tasks existing procedure Fall 2004 6.831 UI Design and Implementation 23 Fall 2004 6.831 UI Design and Implementation 24 6
����������)�����������3����(�4������� �����6�������9���� � Observe users doing real work in the � Questions to ask real work environment � Why do you do this? (goal) � Be concrete � How do you do it? (subtasks) � Establish a master-apprentice � Look for weaknesses in current situation relationship � Goal failures, wasted time, user irritation � User shows how and talks about it � Contextual inquiry � Interviewer watches and asks questions � Participatory design � Challenge assumptions and probe surprises Fall 2004 6.831 UI Design and Implementation 25 Fall 2004 6.831 UI Design and Implementation 26 $������!������������ :�6���������������"����4����������� � Include representative users directly in � � Model-View-Controller � paper the design team � OMS design team included an Olympic athlete as a consultant Fall 2004 6.831 UI Design and Implementation 27 Fall 2004 6.831 UI Design and Implementation 28 7
Recommend
More recommend