Quick Overview - Revision history

Leonie: /* Using the Graph */ update image description and size (align with table)

2025-04-14T09:01:21Z

Using the Graph: update image description and size (align with table)

← Older revision		Revision as of 09:01, 14 April 2025
Line 243:		Line 243:

	== Custom Frontends ==		== Custom Frontends ==
	[[File:Visual-Editor-screenshot.png\|thumb\|right\|~~500px~~\|A visual editor for graph exploration and marking items]]		[[File:Visual-Editor-screenshot.png\|thumb\|right\|460px\|A '''visual editor''' for graph exploration and marking items]]
	[[File:Table-Editor-Screenshot2.png\|thumb\|right\|~~500px~~\|A tabular editor for modifiying and connecting items]]		[[File:Table-Editor-Screenshot2.png\|thumb\|right\|460px\|A '''tabular editor''' for modifiying and connecting items]]

	For an easier and more direct way of interaction some custom frontends have been developed.		For an easier and more direct way of interaction some custom frontends have been developed.

Leonie: /* Using the Graph */ show learning path and most important categories next to each other & increase image size

2025-04-14T08:58:09Z

Using the Graph: show learning path and most important categories next to each other & increase image size

@@ Line 108: / Line 108: @@
 = Using the Graph =
 The graph itself is just a versatile data structure. In order to make it usable, we are developing tools and visualizations. The [https://www.w3.org/TR/sparql11-query/ SPARQL] query language offered by WikiBase allows for retrieving relevant parts of the graph and visualizing it in different ways. This can offer insights on about the contents of the graph, but also the graph itself and it's underlying structure.
 We combine different visualization to create a course page (see for example: [[Courses/WissenschaftlichesArbeiten|WissArb]] and [[Courses/CGBV_SS24|CGBV]]), where a collection of information is contained in one place.
@@ Line 165: / Line 166: @@
 </div>
-Such a graph is possible by allowing students to modify their personal user-item and use it to link to items with the properties: [[Property:P12|has completed]] and [[Property:P23|interested in]].
+<small>Such a graph is possible by allowing students to modify their personal user-item and use it to link to items with the properties: [[Property:P12|has completed]] and [[Property:P23|interested in]]. </small>
-Or '''learning paths''', to show the step-by-step path towards learning a specific topic:
+Or
-{{Learning Path2|item=Q149}}
+{| class="wikitable"
 == Custom Frontends ==
-[[File:Visual-Editor-screenshot.png|thumb|right|400px|A visual editor for graph exploration and marking items]]
+[[File:Visual-Editor-screenshot.png|thumb|right|500px|A visual editor for graph exploration and marking items]]
-[[File:Table-Editor-Screenshot2.png|thumb|right|400px|A tabular editor for modifiying and connecting items]]
+[[File:Table-Editor-Screenshot2.png|thumb|right|500px|A tabular editor for modifiying and connecting items]]
 For an easier and more direct way of interaction some custom frontends have been developed.
 Students can interact with the graph using a '''[https://test.graphit.ur.de/app/src/pages/selectionTools/ visual editor]'''.
-It shows a specific course and all items it includes. It allows students to explore the graph, see learning paths towards specific topics and quickly mark items as prior knowledge or a topic that they are interested in.
+It shows a specific course and all items it includes. It allows students to explore the graph, see learning paths towards specific topics and quickly mark items as [[Property:P12|prior knowledge]] or a topic that they are [[Property:P23|interested in]].
 Admins can interact with a '''tabular editor''', that can modifiy items dependently and independently of each other. They can move, copy or delete ''statements'' (property-item-pairs) between items and create new connections.

Leonie: /* The Dependency Graph */ show session and category query next to each other & update student graph with shapes

2025-04-14T08:43:44Z

The Dependency Graph: show session and category query next to each other & update student graph with shapes

← Older revision		Revision as of 08:43, 14 April 2025
Line 24:		Line 24:
	[[GraphStructure#Course\|Courses]] include [[GraphStructure#Session\|Session]]-Items (representing an actual session of a course), that also [[Property:P14\|include]] all items that are being discussed in person.		[[GraphStructure#Course\|Courses]] include [[GraphStructure#Session\|Session]]-Items (representing an actual session of a course), that also [[Property:P14\|include]] all items that are being discussed in person.

	~~<div style~~="~~border~~: ~~solid 5px #d2d6e0; background~~-~~color~~:~~#eaecf0;~~">		{\| class="wikitable"
	{{#widget:SPARQLquery\|code=		! Items being discussed in a '''[[Item:Q940\|session]]''' on 3D-Graphics of the ''CGBV''-course
			! All items included in the '''category''' ''[[Item:Q8\|3D-Graphics]]''
			\|-
			\| style="width: 64%" \| {{#widget:SPARQLquery\|code=
	#defaultView:Graph		#defaultView:Graph
	PREFIX wdt: <https://graphit.ur.de/prop/direct/>		PREFIX wdt: <https://graphit.ur.de/prop/direct/>
Line 40:		Line 43:
	service wikibase:label { bd:serviceParam wikibase:language "en".}		service wikibase:label { bd:serviceParam wikibase:language "en".}
	} LIMIT 100		} LIMIT 100
	~~\|caption=Items being discussed in a session on 3D-Graphics of the ''CGBV''-course~~
	}}		}}
	</~~div~~>		\| style="width: 36%" \| {{#widget:SPARQLquery\|code=
			#defaultView:Table
			PREFIX wdt: <https://graphit.ur.de/prop/direct/>
			PREFIX wd: <https://graphit.ur.de/entity/>
			select distinct ?item ?itemLabel
			where {
			BIND (wd:Q8 as ?category)
			?category wdt:P14 ?item.

			service wikibase:label { bd:serviceParam wikibase:language "en".}
			}
			}}
			\|}

			</br>

	{\| class="wikitable" style="float:right; width:40em; margin-left:5px"		{\| class="wikitable" style="float:right; width:40em; margin-left:5px"
	! The User-Item of a student and all items connected to it		! The '''User-Item''' of a ''[[Item:Q157\|student]]'' and all items connected to it
	\|-		\|-
	\|		\|
Line 54:		Line 69:
	PREFIX wd: <https://graphit.ur.de/entity/>		PREFIX wd: <https://graphit.ur.de/entity/>

	SELECT ?item1 ~~?image~~ ?item1Label ?item2 ~~?image2~~ ?item2Label ?edgeLabel ?rgb WHERE {		SELECT ?item1 ?item1Label ?item2 ?item2Label ?edgeLabel ?rgb ?shape WHERE {
	VALUES ?item1 {wd:Q157}		VALUES ?item1 {wd:Q157}

Line 68:		Line 83:
	if(?prop = wdt:P23, "ffeec2", # interested in (orange)		if(?prop = wdt:P23, "ffeec2", # interested in (orange)
	"FFFFFF" ))) as ?rgb).		"FFFFFF" ))) as ?rgb).
			# Shape Coding:
			BIND (if(?prop = wdt:P25, "text", # participates in
			if(?prop = wdt:P12, "ellipse", # has completed
			if(?prop = wdt:P23, "box", # interested in
			"text" ))) as ?shape).

	SERVICE wikibase:label { bd:serviceParam wikibase:language "[AUTO_LANGUAGE],en". }		SERVICE wikibase:label { bd:serviceParam wikibase:language "[AUTO_LANGUAGE],en". }

