SlideShare une entreprise Scribd logo
1  sur  66
Télécharger pour lire hors ligne
USER INTERFACE
DESIGN
Definitions, processes and principles

David Little, User Interface Designer, DDH
MA Digital Humanities: Methods and Techniques
OVERVIEW
1. Definitions


2. User-centred design (UCD)


3. Design principles


4. Why you should care


5. Design exercise
1. DEFINITIONS
• What is a user interface?


“That part of a computer system with which a user interacts in
     order to undertake her tasks and achieve her goals.”
                 (Stone, Jarrett et. al., 2001)

• What we interact with when we use any kind of digital
 hardware or software.
EXAMPLES
User interface design: definitions, processes and principles
User interface design: definitions, processes and principles
http://www.flickr.com/photos/purecaffeine/3537809738/
http://www.flickr.com/photos/joelanman/4333130522/in/pool-dailyux
http://www.flickr.com/photos/macbosse/304314327/
WHERE THE UI FITS
• Back-end infrastructure: servers, databases and
 programming.

• Content (i.e. words and pictures).


• Information architecture: how the content is organised and
 navigated.

• User interface: where the user interacts with the above.
USER INTERFACE DESIGN
    “[Interaction design] is concerned with describing user
 behavior and defining how the system will accommodate and
                   respond to that behavior"
                (Jesse James Garrett, 2011)

• Research into the behaviours and goals of the target
 users of a digital product or service.

                            PLUS

• The design of appropriate tools (interfaces) which enable
 users to achieve their goals.
!
• Design without research is guesswork.


• Or may result in an interface which reflects the
    understanding (mental model) of a product’s programmers
    or architects, not its users.

UI design should be thought of as:

• A process integral to the creation of digital products.
• A group of interrelated activities.
• A mindset.
THE CONTEXT OF UI DESIGN
• Sits within a larger set of disciplines, all ultimately
 concerned with the interaction of people with machines.

• Labels can be confusing and describe overlapping
 activities and processes which may be carried out by one
 or a number of people.

• Interaction Design (IXD) and UI design: subtle differences
 in definition but will be used interchangeably in this
 lecture.
USER EXPERIENCE (UX) DESIGN
• Commonplace term in software design and beyond.


• A vague term: which part of a digital product isn’t
 experienced by users?

• Totality of users’ experiences of a product or service, from
 its content, navigation, aesthetics, interactions or even
 how quickly it performs or responds to users’ interactions.

• Umbrella term for a number of more defined disciplines.
THE UX VENN DIAGRAM
                  Dan Saffer, 2009
HUMAN-COMPUTER INTERACTION
(HCI)
• Academic study of the interaction between humans and
 machines.

• Computer science, psychology, linguistics, sociology,
 anthropology.

• Popularised in the 1980s but with roots in older fields of
 ergonomics and human factors: 1900s and earlier.

• UI design can be thought of as the practical
 implementation of HCI research, methods and practices.
2. USER-CENTRED DESIGN (UCD)
• The “U” in UI: USER; the “H” in HCI: HUMAN


          “Focus on the user and all else will follow.”
                          (Google)

• Focus on: people, their motivations, goals and
 behaviours.

• Must be aware of technological constraints but UI design
 is not a technological process.
USER-CENTRED DESIGN (UCD)
• Involve users at all stages of the design process.
RESEARCH
• Who are the users?


• How many different types of user are there?


• What do they want to be able to do?


• How do they currently do it?


• Where do they currently do it?


• Where might they want to be able to do it?


• How might they want to be able to do it?
USER GOALS, STRATEGIC GOALS
AND CONSTRAINTS
• What are the strategic goals (“business goals”) of the
 product you are creating; what were you funded to do?

• Tensions between strategic goals and user goals: how will
 this be managed?

• What constraints do you have:
  • Financial
  • Time
  • Technology
  • People
USER RESEARCH
• How do you find users?
  • An existing user base.
  • An organisation’s own information (e.g. marketing, focus groups,
    audience profiles): what are they willing to share?
  • Academic projects: project team contacts and knowledge.


• If you have limited resources?
   • Friends, family, colleagues.
   • Mailing lists.
   • Social media.
ENGAGING WITH USERS:
INTERVIEWS
• Need to be pragmatic: what are your constraints
 (time, financial). User research takes time and you may need to
 recompense people for their time.

• If you have time: face-to-face, one-to-one interviews in user’s
 “natural environment”: ethnography or contextual enquiry.

• Observe users: how they work, their behaviours, what other
 resources they use.

• What users do and what they say they actually do may well be
 different (c.f. Jakob Nielsen’s First Rule of Usability).

• Unstated goals, domain language.
ENGAGING WITH USERS: OTHER
METHODS
• Interviews via Skype or Email.


• Online surveys (generally better for quantitative
 information).

• Existing published information about user behaviours.
WHAT TO ASK
• What kind of information: qualitative or quantitative
 information? At initial stages of research qualitative
 information may be more useful.

• Ask non-judgmental and non-leading questions.


• Don’t ask questions that are too open-ended (what is of
 relevance to the project given its constraints?)

• For more information:
  • Box and Bowles, Undercover User Experience Design (2010)
  • Kuniavsky, Observing the User Experience: A Practitioner's Guide
    to User Research (2003).
ANALYSIS AND CONCEPTUAL
DESIGN
• Analysis will probably take a lot of time!


• Identify trends: what are user goals and how can these be
 supported—identify by analysing interests and
 behaviours, stated and unstated goals.

• Use information to create high-level documentation to guide the
 design, e.g. user stories (statement of user goals by user
 group) or personas (more in-depth descriptions of “typical”
 users).

• Conceptual design documentation—wireframes.
DELIVERABLES
• User stories: simple statements of overall user goals.


• As a <type of user> I want <a goal> so that <some
 reason>:

  • As an academic historian I want to be able to track ownership and
   descent of manorial properties (to support my research).

  • As a genealogist I want to be able to be able to establish family
   relationships of the families I am researching so that I can use the
   information to construct a family history.

