First commit to migrate the nlp-demo page.

README.md

@@ -1,12 +1,13 @@
 ---
-title: Nlp Demo
-emoji: 👀
-colorFrom: purple
-colorTo: indigo
+title: Nlp Circle Demo
+emoji: 🔥
+colorFrom: green
+colorTo: green
 sdk: gradio
-sdk_version: 4.43.0
+sdk_version: 4.39.0
 app_file: app.py
 pinned: false
+python_version: 3.10.5
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

app.py

@@ -0,0 +1,5 @@
+from src.nlp_circle_demo.wrapped_gradio_objects import GradioTabWrapper
+
+if __name__ == "__main__":
+    demo = GradioTabWrapper.from_yaml("resources/tabs/app_tab.yml")
+    demo.launch()

flagged/log.csv

@@ -0,0 +1,4 @@
+Input,Summary,flag,username,timestamp
+Hello my name is,"Hello my name is Mark O'Keeffe, and I need to get out of here right here on the floor. I don't want this, you're not going to take my picture with the camera on you. What's taking my picture",,,2023-02-13 09:26:59.995980
+Hello my name is,"Hello my name is Mark O'Keeffe, and I need to get out of here right here on the floor. I don't want this, you're not going to take my picture with the camera on you. What's taking my picture",,,2023-02-13 09:27:01.256913
+Paris is the <mask> of France.,,,,,2023-02-13 14:53:47.770858

poetry.toml

@@ -0,0 +1,2 @@
+[virtualenvs]
+create = false

pyproject.toml

@@ -0,0 +1,20 @@
+[tool.poetry]
+name = "nlp-circle-demo"
+version = "0.1.0"
+description = ""
+authors = ["Your Name <[email protected]>"]
+readme = "README.md"
+packages = []
+
+[tool.poetry.dependencies]
+python = "^3.10"
+gradio = "^3.26.0"
+pyyaml = "^6.0"
+
+[tool.poetry.dev-dependencies]
+pre-commit = "^3.2"
+black = "^23.3"
+
+[build-system]
+requires = ["poetry-core"]
+build-backend = "poetry.core.masonry.api"

requirements.txt

@@ -0,0 +1 @@
+pyyaml

resources/interfaces/gbert_interface.yml

@@ -0,0 +1,22 @@
+title: German BERT
+name: huggingface/deepset/gbert-large
+description: >
+    Hier zeigen wir ein Vergleichsmodell, welches ebenfalls maskierte Wörter (hier mit dem Stichwort [MASK]) zu erraten
+    versucht. Dieses Modell wurde allerdings nicht auf rechtliche Sprache spezialisiert, weshalb die prognostizierten
+    Wörter deutlich weniger spezifisch sind. Beide Modelle sind gleich gross und haben 354 Millionen Parameter.
+examples:
+    # This is how we can do nested lists
+    - >
+        Die Beschwerdeführerin rügt sodann eine Verletzung des Verhältnismässigkeitsprinzips. Sie ist der
+        Auffassung, dass die Publikationstätigkeit der WEKO den Grundsatz der [MASK] gemäss Art. 5 Abs. 2
+        und Art. 36 BV wahren müsse.
+    - >
+        In der Folge leitete E. beim [MASK] Zürich zwei Prozesse gegen seine frühere Arbeitgeberin ein. Im einen 
+        verlangte er Lohnfortzahlung, Genugtuung und die Ausstellung eines Arbeitszeugnisses; im andern Ersatz für 
+        Schaden, der ihm aus dem Verhalten der Bank entstanden sei.
+    - >
+        Der variable Teil der Vergütung aller Mitarbeiter, die der Verwaltungsrat in eigener Kompetenz beschliessen 
+        kann, darf nicht grösser als 15 Prozent des ausgewiesenen Reingewinnes sein. Will der Verwaltungsrat eine 
+        höhere variable Gesamtvergütung, muss er diese an der [MASK] beantragen und begründen.
+
+

resources/interfaces/gpt2_interface.yml

