Visualising academic integrity research terminology

This is a template which you can use to help get you started on the wiki submission. It is just intended as a guide and you may modify the structure to suit your project.

Contributors

• Name and what department each person was in.
• Student or staff partner?
• How was each person involved?
• What rough dates did they contribute?
• Miko Oberhauser, Department of Physics. Student partner. Focus on Graphic Design, October-December 2021.
• Man Ho Lam, Department of Physics. Student partner. Focus on Education Design, October-December 2021.
• Themis Halka, Department of Biomedicine. Student partner. Focus on Interaction design, October-December 2021.
• Alexandru-Eduard Danila, Department of Mathematics. Student partner. Focus on the way in which the data from the data set was displayed, October - December 2021.
• Thomas Lancaster, Department of Computing. Staff partner from October 2021.

Aims & Learning Outcomes

• Explain the motivation for your visualisation.

• Introduce the subject of your visualisation.
• Which module and year is it intended for and which setting (lecture or self study)?
• List learning outcomes. E.g.: "After using this visualisation, students should be able to explain that..."

The visualisation will be used as a supporting activity in the Academic Integrity in STEMM I-Explore module, therefore the target audience are second or third year Imperial College students in the module. In the beginning, most of them will only have limited amount of knowledge about academic integrity research, for example, everything about academic integrity is just anti-plagiarism and anti-cheating.

The aim will be to provide an interactive visualisation that shows the type of terminology used in academic integrity research paper titles and shows how this has developed over time. Some examples of the type of data available are given in the 2021 paper “Academic Dishonesty or Academic Integrity? Using Natural Language Processing (NLP) Techniques to Investigate Positive Integrity in Academic Integrity Research” (https://doi.org/10.1007/s10805-021-09422-4).

Researchers in the field of academic integrity might also be interested in using the visualisation, so it is worthy to create an extension that would allow the visualisation to work with a dynamic data set and to introduce information from paper abstracts as well as paper titles.

Intending learning outcomes:

After using this visualisation, the target audience will be able to:

• Discuss the range of research that has been conducted under the academic integrity banner and identify topics of timely and personal interest to them.
• Explore the range of terminology used in academic integrity research and to interpret how the choice of paper titles influences how often papers are cited and the future reach of research
• Contrast the use of positive, neutral and negative language in discussing academic integrity and to show how the messaging used within the field has developed over time

Design Overview

• What the final outcome was, how it looks, how it functions etc.
• Include graphics.
• Do not include justification or design progression, leave this for later sections.

Design Justification

Assessment Criteria

List your cohort's assessment criteria. You may want to number the assessment criteria so you can refer to them easily later.

Education Design:

1. Target audience and their prior knowledge is clearly identified. This information is applied to decide what the learning outcomes should be.
2. Key concepts identified and broken down into several discrete and easily achievable points.

Graphical Design:

1. The design is such that the visualisation is clear and easily understood; the layout isn't cluttered.
2. The choice of font, as well as size and placement of text in the visualisation design, makes the information easy to comprehend.
3. The colour palette is appropriate and well justified, making it easy to see all text/design elements.

Interaction Design:

1. The learner should know intuitively what the objectives are of the visualisation.
2. The user should be able to intuitively understand the function of each interactive element in the visualisation.
3. There should be immediate visual feedback when a learner interacts with the visualisation.

General:

1. The wiki page should give a clear overview of the project, and someone not familiar with the project should be able to understand it - no prior understanding necessary.
2. The design choices should be well justified in the Wiki project page.
3. Fulfillment of staff partner's brief.

Education Design

• What Methods were considered to convey concepts?
• Design progression, key choices with justifications.
• How has feedback been incorporated.
• Since our target audience have very limited background knowledge, we want to allow them to freely explore the visualisation in the first instance instead of starting the scaffolding process and feeding much information straight away. There will be a button in each page which takes them back to the first page to restart.
• Our project is heavily based on words instead of equations and numbers, and we also want to keep the audience interested and active all the time. Using word bubbles/clouds with different colours/sizes is a relaxing and impressive way to address information about words.
• The relationship bewteen number of citations, choice of topics and year of publish can be too much information to give at once. We instead list there categories( least cited, average cited and most cited) to let the audience explore one after each one.

Graphical Design

• How were accessibility issues considered?
• How was space used effectively?
• Design progression, key choices with justifications.
• How has feedback been incorporated.

• How is the design intuitive?

The construction of the design system for this visualisation involved creating the visual design language, including the components of colour, typography, size and spacing, along with a UI pattern. As we do not have much imagery, the guidelines for illustrations and icons have not been precisely defined (yet). Colours were selected and their contrast checked using the WebAIM online tool to accommodate users with visual impairments. Furthermore, care was taken to avoid the colours red and green for juxtapositions since about 1 in 12 men and 1 in 200 women suffer from red-green visual impairment . Instead, magenta and imperial blue were chosen as contrasting colours to represent negative and positive sentiments, respectively. The shade of blue chosen is also the same as in the ImpVis logo to comply with the branding of the overall website.

On tne topic page the desktop was divided into a side and main column following the rule of thirds. As per request of the staff partner the user should see the key data at a glance which is achieved by placing the primary chart of a topic in the main column and secondary charts in the scrollable side column on the left. For more information, users can expand each infographic by clicking on the icon in the top right corner of each representation. This way, the visualisation does not become cluttered and shows only the necessary information required to get a grasp of the topic. For the home page the background was blurred and the elements the user is meant to interact with are placed in the middle, to direct their attention to it. On both pages a help button was added to the top right or bottom right corner, as this is the location users intuitively look to find more guidance in.

The visualisation was made even more intuitive by using symbols whose function is known to the users. For example, when a user sees a magnifying glass icon in a bar, they know that this is a search bar where they can look up terms.

Throughout the design process, decisions were discussed within our project group and we continually suggested potential enhancements or challenged choices that had previously been made.

Click here and take a look at our first prototype!

Interaction Design

• Choice of interactive element(s) that fit in organically with the visualisation [inspiration of choice might be from lecture/in-class activity or other sources] - Sliders/Buttons/Cursor (hover/click):
• Question marks pop ups: can click on question marks on the home page: pop up with text explaining general function of interaction + different options. Justification: clear help function, intuitive. User can choose to click on it: if knows how to use the visualisation, no impact on the design, page not full of text.
• Search bars and enter button: for learner's input of keywords/filters. Explicit function, similar to google
• Buttons for navigation within platform: return to home page... function indicated on button
• Links enabling user to click on words to have more info: intuitive.
• Keeping accessibility of interactive elements in mind during design phase.
• Design progression, key choices with justifications.
• How has feedback been incorporated.

Progress and Future Work

• Is the design finalised?
• Which pages have been uploaded to website?
• Any ideas for future improvements.

Links

• Link to GitHub repository for code in development:
• Link to visualisation on ImpVis website (when uploaded):
• ImpVis website (in progress): https://impvis.co.uk/code/projects/7
• Link to Collection on ImpVis website (when created):
• Link to Figma Prototype: https://www.figma.com/proto/SVziYGbNHYZQQue8e1PWQ6/ImpVis?node-id=312%3A3&scaling=min-zoom&page-id=0%3A1&starting-point-node-id=312%3A3
• Project's Miro Board: https://miro.com/app/board/o9J_lpvA2FQ=/
• Staff-partner's Research Paper: https://doi.org/10.1007/s10805-021-09422-4