• Sketches and wireframes: at this stage a point of
 discussion with other stakeholders.
User interface design: definitions, processes and principles
User interface design: definitions, processes and principles
PROTOTYPING AND TESTING
• Prototyping: creation of artefacts for testing with users:
 can be low-fidelity (e.g. paper-based), medium fidelity
 (e.g. wireframes, static coded web pages) or high fidelity
 (e.g. functional web pages).

• Feedback from testing the prototypes can be fed back into
 further iterations of the design.

• Resource intensive but much easier (and cheaper) to
 address issues and fix usability problems early in the
 process than later.
COST BENEFIT

“The rule of thumb in many usability-aware organizations is
that the cost-benefit ratio for usability is $1:$10-$100. Once a
system is in development, correcting a problem costs 10
times as much as fixing the same problem in design. If the
system has been released, it costs 100 times as much relative
to fixing in design.”

T. Gilb (1998) quoted on the Usability Professionals
Association (UPA) website.
USABILITY TESTING
• Usability

“The extent to which a product can be used by specified users to
achieve specified goals with effectiveness, efficiency and satisfaction
in a specified context of use.”
     International Organization for Standardization (ISO): ISO 9241-11

• Doesn’t require a lab or expensive equipment.

• One-to-one testing of a prototype with a user. A facilitator gives a
 participant a number of tasks to work through on the interface and asks
 them to “think aloud” their decisions.

• Make notes on the user’s behaviour and, if possible, use screen
 recording software to record the user’s decisions, voice and facial
 expression.
ITERATIVE DESIGN
• Analyse results of testing and feed back into design


• Don’t need many participants to identify main usability problems
 (around four should be fine).

• Steve Krug: short, accessible books on running usability testing: Don’t
 Make Me Think! and Rocket Surgery Made Easy.

• How many tests should you run? It depends. Usually defined by
 project constraints (unless you’re Google who once famously tested
 41 shades of blue to see which performed better!).

• Remote usability testing software: an alternative to running face-to-
 face tests, but usually better for gathering quantitative information.
UCD: SUMMARY
• A mindset: gives a voice to the user throughout the design
    and build process.
•   Iterative: design, test, design, test etc.
•   Be pragmatic. You will always have constraints.
•   One round of testing is better than none.
•   Testing one user is 100% better than testing none (but
    more is better!).
3. DESIGN PRINCIPLES
3.1   Simplicity
3.2   Structure
3.3   Visibility
3.4   Consistency
3.5   Tolerance
3.6   Feedback
3.1 SIMPLICITY
• A user interface should be kept as simple as possible for
  users in order that they can achieve their goals.
• What is simplicity? The simplest interface for the job, but
  no simpler!
• Which is simpler?
User interface design: definitions, processes and principles
User interface design: definitions, processes and principles
SIMPLICITY
• Depends on context of use.
• What is the purpose of your product?
• What do your users want to do?
• Keep to your core functionality
3.2. STRUCTURE
• Ensure that the interface is clearly laid out, well organised
 and controls are easily identifiable.

• “Gestalt laws of perception”:

  • Proximity. When elements are grouped together, people perceive
    them as being related.
  • Similarity. Elements that look similar are perceived as being
    related.
  • Closure. As humans we are generally quite good at filling in
    missing information and this is certainly the case in perception. We
    fill in the blanks with “incomplete” images. Commonly used in logo
    design etc.
Proximity: the layout of a
navigation menu
Proximity and similarity: Flickr’s top menu bar




                                         Similarity: Icons for Adobe Dreamweaver
                                         and Fireworks
Closure: Apple’s logo
Grids: an established tool from graphic design
for imposing order on information
User interface design: definitions, processes and principles
3.3. VISIBILITY
• Visibility can be thought as ensuring that interface controls
 that need to be accessed by the user are as visible as
 possible.

• It ties in with the idea of “affordance”, popularised by the
 design thinker and writer Don Norman:

  “The perceived and actual properties of the thing, primarily
those fundamental properties that determine just how the thing
                   could possibly be used.”
                    (Don Norman, 1988)
• Affordance: “this is for doing that”.




   Underlined text on a web page is for clicking
The “home” button on an iPhone is for pressing
• Conform to established rules.


• Use of appropriate metaphors can also promote visibility.
 Sometimes metaphors come from a pre-existing
 technology, e.g.:




                  The Gmail icon: resembles a “traditional” envelope




• At its most extreme this can result in “skeuomorphism”:
 incorporating elements in the UI from a previous technology
 that serve no purpose other than being decorative.
Apple’s Podcast app: features an emulated
tape mechanism.

“Real-world” UI metaphors most successful
when they allow users to easily form
connections between the interface and
existing technologies.

What does a tape mechanism mean for
younger users?
3.4. CONSISTENCY
• “People see what they expect to see.”
• Recognition over recall.
• Consistency across a product or set of products.
3.5. TOLERANCE
• Well designed software should try to prevent users from
 making errors in the first place but is inevitable that
 mistakes will happen. A tolerant UI is a forgiving UI and
 lets users recover from mistakes they have made.

• Mistakes may take many forms, e.g. an accidentally
 discarded email draft, a formatting mistake in a Word
 processor or an incorrectly filled form field.
Tolerant: the colour picker in Photoshop: only allows me to enter six digits for a
hex colour code (red, green and blue number pairs).
Intolerant: the colour picker in Illustrator: allows me to enter more
than six digits and then presents me with an annoying error
message (also note the inconsistency across products).
3.6. FEEDBACK
• How the UI communicates with the user after she has
 carried out an interaction.

• Feedback may be visual, auditory or even haptic (that is
 communicated via touch):
  • The success message that appears after a web form has been
    submitted.
  • The whooshing sounds as an SMS is sent from an iPhone.
  • The sense of a Wii controller vibrating when simulating a machine
    gun being fired on Call of Duty.