@@ -0,0 +1,19 @@
+title: GPT2 # will be used as tab title and for the link.
+name: huggingface/gpt2 # path to model
+description: >
+    GPT2 ist ein Foundation Modell, welches im Jahr 2019 darauf trainiert wurde, Texte weiterzuschreiben: 
+    Wort für Wort wählt das Modell die wahrscheinlichste Fortsetzung des Textes, und kann so ganze
+    Sätze und Texte bilden. Da das Modell allerdings für heutige Standards nur sehr klein ist, sind die 
+    resultierenden Texte nicht allzu beeindruckend. <br>
+
+    Das heute so populäre ChatGPT-Modell basiert auf der genau gleichen Technologie, nur hat es sehr viel 
+    mehr Speicherplatz zur Verfügung und wurde mit einem grösseren Textkorpus trainiert. ChatGPT hat genau 
+    die gleichen Probleme wie dieses deutlich kleinere GPT2-Modell - es kann semantische
+    Fehler machen, es ist in unterschiedlichen Sprachen unterschiedlich gut, und es bildet die Vorurteile des
+    Trainingsdatensatzes ab - nur kann es all seine Mängel deutlich besser hinter eindrücklichen Sätzen verstecken.
+
+examples:
+    - Paris is the capital of
+    - My dad works as a 
+    - My mother works as a 
+    - Auf Deutsch funktioniert das Modell deutlich

resources/interfaces/legal_german_roberta_interface.yml

@@ -0,0 +1,30 @@
+title: Legal German RoBERTa
+name: huggingface/joelito/legal-german-roberta-large
+description: >
+    Statt ein öffentlich verfügbares Foundation-Modell zu verwenden, können wir auch selbst solche Modelle 
+    trainieren. Auf dieser Seite zeigen wir ein solches Modell, welches an unserem Institut auf einem Textkorpus
+    mit rechtlicher Sprache vortrainiert wurde. Dadurch soll das Modell Textverarbeitungsaufgaben im Legal-
+    Bereich deutlich besser lösen können als generische Modelle. <br>
+
+    Die zwei hier gezeigten Foundation-Modelle wurden etwas anders trainiert als das vorher gezeigte GPT2-Modell:
+    Wir nehmen einen Text und maskieren ein Wort davon (mit dem Stichwort <mask>). Das Modell lernt nun, wie es 
+    dieses Wort voraussagen kann. Im Gegensatz zu GPT2 können die Modelle also auch vorausschauen - dafür sind sie
+    weniger gut für Textgenerierung geeignet. <br>
+
+    Wenn wir dem Modell nun verschiedene Beispiele von aktuellen Bundesgerichtsentscheiden mit einem maskierten Wort 
+    zeigen, macht es mit hoher Zuverlässigkeit einen guten Vorschlag, welches Wort fehlen könnte. Zum Vergleich 
+    zeigen wir im Tab "German BERT" ein gleich grosses generisches Modell, welches die Aufgabe deutlich weniger gut löst.
+
+examples:
+    - >
+        Die Beschwerdeführerin rügt sodann eine Verletzung des Verhältnismässigkeitsprinzips. Sie ist der
+        Auffassung, dass die Publikationstätigkeit der WEKO den Grundsatz der <mask> gemäss Art. 5 Abs. 2
+        und Art. 36 BV wahren müsse.
+    - >
+        In der Folge leitete E. beim <mask> Zürich zwei Prozesse gegen seine frühere Arbeitgeberin ein. 
+        Im einen verlangte er Lohnfortzahlung, Genugtuung und die Ausstellung eines Arbeitszeugnisses; im 
+        andern Ersatz für Schaden, der ihm aus dem Verhalten der Bank entstanden sei.
+    - >
+        Der variable Teil der Vergütung aller Mitarbeiter, die der Verwaltungsrat in eigener Kompetenz beschliessen 
+        kann, darf nicht grösser als 15 Prozent des ausgewiesenen Reingewinnes sein. Will der Verwaltungsrat eine 
+        höhere variable Gesamtvergütung, muss er diese an der <mask> beantragen und begründen.

