Designing Asynchronous Online Discussion Forum Interface and Interaction Based on the Community of Inquiry Framework

The community of inquiry (CoI) framework describes a process for creating collaborative learning through three elements or presences: social, cognitive, and teaching. Despite its popularity among researchers and practitioners, use of the CoI model is limited to mapping instructional activities, which are yet to be developed into an interaction design for online collaborative learning intended to support the CoI presences. This study was aimed at developing the interaction design of an asynchronous online discussion forum employing a user-centered design method contextualized to the learning-centered design approach. Seven scenario and user interfaces were created to facilitate one introductory activity and four phases of inquiry. The design was evaluated through contextual interviews with ten students. The interviews revealed that the prototype encouraged and supported (a) introductory activity (social presence), (b) idea exploration (cognitive presence), (c) summarizing the discussion (cognitive presence), and (d) facilitating discussion (teaching presence). Future research could be aimed at improving the proposed design based on recommendations and developing a fully functional working system to be tested in real settings.


Introduction
Online collaborative learning (OCL) has been widely discussed and recommended in the discourse of online learning (Laal, Laal, & Kermanshahi, 2012).The notion of collaboration in OCL refers to a group of learners who participate in idea transactions in which learners construct their personal knowledge (Garrison, 2016).This concept was derived from constructivist theories that describe learning as an active process in which a person constructs knowledge based on experience (Hendry, Frommer, & Walker, 1999), prior knowledge (Bransford, Brown, & Cocking, 2000), and interactions with other learners as well as environments (Garrison, 2016).
The discourse of OCL has brought forward various theories and frameworks.A systematic review of the trends in online educational research by Valverde-Berrocoso, Garrido-Arroyo, Burgos-Videla, and Morales-Cevallos (2020) found that the community of inquiry (CoI) framework developed by Garrison, Anderson, and Archer (2000) has become the most widely adopted framework in online educational research.Garrison et al. (2000) developed the CoI framework based on the concept of collaborative thinking.The community of inquiry refers to a learning environment in which a group of learners collaborates to construct understanding of a concept (Garrison, 2016).
The CoI framework consists of three interrelated constructs or presences: cognitive presence, teaching presence, and social presence.According to the CoI model, the three constructs make up a meaningful educational experience.Cognitive presence refers to a learner's construction of meaning through interacting with other learners.Teaching presence refers to the organization and management of learning activities to sustain meaningful interaction and knowledge construction.Social presence refers to a learner's expression of authentic individual characteristics, which encompasses social cues, openness, and group cohesion.The CoI model, including its three presences, is depicted in Figure 1.