NIELSEN’S HEURISTICS
• Jakob Nielsen’s ten heuristics (guidelines!) for creating usable
    interfaces (1999):

•   Visibility of system status
•   Match between system and the real world
•   User control and freedom
•   Consistency and standards
•   Error prevention
•   Recognition rather than recall
•   Flexibility and efficiency of use
•   Aesthetic and minimalist design
•   Help users recognise, diagnose and recover from errors
•   Help and documentation

http://www.useit.com/papers/heuristic/heuristic_list.html
4. WHY YOU SHOULD CARE
4.1   Finance
4.2   Impact
4.3   Ethics
4.1 FINANCE
• Cost savings of usability testing.
• For commercial organisations, greater usability leads to
  increased sales and greater competitive advantage.
• For non-profits, “conversion rates” (e.g. transforming a
  casual user to a signed-up and engaged user) are still
  important: a resource that addresses the needs of its
  users is more likely to lead to greater use and (repeated)
  engagement.
• Justify the use of limited funds.
• Reduce support costs.
4.2 IMPACT
• Increased user engagement in design can lead to more
  user-focused resources which in turn can increase a
  resource’s impact.
• Old Bailey Online:
  • JISC funded user engagement exercise: resource was not being
    well-used by academic community.
  • Study resulted in creation of sets of tools aimed at teachers and
    researchers.
• Impact important consideration when creating funding
  applications.
• Toolkits for measuring impact of digital resources, e.g.
  TIDSR: Toolkit for the Impact of Digitised Scholarly
  Resources (Oxford Internet Institute).
4.3 ETHICS
• All resources have users or potential users.
• Users may battle with a difficult UI if your resource is
  unique enough but why should they?
• Jef Raskin, The Humane Interface (2000): laws of
  interface design:
  • A computer shall not harm your work or, through inactivity, allow
    your work to come to harm.
  • A computer shall not waste your time or require you to do more
    work than is strictly necessary.
FINALLY
• There are plenty of terrible user experiences
  already, don’t add to them.
• Engage with users and follow established design
  processes and principles.
• Start noticing the good and bad user experiences you
  encounter every day.
User interface design: definitions, processes and principles
User interface design: definitions, processes and principles
User interface design: definitions, processes and principles
User interface design: definitions, processes and principles
http://dilbert.com/strips/comic/2009-03-21/


David Little
david.little@kcl.ac.uk
DESIGN EXERCISE
• Suggest up to three changes to the CCED search screen
 which would assist amateur local historians.

• 5-10 minutes: familiarise yourself with the brief.


• Maximum 25 minutes on the design: sketch!


• 5 minutes: prepare to present.


• 2-3 minutes per group: present your ideas.


• No right or wrong answers.

Contenu connexe

Tendances

UX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyUX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyCHI UX Indonesia
 
Module 1st USER INTERFACE DESIGN (15CS832) - VTU
Module 1st USER INTERFACE DESIGN (15CS832) - VTU Module 1st USER INTERFACE DESIGN (15CS832) - VTU
Module 1st USER INTERFACE DESIGN (15CS832) - VTU Sachin Gowda
 
What is a User Experience?
What is a User Experience? What is a User Experience?
What is a User Experience? Dotinum
 
10 Usability Heuristics explained
10 Usability Heuristics explained10 Usability Heuristics explained
10 Usability Heuristics explainedCraft Design
 
An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design
An Introduction to Ben Shneiderman's Eight Golden Rules of Interface DesignAn Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design
An Introduction to Ben Shneiderman's Eight Golden Rules of Interface DesignJochen Wolters
 
Usability vs. User Experience: What's the difference?
Usability vs. User Experience: What's the difference?Usability vs. User Experience: What's the difference?
Usability vs. User Experience: What's the difference?Domain7
 
UI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiUI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiMatin Maleki
 
Simple Steps to UX/UI Web Design
Simple Steps to UX/UI Web DesignSimple Steps to UX/UI Web Design
Simple Steps to UX/UI Web DesignKoombea
 
Mobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best PracticesMobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best PracticesOXD
 

Tendances (20)

UX Experience Design: Processes and Strategy
UX Experience Design: Processes and StrategyUX Experience Design: Processes and Strategy
UX Experience Design: Processes and Strategy
 
Module 1st USER INTERFACE DESIGN (15CS832) - VTU
Module 1st USER INTERFACE DESIGN (15CS832) - VTU Module 1st USER INTERFACE DESIGN (15CS832) - VTU
Module 1st USER INTERFACE DESIGN (15CS832) - VTU
 
HCI
HCIHCI
HCI
 
What is a User Experience?
What is a User Experience? What is a User Experience?
What is a User Experience?
 
10 Usability Heuristics explained
10 Usability Heuristics explained10 Usability Heuristics explained
10 Usability Heuristics explained
 
User interface design
User interface designUser interface design
User interface design
 
UI/UX Fundamentals
UI/UX FundamentalsUI/UX Fundamentals
UI/UX Fundamentals
 
User Research 101
User Research 101User Research 101
User Research 101
 
An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design
An Introduction to Ben Shneiderman's Eight Golden Rules of Interface DesignAn Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design
An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design
 
UI UX in depth
UI UX in depthUI UX in depth
UI UX in depth
 
Cognitive Walkthrough
Cognitive WalkthroughCognitive Walkthrough
Cognitive Walkthrough
 
Usability vs. User Experience: What's the difference?
Usability vs. User Experience: What's the difference?Usability vs. User Experience: What's the difference?
Usability vs. User Experience: What's the difference?
 
Ui design
Ui designUi design
Ui design
 
UI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiUI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin Maleki
 
User interface-design
User interface-designUser interface-design
User interface-design
 
UX/UI Introduction
UX/UI IntroductionUX/UI Introduction
UX/UI Introduction
 
Simple Steps to UX/UI Web Design
Simple Steps to UX/UI Web DesignSimple Steps to UX/UI Web Design
Simple Steps to UX/UI Web Design
 