resources/interfaces/ner_interface.yml

@@ -0,0 +1,13 @@
+title: Named Entity Recognition # will be used as tab title and for the link.
+name: huggingface/harshildarji/gbert-legal-ner # path to model
+description: >
+    Bei dieser Aufgabe geht es darum, automatisch Eigennamen oder Entitäten, engl. named entities,
+    in einem Text zu erkennen und einer Klasse zuzuordnen. So wäre beispielsweise Max Mustermann ein
+    Eigenname der Klasse Person; Berner Fachhochschule wäre ein Eigenname der Klasse Organisation. Das
+    hier verwendete Beispielmodell wurde auf juristische Texte des Deutschen trainiert und erkennt
+    Eigennamen, die für die juristischen Domäne relevant sind, wie zum Beispiel Lawyer (= Anwalt) oder
+    Law (=Gesetz).'
+examples:
+    - >
+        1. Das Bundesarbeitsgericht ist gemäß § 9 Abs. 2 Satz 2 ArbGG iVm. § 201 Abs. 1 Satz 2 GVG für
+        die beabsichtigte Klage gegen den Bund zuständig.

resources/interfaces/qa_interface.yml

@@ -0,0 +1,27 @@
+title: Question Answering
+name: huggingface/deepset/gelectra-large-germanquad
+description: >
+    Hier handelt es sich um ein Modell, welches auf eine spezifische Aufgabe spezialisiert wurde
+    (im Fachjargon "Finetuning" genannt):
+    In einem Text die Antwort auf eine gestellte Frage zu finden. Ausgangspunkt bildete das mehrsprachige
+    XLM-RoBERTa Modell mit 270M Parameter. Dieses Foundation Modell wurde anschliessend 
+    mit zahlreichen Beispielen von Texten, Fragen und gefundenen Antworten weitertrainiert, 
+    um diese spezifische Aufgabe zu lösen. 
+examples:
+    -
+        - Mein Name ist Wolfgang und ich lebe in Berlin
+        - Wo wohne ich?
+    -
+        - >
+            Der Amazonas-Regenwald, auf Englisch auch als Amazonien oder Amazonas-Dschungel bekannt,
+            ist ein feuchter Laubwald, der den größten Teil des Amazonas-Beckens Südamerikas bedeckt.
+            Dieses Becken umfasst 7.000.000 Quadratkilometer (2.700.000 Quadratmeilen), von denen
+            5.500.000 Quadratkilometer (2.100.000 Quadratmeilen) vom Regenwald bedeckt sind. Diese
+            Region umfasst Gebiete von neun Nationen. Der größte Teil des Waldes befindet sich in
+            Brasilien mit 60% des Regenwaldes, gefolgt von Peru mit 13%, Kolumbien mit 10% und geringen
+            Mengen in Venezuela, Ecuador, Bolivien, Guyana, Suriname und Französisch-Guayana. Staaten
+            oder Abteilungen in vier Nationen enthalten \"Amazonas\" in ihren Namen. Der Amazonas
+            repräsentiert mehr als die Hälfte der verbleibenden Regenwälder des Planeten und umfasst
+            den größten und artenreichsten tropischen Regenwald der Welt mit geschätzten 390 Milliarden
+            Einzelbäumen, die in 16.000 Arten unterteilt sind.
+        - Welcher Name wird auch verwendet, um den Amazonas-Regenwald auf Englisch zu beschreiben?

resources/interfaces/summarization_interface.yml