Figure 1
The Community of Inquiry (CoI) Model Note.From "About the Framework: An Introduction to the Community of Inquiry," by Centre for Distance Education at Athabasca University, 2021 (http://thecommunityofinquiry.org/coi).CC BY-SA 4.0.
The dynamics of the CoI presences are related to the need to foster and sustain certain presences during each specific phase of a collaborative learning activity.Garrison (2016) recommended that social presence be nurtured during the early phase of learning.Once social presence has created a conducive learning environment for effective collaboration (e.g., strong group cohesion, openness for communication, etc.), cognitive and teaching presence need to be cultivated to ensure the attainment of learning goals.Therefore, effective instructional strategies should be designed to meet a range of needs.
In the context of online learning in higher education institutions, the CoI model has become popular as a framework that provides guidance to deliver computer-assisted collaborative learning.The CoI framework is also viewed as suitable for higher education settings (Vaughan, Cleveland-Innes, & Garrison, 2013) based on the understanding that education at this level is fundamentally a process of inquiry in which learners act as discoverers and not as mere users or followers (Lipman, 2003).
In regard to CoI framework implementation in an online learning environment, an asynchronous online discussion forum (AODF) could serve to facilitate collaboration among learners.Both collaboration and critical thinking could be fostered due to the forum's asynchronous nature, giving ample time to participants to read messages and plan responses well before posting them (Garrison & Anderson, 2003).Moreover, a well-designed environment is crucial to the success of OCL, as shown in Sun, Franklin, and Gao (2015), in the context of informal English language education.Thus, there is a need to design effective online learning environments to ensure the success of OCL.
Regarding the need to design an effective OCL environment, especially one that adopts the CoI framework, there are limitations found in the discourse on CoI.Despite being widely adopted and referred to in a number of studies, use of the CoI framework is still limited to addressing two issues.
First, recent studies have focused only on mapping instructional activities to certain CoI presences (Dunlap & Lowenthal, 2018;Fiock, 2020;Stephen & Roberts, 2017;Stewart, 2017).Second, research into design that encompasses both instructional and interaction design aspects has yet to evaluate the effectiveness of any proposed design to foster and sustain the three CoI presences, as shown in Fiock (2020), or is limited to only a single feature supporting a single CoI presence, as demonstrated in Faisal, Junus, and Santoso (2020).Therefore, in order to address these research gaps, the following research questions (RQ) were posed in this study.
• RQ1: How is the interaction design of an AODF that is intended to foster and sustain CoI presences developed?
• RQ2: What are learners' reactions when interacting with a prototype of an AODF that is intended to foster and sustain CoI presences?
In order to answer the research questions, the interaction (i.e., scenario of use) and user interface (i.e., graphical elements) design of an asynchronous online forum were developed in this study.The prototype designs were evaluated, applying user insights to further improve the designs.

Relevant Theories The Community of Inquiry (CoI) Framework
The CoI is defined by Garrison (2016) as a community in which participants engage in free inquiries to experience meaningful and complete learning of a concept and the inquiry process itself.Furthermore, the notion of inquiry refers to a collaborative approach to problem solving through reflective and interactive discussions among learners.There are aspects that are brought up by participants in the community.These aspects are shown in Figure 1 as the CoI presences that interact to form educational experiences in the context of a collaborative and constructive learning experience (Garrison & Anderson, 2003. Each of the three presences, (social, cognitive, and teaching,) has specific categories that define it.Each category consists of several indicators which represent the operationalization of the presence.Garrison and Arbaugh (2007)  The categories and indicators could be used as a reference to develop a coding scheme for analyzing the contents of discussion transcripts in order to diagnose what CoI presences are being shown by participants in a discussion forum (Garrison & Arbaugh, 2007).The indicators are only some examples that represent CoI presences.
The cognitive presence is operationalized in the practical inquiry model (Garrison, 2016).This model includes several phases that could be undertaken by learners in the process of constructing and negotiating meaning through both private world reflection and a shared world discourse.The phases include initial triggering events, exploration, integration, and resolution.Triggering events which take place in a shared world discourse could foster participants' awareness of the problem.This triggers exploration and integration in a private reflection to produce conception (i.e., possible solutions).The conception was then discussed to make a resolution.In this study, we used the practical inquiry model as a reference for defining the context of the use of the AODF.
The operationalization of the CoI presences is closely related to the medium in which the education experience is taking place.The next subsection describes the evolving concept of e-learning and the use of an AODF to facilitate OCL based on the CoI framework.

E-learning and the Asynchronous Online Discussion Forum
The concept of e-learning has gone through different phases of development that coincide with the development of information technology in education.As a result, the term e-learning has evolved along with its development phases.According to a study on its history by Aparicio, Bacao, and Oliveira (2016), the development of e-learning started from the advent of computer-assisted instruction.
In its subsequent development, e-learning referred to the use of Internet technology to facilitate distance learning (Garrison & Anderson, 2003).At present, a comprehensive definition of e-learning has been proposed by Sangrà, Vlachopoulos, and Cabrera (2012), who defined e-learning as an approach in learning that represents all or some aspects of a model that uses media and electronic devices to enhance accessibility, communication, and interaction, or facilitate the adoption of new understandings of learning developments.Similar to the definition by Sangrà et al. (2012), Aparicio et al. (2016) further expanded the scope of e-learning.More than just the use of computer technology to facilitate learning, it encompasses learning strategies, methods, content diffusion, and connections.
In regard to the application of the CoI framework to an e-learning system, the AODF plays an important part.The AODF is one feature of an e-learning system that could facilitate collaborative thinking activities, which are the main activities in online collaborative learning based on the CoI framework (Garrison, 2016).The AODF is a text-based communication medium with certain limitations in comparison to synchronous media, e.g., the inability to facilitate the expression of rich emotional cues (intonations, live facial expressions, etc.).However, an AODF can provide ample time to participants to reflect on how to respond well to ideas expressed in the forum.Thus, the AODF may foster critical thinking and facilitate higher-order learning (Garrison & Anderson, 2003).
The important role of an AODF in facilitating OCL underscores the need to provide effective AODF design to foster and sustain the CoI presences to ensure the attainment of learning goals.Designing interaction in an AODF is a crucial activity to ensure every participant has a meaningful and satisfying learning experience.The following subsection describes the relevant principles of interaction design for creating an effective AODF.

Principles of Interaction Design
Interaction design is an important aspect of computerized systems, including e-learning systems.
Interaction design is defined as the development of interactive products to support human communication and interaction in everyday life (Sharp, Preece, & Rogers, 2019).
There are some types of interaction that need to be catered to in the development of an e-learning system, namely learner-interface interaction, learner-content interaction, learner-support system interaction, and learner-context interaction (Anderson, 2008).Moreover, in the context of applying the CoI framework to an e-learning system, a meaningful learning experience is supported by three interacting entities that include learners, facilitators, and contents (Garrison & Anderson, 2003).
Effective interface design is crucial in developing an e-learning system.It is related to the usability of the system.Usability is defined as a set of quality attributes that determines the ease of use and the ease of learning how to use a product (Nielsen, 2012).Both the ease of use and the learnability are two of the six usability goals outlined by Sharp et al. (2019).
There are some best practices that serve as a guideline in developing interface design to attain the usability goals.One set of best practices is Shneiderman's eight golden rules of interface design (Shneiderman & Plaisant, 2005).Another is Nielsen's ten usability heuristics (Nielsen, 2020).Apart from referring to best practices in user interface design, this study adopted a user-centered design (UCD) method that has been adapted to the context of e-learning based on learning-centered design (LCD).
Details of the UCD and LCD are further discussed in the next section.

Methodology
This study adopted a research by design approach using an exploratory case study, which puts qualitative data into focus (Lazar, Feng, & Hochheiser, 2017) to explore the possible design solutions for a specific context.In this study, the specific context is the application of the CoI framework to the design of an AODF.
This study adopted the UCD method (Sharp et al., 2019;U.S. Department of Health and Human Services, 2006).UCD is an iterative method of designing interaction that consists of five phases: (e) evaluation.In this study, the UCD was also adapted to the context of e-learning system development with the involvement of experts as subject-matter and e-learning specialists.This adaptation reflects the LCD concept proposed by Dhar and Yammiyavar (2012), which focuses on providing an online environment that supports the learning process rather than just good usability.The identifying user requirements stage is related to another phase in UCD: defining user requirements.
During this phase, user needs and goals as criteria for product success are identified (U.S.Department of Health and Human Services, 2006).The output of this stage is a set of design requirements.In this study, both students and lecturers who used the AODF were involved through online surveys and indepth interviews.Online surveys involved 37 respondents (26 students and 11 lecturers), in-depth user interviews involved ten students, and expert interviews involved four specialists in OCL.

Figure 2 The Stages of This Study
The designing the interaction design stage is related to the designing solution phase in UCD.During this stage, high-fidelity user interfaces and contextual scenarios were developed as the interaction design of the AODF.The high-fidelity user interfaces are meant to closely resemble the final product (Sharp et al., 2019).The tool used to design the high-fidelity interfaces was Figma (www.figma.com).
Figma was chosen because of its free prototyping features and unlimited design files.The design solutions developed in this stage consisted of the AODF user interface design and its contextual scenarios that describe how the AODF is used in certain situations (e.g., during the early phase of OCL, etc.).Both outputs were used to answer RQ2.
The prototyping stage corresponds with the prototyping phase in UCD.In this stage, an AODF mockup was developed based on the high-fidelity user interfaces from the previous design stage.The mockup was a high-fidelity clickable prototype made using Figma's prototyping feature.
The design evaluation stage is related to the evaluation phase in UCD.During this stage, design solutions are tested by real users (U.S.Department of Health and Human Services, 2006).In order to answer RQ2, the user experience and users' perceptions regarding the prototype's ability to foster and sustain the CoI presences were captured in this stage.The evaluation was conducted qualitatively through contextual semi-structured interviews guided by contextual scenarios.The contextual interviews involved ten student participants.
User requirements, user perceptions, and user experience when interacting with the prototype were obtained using the methods illustrated in Figure 2. The results of in-depth interviews and online surveys in the early phase of this study which were used to formulate the design requirements are presented in the next section.The results of the design evaluation are discussed in the Evaluation Results section.

Design Requirements and Solutions
Students, lecturers, and experts expressed various views and reported diverse issues related to fostering and sustaining the CoI presences in the AODF.A summary of the findings from the in-depth interviews and surveys is illustrated in the rich picture shown in Figure 3.As shown in Figure 3, some students expressed the notion that they considered an AODF as a place for final answers where they are to give the one response they consider the best and most correct to the questions or problems presented by the lecturer.These phenomena were also observed in Junus et al.
(2019) as some of the challenges faced by students in CoI-based AODF activities.Dynamic discussions in which exploration and integration activities exist often occur in internal groups outside the AODF.
This could lead to unnatural responses written by students in the AODF and hinder efforts to diagnose and correct misconceptions during the early phase of discussions.
As shown in Figure 3, in any discussion thread with many participants, the large and growing number of responses hinder students' ability to monitor the discussion.Some students said that reading replies one by one was very tiring.One strategy adopted by some students to solve this issue was making notes when planning a response.
The in-depth interviews and surveys also revealed some AODF design requirements related to CoI presences.Table 1 presents a summary of the AODF design requirements that were gathered from the views of students, lecturers, and experts.Note.AODF = asynchronous online discussion forum.
The interaction design of the AODF was developed based on the design requirements presented in Table 1 and stages included in the practical inquiry model as the contexts of use, which reflect how a discussion progresses from triggers presentation to resolution.Table 2 presents AODF feature mapping as one of the deliverables of AODF interaction design.The AODF interaction design developed in this study consisted of a prototype containing 14 features mapped to the CoI presences and seven scenarios that described seven contexts of use as presented in onboarding; and pop-ups.Some of these features are displayed on the user interface of the AODF as shown in Figure 4.
In Figure 4, number 1 indicates a thread message to initialize a discussion.Below the thread message, number 2 indicates a reply posted by a participant.On the right side of the thread page, there are some features such as a discussion guide (number 3), discussion reference (number 4), discussion analytics (number 5), and summarizing tool (number 6).Profile picture, emotional cues (emoticons, stickers, and GIFs), quick reactions (like, love, and claps), mentions, and quotes (text highlighting) are located inside the reply section.In addition, the word clouds feature is located inside the discussion analytics section and can be shown by clicking on the see more button.Other features include pop-ups and onboarding, which are shown during specific phases of inquiry (e.g., the triggering event).Additionally, a notification that says someone is writing (number 7) is shown when a participant is writing a reply in the thread.
The discussion analytics feature helps users to understand and monitor the progress of a discussion through simple numerical data (e.g., number of answers, number of online participants, total number of participants, and number of participants who have not responded to the discussion thread) and word clouds.Similar to the discussion analytics feature and word clouds, the summarizing tool is intended to facilitate participants in understanding the progress of the discussion.This feature arises from student suggestions (see Table 1) and from the results of Faisal et al. (2020).Apart from these features, the designed prototype also included onboarding and pop-ups.The onboarding and pop-ups were dynamic features whose appearance and content varied in different inquiry phases.The appearance and content of the onboarding and pop-ups features were adjusted to the indicators of each inquiry phase, according to Shea et al. (2010).The onboarding feature was intended to provide an overview of the activities that needed to be carried out at a certain inquiry stage, information about discussion mechanisms, expectations, and discussion deadlines.Meanwhile, the pop-ups were intended to inform discussion participants about the relevant features in each phase of inquiry and guide discussion activities.
In addition to the user interface design and the contextual feature mapping based on CoI presence indicators, the interaction design developed in this study included contextual scenarios that describe

205
the AODF scenario for each context of use as presented in Table 2.An example of the user scenario for ice-breaking activities is shown here.
The AODF is used for self-introductory and discussion orientation activities.In this study, the facilitator opens the self-introductory session by starting a thread with a post expressing greetings and sharing experiences that are relevant to the discussion topic.Emotional cues such as emoticons, stickers, GIF images, or multimedia attachments could be used to create a lively and informal discussion environment.After the self-introductory session, the following steps are undertaken by the participants.
In the first step, the participants reply to the thread.The participants are then shown onboarding cards that give them some information about the purpose of the discussion, the mechanism, the expectation of the facilitator, and the deadline for discussion outputs.
In the second step, the participants enter the thread page and are shown a pop-up that encourages them to upload their profile pictures to enhance their social presence (if participants have yet to upload their profile pictures).
In the third step, after uploading profile pictures, the participants are shown a pop-up that instructs them to create a lively discussion environment by using informal language, having a sense of respect towards other participants, using emotional cues (e.g., emoticons, etc.) features in their reply, and using quick reply features (e.g., claps, like, etc.).
In the fourth step, when participants open the text editor to write a reply in the thread, a pop-up shows some relevant AODF features located inside the reply section (e.g., stickers, emoticons, etc.), which can be used in self-introduction.
In the fifth step, the participants post their replies in which the content includes self-introduction.
In this scenario, the AODF features used were discussion onboarding, discussion guide, and pop-ups (with instructions for ice-breaking activities), emotional cues (emoticons, stickers, and GIFs), quick reactions (like, love, and claps), and profile picture.The scenario is illustrated in a storyboard shown in Figure 5.

Storyboard for Ice-Breaking Activities in the AODF
The interaction design was then tested with ten students.A summary of the results is presented in the next section.

Evaluation Results
The contextual testing conducted on the prototype provided insights into how participants viewed the prototype.Ten students who had prior experience in using an AODF for OCL activities were involved.
The context was an introductory discussion activity and a general orientation discussion on good versus bad design through inquiry stages.The results of this contextual testing were intended to answer RQ2.
The students were asked to do various tasks on the prototype and then describe their experiences when interacting with the prototype.The testing was conducted using scenarios that were adapted for evaluation purposes (e.g., giving participants the context of use without aiding them in completing given tasks).Participants' perceptions within the context of the introductory activity (task 1) and the specific stages of inquiry (task 2-task 7) are summarized in Table 3.The summary of participants' responses to the prototype as shown in Table 3 is helpful in answering RQ2.The prototype was found to be helping most participants in the pre-discussion introduction (icebreaking activities; task 1), sharing information acquired from exploring relevant sources to answer the trigger (task 3), helping others in understanding the problems by diagnosing and correcting misconceptions (task 4), and formulating conclusions (task 6).However, there were issues in expressing initial understanding of the trigger of the discussion (task 2), integrating ideas (task 5), and understanding the achievements of the discussion and formulating a resolution (task 7).These issues are related to cognitive presence at the inquiry phases of triggering events, initial integration, and resolution.
Nevertheless, in general, all participants responded positively to the AODF prototype (n = 10).Most also stated that the prototype provided a different and positive experience compared to other discussion forums.Moreover, some participants (n = 8) stated that they were aware of the inquiry phases despite having difficulties in understanding what to do in certain phases.

Conclusion
This study developed an AODF interaction design based on the CoI framework using the UCD method, which was contextualized for the development of an e-learning system.The design requirements were defined by students, lecturers, and OCL experts.
To answer RQ1 (How is the interaction design of an AODF that is intended to foster and sustain CoI presences developed?),we created an AODF interaction design consisting of a clickable high-fidelity prototype containing 14 features mapped against the presences in CoI and seven scenarios describing the use of various features during different inquiry phases based on the practical inquiry model.The 14 features were mapped to foster and facilitate the CoI presences in the context of an initial selfintroduction activity and a general orientation discussion that was carried out through four stages of inquiry.
To answer RQ2 (What are learners' reactions when interacting with a prototype of an AODF that is intended to foster and sustain CoI presences?),all contextual testing participants (n = 10) responded positively to the AODF prototype.Most participants also considered that the prototype provided a different and positive experience when compared to other online discussion forums.Participants revealed that the prototype helped them to create a social presence in the context of the initial selfintroduction activity, cognitive presence in the context of drawing conclusions, and teaching presence when there were participants in need of help during the exploration phase.
There were several suggestions for improvement made by participants.Issues that arose were related to the prototype's user interface and user perceptions regarding the effectiveness of AODF interaction design in facilitating activities to foster cognitive presence at the inquiry phases of triggering events, initial integration, and resolution.
This study has practical implications, providing descriptions of how the user interface and interaction of an AODF could be designed to foster CoI presences.Further research could be aimed at evaluating the proposed AODF design quantitatively in a classroom setting and identifying AODF features that significantly nurture CoI presences.Moreover, the UCD and LCD methods used in this study could be adopted when designing other e-learning systems in various contexts.
outlined the categories of the CoI presences and gave examples of their indicators.Social presence has three categories, namely open communication, group cohesion, and affective.Cognitive presence has four categories, namely triggering events, exploration, integration, and resolution.Teaching presence has three categories, specifically learning activity design, direct instruction, and discourse facilitation.Each category has indicators.For example, risk free expression and the use of emoticons are indicators for open communication and affective category respectively.
(a) specifying the context of use; (b) defining requirements; (c) designing solutions; (d) prototyping; and There were five stages in this study, namely: (a) literature study; (b) identifying user requirements; (c) designing the interaction design; (d) prototyping; and (e) design evaluation.These stages, including the outputs of each stage, are illustrated in Figure 2. The literature study stage is related to a phase in UCD in which users and their context of use are identified (U.S.Department of Health and Human Services, 2006).In this study, specifying the context of use was carried out through a literature review of research in the domain of the CoI framework.The outputs of this stage were the user characteristics and the context in which the AODF was used.

Figure 3 Rich
Figure 3

Figure 4 Interface
Figure 4

Table 1
Summary of AODF Design Requirements to Facilitate the CoI Presences

Table 2 .
The AODF features included: thread and reply; text editor; profile picture; emotional cues (emoticons, stickers, and GIFs); quick reactions (like, love, and claps); mentions; quotes (as a text highlighting feature included in the text editor); discussion guide; discussion references (learning

Table 3
Summary of the Contextual Testing ResultsNote.a AODF features that were expressed in tasks in which there were participants who intended to reply in the AODF with messages indicating exploration.b AODF features that were expressed in tasks in which there were participants who were confused about what integration is or what messages were expected to indicate integration.
c AODF features that were expressed in tasks in which there were participants who had confusion on what resolution is or what messages were expected to indicate resolution.