SOFTWARE DEVELOPMENT PROJECT

ASSIGNMENT 3: DESIGN DOCUMENT

Ahmad Helmi (20/454524/PA/19555)

Kavindra Alaika Ahmad (20/457771/PA/19809)
Dzaki Dzikril Hakim (20/454530/PA/19561)

DEPARTMENT OF COMPUTER SCIENCE AND ELECTRONICS

FACULTY OF MATHEMATICS AND NATURAL SCIENCES
UNIVERSITAS GADJAH MADA
YOGYAKARTA
2022
 TABLE OF CONTENTS

1. Architecture ........................................................................................................................ 1

1.1. General Architecture .............................................................................................. 1

1.2. Process of Visualisation of FHIR Resources Browsing ......................................... 1

1.3. Process of Visualisation of FHIR Profile and Extension Browsing ...................... 2

1.4. Process of Visualisation of FHIR Profile and Extension Creation......................... 2

2. System Description ............................................................................................................ 3

LIST OF FIGURES

Table 1.1 System Architecture ....................................................................................................... 1

Table 1.2 Visualisation Process of FHIR Resource Browsing ....................................................... 1

Table 1.3 Visualisation Process of FHIR Profile and Extension Browsing ................................... 2

Table 1.4 Visualisation Process of FHIR Profile and Extension Creation ..................................... 2

Table 2.1 System Flowchart ........................................................................................................... 3

Table 2.2 System Use-Case Diagram ............................................................................................. 3

1. Architecture

The software relies on visual FHIR as a graphical tool to convey the content of FHIR; it allows
for the visualisation of browsing, profiling, and defining extensions. The outline of system
architecture is as follows: FHIR specification, Visual FHIR, and Clinical Context of Use. User
interaction takes place in Visual FHIR, where users can perform visualised browsing, profiling,
and extension defining. Figure 1.1 illustrates the system architecture.

Figure 1.1 System Architecture

For browsing FHIR resources, the software parsed the schemas of the FHIR resources. It obtains
the Uniform Resource Identifiers (URIs) by following "$ref". The elements of each schema file
are found by parsing "properties". Functions d3.layout.tree and d3.svg.diagonal are used to
construct the collapsible tree graph of the schema. JQuery is used to support interactive
functions. Figure 1.2 illustrates the process of FHIR resources browsing visualisation.

Figure 1.2 Visualisation of FHIR Resource Browsing

For browsing FHIR profiles and extensions, the Structure of StructureDefinition file is parsed to
obtain elements under "snapshot" nodes. The relations between nodes in the tree is found by
parsing the node property "path". The graph is constructed using function d3.layout.tree and
d3.svg.diagonal and the relation graph is created using d3.layout.force. Figure 1.3 illustrates the
process of FHIR profiles and extensions browsing visualisation.

Figure 1.3 Visualisation of FHIR Profiles and Extensions Browsing

For creating FHIR profiles and extensions, the software focuses on basic functions, such as
changing cardinality, removing elements useless to the case context, and adding use case
extensions. HAPI FHIR API is implemented to ensure that user defined profiles and extensions
conform to the FHIR specification Figure 1.3 illustrates the visualisation process.

Figure 1.4 Visualisation of FHIR Profiles and Extensions Creation

2. System Description

Users can input a FHIR file. If they choose to browse a FHIR resource, the system parses the
schema and displays a tree graph representation of the FHIR Profile. If the user chooses to
browse a FHIR profile or extension, the system parses through Structure Definition and displays
tree and relational graphs of the profile or extensions.

Users can interact with the tree graph; clicking on a node will expand or collapse the sub-tree
from that node. Clicking on a node name is going to bring up descriptions and definitions of each
element. Users can also search for specific elements, which the system will display at the centre
of the page in bold. Importing a new FHIR file will override the current one.

Figure 2.1 and Figure 2.2 illustrate the workflow of the system.

Figure 2.1 Flowchart of the System

Figure 2.2 Use Case Diagram of the System