Ux design-fundamentals
Ux design-fundamentalsUx design-fundamentals
Ux design-fundamentals
 
HCI Presentation
HCI PresentationHCI Presentation
HCI Presentation
 
Mobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best PracticesMobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best Practices
 

En vedette

User Interface Design
User Interface DesignUser Interface Design
User Interface DesignJReifman
 
Fundamentals of User Interface Design
Fundamentals of User Interface DesignFundamentals of User Interface Design
Fundamentals of User Interface DesignMerlin Rebrović
 
Lecture 7 Software Engineering and Design User Interface Design
Lecture 7 Software Engineering and Design User Interface Design Lecture 7 Software Engineering and Design User Interface Design
Lecture 7 Software Engineering and Design User Interface Design op205
 
User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15koolkampus
 
Prototype model
Prototype modelPrototype model
Prototype modelsadhana8
 
Architecture design in software engineering
Architecture design in software engineeringArchitecture design in software engineering
Architecture design in software engineeringPreeti Mishra
 
Software testing basic concepts
Software testing basic conceptsSoftware testing basic concepts
Software testing basic conceptsHưng Hoàng
 
Software Testing Basics
Software Testing BasicsSoftware Testing Basics
Software Testing BasicsBelal Raslan
 
Prototype model
Prototype modelPrototype model
Prototype modelshuisharma
 
Software testing methods, levels and types
Software testing methods, levels and typesSoftware testing methods, levels and types
Software testing methods, levels and typesConfiz
 

En vedette (12)

User Interface Design
User Interface DesignUser Interface Design
User Interface Design
 
Fundamentals of User Interface Design
Fundamentals of User Interface DesignFundamentals of User Interface Design
Fundamentals of User Interface Design
 
Lecture 7 Software Engineering and Design User Interface Design
Lecture 7 Software Engineering and Design User Interface Design Lecture 7 Software Engineering and Design User Interface Design
Lecture 7 Software Engineering and Design User Interface Design
 
User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15User Interface Design in Software Engineering SE15
User Interface Design in Software Engineering SE15
 
User Interface
User InterfaceUser Interface
User Interface
 
Prototype model
Prototype modelPrototype model
Prototype model
 
Architectural Design
Architectural DesignArchitectural Design
Architectural Design
 
Architecture design in software engineering
Architecture design in software engineeringArchitecture design in software engineering
Architecture design in software engineering
 
Software testing basic concepts
Software testing basic conceptsSoftware testing basic concepts
Software testing basic concepts
 
Software Testing Basics
Software Testing BasicsSoftware Testing Basics
Software Testing Basics
 
Prototype model
Prototype modelPrototype model
Prototype model
 
Software testing methods, levels and types
Software testing methods, levels and typesSoftware testing methods, levels and types
Software testing methods, levels and types
 

Similaire à User interface design: definitions, processes and principles

User Interface Design: Definitions, Processes and Principles
User Interface Design: Definitions, Processes and PrinciplesUser Interface Design: Definitions, Processes and Principles
User Interface Design: Definitions, Processes and PrinciplesMoodLabs
 
Interaction design: desiging user interfaces for digital products
Interaction design: desiging user interfaces for digital productsInteraction design: desiging user interfaces for digital products
Interaction design: desiging user interfaces for digital productsDavid Little
 
Usability Workshop, 11-8-2012
Usability Workshop, 11-8-2012Usability Workshop, 11-8-2012
Usability Workshop, 11-8-2012Samantha Bailey
 
UX Workshop at Startit@KBC
UX Workshop at Startit@KBCUX Workshop at Startit@KBC
UX Workshop at Startit@KBCUXprobe
 
UXPA 2023: UX Fracking: Using Mixed Methods to Extract Hidden Insights
UXPA 2023: UX Fracking: Using Mixed Methods to Extract Hidden InsightsUXPA 2023: UX Fracking: Using Mixed Methods to Extract Hidden Insights
UXPA 2023: UX Fracking: Using Mixed Methods to Extract Hidden InsightsUXPA International
 
Intro to UX Design
Intro to UX DesignIntro to UX Design
Intro to UX Designjayyearley
 
Conducting User Research
Conducting User ResearchConducting User Research
Conducting User ResearchJeremy Horn
 
Introduction to User-Centered Design
Introduction to User-Centered DesignIntroduction to User-Centered Design
Introduction to User-Centered DesignAllison Bloodworth
 
Website Usability | Day 1
Website Usability | Day 1Website Usability | Day 1
Website Usability | Day 1studiokandm
 
Multi Platform User Exerience
Multi Platform User ExerienceMulti Platform User Exerience
Multi Platform User ExerienceTanya Zavialova
 
Design process interaction design basics
Design process interaction design basicsDesign process interaction design basics
Design process interaction design basicsPreeti Mishra
 
User Experience Design: an Overview
User Experience Design: an OverviewUser Experience Design: an Overview
User Experience Design: an OverviewJulie Grundy
 
Introductiontousability 090407053727-phpapp02
Introductiontousability 090407053727-phpapp02Introductiontousability 090407053727-phpapp02
Introductiontousability 090407053727-phpapp02Techved Consulting
 
User Centered Design
User Centered DesignUser Centered Design
User Centered DesignShawn Calvert
 
A brief overview of the history and practice of user experience by Ian Westbrook
A brief overview of the history and practice of user experience by Ian WestbrookA brief overview of the history and practice of user experience by Ian Westbrook
A brief overview of the history and practice of user experience by Ian WestbrookAlex Cachia
 
NYU Web Intensive - Week 3 Class 1
NYU Web Intensive - Week 3 Class 1NYU Web Intensive - Week 3 Class 1
NYU Web Intensive - Week 3 Class 1studiokandm
 
Incorporating UX into Your Projects
Incorporating UX into Your ProjectsIncorporating UX into Your Projects
Incorporating UX into Your ProjectsKarl Kaufmann
 