Leonie: small error fixes

2025-04-09T13:17:17Z

small error fixes

← Older revision		Revision as of 13:17, 9 April 2025
Line 21:		Line 21:
	</br>		</br>

	In order to make this amount of data useable, several ''Structure-Items'' have been defined to help group items together. For example learning contents of similar ~~topic~~ are [[Property:P14\|included]] in a [[GraphStructure#Category\|category]] that can later be referenced when putting a course together.		In order to make this amount of data useable, several ''Structure-Items'' have been defined to help group items together. For example learning contents of similar topics are [[Property:P14\|included]] in a [[GraphStructure#Category\|category]], that can later be referenced when putting a course together.
	[[GraphStructure#Course\|Courses]] include [[GraphStructure#Session\|Session]]-Items (representing an actual session of a course), that also [[Property:P14\|include]] all items that are being discussed in person.		[[GraphStructure#Course\|Courses]] include [[GraphStructure#Session\|Session]]-Items (representing an actual session of a course), that also [[Property:P14\|include]] all items that are being discussed in person.

Line 75:		Line 75:
	\|}		\|}

	Every item can further include existing [[GraphStructure#Properties\|~~Properties~~]]. This allows for specifying information such as a date, expressing interest, people responsible and URLs.		Every item can further include existing [[GraphStructure#Properties\|properties]]. This allows for specifying information such as a date, expressing interest, people responsible and URLs.

	People can interact with the graph by creating a '''User-Item''' (example: [[Item:Q157\|Max Mustermann]]), that they can use to link back to items in different ways.		People can interact with the graph by creating a '''User-Item''' (example: [[Item:Q157\|Max Mustermann]]), that they can use to link back to items in different ways.
Line 87:		Line 87:

	= Using the Graph =		= Using the Graph =
	The graph itself is just a versatile data structure. In order to make it usable, we are developing tools and visualizations. The [https://www.w3.org/TR/sparql11-query/ SPARQL] query language offered by WikiBase allows for retrieving relevant parts of the graph and visualizing it in different ways.		The graph itself is just a versatile data structure. In order to make it usable, we are developing tools and visualizations. The [https://www.w3.org/TR/sparql11-query/ SPARQL] query language offered by WikiBase allows for retrieving relevant parts of the graph and visualizing it in different ways. This can offer insights on about the contents of the graph, but also the graph itself and it's underlying structure.

	We combine different visualization ~~options~~ to create a course page (see for example: [[Courses/WissenschaftlichesArbeiten\|WissArb]] and [[Courses/CGBV_SS24\|CGBV]]), where a collection of information is contained in one place. Using the SPARQL-Queries information can be quickly pulled from the graphs and displayed. This can offer insights on about the contents of the graph, but also the graph itself and it's underlying structure.		We combine different visualization to create a course page (see for example: [[Courses/WissenschaftlichesArbeiten\|WissArb]] and [[Courses/CGBV_SS24\|CGBV]]), where a collection of information is contained in one place.

	<div style="clear: both"></div>		<div style="clear: both"></div>
Line 161:		Line 161:
	It shows a specific course and all items it includes. It allows students to explore the graph, see learning paths towards specific topics and quickly mark items as prior knowledge or a topic that they are interested in.		It shows a specific course and all items it includes. It allows students to explore the graph, see learning paths towards specific topics and quickly mark items as prior knowledge or a topic that they are interested in.

	Admins can interact with a '''tabular editor''', that can modifiy items ~~dependend~~ and independently of each other. They can move, copy or delete ''statements'' (property-item-pairs) between items and create new connections.		Admins can interact with a '''tabular editor''', that can modifiy items dependently and independently of each other. They can move, copy or delete ''statements'' (property-item-pairs) between items and create new connections.

	= Plans for the Future =		= Plans for the Future =
Line 169:		Line 169:
	* Continuous evaluation of the usage through pilot projects in courses, in the planning/revision of a degree program and for individual learning paths, e.g. for career changers		* Continuous evaluation of the usage through pilot projects in courses, in the planning/revision of a degree program and for individual learning paths, e.g. for career changers
	* Integration of OER		* Integration of OER
	* Analysis of the course of study aggregated and in person.		* Analysis of the course of study aggregated and in person
	* Development of tools for visualizing and processing the data		* Development of tools for visualizing and processing the data
	* Preparation for scaling the concept to university / national / international level.		* Preparation for scaling the concept to university / national / international level

	Cooperation with other partners is planned, in particular with developers in the area of Wikibase / graph databases and application partners from the public sector.		Cooperation with other partners is planned, in particular with developers in the area of Wikibase / graph databases and application partners from the public sector.

Leonie: /* The Dependency Graph */ specifiy that nodes=items and edges=properties

2025-04-09T12:37:02Z

The Dependency Graph: specifiy that nodes=items and edges=properties

← Older revision		Revision as of 12:37, 9 April 2025
Line 3:		Line 3:
	The goal of '''GraphIT''' is to develop and evaluate a dependency graph of learning contents.		The goal of '''GraphIT''' is to develop and evaluate a dependency graph of learning contents.
	This graph enables faculties to develop better study programs, teachers to structure their courses better and students to find the best way to achieve their personal goals.		This graph enables faculties to develop better study programs, teachers to structure their courses better and students to find the best way to achieve their personal goals.

			{{Note\|type=info\|text=On each interactive visualization on this page, you can click on the "GraphIT Query Service" link in the lower left corner. This opens a new tab which shows you the SPARQL query and allows you to modify it.}}

	= The Dependency Graph =		= The Dependency Graph =
	[[File:Graph-simple.png\|thumb\|right\|650px\|Learning contents connect to each other to form a ''learning path'']]		[[File:Graph-simple.png\|thumb\|right\|650px\|Learning contents connect to each other to form a ''learning path'']]
	A dependency graph is a collection of ''nodes'', connected with each other using ''edges'', to show which nodes depend on others. For GraphIT the nodes ~~or items~~ represent a topic of study.		A dependency graph is a collection of ''nodes'' (or items), connected with each other using ''edges'' (or properties), to show which nodes depend on others. For GraphIT the nodes represent a topic of study.

	At the lowest level our graph is structured by '''linking learning contents to their prerequisite(s)'''.		At the lowest level our graph is structured by '''linking learning contents to their prerequisite(s)'''.

Leonie: /* Using the Graph */ remove hint to move to begining of page

2025-04-09T12:34:20Z

Using the Graph: remove hint to move to begining of page

← Older revision		Revision as of 12:34, 9 April 2025
Line 85:		Line 85:

	= Using the Graph =		= Using the Graph =
	{{Note\|type=info\|text=On each interactive visualization on this page, you can click on the "GraphIT Query Service" link in the lower left corner. This opens a new tab which shows you the SPARQL query and allows you to modify it.}}

	The graph itself is just a versatile data structure. In order to make it usable, we are developing tools and visualizations. The [https://www.w3.org/TR/sparql11-query/ SPARQL] query language offered by WikiBase allows for retrieving relevant parts of the graph and visualizing it in different ways.		The graph itself is just a versatile data structure. In order to make it usable, we are developing tools and visualizations. The [https://www.w3.org/TR/sparql11-query/ SPARQL] query language offered by WikiBase allows for retrieving relevant parts of the graph and visualizing it in different ways.

Line 156:		Line 154:
	[[File:Table-Editor-Screenshot2.png\|thumb\|right\|400px\|A tabular editor for modifiying and connecting items]]		[[File:Table-Editor-Screenshot2.png\|thumb\|right\|400px\|A tabular editor for modifiying and connecting items]]

	For an easier and ~~directer~~ way of interaction some custom frontends have been developed.		For an easier and more direct way of interaction some custom frontends have been developed.

	Students can interact with the graph using a '''[https://test.graphit.ur.de/app/src/pages/selectionTools/ visual editor]'''.		Students can interact with the graph using a '''[https://test.graphit.ur.de/app/src/pages/selectionTools/ visual editor]'''.

Leonie: /* The Dependency Graph */ small error-fixes

2025-04-09T12:32:09Z

The Dependency Graph: small error-fixes

← Older revision		Revision as of 12:32, 9 April 2025
Line 6:		Line 6:
	= The Dependency Graph =		= The Dependency Graph =
	[[File:Graph-simple.png\|thumb\|right\|650px\|Learning contents connect to each other to form a ''learning path'']]		[[File:Graph-simple.png\|thumb\|right\|650px\|Learning contents connect to each other to form a ''learning path'']]
	A dependency graph is a collection of ''nodes'', connected with each other using ''edges''~~. These connections~~ show which nodes depend on others. ~~These~~ nodes or items represent a topic of study.		A dependency graph is a collection of ''nodes'', connected with each other using ''edges'', to show which nodes depend on others. For GraphIT the nodes or items represent a topic of study.

	At the lowest level our graph is structured by '''linking learning contents to their prerequisite(s)'''.		At the lowest level our graph is structured by '''linking learning contents to their prerequisite(s)'''.
	~~A student~~ can ~~now~~ use these links to determine how ~~items~~ depend on each other, and what knowledge is required to understand a specific ~~node~~.		Students can use these links to determine how topics depend on each other, and what knowledge is required to understand a specific item.
	Materials (such as tutorials and articles) or exams can also be linked to each learning content.		Materials (such as tutorials and articles) or exams can also be linked to each learning content.

Line 20:		Line 20:

	In order to make this amount of data useable, several ''Structure-Items'' have been defined to help group items together. For example learning contents of similar topic are [[Property:P14\|included]] in a [[GraphStructure#Category\|category]] that can later be referenced when putting a course together.		In order to make this amount of data useable, several ''Structure-Items'' have been defined to help group items together. For example learning contents of similar topic are [[Property:P14\|included]] in a [[GraphStructure#Category\|category]] that can later be referenced when putting a course together.
	[[GraphStructure#Course\|Courses]] include [[GraphStructure#Session\|~~Sessions~~]] ~~that represent~~ an actual session of a course ~~and~~ [[Property:P14\|include]] all items that are being discussed in person.		[[GraphStructure#Course\|Courses]] include [[GraphStructure#Session\|Session]]-Items (representing an actual session of a course), that also [[Property:P14\|include]] all items that are being discussed in person.

	<div style="border: solid 5px #d2d6e0; background-color:#eaecf0;">		<div style="border: solid 5px #d2d6e0; background-color:#eaecf0;">
Line 38:		Line 38:
	service wikibase:label { bd:serviceParam wikibase:language "en".}		service wikibase:label { bd:serviceParam wikibase:language "en".}
	} LIMIT 100		} LIMIT 100
	\|caption=Items being discussed in a session of the ''CGBV''-course ~~on 3D-Graphics~~		\|caption=Items being discussed in a session on 3D-Graphics of the ''CGBV''-course
	}}		}}
	</div>		</div>

Leonie: /* Using the Graph */ add query for learning path

2025-04-09T12:22:56Z

Using the Graph: add query for learning path

← Older revision		Revision as of 12:22, 9 April 2025
Line 92:		Line 92:

	<div style="clear: both"></div>		<div style="clear: both"></div>
	Such as a timeline of all course sessions:		Such as a '''timeline''' of all course sessions:
	<div style="border: solid 5px #d2d6e0; background-color:#eaecf0;">		<div style="border: solid 5px #d2d6e0; background-color:#eaecf0;">
	{{#widget:SPARQLquery\|code=		{{#widget:SPARQLquery\|code=
Line 140:		Line 140:
	SERVICE wikibase:label { bd:serviceParam wikibase:language "[AUTO_LANGUAGE],en". }		SERVICE wikibase:label { bd:serviceParam wikibase:language "[AUTO_LANGUAGE],en". }
	}		}
			\| caption=Students self defined interests and prior knowledge for learning contents of the WissArb-Course
	\| height=20em		\| height=20em
	~~\| caption=Students self defined interests and prior knowledge for learning contents of the WissArb-Course~~
	}}		}}
	</div>		</div>

	Such a graph is possible by allowing students to modify their personal user-item and use it to link to items with the ~~specific~~ properties: [[Property:P12\|has completed]] and [[Property:P23\|interested in]].		Such a graph is possible by allowing students to modify their personal user-item and use it to link to items with the properties: [[Property:P12\|has completed]] and [[Property:P23\|interested in]].


			Or '''learning paths''', to show the step-by-step path towards learning a specific topic:
			{{Learning Path2\|item=Q149}}


	== Custom Frontends ==		== Custom Frontends ==

