37
Bachelor’s thesis “An interactive form-based mobile software system with a sample application in eldercare” Markus Harrer 2 nd presentation in Advanced Speaking 6 th June 2013

An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Embed Size (px)

DESCRIPTION

Presentation about my bachelor's thesis back in early 2009. The motivation for this paper was that mobile devices have been entering the workplace at businesses that were previously not supposed to be "digitalized" thus leading to overwhelmed staff and software systems suffering from major acceptance drawbacks. My primary research questions were to find a way to design and realize a software system that can support "interactive forms." Interactive forms are a structured game-like way of entering or gathering data in a computer. They have a well-designed and visually appealing user interface combined with a motivation system (e.g. achievements or high scores). Other goals of my thesis were to create a software development process and a software architecture that support a workflow for the interdisciplinary design of interactive forms. In my thesis I initially investigated and gathered domain-specific requirements for elderly care, which is a (nearly) non-digitized domain, to better understand the problems that a caretaker has to deal with every day. I then analyzed the specific needs of interaction designers and software developers and looked for domain expert centric, iterative development processes that are similar for interaction designers and software developers. This was followed by an examination of existing software architectures that can support most of the requirements previously determined. Finally, I implemented a prototype that demonstrated the feasibility of interactive forms and their underlying software architecture and development process.

Citation preview

Page 1: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Bachelor’s thesis

“An interactive form-based mobile software system with a sample application in eldercare”

Markus Harrer

2nd presentation in Advanced Speaking

6th June 2013

Page 2: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Outline

1. Introduction to usability and interaction design

2. Bachelor’s thesis approach and results

3. Use of the English language

4. Summary

6/6/2013 Markus Harrer Slide 2

Page 3: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Outline

1. Introduction to usability and interaction design

2. Bachelor’s thesis approach and results

3. Use of the English language

4. Summary

6/6/2013 Markus Harrer Slide 3

Page 4: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

6/6/2013 Markus Harrer Slide 4

Page 5: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Why should we care about usability?

Definition (ISO 9241-11)

“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.”

Five attributes of usability (Nielson)

• Learnability• Efficiency• Memorability

• Errors• Satisfaction

6/6/2013 Markus Harrer Slide 5

Page 6: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Why should we care about usability?

Definition (ISO 9241-11)

“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.”

Five attributes of usability (Nielson)

• Learnability• Efficiency• Memorability

• Errors• Satisfaction

6/6/2013 Markus Harrer Slide 6

Bad readability

Unexpected error What is the right answer?

Page 7: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Bad user interface design

6/6/2013 Markus Harrer Slide 7

Difficult to learn

Hard to remember

Too many distractions

Page 8: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Good user interface design

6/6/2013 Markus Harrer Slide 8

Page 9: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Good user interface design

6/6/2013 Markus Harrer Slide 9

“Perfection is achieved, not when there is nothing more to add,

but when there is nothing left to take away.”

Antoine de Saint-Exupéry

Page 10: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

6/6/2013 Markus Harrer Slide 10

Page 11: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

“The practice of designing interactive digital products, environments, systems, and services.“

Alan Cooper, About Face 3

6/6/2013 Markus Harrer Slide 11

“Interaction design is heavily focused on satisfying the needsand desires of the people who will use the product.

…Where other disciplines like software engineering have a heavy focus on designing for technical stakeholders of a

project.”Wikipedia

What is interaction design?

Page 12: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

6/6/2013 Markus Harrer Slide 12

Bad interaction design

Visual and cognitive overload

No guidance

Page 13: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Good interaction design

Big Brain Academy

6/6/2013 Markus Harrer Slide 13

Angry Birds

Fruit Ninja

Page 14: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

What do we need for game-like software?

6/6/2013 Markus Harrer Slide 14

General information

Motivation system

Overall result

Daily progress

Modular structure

Rewards Customizable

“Brain Training” on Nintendo DS

Page 15: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Roles of an interaction designer

• Visualizes concepts and interactions

• Designs rich graphical interfaces

• Creates dynamic prototypes for early testing

• Evaluates UI via end user tests

• Supports the development team

• Uses user-centric process model

6/6/2013 Markus Harrer Slide 15

Page 16: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Outline

1. Introduction to usability and interaction design

2. Bachelor’s thesis approach and results

3. Use of the English language

4. Summary

6/6/2013 Markus Harrer Slide 16

Page 17: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

My Thesis: The challenges

6/6/2013

Goals

1. Develop a process model for the collaborative work of interaction designers and software engineers

2. Find a software architecture that supports that development process

3. Demonstrate usefulness by a prototype implementation

“An interactive form-based mobile software system with a sample application in eldercare”

Markus Harrer Slide 17

Page 18: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Approach

1. Analyze requirements

2. Derive key features

3. Invent metaphor

4. Find development process

5. Find system architecture

6. Implement prototype

6/6/2013 Markus Harrer Slide 18

Page 19: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Various types of forms in eldercare

6/6/2013 Markus Harrer Slide 19

1. Analyze requirements

Page 20: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Existing software products in eldercare

6/6/2013 Markus Harrer Slide 20