Siblings or Step Siblings? Common Connections Between Technical Communication...
Siblings or Step Siblings? Common Connections Between Technical Communication...Siblings or Step Siblings? Common Connections Between Technical Communication...
Siblings or Step Siblings? Common Connections Between Technical Communication...Chris LaRoche
 
1_Introduction to Interaction Design.pdf
1_Introduction to Interaction Design.pdf1_Introduction to Interaction Design.pdf
1_Introduction to Interaction Design.pdfOmarShahid15
 

Similaire à User interface design: definitions, processes and principles (20)

User Interface Design: Definitions, Processes and Principles
User Interface Design: Definitions, Processes and PrinciplesUser Interface Design: Definitions, Processes and Principles
User Interface Design: Definitions, Processes and Principles
 
Interaction design: desiging user interfaces for digital products
Interaction design: desiging user interfaces for digital productsInteraction design: desiging user interfaces for digital products
Interaction design: desiging user interfaces for digital products
 
Usability Workshop, 11-8-2012
Usability Workshop, 11-8-2012Usability Workshop, 11-8-2012
Usability Workshop, 11-8-2012
 
UX Workshop at Startit@KBC
UX Workshop at Startit@KBCUX Workshop at Startit@KBC
UX Workshop at Startit@KBC
 
UXPA 2023: UX Fracking: Using Mixed Methods to Extract Hidden Insights
UXPA 2023: UX Fracking: Using Mixed Methods to Extract Hidden InsightsUXPA 2023: UX Fracking: Using Mixed Methods to Extract Hidden Insights
UXPA 2023: UX Fracking: Using Mixed Methods to Extract Hidden Insights
 
Intro to UX Design
Intro to UX DesignIntro to UX Design
Intro to UX Design
 
Conducting User Research
Conducting User ResearchConducting User Research
Conducting User Research
 
Introduction to User-Centered Design
Introduction to User-Centered DesignIntroduction to User-Centered Design
Introduction to User-Centered Design
 
Website Usability | Day 1
Website Usability | Day 1Website Usability | Day 1
Website Usability | Day 1
 
Multi Platform User Exerience
Multi Platform User ExerienceMulti Platform User Exerience
Multi Platform User Exerience
 
Design process interaction design basics
Design process interaction design basicsDesign process interaction design basics
Design process interaction design basics
 
TP2 Understanding the customer
TP2 Understanding the customerTP2 Understanding the customer
TP2 Understanding the customer
 
User Experience Design: an Overview
User Experience Design: an OverviewUser Experience Design: an Overview
User Experience Design: an Overview
 
Introductiontousability 090407053727-phpapp02
Introductiontousability 090407053727-phpapp02Introductiontousability 090407053727-phpapp02
Introductiontousability 090407053727-phpapp02
 
User Centered Design
User Centered DesignUser Centered Design
User Centered Design
 
A brief overview of the history and practice of user experience by Ian Westbrook
A brief overview of the history and practice of user experience by Ian WestbrookA brief overview of the history and practice of user experience by Ian Westbrook
A brief overview of the history and practice of user experience by Ian Westbrook
 
NYU Web Intensive - Week 3 Class 1
NYU Web Intensive - Week 3 Class 1NYU Web Intensive - Week 3 Class 1
NYU Web Intensive - Week 3 Class 1
 
Incorporating UX into Your Projects
Incorporating UX into Your ProjectsIncorporating UX into Your Projects
Incorporating UX into Your Projects
 
Siblings or Step Siblings? Common Connections Between Technical Communication...
Siblings or Step Siblings? Common Connections Between Technical Communication...Siblings or Step Siblings? Common Connections Between Technical Communication...
Siblings or Step Siblings? Common Connections Between Technical Communication...
 
1_Introduction to Interaction Design.pdf
1_Introduction to Interaction Design.pdf1_Introduction to Interaction Design.pdf
1_Introduction to Interaction Design.pdf
 

Dernier

Practical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptxPractical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptxKatherine Villaluna
 
How to Add Existing Field in One2Many Tree View in Odoo 17
How to Add Existing Field in One2Many Tree View in Odoo 17How to Add Existing Field in One2Many Tree View in Odoo 17
How to Add Existing Field in One2Many Tree View in Odoo 17Celine George
 
5 charts on South Africa as a source country for international student recrui...
5 charts on South Africa as a source country for international student recrui...5 charts on South Africa as a source country for international student recrui...
5 charts on South Africa as a source country for international student recrui...CaraSkikne1
 
Presentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a ParagraphPresentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a ParagraphNetziValdelomar1
 
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...Nguyen Thanh Tu Collection
 
How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17Celine George
 
Prescribed medication order and communication skills.pptx
Prescribed medication order and communication skills.pptxPrescribed medication order and communication skills.pptx
Prescribed medication order and communication skills.pptxraviapr7
 
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptxPISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptxEduSkills OECD
 
Education and training program in the hospital APR.pptx
Education and training program in the hospital APR.pptxEducation and training program in the hospital APR.pptx
Education and training program in the hospital APR.pptxraviapr7
 
How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17Celine George
 
How to Use api.constrains ( ) in Odoo 17
How to Use api.constrains ( ) in Odoo 17How to Use api.constrains ( ) in Odoo 17
How to Use api.constrains ( ) in Odoo 17Celine George
 
Human-AI Co-Creation of Worked Examples for Programming Classes
Human-AI Co-Creation of Worked Examples for Programming ClassesHuman-AI Co-Creation of Worked Examples for Programming Classes
Human-AI Co-Creation of Worked Examples for Programming ClassesMohammad Hassany
 
M-2- General Reactions of amino acids.pptx
M-2- General Reactions of amino acids.pptxM-2- General Reactions of amino acids.pptx
M-2- General Reactions of amino acids.pptxDr. Santhosh Kumar. N
 
The Stolen Bacillus by Herbert George Wells
The Stolen Bacillus by Herbert George WellsThe Stolen Bacillus by Herbert George Wells
The Stolen Bacillus by Herbert George WellsEugene Lysak
 