Leonie: /* Overview of Student */ moved to graph structure

2025-04-09T12:14:20Z

Overview of Student: moved to graph structure

← Older revision		Revision as of 12:14, 9 April 2025
Line 169:		Line 169:

	Cooperation with other partners is planned, in particular with developers in the area of Wikibase / graph databases and application partners from the public sector.		Cooperation with other partners is planned, in particular with developers in the area of Wikibase / graph databases and application partners from the public sector.

	~~= Overview of Student =~~
	~~Shows what items a Student is has linked their item to. Can be used to track progress.~~
	~~{{#widget:SPARQLquery\|code=~~
	~~#defaultView:Graph~~
	~~PREFIX wdt: <https://graphit.ur.de/prop/direct/>~~
	~~PREFIX wd: <https://graphit.ur.de/entity/>~~

	~~SELECT ?item1 ?image ?item1Label ?item2 ?image2 ?item2Label ?edgeLabel ?rgb WHERE {~~
	~~VALUES ?item1 {wd:Q157}~~

	~~?item1 ?prop ?item2.~~
	~~?edge ?dummy ?prop ; rdf:type wikibase:Property.~~

	~~# Minus username in edgeLabel~~
	~~FILTER (?prop != wdt:P28)~~

	~~# Color Coding:~~
	~~bind (if(?prop = wdt:P25, "e8fcff", # participates in (blue) f3fdff~~
	~~if(?prop = wdt:P12, "e3ffd9", # has completed (green)~~
	~~if(?prop = wdt:P23, "ffeec2", # interested in (orange)~~
	~~"FFFFFF" ))) as ?rgb).~~

	~~SERVICE wikibase:label { bd:serviceParam wikibase:language "[AUTO_LANGUAGE],en". }~~
	~~} ORDER BY ?prop~~
	}}

	~~== Learning path ==~~
	~~The complete path to an item (here: [[Item:Q149\|Virtual Cameras]]) and what's next.~~
	~~{{#widget:SPARQLquery\|code=~~
	~~#defaultView:Graph~~
	~~# prerequisite -> topic -> postrequisite~~
	~~PREFIX wd: <https://graphit.ur.de/entity/>~~
	~~PREFIX wdt: <https://graphit.ur.de/prop/direct/>~~
	~~SELECT distinct ?v ?vLabel ?rgb ?link ?linkLabel~~
	~~WHERE {~~
	{
	~~{ SELECT * WHERE {~~
	~~{ SELECT ?goal ?goalLabel ?topic ?topicLabel WHERE {~~
	{
	~~BIND (wd:Q149 as ?goal).~~
	~~?goal wdt:P1+ ?topic.~~
	~~} UNION {~~
	~~VALUES ?topic { wd:Q149 } # we also want to include the root node itself~~
	}

	}
	}

	~~?topic wdt:P1 ?pre.~~
	~~BIND (?topic as ?v). # + add all ?pre that are not yet in ?topic~~
	~~BIND (?pre as ?link).~~
	~~bind (if(?v = wd:Q149, "FBBC74", "FFEDD8") as ?rgb).~~
	}
	}

	~~Union~~

	~~{ SELECT * WHERE {~~
	~~{ SELECT ?topic ?topicLabel ?goal ?goalLabel WHERE {~~
	{
	~~BIND (wd:Q149 as ?topic).~~
	~~?goal wdt:P1+ ?topic.~~
	~~} UNION {~~
	~~VALUES ?topic { wd:Q149 } # we also want to include the root node itself~~
	}
	}
	}
	~~?post wdt:P1 ?topic.~~
	~~BIND (?post as ?v).~~
	~~BIND (?topic as ?link).~~
	~~bind ("F68C13" as ?rgb).~~
	}
	}

	~~SERVICE wikibase:label { bd:serviceParam wikibase:language "[AUTO_LANGUAGE],en". }~~
	}
	~~} \|caption=The learning path to an item, showing its pre- and postrequisites~~
	}}

Leonie: /* Plans for the Future */ add section from Freiraum-Projektantrag

2025-04-09T12:13:20Z

Plans for the Future: add section from Freiraum-Projektantrag

← Older revision		Revision as of 12:13, 9 April 2025
Line 159:		Line 159:

	= Plans for the Future =		= Plans for the Future =
			We want to implement:
			* Evaluation and implementation of a suitable infrastructure (based on Wikibase)
			* Structuring the content of a course of study as a dependency graph
			* Continuous evaluation of the usage through pilot projects in courses, in the planning/revision of a degree program and for individual learning paths, e.g. for career changers
			* Integration of OER
			* Analysis of the course of study aggregated and in person.
			* Development of tools for visualizing and processing the data
			* Preparation for scaling the concept to university / national / international level.

			Cooperation with other partners is planned, in particular with developers in the area of Wikibase / graph databases and application partners from the public sector.

	= Overview of Student =		= Overview of Student =