@@ -0,0 +1,35 @@
+title: Text-Zusammenfassung # will be used as tab title and for the link.
+name: huggingface/Einmalumdiewelt/T5-Base_GNAD # path to model
+description: >
+    Hier wurde ein sogenanntes T5-Sprachmodell auf den Task der Text-Zusammenfassung
+    spezialisiert. Das Modell versteht nur Deutsch und hat 220 Millionen Parameter.
+examples:
+    - >
+        Innovation Booster Swiss Smart Cities.
+        Der Innovation Booster Swiss Smart Cities unterstützt die Entwicklung von vernetzten 
+        Lösungen von Anfang an und erleichtert radikale Innovationsprojekte in grösserem Umfang 
+        mit höheren Risiken und Gewinnen, die durch isolierte lokale Projekte allein nicht zu 
+        stemmen sind. Smarte urbane Lösungen erfordern die Beteiligung eines breiten Spektrums von 
+        Akteuren, die von den Bürgern über die Privatwirtschaft bis hin zu Behörden und Hochschulen 
+        reichen. Der Booster bringt diese Akteure aus allen Regionen der Schweiz zusammen; in einem 
+        Co-Creation-Ansatz werden sie Lösungen für wichtige Herausforderungen moderner Städte entwickeln, 
+        die alle Dimensionen einer Smart City umfassen. Dazu führt der Booster regelmässige Aufrufe für 
+        Ideen durch, welche von einer Jury bewertet werden. Erfolgreiche Innovationsteams können mit 
+        bis zu CHF 25000 gefördert werden. Es geht dabei um eine Anschubfinanzierung für gute Ideen 
+        im ersten Stadium eines Innovationsprozesses, um diese soweit weiterzuentwickeln bzw. zu validieren, 
+        dass danach eine echte Entwicklung zur Marktreife möglich wird. Die Förderung und Anschubfinanzierung 
+        von neuen Ideen wird so einen grossen Schub in den Smart-City-Entwicklungen in der Schweiz auslösen 
+        und so zur weiteren Digitalisierung im öffentlichen Sektor beitragen.
+    - >
+        Demokratie Labor Basel
+        Digitalisierung, Klimawandel, zunehmende nationalistischer Tendenzen und die damit verbundene politische 
+        Polarisierung der Gesellschaft üben einen wachsenden Problem- und Reformdruck auf moderne Demokratien aus. 
+        Die Schweizer Demokratie hat sich jedoch in den letzten 100 Jahren institutionell kaum verändert. 
+        Entsprechend gross ist der Bedarf nach einer Anpassung der Beteiligungs- und Mitwirkungsinstrumente. 
+        Das Projekt will Reformansätze für mehr Bürger*innenbeteiligung entwickeln und testen.
+        Ausgehend von den existierenden politischen Strukturen werden über einen Zeitraum von drei Jahren von SRB 
+        und der BFH neue Ansätze zur demokratischen Partizipation, Meinungsbildung und Mitbestimmung identifiziert, 
+        experimentell auf ihre Praxistauglichkeit getestet und in konkrete Umsetzungsvorschläge überführt. In 
+        einzelnen Projekten werden bereits technische Lösungen skizziert oder auch Prototypen der entsprechenden 
+        Instrumente entwickelt. Insgesamt beinhaltet das Projekt zehn Reformansätze.
+

resources/interfaces/zero_shot_interface.yml