General views of Histopathology and step
General views of Histopathology and stepGeneral views of Histopathology and step
General views of Histopathology and stepobaje godwin sunday
 
Philosophy of Education and Educational Philosophy
Philosophy of Education  and Educational PhilosophyPhilosophy of Education  and Educational Philosophy
Philosophy of Education and Educational PhilosophyShuvankar Madhu
 
Easter in the USA presentation by Chloe.
Easter in the USA presentation by Chloe.Easter in the USA presentation by Chloe.
Easter in the USA presentation by Chloe.EnglishCEIPdeSigeiro
 
Patient Counselling. Definition of patient counseling; steps involved in pati...
Patient Counselling. Definition of patient counseling; steps involved in pati...Patient Counselling. Definition of patient counseling; steps involved in pati...
Patient Counselling. Definition of patient counseling; steps involved in pati...raviapr7
 

Dernier (20)

Practical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptxPractical Research 1: Lesson 8 Writing the Thesis Statement.pptx
Practical Research 1: Lesson 8 Writing the Thesis Statement.pptx
 
How to Add Existing Field in One2Many Tree View in Odoo 17
How to Add Existing Field in One2Many Tree View in Odoo 17How to Add Existing Field in One2Many Tree View in Odoo 17
How to Add Existing Field in One2Many Tree View in Odoo 17
 
5 charts on South Africa as a source country for international student recrui...
5 charts on South Africa as a source country for international student recrui...5 charts on South Africa as a source country for international student recrui...
5 charts on South Africa as a source country for international student recrui...
 
Personal Resilience in Project Management 2 - TV Edit 1a.pdf
Personal Resilience in Project Management 2 - TV Edit 1a.pdfPersonal Resilience in Project Management 2 - TV Edit 1a.pdf
Personal Resilience in Project Management 2 - TV Edit 1a.pdf
 
Presentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a ParagraphPresentation on the Basics of Writing. Writing a Paragraph
Presentation on the Basics of Writing. Writing a Paragraph
 
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
CHUYÊN ĐỀ DẠY THÊM TIẾNG ANH LỚP 11 - GLOBAL SUCCESS - NĂM HỌC 2023-2024 - HK...
 
How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17How to Show Error_Warning Messages in Odoo 17
How to Show Error_Warning Messages in Odoo 17
 
Prescribed medication order and communication skills.pptx
Prescribed medication order and communication skills.pptxPrescribed medication order and communication skills.pptx
Prescribed medication order and communication skills.pptx
 
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptxPISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
PISA-VET launch_El Iza Mohamedou_19 March 2024.pptx
 
Prelims of Kant get Marx 2.0: a general politics quiz
Prelims of Kant get Marx 2.0: a general politics quizPrelims of Kant get Marx 2.0: a general politics quiz
Prelims of Kant get Marx 2.0: a general politics quiz
 
Education and training program in the hospital APR.pptx
Education and training program in the hospital APR.pptxEducation and training program in the hospital APR.pptx
Education and training program in the hospital APR.pptx
 
How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17How to Add a New Field in Existing Kanban View in Odoo 17
How to Add a New Field in Existing Kanban View in Odoo 17
 
How to Use api.constrains ( ) in Odoo 17
How to Use api.constrains ( ) in Odoo 17How to Use api.constrains ( ) in Odoo 17
How to Use api.constrains ( ) in Odoo 17
 
Human-AI Co-Creation of Worked Examples for Programming Classes
Human-AI Co-Creation of Worked Examples for Programming ClassesHuman-AI Co-Creation of Worked Examples for Programming Classes
Human-AI Co-Creation of Worked Examples for Programming Classes
 
M-2- General Reactions of amino acids.pptx
M-2- General Reactions of amino acids.pptxM-2- General Reactions of amino acids.pptx
M-2- General Reactions of amino acids.pptx
 
The Stolen Bacillus by Herbert George Wells
The Stolen Bacillus by Herbert George WellsThe Stolen Bacillus by Herbert George Wells
The Stolen Bacillus by Herbert George Wells
 
General views of Histopathology and step
General views of Histopathology and stepGeneral views of Histopathology and step
General views of Histopathology and step
 
Philosophy of Education and Educational Philosophy
Philosophy of Education  and Educational PhilosophyPhilosophy of Education  and Educational Philosophy
Philosophy of Education and Educational Philosophy
 
Easter in the USA presentation by Chloe.
Easter in the USA presentation by Chloe.Easter in the USA presentation by Chloe.
Easter in the USA presentation by Chloe.
 
Patient Counselling. Definition of patient counseling; steps involved in pati...
Patient Counselling. Definition of patient counseling; steps involved in pati...Patient Counselling. Definition of patient counseling; steps involved in pati...
Patient Counselling. Definition of patient counseling; steps involved in pati...
 

