1 Hypermedia Design Models & Methodologies Dr Gary Wills IAM Research Group © University of Southampton
Jan 17, 2016
1
Hypermedia Design Models & Methodologies
Dr Gary Wills
IAM Research Group
© University of Southampton
2
Aims of Lecture
• To present the major design models and methodologies.– HDM– RMM– OOHDM
• To briefly look at:– Design environments– Design patterns
3
Why Do We Use Design Models
• Give a discipline approach and structure to the design process– Makes visible the activities to be undertaken– Identify the deliverables– Aids organisation to plan
• Staff, schedules, budgets, project management
– Aids communication between Analysts, designers, implementers and clients
4
Hypermedia Design Model (HDM).
• Originally developed by Garzotto et al around 1993
• This is a design model and not so much a methodology
• Allows the documentation and comparison of designs
5
HDM- Authoring
• Authoring in the Large– Overview of information elements – Navigational structures – Independent of node content
• Authoring in the Small– Development of the node contact– Captures semantics of the the application
6
HDM-Entities
• Entities – a physical object or concept in the domain– Grouped into entity types.– Autonomous pieces of information– Consist of a hierarchy of components
• Components– Represent an abstraction of a set of units
• Units – Represent information from different perspective
7
HDM. – Entity Relationships
• Different from tradition E-R diagrams– Complex inner structures– Default browsing semantics (structure)
• Perspective– Syntactical device to organise information– All components of an entity have the same
number of perspectives as the entity.
8
HDM.-links• Links in HDM
– Capture the domain relations
– Capture the navigational patterns
• Link Types– Structural links: connect together components
belonging to the same entity.
– Perspective links: connect together the different units that correspond to the same component.
– Application links: denote arbitrary, domain dependent relationships
9
HDM. -Schema
• A schema (a diagrammatic outline) describes the application at a global level– Independent of file structure and implementation
• A schema definition specifies a set of entity types and link types.
• A schema instance is a collection of entities, components, units, and links that satisfy the definitions of the schema
10
HDM.- Summary
• HDM is a design model– HDM consists of typed entities which in turn are
composed of components.
– Entities and components are connected by structural links or application links.
– An HDM schema is a set of entity and link type definitions
– A schema instance is a set of actual entities and links.
– HDM is a top-down design process for the development of applications
11
The Relationship Management Methodology (RMM).
• Originally developed by Isakowitz et al in 1995
• This is a design methodology based on similar concepts as HDM
• Applicable to a narrow set of data– Volatile data that requires regular updating
12
RMM.
• RMM provides both a design model and a set of steps to aid implementation.
• Uses a form of E_R diagram – Relationship management data MODEL
• The RMM is a full design life-cycle model
• The methodology core focuses on the design phases
13
Construction
Run-Time BehaviourDesign
Navigational Design S3
User InterfaceScreen Design
Entity Design S2
Conversion ProtocolDesign
Entity Relationship (diagrams) S1 Design
14
RMM.-Step 1 E-R Diagram
• Information space analysed and modelled using E-R diagram– Well known and documented technique
– Identifies entities and relationships
– Focus on inherent structure not domain information use
– Similar techniques to reduce many-to-many relationships
• Slight difference from E-R– Links are directional
15
RMM.- Step 2 Slice Design
• Determine how the information in the entity is – Presented to the user, – How the user may access it.
• Attributes of a entity instance are grouped into slices– Structural links: links between slices of same entity– Associated links: links between slices from
different entities
16
ContactDetails
Name
Address
GenreBiography
lives at
Contact at
Bio Info
writes
Wri
tes
Author
17
RMM. – M Slice
• A limitation to slicing – Can only slice up an entity
• New type of slice, m-slice– Models presentation units that contain
information from more than one entity.– Models only information not presentation– Can be nested
18
19
RMM. -Step 3 Navigational Design
• Designing the navigation paths through the entities.
• Described in generic terms and not hard coded. – Aids updating of the information– Achieved by referring to properties of the
entities and their relationships.
• Conducted in parallel with S2
20
RMM- Remaining Steps
• S4 conversion protocol: – This step transforms each element on the RMDM
diagram into an implementation object..
• S5 user-interface design: – Design of interface components using the
RMDM..
• S6 run-time behaviour: – This stage considers the functionality of the
application.
• S7 construction and testing:
21
RMM. - Summary
• Based on entity-relationship modelling. • Focuses the design stage.• Most appropriately used for applications. When
– High degree of structure – High volatility of information
• Does not tied the designers to any specific implementation
• RMM takes a top-down approach to the design but does not support iteration
22
The Object Oriented Hypermedia Design Model, (OOHDM)
• This methodology was proposed by Schwabe et al.
• They say that a good Web application should be, first of all, a good hypermedia application.
• OOHDM builds a hypermedia application using an object-oriented framework.
• The design method uses a four-step process, each focusing on a particular design control.
23
OOHDM- Conceptual Analysis
• The main aim of this step is to capture the domain semantics as naturally as possible.
• Little concern is made of the type of user , task undertaken, functionality or structure.
• Results in a conceptual schema built out of subsystem classes and relationships.
24
OOHDM-Navigational Design
• Reorganised the information to take into account the users tasks/profiles – Define a navigational model in terms of nodes,
links and access structures. – Avoids the redundant information and prevent
the user getting lost in hyperspace.
• Independently of the conceptual model.
25
OOHDM-Abstract Interface
• Perceptible interface objects are defined in terms of interface classes.
• Interface behaviour is declared specifying – how to handle external and user generated events
– how communication takes place between navigational and interface objects.
• A clear separation– allows different interfaces for the same navigational
model, giving a higher degree of independence.
26
OOHDM-Implementation:
• The designer maps the navigational and interface models into a concrete object.
• The conceptual domain-use relational database and scripts
27
OOHDM-
• Separation of the design into clear steps allows the designer to focus on the important issues in each step.
• OOHDM does not cover the early aspects of the design process nor does it address how the steps are coordinated
28
OOHDM-Summary
• An OO incremental based design method with hypermedia domain specific extensions
• There are four main activities– Conceptual, design Navigation design, Abstract
interface design, Implementation
• By separating the different design phases OOHDM improves maintainability
• OHDM is an iterative approach, yet it does not describe explicitly how the design phase are coordinated
29
Applying and Adapting the Methodology.
• You will need to adapt the model and methodology to you requirements– Principles the same, examples different
– Modify the product model by adding domain specific entities and removing redundant entities
– Modify the activities to reflect the changes in the product model, even add or remove activities.
– Modify the outputs to reflect the changes to the activities and add or remove outputs
30
Tools and Environments
• The design methodology is independent of implementation solution.
• A design environment are required– A fast experimental feedback loop.
– Tools for generalisation and instantiating models.
– Easy and unconstrained cloning tools.
– The ability to easily build solutions that may be evaluated directly.
– Integrating light prototyping
31
Tools and Environments
• Tools-– Golden rule: First decide the methodology to
be used, implement it, then look for opportunities to enhance it by using a tool.
– Support for a specific methodology, i.e, RMCase
– General tools i.e ColdFusion
32
Design Patterns
• Capturing design rules that emerge from the design– Identify common problems during design– Identify alternative solutions– Uses a shared vocabulary-model independent– Helps newer team member learn quickly
• Does require time, as information entered into a knowledge base
33
Design Patterns;- Structure
• The pattern should be clear, consistent and in a uniform structure.– Always give the pattern's context– Problem and interaction of events– Elements of the solution– Try to include examples– Use a naming convention
34
Design Patterns :- Examples
• Organising information space:– What are the effective ways to organise the information
to aid navigation and yet also suit human cognition
• Organising the interface: – What type of interface is appropriate in what
circumstance.
• Implementation: – Implementing the appropriate navigation aids.
• Process: – Often captured in a methodology as described above.
35
Summary
• HDM– A model– Use E-R diagrams– Used as the basis of the other methodologies
• RMM– E-R based– Slice entities
• OOHDM– OO techniques used
36
Summary
• No perfect design model as yet– You need to modify and methodology used.
• Tools– Choose your methodology first
• Design patterns– Captures your ‘neat’ ways of solving a problem