@@ -0,0 +1,49 @@
+title: Zero-Shot Interface
+name: huggingface/Sahajtomar/German_Zeroshot
+description: >
+    Bei dieser Aufgabe handelt es sich um eine Textklassifizierungsaufgabe. Das heißt, das Modell
+    bekommt einen Textinhalt vorgelegt und muss aus einer Liste vordefinierter Labels entscheiden,
+    welches dieser Labels den Inhalt des Textes am besten beschreibt. Der Krux bei der ganzen Sache ist,
+    dass das Modell keine Spezialisierung für die Labels erfahren hat und sozusagen beim ersten Mal die
+    richtige Auswahl treffen muss; daher zero shot, denn es hat nur einen Versuch. Erreicht wird dies, in
+    dem ein vortrainiertes Modell auf einen Datensatz für Natural Language Inference (dt. natürlichsprachliche
+    Inferenz oder Rückschluss auf natürliche Sprache) spezialisiert wird. Bei dieser Aufgabe bekommt
+    das Modell zwei Texte vorgelegt und muss lernen, in welchem Verhältnis die beiden Texte zueinanderstehen.
+    Folgende Klassen stehen dabei zur Auswahl:
+
+    Entailment: Text A ist eine logische Schlussfolgerung von Text B
+
+    Contradiction: Text A steht im Widerspruch zu Text B
+    
+    Neutral: es lassen sich keine Schlussfolgerungen dieser Art ziehen
+    </br>
+    Nehmen wir als Beispiel den Ausgangstext «Die Kinder lächeln und winken in die Kamera». Nach der Spezialisierung
+    sollte das Modell in der Lage sein zu sagen, dass die Aussage «Es sind Kinder anwesend.» eine logische
+    Schlussfolgerung des Ausgangstextes ist, während die Aussage «Die Kinder runzeln die Stirn.» im Widerspruch
+    zum Ausgangstext steht.
+    </br>
+    Es hat sich gezeigt, dass Modelle, die auf Natural Language Inference spezialisiert wurden, auch sehr gut darin sind,
+    Texten thematisch passende Labels zuzuordnen. Wenn wir wieder den Ausgangstext von vorhin nehmen, wäre das Modell in
+    der Lage zu sagen, dass von den möglichen Kandidatenlabels [Wirtschaft, Familie, Feier, Tragödie] Familie und Feier
+    diejenigen Labels sind, die den Inhalt des Textes am besten beschreiben.</br></br>Das hier verwendete Beispielmodell
+    wurde auf deutschsprachige Texte trainiert.
+examples:
+    -
+        - >
+            COVID-19 (Akronym von englisch coronavirus disease 2019, deutsch Coronavirus-Krankheit-2019), in den
+            deutschsprachigen Ländern umgangssprachlich meist nur als „Corona“ oder „Covid“ bezeichnet, ist eine
+            meldepflichtige Infektionskrankheit mit einem breiten aber unspezifischen Symptomspektrum, die durch eine
+            Infektion (Ansteckung) mit dem Betacoronavirus SARS-CoV-2 verursacht wird. Das Virus wurde erstmals im
+            Dezember 2019 in Wuhan (Volksrepublik China) beschrieben. Es verbreitete sich sehr schnell weltweit und ist
+            Ursache der COVID-19-Pandemie. Bis 18. Oktober 2022 wurden weltweit rund 622 Millionen COVID-Infizierte registriert,
+            es wird aber in vielen Ländern eine hohe Dunkelziffer vermutet. Laut einer Schätzung der Weltgesundheitsorganisation
+            (WHO) gab es zwischen Anfang 2020 und Ende 2021 eine weltweite, durch COVID-19 verursachte Übersterblichkeit von
+            14,83 Millionen Toten.
+        -
+            - Wirtschaft
+            - Familie
+            - Politik
+            - Finanzen
+            - Medizin
+            - Gesundheit
+        - True

resources/markdown/einführung.md