User interface design: definitions, processes and principles

  • 1. USER INTERFACE DESIGN Definitions, processes and principles David Little, User Interface Designer, DDH MA Digital Humanities: Methods and Techniques
  • 2. OVERVIEW 1. Definitions 2. User-centred design (UCD) 3. Design principles 4. Why you should care 5. Design exercise
  • 3. 1. DEFINITIONS • What is a user interface? “That part of a computer system with which a user interacts in order to undertake her tasks and achieve her goals.” (Stone, Jarrett et. al., 2001) • What we interact with when we use any kind of digital hardware or software.
  • 10. WHERE THE UI FITS • Back-end infrastructure: servers, databases and programming. • Content (i.e. words and pictures). • Information architecture: how the content is organised and navigated. • User interface: where the user interacts with the above.
  • 11. USER INTERFACE DESIGN “[Interaction design] is concerned with describing user behavior and defining how the system will accommodate and respond to that behavior" (Jesse James Garrett, 2011) • Research into the behaviours and goals of the target users of a digital product or service. PLUS • The design of appropriate tools (interfaces) which enable users to achieve their goals.
  • 12. ! • Design without research is guesswork. • Or may result in an interface which reflects the understanding (mental model) of a product’s programmers or architects, not its users. UI design should be thought of as: • A process integral to the creation of digital products. • A group of interrelated activities. • A mindset.
  • 13. THE CONTEXT OF UI DESIGN • Sits within a larger set of disciplines, all ultimately concerned with the interaction of people with machines. • Labels can be confusing and describe overlapping activities and processes which may be carried out by one or a number of people. • Interaction Design (IXD) and UI design: subtle differences in definition but will be used interchangeably in this lecture.
  • 14. USER EXPERIENCE (UX) DESIGN • Commonplace term in software design and beyond. • A vague term: which part of a digital product isn’t experienced by users? • Totality of users’ experiences of a product or service, from its content, navigation, aesthetics, interactions or even how quickly it performs or responds to users’ interactions. • Umbrella term for a number of more defined disciplines.
  • 15. THE UX VENN DIAGRAM Dan Saffer, 2009
  • 16. HUMAN-COMPUTER INTERACTION (HCI) • Academic study of the interaction between humans and machines. • Computer science, psychology, linguistics, sociology, anthropology. • Popularised in the 1980s but with roots in older fields of ergonomics and human factors: 1900s and earlier. • UI design can be thought of as the practical implementation of HCI research, methods and practices.
  • 17. 2. USER-CENTRED DESIGN (UCD) • The “U” in UI: USER; the “H” in HCI: HUMAN “Focus on the user and all else will follow.” (Google) • Focus on: people, their motivations, goals and behaviours. • Must be aware of technological constraints but UI design is not a technological process.
  • 18. USER-CENTRED DESIGN (UCD) • Involve users at all stages of the design process.
  • 19. RESEARCH • Who are the users? • How many different types of user are there? • What do they want to be able to do? • How do they currently do it? • Where do they currently do it? • Where might they want to be able to do it? • How might they want to be able to do it?
  • 20. USER GOALS, STRATEGIC GOALS AND CONSTRAINTS • What are the strategic goals (“business goals”) of the product you are creating; what were you funded to do? • Tensions between strategic goals and user goals: how will this be managed? • What constraints do you have: • Financial • Time • Technology • People
  • 21. USER RESEARCH • How do you find users? • An existing user base. • An organisation’s own information (e.g. marketing, focus groups, audience profiles): what are they willing to share? • Academic projects: project team contacts and knowledge. • If you have limited resources? • Friends, family, colleagues. • Mailing lists. • Social media.
  • 22. ENGAGING WITH USERS: INTERVIEWS • Need to be pragmatic: what are your constraints (time, financial). User research takes time and you may need to recompense people for their time. • If you have time: face-to-face, one-to-one interviews in user’s “natural environment”: ethnography or contextual enquiry. • Observe users: how they work, their behaviours, what other resources they use. • What users do and what they say they actually do may well be different (c.f. Jakob Nielsen’s First Rule of Usability). • Unstated goals, domain language.
  • 23. ENGAGING WITH USERS: OTHER METHODS • Interviews via Skype or Email. • Online surveys (generally better for quantitative information). • Existing published information about user behaviours.
  • 24. WHAT TO ASK • What kind of information: qualitative or quantitative information? At initial stages of research qualitative information may be more useful. • Ask non-judgmental and non-leading questions. • Don’t ask questions that are too open-ended (what is of relevance to the project given its constraints?) • For more information: • Box and Bowles, Undercover User Experience Design (2010) • Kuniavsky, Observing the User Experience: A Practitioner's Guide to User Research (2003).
  • 25. ANALYSIS AND CONCEPTUAL DESIGN • Analysis will probably take a lot of time! • Identify trends: what are user goals and how can these be supported—identify by analysing interests and behaviours, stated and unstated goals. • Use information to create high-level documentation to guide the design, e.g. user stories (statement of user goals by user group) or personas (more in-depth descriptions of “typical” users). • Conceptual design documentation—wireframes.
  • 26. DELIVERABLES • User stories: simple statements of overall user goals. • As a <type of user> I want <a goal> so that <some reason>: • As an academic historian I want to be able to track ownership and descent of manorial properties (to support my research). • As a genealogist I want to be able to be able to establish family relationships of the families I am researching so that I can use the information to construct a family history. • Sketches and wireframes: at this stage a point of discussion with other stakeholders.
  • 29. PROTOTYPING AND TESTING • Prototyping: creation of artefacts for testing with users: can be low-fidelity (e.g. paper-based), medium fidelity (e.g. wireframes, static coded web pages) or high fidelity (e.g. functional web pages). • Feedback from testing the prototypes can be fed back into further iterations of the design. • Resource intensive but much easier (and cheaper) to address issues and fix usability problems early in the process than later.
  • 30. COST BENEFIT “The rule of thumb in many usability-aware organizations is that the cost-benefit ratio for usability is $1:$10-$100. Once a system is in development, correcting a problem costs 10 times as much as fixing the same problem in design. If the system has been released, it costs 100 times as much relative to fixing in design.” T. Gilb (1998) quoted on the Usability Professionals Association (UPA) website.
  • 31. USABILITY TESTING • Usability “The extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use.” International Organization for Standardization (ISO): ISO 9241-11 • Doesn’t require a lab or expensive equipment. • One-to-one testing of a prototype with a user. A facilitator gives a participant a number of tasks to work through on the interface and asks them to “think aloud” their decisions. • Make notes on the user’s behaviour and, if possible, use screen recording software to record the user’s decisions, voice and facial expression.
  • 32. ITERATIVE DESIGN • Analyse results of testing and feed back into design • Don’t need many participants to identify main usability problems (around four should be fine). • Steve Krug: short, accessible books on running usability testing: Don’t Make Me Think! and Rocket Surgery Made Easy. • How many tests should you run? It depends. Usually defined by project constraints (unless you’re Google who once famously tested 41 shades of blue to see which performed better!). • Remote usability testing software: an alternative to running face-to- face tests, but usually better for gathering quantitative information.
  • 33. UCD: SUMMARY • A mindset: gives a voice to the user throughout the design and build process. • Iterative: design, test, design, test etc. • Be pragmatic. You will always have constraints. • One round of testing is better than none. • Testing one user is 100% better than testing none (but more is better!).
  • 34. 3. DESIGN PRINCIPLES 3.1 Simplicity 3.2 Structure 3.3 Visibility 3.4 Consistency 3.5 Tolerance 3.6 Feedback
  • 35. 3.1 SIMPLICITY • A user interface should be kept as simple as possible for users in order that they can achieve their goals. • What is simplicity? The simplest interface for the job, but no simpler! • Which is simpler?
  • 38. SIMPLICITY • Depends on context of use. • What is the purpose of your product? • What do your users want to do? • Keep to your core functionality
  • 39. 3.2. STRUCTURE • Ensure that the interface is clearly laid out, well organised and controls are easily identifiable. • “Gestalt laws of perception”: • Proximity. When elements are grouped together, people perceive them as being related. • Similarity. Elements that look similar are perceived as being related. • Closure. As humans we are generally quite good at filling in missing information and this is certainly the case in perception. We fill in the blanks with “incomplete” images. Commonly used in logo design etc.
  • 40. Proximity: the layout of a navigation menu
  • 41. Proximity and similarity: Flickr’s top menu bar Similarity: Icons for Adobe Dreamweaver and Fireworks
  • 43. Grids: an established tool from graphic design for imposing order on information
  • 45. 3.3. VISIBILITY • Visibility can be thought as ensuring that interface controls that need to be accessed by the user are as visible as possible. • It ties in with the idea of “affordance”, popularised by the design thinker and writer Don Norman: “The perceived and actual properties of the thing, primarily those fundamental properties that determine just how the thing could possibly be used.” (Don Norman, 1988)
  • 46. • Affordance: “this is for doing that”. Underlined text on a web page is for clicking
  • 47. The “home” button on an iPhone is for pressing
  • 48. • Conform to established rules. • Use of appropriate metaphors can also promote visibility. Sometimes metaphors come from a pre-existing technology, e.g.: The Gmail icon: resembles a “traditional” envelope • At its most extreme this can result in “skeuomorphism”: incorporating elements in the UI from a previous technology that serve no purpose other than being decorative.
  • 49. Apple’s Podcast app: features an emulated tape mechanism. “Real-world” UI metaphors most successful when they allow users to easily form connections between the interface and existing technologies. What does a tape mechanism mean for younger users?
  • 50. 3.4. CONSISTENCY • “People see what they expect to see.” • Recognition over recall. • Consistency across a product or set of products.
  • 51. 3.5. TOLERANCE • Well designed software should try to prevent users from making errors in the first place but is inevitable that mistakes will happen. A tolerant UI is a forgiving UI and lets users recover from mistakes they have made. • Mistakes may take many forms, e.g. an accidentally discarded email draft, a formatting mistake in a Word processor or an incorrectly filled form field.
  • 52. Tolerant: the colour picker in Photoshop: only allows me to enter six digits for a hex colour code (red, green and blue number pairs).
  • 53. Intolerant: the colour picker in Illustrator: allows me to enter more than six digits and then presents me with an annoying error message (also note the inconsistency across products).
  • 54. 3.6. FEEDBACK • How the UI communicates with the user after she has carried out an interaction. • Feedback may be visual, auditory or even haptic (that is communicated via touch): • The success message that appears after a web form has been submitted. • The whooshing sounds as an SMS is sent from an iPhone. • The sense of a Wii controller vibrating when simulating a machine gun being fired on Call of Duty.
  • 55. NIELSEN’S HEURISTICS • Jakob Nielsen’s ten heuristics (guidelines!) for creating usable interfaces (1999): • Visibility of system status • Match between system and the real world • User control and freedom • Consistency and standards • Error prevention • Recognition rather than recall • Flexibility and efficiency of use • Aesthetic and minimalist design • Help users recognise, diagnose and recover from errors • Help and documentation http://www.useit.com/papers/heuristic/heuristic_list.html
  • 56. 4. WHY YOU SHOULD CARE 4.1 Finance 4.2 Impact 4.3 Ethics
  • 57. 4.1 FINANCE • Cost savings of usability testing. • For commercial organisations, greater usability leads to increased sales and greater competitive advantage. • For non-profits, “conversion rates” (e.g. transforming a casual user to a signed-up and engaged user) are still important: a resource that addresses the needs of its users is more likely to lead to greater use and (repeated) engagement. • Justify the use of limited funds. • Reduce support costs.
  • 58. 4.2 IMPACT • Increased user engagement in design can lead to more user-focused resources which in turn can increase a resource’s impact. • Old Bailey Online: • JISC funded user engagement exercise: resource was not being well-used by academic community. • Study resulted in creation of sets of tools aimed at teachers and researchers. • Impact important consideration when creating funding applications. • Toolkits for measuring impact of digital resources, e.g. TIDSR: Toolkit for the Impact of Digitised Scholarly Resources (Oxford Internet Institute).
  • 59. 4.3 ETHICS • All resources have users or potential users. • Users may battle with a difficult UI if your resource is unique enough but why should they? • Jef Raskin, The Humane Interface (2000): laws of interface design: • A computer shall not harm your work or, through inactivity, allow your work to come to harm. • A computer shall not waste your time or require you to do more work than is strictly necessary.
  • 60. FINALLY • There are plenty of terrible user experiences already, don’t add to them. • Engage with users and follow established design processes and principles. • Start noticing the good and bad user experiences you encounter every day.
  • 66. DESIGN EXERCISE • Suggest up to three changes to the CCED search screen which would assist amateur local historians. • 5-10 minutes: familiarise yourself with the brief. • Maximum 25 minutes on the design: sketch! • 5 minutes: prepare to present. • 2-3 minutes per group: present your ideas. • No right or wrong answers.