1. Analyze requirements

Page 21: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

System’s requirements

Observations

• Many various forms in one nursing home

• Different forms per nursing home

• Many non-technical people• Work mobile• Use medical equipment

Conclusions

1. Need for modular, customizable software system

2. Mobile device, touch screen input, game-oriented interface / animations and direct hardware access

6/6/2013 Markus Harrer Slide 21

1. Analyze requirements

Page 22: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Mock-up: A mobile assistant for elderly care

Main goals

• Provide reminder / scheduling functionality

• Reduce the writing effort

• Improve the flow and quality of information

System goals

• Focus on high usability

• Integrated motivational system

• Process-oriented workflow

• Minimize learning and training efforts

6/6/2013 Markus Harrer Slide 22

2. Derive key features

Page 23: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Mock-up examples 1

Start screen Overview of residents

6/6/2013 Markus Harrer Slide 23

2. Derive key features

Page 24: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Mock-up examples 2

Documentation of wounds Task list

6/6/2013 Markus Harrer Slide 24

2. Derive key features

Page 25: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Metaphor: Interactive Forms

6/6/2013 Markus Harrer Slide 25

Paper-based forms Interactive Form System of Interactive Forms

3. Invent metaphor

Client• Elaborated and dynamic graphical

features• Animations / video support• Direct communication with hardware• Wizard-based interaction style

General• One Interactive Form per use case• Modular architecture• Synchronization mechanism for data

Page 26: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Connecting the stakeholders

6/6/2013 Markus Harrer Slide 26

Interaction DesignerEnd User

Software EngineerDomain Expert

Domain expert and software engineerRequirementsUse CasesBusiness logic and data structuresAcceptance testing

4. Find development process

End user and interaction designerUser interfaceInformation architectureDesign and behaviorUsability testing

Page 27: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Interaction Designer

Need for separated system components (technical)

Software Engineer

6/6/2013 Markus Harrer Slide 27

Need for an integrated development workflow (process)

Software EngineerInteraction Designer

Software EngineerInteraction Designer

?

The challenge: Connecting

4. Find development process

Page 28: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Analysis

Design

Implemen-tation

First result: A development process for interactive forms

Project start

End User Domain Expert

Interaction DesignerUser-centered Design

Software EngineerAgile Development Process

Proto-typing

Design

Implemen-tation

Evaluation / Result

6/6/2013 Markus Harrer Slide 28

4. Find development process

Page 29: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Interactive Form

User Interface

Persistence / external data

Business Logic

Interactive Form

User Interface

Persistence / external data

Business Logic

Interactive Form

User Interface

Persistence / external data

Business Logic

Architecture of a interactive form

=> Pluggable Component Architecture

Interactive Form

User Interface

Persistence / external data

Business Logic

6/6/2013 Markus Harrer Slide 29

Interaction Designer

End User

Software Engineer

Domain Expert

5. Find system architecture

Page 30: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Second result: A Gun Magazine Architecturefor interactive forms

• Horizontal and vertical separation of concerns

• Support for parallel development activities

• Customizable features and functionality

• Framework provides common services

Interactive Form

User Interface

Persistence / external data

Business Logic

6/6/2013 Markus Harrer Slide 30

5. Find system architecture

Page 31: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Proof of feasibility: A primitive prototype

6/6/2013 Markus Harrer Slide 31

Interaction Designer Domain ExpertSoftware EngineerEnd User

Microsoft Expression Studio

Microsoft Visual Studio

Microsoft XAML2

Microsoft C# / .NET / CAL3

Interactive Form

Tools / IDE1

Language /Framework

Artifact1IDE: Integrated Development Environment2XAML: Extensible Application Markup Language3CAL: Composite Application Library

6. Implement prototype

Page 32: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Third result: UI of a primitive prototype

6/6/2013 Markus Harrer Slide 32

Pre app era / hype (early 2009): No iPad or Google Nexus available yet!

6. Implement prototype

Page 33: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Outline

1. Introduction to usability and interaction design

2. Bachelor’s thesis approach and results

3. Use of the English language

4. Summary

6/6/2013 Markus Harrer Slide 33

Page 34: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Use of the English language

• Literature

• User-centered design• Usability Engineering• Interaction Design

• Research Papers• Human-Interaction patterns• Composite frameworks

• Software• Documentation of frameworks• Source code and in-program documentation

6/6/2013 Markus Harrer Slide 34

Page 35: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Outline

1. Introduction to usability and interaction design

2. Bachelor’s thesis approach and results

3. Use of the English language

4. Summary

6/6/2013 Markus Harrer Slide 35

Page 36: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Summary

• Interaction design is most important for successful systems

• Increasing the collaboration between stakeholders can lead to a huge improvement towards usable and engagingsoftware systems

• A user-centered, iterative design process can be easily achieved

• A software system designed with a “Gunshot Model Architecture” can support a collaborative software development process

6/6/2013 Markus Harrer Slide 36

Page 37: An interactive form-based mobile software system with a sample application in eldercare (bachelor's thesis 2009)

Thank you!

Questions?

6/6/2013 Markus Harrer Slide 37