@@ -0,0 +1,15 @@
+Grundsätzlich sind Sprachmodelle nichts als statistische Modelle, welche die menschliche Sprache abbilden. Sie werden zunächst mit sehr zahlreichen Texten auf gewisse, sehr allgemeine Aufgaben "vortrainiert", wodurch sie die Grundstruktur der Sprache erlernen können. Solche allgemeinen Modelle werden "Foundation Models" genannt.
+
+#### GPT als Beispiel für ein Foundation Model
+Eine solche Aufgabe ist es zum Beispiel, das nächste Wort in einem Text vorauszusagen. Um dies lösen zu können, braucht ein Modell einerseits ein Verständnis für Grammatik. Anderseits muss es aber auch lernen, welche Wörter in einem Kontext gemeinsam vorkommen, um stets das richtige Wort voraussagen zu können. Ein Beispiel für ein solches Modell ist GPT-2, welches Sie in der nachfolgenden Demo ausprobieren können. Die vortrainierten Sprachmodelle haben also bereits ein Verständnis für Sprache und bilden daher die Basis für zahlreiche Anwendungen.
+
+#### Anwendung von Foundation Models
+Die Anwendung von Foundation Models kann grob in zwei Kategorien unterteilt werden: Bei der **Zero-Shot Anwendung** wird das Modell direkt dafür verwendet, um eine Aufgabe zu lösen. Wir können hierfür einfach ein Modell etwas fragen, und das Modell die Antwort generieren lassen - so wie wir es beispielsweise bei der Verwendung von ChatGPT tun. Beim **Finetuning** wird das Modell hingegen anhand von weiteren Beispielen auf eine ganz bestimmte Anwendung spezialisiert. Dies führt oft noch zu besseren Resultaten als die Zero-Shot-Verwendung, allerdings erfordert die Spezialisierung  Beispieldaten für die Aufgabe und ist mit grösserem technischem Aufwand verbunden.
+
+#### Modellgrösse
+Die Qualität des Sprachmodells hängt stark von der Grösse des Modells und des Datensatzes ab. Während die Technologien hinter ChatGPT bereits weitestgehend bekannt waren, ist das einzige Geheimnis hinter den verblüffenden Resultaten die Modellgrösse: Das Modell hat 175 Milliarden Parameter und wurde auf über 8 Milliarden Textdokumenten trainiert. Dadurch konnte es ein so gutes Verständnis für Sprache und das Erkennen von thematischen Kontexten erlangen, dass man das Gefühl hat, man interagiere mit einem anderen Menschen.
+
+#### Über diese Demoseite
+Mit dieser Demoseite wollen wir eine Intuition für verschiedene Anwendungsmöglichkeiten von Foundation Models vermitteln. In den Reiter "GPT2" und "Legal" kann direkt mit Foundation Models interagiert werden. "Question Answering", "Text-Zusammenfassung" und "Named Entity Recognition" sind beispiele für Modelle, welche mittels Finetuning spezialisiert wurden. Im "Zero-Shot Interface" ist schliesslich ein Beispiel für eine Zero-Shot Verwendung aufgezeigt.
+
+Die Demoseite wurde am Institut für Public Sector Transformation der Berner Fachhochschule entwickelt.

resources/pages/intro.yml

@@ -0,0 +1,4 @@
+title: Einführung
+content:
+- markdown/einführung.md
+- interfaces/gpt2_interface.yml

resources/tabs/app_tab.yml

@@ -0,0 +1,9 @@
+title: NLP Demo-Seite
+dependencies:
+- markdown/einführung.md
+- interfaces/gpt2_interface.yml
+- tabs/legal_tab.yml
+# - interfaces/qa_interface.yml
+# - interfaces/summarization_interface.yml
+- interfaces/ner_interface.yml
+- interfaces/zero_shot_interface.yml

resources/tabs/legal_tab.yml

@@ -0,0 +1,4 @@
+title: Legal # will be used as tab title
+dependencies:
+- interfaces/legal_german_roberta_interface.yml
+- interfaces/gbert_interface.yml

resources/templates/template_interface.yml

@@ -0,0 +1,20 @@
+title: Some Title # will be used as tab title and for the link.
+name: huggingface/deepset/gelectra-large-germanquad # path to model
+description: > # Adding > here allows multiline strings
+    This
+    is
+    a
+    string
+    accross
+    multiple
+    lines
+examples:
+    # This is how we can do nested lists
+    - # First example
+        - Foo
+        - Bar
+    - # Second example
+        - >
+            Hello
+            world
+        - Hello who?

resources/templates/template_tab.yml

@@ -0,0 +1,3 @@
+title: Some Title # will be used as tab title
+dependencies:
+- templates/template_interface.yaml # provide all dependant interfaces as a list

src/nlp_circle_demo/wrapped_gradio_objects.py

