# A Hybrid Recommender System for HCI Design Pattern Recommendations
## 3 Proposed Recommender System
### Overall Architecture of the IDEPAR System
#### 3.2.2 Semantic Module  
The main target of the semantic module is to perform an automated reasoning over the MIDEP ontology [24; 25] and to select the most relevant design patterns based on an  
Figure 3: IDEPAR system architecture. ontology-based technique. In the following, we present an overview of the MIDEP ontology and describe the workflow of the semantic module. * The MIDEP ontology:  
The MIDEP ontology is a modular ontology that is built using the NeOn methodology [26]. This ontology presents a modeling solution for tackling recurring design problems related to user interfaces. As depicted in Figure 4, we distinguished three main modules that constitute the MIDEP ontology, including the design pattern module, the user profile module, and the user interface module. The proposed IDEPAR system considers a collection of 45 HCI design patterns that are formalized within the MIDEP ontology. A partial list of these design patterns, along with their corresponding design pattern category, group, problem, and solution, is illustrated in Table 3.  
* Semantic module workflow:  
The semantic module workflow, depicted in Figure 5, takes design problem categories affected by the NLP module as input and outputs a list of the recommended design patterns. A detailed description of each phase is provided below. \begin{table}
\begin{tabular}{c c c c c} \hline \hline
**Design Pattern** & **Design Pattern** & **Design Pattern** & **Design Pattern** & **Design Pattern** \\
**Group** & **Category** & **Name** & **Problem** & **Solution** \\ \hline \multirow{4}{*}{Navigation} & \multirow{4}{*}{Interaction} & MapNavigator & \begin{tabular}{c} User needs to find a location of \\ choice on a map \\ \end{tabular} & Display map navigator element \\  & & Menu & User needs to access the main \\ \cline{3-5}  & & & \begin{tabular}{c} navigation \\ Content needs to be separated into \\ sections and accessed using a flat \\ navigation structure \\ \end{tabular} & Repeat the main navigation on \\ \cline{3-5}  & & & \
\begin{tabular}{c} Content needs to be separated into \\ sections and accessed using a flat \\ navigation structure \\ \end{tabular} &
\begin{tabular}{c} Display a horizontal bar \\ containing the different sections \\ or categories \\ \end{tabular} \\ \hline \multirow{2}{*}{FontColor} & \multirow{2}{*}{Customization} & LightFont & User has difficulties perceiving \\  & & DarkFont & font color \\ \cline{3-5}  & & ColoredFont & & Set colored font color \\ \hline \hline \end{tabular}
\end{table} 
Table 3: Partial list of HCI design patterns. Figure 4: MIDEP ontology model. 1. Phase 1: The workflow starts by checking the semantic similarity between design problem categories and design pattern group. First, the semantic module calculates the Semantic Similarity Measures (SSM) and creates relationships between concepts that are semantically similar. In Figure 6, we provide an algorithm that illustrates this process in more detail. After that, the semantic module performs a matching between MIDEP ontology instances, including the design problem concepts and design pattern group. At this level of matching, the present module applies generic rules using the inference engine. These inference rules include an antecedent and consequent part; whenever the \"conditions\" presented in the antecedent part hold, the \"facts\" specified in the consequent part must also hold. An example of a matching rule applied in this phase is illustrated in Table 4.
2. Phase 2: The second phase within the semantic module addresses the selection of the design pattern group and their corresponding design patterns. In particular, the present module makes inferences on the MIDEP ontology using a reasoning mechanism based on the \"hasDPgroup\" relationship between the ontological concepts.