Merge branch 'main' of https://gitfrieds.nackenbox.xyz/Gottfried/KI-Kunst-Kirsten-Kloeckner

KIKunstKirstenKlöckner/Pages/AiArt.razor

@@ -174,6 +174,7 @@
         new() { Position = TooltipPosition.Bottom, Duration = null});
 
     private string _imagePromptEnglish = "";
+    private string _imageIdea = "";
     private string _imageDescription = "";
     private string _imagePrompt = "";
 
@@ -184,6 +185,7 @@
     private Conversation converse;
 
     private string _basePrompt;
+    private string _ideaPrompt;
 
     private string _imageUrl;
 
@@ -405,16 +407,23 @@
             _addonsVisible = false;
             _bothVisible = _buttonVisible && _addonsVisible;
             await UpdateBusyMessage("Kirstens Assistent zerbricht sich über deine Idee den Kopf...");
-            _basePrompt = await File.ReadAllTextAsync($"{Directory.GetCurrentDirectory()}{@"/wwwroot/test_prompt.txt"}");
+            _ideaPrompt = await File.ReadAllTextAsync($"{Directory.GetCurrentDirectory()}{@"/wwwroot/idea_prompt.txt"}");
 
             ChatRequest chatRequest = new ChatRequest
                 {
                     Temperature = temperature,
-                    Model = Model.ChatGPTTurbo,
+                    Model = Model.GPT4,
                 };
 
             converse = _openAiApi.Chat.CreateConversation(chatRequest);