@@ -0,0 +1,143 @@
+import gradio as gr
+import yaml
+import os
+
+bfh_blue = gr.themes.utils.colors.Color(
+    c50="#edf0f2",
+    c100="#dbe0e5",
+    c200="#b7c1cb",
+    c300="#93a2b1",
+    c400="#6f8397",
+    c500="#4b647d",
+    c600="#3c5064",
+    c700="#2d3c4b",
+    c800="#1e2832",
+    c900="#0f1419",
+    c950="#070a0c",
+    name="bfh_blue",
+)
+
+bfh_yellow = gr.themes.colors.Color(
+    c50="#fff9e6",
+    c100="#fef3cc",
+    c200="#fde799",
+    c300="#fcdb66",
+    c400="#fbcf33",
+    c500="#fac300",
+    c600="#c89c00",
+    c700="#967500",
+    c800="#644e00",
+    c900="#322700",
+    c950="#191300",
+    name="bfh_yellow",
+)
+
+
+class BFHTheme(gr.themes.Base):
+    def __init__(
+        self,
+    ):
+        super().__init__(
+            primary_hue=bfh_blue,
+            secondary_hue=bfh_yellow,
+        )
+
+
+class WrappedGradioObject:
+    def __init__(self, title, gradio_element):
+        self.title = title
+        self.gradio_element = gradio_element
+
+    def launch(self):
+        return self.gradio_element.launch()
+
+    @staticmethod
+    def read_yaml(path):
+        with open(path) as f:
+            return yaml.safe_load(f)
+
+    @staticmethod
+    def read_file(path):
+        with open(path) as f:
+            return f.read()
+
+
+class GradioInterfaceWrapper(WrappedGradioObject):
+    @classmethod
+    def from_yaml(cls, path):
+        """Initializes Interface from YAML file."""
+        content_dict = cls.read_yaml(path)
+        return cls.create_interface(**content_dict)
+
+    @classmethod
+    def create_interface(cls, name, title, description, examples=None):
+        """Creates Gradio-Element containing an interface."""
+        description = cls._prepend_link_to_description(name, title, description)
+        interface = gr.load(
+            name,
+            title=None,  # Having the Tab-Name is sufficient.
+            description=description,
+            examples=examples,
+        )
+        return cls(title, interface)
+
+    @staticmethod
+    def _prepend_link_to_description(name, title, description):
+        without_huggingface = name.removeprefix("huggingface/")
+        link = f"https://huggingface.co/{without_huggingface}"
+        return f'<a href="{link}">{title}</a> </br> {description}'
+
+
+class GradioTabWrapper(WrappedGradioObject):
+    @classmethod
+    def from_gradio_object_list(cls, title, gradio_objects):
+        """Constructs a GradioTabWrapper from a title and a list of WrappedGradioObjects."""
+        interface = gr.TabbedInterface(
+            [obj.gradio_element for obj in gradio_objects],
+            [obj.title for obj in gradio_objects],
+            theme=BFHTheme(),
+        )
+        return cls(title, interface)
+
+    @classmethod
+    def from_yaml(cls, path):
+        content_dict = cls.read_yaml(path)
+        gradio_objects = [
+            cls._read_dependency(dependency)
+            for dependency in content_dict["dependencies"]
+        ]
+        return cls.from_gradio_object_list(
+            content_dict["title"],
+            gradio_objects,
+        )
+
+    @staticmethod
+    def _read_dependency(path):
+        full_path = f"resources/{path}"
+        if path.startswith("interfaces"):
+            return GradioInterfaceWrapper.from_yaml(full_path)
+        if path.startswith("tabs"):
+            return GradioTabWrapper.from_yaml(full_path)
+        if path.startswith("markdown"):
+            return GradioMarkdownWrapper.from_markdown(full_path)
+        raise ValueError(
+            "Gradio Object Type could not be inferred from path name. Make sure "
+            "that all interface object yamls are in resources/interfaces, "
+            "all tab object yamls are in resources/tabs, and all markdown objects "
+            "are in resources/markdown."
+        )
+
+
+class GradioMarkdownWrapper(WrappedGradioObject):
+    @classmethod
+    def from_markdown(cls, path):
+        """Creates text from markdown. The title is inferred from the file name."""
+        content = cls.read_file(path)
+        title = cls.title_from_path(path)
+        return cls(title, gr.Markdown(content))
+
+    @staticmethod
+    def title_from_path(path):
+        _, last = os.path.split(path)
+        name, _ = os.path.splitext(last)
+        return name.capitalize()