-            converse.AppendUserInput(_basePrompt + " " + request);
+            converse.AppendUserInput(_ideaPrompt + " " + request);
+
+            _imageIdea = await converse.GetResponseFromChatbotAsync();
+
+            _basePrompt = await File.ReadAllTextAsync($"{Directory.GetCurrentDirectory()}{@"/wwwroot/test_prompt2.txt"}");
+            converse.AppendUserInput(_basePrompt);
+
+
         }
         else
         {

KIKunstKirstenKlöckner/Pages/Projekt.razor

@@ -0,0 +1,137 @@
+@page "/projekt"
+
+
+
+<div class="hero_area">
+
+    <!-- slider section -->
+    <section class=" slider_section ">
+        <div class="container">
+            <div class="row">
+                <div class="col-md-6 ">
+                    <div class="detail_box">
+                        <h1>
+                            Das <br>
+                            Projekt <br>
+                        </h1>
+                        <p>
+                            Zusammentreffen von Talent, Technologie und sozialer Verantwortung: Die Entstehung eines einzigartigen Projekts
+                        </p>
+
+                    </div>
+                </div>
+                <div class="col-lg-5 col-md-6 offset-lg-1">
+                    <div class="img_content">
+                        <div class="img_container">
+                            <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
+                                <div class="carousel-inner">
+                                    <div class="carousel-item active">
+                                        <div class="img-box">
+                                            <img src="images/slider-img1.jpg" alt="">
+                                        </div>
+                                    </div>
+                                    <div class="carousel-item">
+                                        <div class="img-box">
+                                            <img src="images/slider-img2.jpg" alt="">
+                                        </div>
+                                    </div>
+                                    <div class="carousel-item">
+                                        <div class="img-box">
+                                            <img src="images/slider-img3.jpg" alt="">
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
+                            <span class="sr-only">Previous</span>
+                        </a>
+                        <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
+                            <span class="sr-only">Next</span>
+                        </a>
+                    </div>
+
+                </div>
+            </div>
+        </div>
+    </section>
+    <!-- end slider section -->
+</div>
+<!-- explaining section -->
+<div class="container">
+</div>
+
+
+
+<!-- about section -->
+<section class="about_section layout_padding">
+    <div class="container">
+        <div class="row">
+            <div class="col-md-6">
+                <div class="img_container">
+                    <div class="img-box b1">
+                        <img src="images/about4.jpg" alt="" />
+                    </div>
+                </div>
+
+            </div>
+            <div class="col-md-6">
+                <div class="detail-box">
+                    <div class="heading_container">
+                        <h2>
+                            Wie entstand das Wunschprogramm Projekt?
+                        </h2>
+                        <img src="images/plug.png" alt="">
+                    </div>
+                    <p>
+                        Das Projekt "Wunschprogramm-Assistentin" ist ein lebendiges Beispiel für kreative Zusammenarbeit, Innovation und Engagement, das sich selbstverständlich in einem ständigen Prozess der Entwicklung und Entfaltung befindet. Es vereint die Talente und Visionen von Künstlern, Journalisten, Studenten und einem engagierten Verein, um etwas wirklich Einzigartiges zu schaffen.
+                        In enger Zusammenarbeit mit einem Team von IT-Studenten an der Leibniz-Universität in Hannover und dem Verein APROTO – Aktionen und Projekte pro Toleranz, bringt die Berliner Künstlerin Kirsten Klöckner dieses einzigartige Projekt zum Leben. APROTO e.V., ein Verein, der sich für Toleranz und Verständigung einsetzt, hat bereits in der Vergangenheit durch Kunstprojekte Brücken zwischen verschiedenen Kulturen und Gesellschaftsgruppen gebaut.
+                        Die Journalistin Meike Wolff, Vorstand von APROTO e.V., trägt durch ihre Texte und ihre Kommunikationsfähigkeiten dazu bei, das Projekt in die Öffentlichkeit zu bringen. Ihre Arbeit spiegelt den dynamischen Charakter des Projekts wider, das sich ständig weiterentwickelt und wächst.
+                        
+                    </p>
+                    <a href="">
+                        Read More
+                    </a>
+                </div>
+            </div>
+
+
+        </div>
+    </div>
+</section>
+
+<section class="about_section layout_padding">
+    <div class="container">
+        <div class="row">
+            <div class="col-md-6">
+                <div class="detail-box">
+                    <div class="heading_container">
+                        <img src="images/plug.png" alt="">
+                    </div>
+                    <p>
+                        Die Idee zu diesem innovativen Projekt stammt von dem Journalisten Till-Matthias Jürgens. In enger Abstimmung mit den IT-Studenten und der Künstlerin Kirsten Klöckner überwacht er die Gesamtkonzeption und stellt sicher, dass das Projekt in Bewegung bleibt, sich anpasst und innovativ bleibt.
+                        Die technische Umsetzung liegt in den fähigen Händen von Jan Kaminski, Meiko Remiorz, Simon Lübeß und Timm Kleipsties, KI-Studenten der Leibniz-Universität in Hannover. Sie arbeiten kontinuierlich an der Entwicklung des KI-Modells und seiner Daten-Einspeisung. Jan Kaminski, der auch für die grafische Umsetzung der Webseite verantwortlich ist, fungiert als kommunikative Schnittstelle und sorgt dafür, dass die technische und kreative Seite des Projekts nahtlos zusammenarbeiten.
+                        Das Projekt "Wunschprogramm-Assistentin" ist mehr als nur eine künstlerische Unternehmung; es ist ein Zusammentreffen von Talent, Technologie und sozialer Verantwortung. Es zeigt, wie Kunst, Wissenschaft und Gemeinschaft zusammenarbeiten können, um etwas zu schaffen, das sowohl schön als auch bedeutungsvoll ist. Es ist ein Beweis dafür, dass die Grenzen zwischen diesen Bereichen nicht festgelegt sind und dass durch Zusammenarbeit und Innovation neue Wege beschritten werden können. Es ist ein aufregender Blick in die Zukunft der Kunst, eine Zukunft, die jetzt stattfindet, und ein Projekt, das sich in einem ständigen Prozess der Entdeckung und Erneuerung befindet.
+
+                    </p>
+                    <a href="">
+                        Read More
+                    </a>
+                </div>
+            </div>
+            <div class="col-md-6">
+                <div class="img_container">
+                    <div class="img-box b1">
+                        <img src="images/about1.jpg" alt="" />
+                    </div>
+                    <div class="img-box b2">
+                        <img src="images/about2.jpg" alt="" />
+                    </div>
+                </div>
+
+            </div>
+
+        </div>
+    </div>
+</section>
+<!-- end about section -->

KIKunstKirstenKlöckner/Shared/MainLayout.razor

@@ -61,7 +61,7 @@
                             <a href="">
                                 <img src="images/location-white.png" alt="">
                                 <span>
-                                    Passages of Lorem Ipsum available
+                                    Kirsten Klöckners KI-Atelier
                                 </span>
                             </a>
                         </div>
@@ -77,23 +77,13 @@
                             <a href="">
                                 <img src="images/envelope-white.png" alt="">
                                 <span>
-                                    demo@gmail.com
+                                    nackenbox@gmail.com
                                 </span>
                             </a>
                         </div>
                     </div>
                 </div>
                 <div class="row">
-                    <div class="col-md-8 col-lg-9">
-                        <div class="info_form">
-                            <form action="">
-                                <input type="text" placeholder="Enter your email">
-                                <button>
-                                    subscribe
-                                </button>
-                            </form>
-                        </div>
-                    </div>
                     <div class="col-md-4 col-lg-3">
                         <div class="info_social">
                             <div>

KIKunstKirstenKlöckner/wwwroot/idea_prompt.txt

@@ -0,0 +1 @@
+Gib mir eine Bildidee, die ein Bild kurz beschreibt im Übertragenden Sinne. Der Titel ist:

KIKunstKirstenKlöckner/wwwroot/test_prompt.txt

@@ -1,29 +0,0 @@
-Kunststil und Techniken: Kirsten Klöckner ist eine Künstlerin, die sich auf Aquarell- und Tusche-Materialien spezialisiert hat. Diese Techniken erfordern ein hohes Maß an Geschick und Präzision, da sie sowohl transparente als auch deckende Effekte erzeugen kann. Die Verwendung von Papier als Untergrund ermöglicht es ihr, mit verschiedenen Strukturen und Texturen zu experimentieren. Die Vielfalt der Techniken, die sie beherrscht - wie Federzeichnung, Pinselzeichnung, Nass-in-Nass-Technik, Trocken-auf-Trocken-Technik und Lasur - ermöglicht es ihr, ihre künstlerische Vision in unterschiedlichen Ausdrucksformen zu realisieren.
-
-Themen und Motive: Klöckners Kunst zeigt eine breite Palette von Themen und Motiven. Ihre Werke enthalten oft Naturmotive. Gleichzeitig widmet sie sich aber auch gesellschaftlichen und politischen Anliegen, wie zum Beispiel Gastfreundschaft, Verantwortung, Klimaschutz und kritischen Reflektionen über den Alltag. Die Vielfalt der Themen zeigt, dass sie eine Künstlerin ist, die sich für viele Facetten des Lebens interessiert und ihre Kunst als Ausdrucksmittel für verschiedene Gedanken und Gefühle nutzt. Oftmals werden die Kernobjekte eines Werkes sehr detailliert dargestellt und etwas weniger abstrakt.
-
-Emotionen und Interpretation: Kirsten Klöckners Kunst scheint stark von Emotionen durchdrungen zu sein, die bei den Betrachtern Resonanz erzeugen. Die Assoziationen und Reaktionen anderer Menschen auf ihre Werke reichen von Freude und Dankbarkeit bis hin zu nachdenklichen Reflexionen über gesellschaftliche Fragen. Dies deutet darauf hin, dass ihre Kunst eine breite Palette von Emotionen anspricht und eine starke Verbindung zu den Betrachtern herstellt. Klöckners Fähigkeit, Emotionen in ihren Werken zu vermitteln, zeugt von ihrer künstlerischen Sensibilität und ihrer Fähigkeit, eine tiefere Ebene der Kommunikation mit ihrem Publikum zu erreichen.
-
-Narrative Elemente: In ihrer Kunst integriert Klöckner oft narrative Elemente, die Geschichten erzählen oder eine tiefere Bedeutung hervorheben. Diese erzählerischen Aspekte tragen dazu bei, dass ihre Werke komplexer und aussagekräftiger werden. Die Verwendung von Symbolen wie Schleifen, Tischen und Haken in ihren Bildern gibt den Betrachtern einen zusätzlichen Anreiz, die Bedeutung hinter den Kunstwerken zu erkunden und sich mit den dargestellten Themen auseinanderzusetzen. Sie teilt die Titel ihrer Werke oft in einzelne Worte welche dann als jeweiliges Element Einzug in ihre Werke finden. (z.B. Schilderwald wird zu einem Bild aus Schildern in einem Wald).
-
-Künstlerische Ambition und Botschaft: Kirsten Klöckner zeigt durch ihre Kunst eine klare Botschaft und Ambition. Ihre Werke sind nicht nur ästhetisch ansprechend, sondern dienen auch als Medium, um ihre persönlichen Überzeugungen und Gedanken zu verschiedenen Themen auszudrücken. Sie fordert die Betrachter dazu auf, über gesellschaftliche Fragen, Naturverbundenheit und das menschliche Dasein nachzudenken. Ihre Kunst regt Diskussionen und Reflexionen an und zeigt, dass sie als Künstlerin eine Botschafterin für verschiedenste Anliegen ist.
-
-Dies die Vorgehensweise bei der Entwicklung eines Bildes von Kirsten Klöckner.
-Wenn sie einen Titel bekommen hat und dazu ein Bild malen sollte, hat sie so gearbeitet. Bitte generiere einen Englischen Prompt für eine Bild KI basierend auf den gennanten Aspekten. 
-
-Hier findest du Beispiele, wie der Promt aussehen soll: 
-
-"Portrait of an astronaut in space, detailed starry background, reflective helmet."
-“Painting of a floating island with giant clock gears, populated with mythical creatures.”
-“Landscape of a Japanese garden in autumn, with a bridge over a koi pond.”
-“Painting representing the sound of jazz music, using pale colors and erratic shapes.”
-“Painting of a modern smartphone with classic art pieces appearing on the screen.”
-“Battle scene with futuristic robots and a golden palace in the background.”
-“Painting of a bustling city market with different perspectives of people and stalls.”
-“Painting of a ship sailing in a stormy sea, with dramatic lighting and powerful waves.”
-“Painting of a female botanist surrounded by exotic plants in a greenhouse.”
-“Painting of an ancient castle at night, with a full moon, gargoyles, and shadows.”
-
-Bitte nutze für den Prompt maximal 20 Wörter und achte darauf, dass der Prompt auf englisch ist.
-
-Den Titel für den zu erstellenden Promt ist: 

KIKunstKirstenKlöckner/wwwroot/test_prompt2.txt

@@ -1,10 +1,5 @@
-Du wirst gleich einen Titel für ein Bild bekommen. Bitte versuch diesen Titel in eine Bildidee für eine KI umzuwandeln. 
+Bitte generiere einen Englischen Prompt für dieses Bild
 
-Hier sind Ideen, wie du den Titel umformen kannst: 
-
-"Interpretieren Sie den Titel tiefsinnig und mehrschichtig, finden Sie Symbole und tiefere Bedeutungen. Nutzen Sie persönliche oder gesellschaftliche Filter für die Interpretation. Bringen Sie abstrakte Darstellungen, Symbole und Metaphern ein, die der Titel hervorruft. Bedenken Sie gesellschaftliche und kulturelle Themen sowie Themen wie Toleranz und Verantwortung. Fügen Sie Humor und Ironie hinzu, hinterfragen Sie traditionelle Themen kritisch. Reflektieren Sie Ihre Emotionen und Gedanken, stellen Sie sicher, dass Ihr Kunstwerk eine Aussage trifft. Lassen Sie Interpretation und Assoziationen zu, erforschen Sie neue Kontexte, seien Sie offen für Überraschungen und hinterfragen Sie das Gewohnte."
-
-Bitte generiere einen Englischen Prompt für eine Bild KI basierend auf diesen vorherigen Herangehensweisen.
 Hier findest du Beispiele, wie der Promt aussehen soll: 
 "Portrait of an astronaut in space, detailed starry background, reflective helmet."
 “Painting of a floating island with giant clock gears, populated with mythical creatures.”
@@ -12,5 +7,3 @@ Hier findest du Beispiele, wie der Promt aussehen soll:
 “Painting representing the sound of jazz music, using pale colors and erratic shapes.”
 Bitte nutze unbedingt für den Prompt maximal 20 Wörter!
 Der Promt selber darf auf keinen Fall abstrakt sein, man muss durch den Promt ein genaues Bild vor Augen haben.
-
-Der Titel lautet: