Upload 18 files

.gitattributes

@@ -56,3 +56,5 @@ examples/original/0x000faf94.wav filter=lfs diff=lfs merge=lfs -text
 examples/original/0x0011ce99.wav filter=lfs diff=lfs merge=lfs -text
 examples/original/dialogue_1.wav filter=lfs diff=lfs merge=lfs -text
 examples/original/dialogue_9.wav filter=lfs diff=lfs merge=lfs -text
+assets/G13_DUBAI.pdf filter=lfs diff=lfs merge=lfs -text
+assets/G13_DUBAI.pptx filter=lfs diff=lfs merge=lfs -text

assets/G13_DUBAI.pdf

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:232fa26f926ed888eb48f7bd62a32c3af77c02f96a90da38ceaf6afb99fd96a5
+size 1192603

assets/G13_DUBAI.pptx

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:ce44e49d8e6f9afb7a02036480bb19b61f9139dab90c256baa86c12f17dd5ccc
+size 12509463

src/content/about_tab.py

@@ -1,4 +1,5 @@
 import gradio as gr
+from src.utils import get_base64_image
 
 def about_tab():
     with gr.TabItem("ℹ️ O projekcie"):
@@ -21,6 +22,33 @@ def about_tab():
             gr.HTML("""
                 <div style="font-size: 18px; font-family: Myriad, sans-serif;">
                 Aby osiągnąć nasz cel, opracowaliśmy modularną architekturę systemu umożliwiającego generowanie dubbingu z użyciem nowoczesnych modeli AI. Cały proces został podzielony na trzy główne etapy: przetwarzanie wstępne, tłumaczenie oraz generowanie dźwięku. Każdy z tych komponentów działa niezależnie, co pozwala na łatwą modyfikację lub wymianę modelu na bardziej zaawansowany bez konieczności przebudowy całego potoku przetwarzania.
+                <br><br>
+                Proces rozpoczęto od oczyszczenia nagrań z zakłóceń tła przy użyciu modelu Demucs, który umożliwił skuteczne wydzielenie sygnału mowy. Następnie zastosowano Mossformer2 do separacji mówców, co pozwoliło rozdzielić wypowiedzi różnych osób w nagraniu. Transkrypcja i segmentacja audio zostały przeprowadzone za pomocą modelu Whisper, znanego z wysokiej jakości rozpoznawania mowy. Otrzymane wypowiedzi pogrupowano przy użyciu algorytmu DBSCAN, co ułatwiło identyfikację spójnych segmentów konwersacyjnych.
+                <br><br>
+                Do tłumaczenia wykorzystano polski wielojęzyczny model językowy Bielik, który efektywnie przekłada teksty zachowując ich znaczenie. Unikalnym aspektem naszego podejścia jest uwzględnianie kontekstu w postaci sąsiadujących fragmentów dialogu — zarówno wypowiedzi poprzedzających, jak i następujących po tłumaczonym fragmencie. Jakość tłumaczeń jest oceniana automatycznie za pomocą metryk takich jak COMET, BERTScore i BLEU, które zapewniają obiektywną ocenę pod kątem zgodności semantycznej oraz płynności tłumaczonego tekstu. 
+                <br><br>
+                Syntezę mowy zrealizowano przy użyciu modelu XTTS-v2, obsługującego 17 języków i umożliwiającego generowanie naturalnego głosu na podstawie jedynie 6-sekundowego nagrania referencyjnego. Został on wybrany ze względu na dobrą jakość dźwięku, szybkość działania oraz lepszą kompatybilność z językiem polskim niż inne dostępne modele. Na końcu przeprowadzono subiektywną ocenę końcowego dźwięku w formie testów odsłuchowych.
+                <br><br>
+                Na poniższym schemacie przedstawiono szczegółowy przebieg procesu.
                 </div>
             """)
 
+            img_data = get_base64_image("assets/schema.png")
+            schema_html = f"""
+            <div style="display: flex; justify-content: center; padding: 20px;">
+                <img src="{img_data}" 
+                    style="
+                        width: 100%;
+                        max-width: 1000px;
+                        border: none;
+                        object-fit: contain;
+                    " 
+                    alt="Schemat procesu"
+                />
+            </div>
+            """
+            gr.HTML(schema_html)
+            gr.HTML('<div style="text-align: center; font-size: 18px; font-family: Myriad, sans-serif;">Przebieg procesu przetwarzania nagrania.</div>')
+            
+        
+

src/content/about_us_tab.py

@@ -13,9 +13,10 @@ def about_us_tab():
                 W skład zespołu wchodzą: Natalia Iwańska, Klaudia Janicka, Wiktor Jeżowski, Kajetan Kołodziejczyk oraz Michał Wiktorowski. 
                 <br>
                 Opiekunami projektu są dr hab. inż. Maciej Piasecki oraz dr inż. Piotr Syga.
-                </div>
+                </div><br>
             """)
 
+
             gr.HTML('<div style="font-size: 35px; font-family: Myriad, sans-serif; font-weight: bold; text-align: left;">📩 Kontakt</div>')
 
             gr.HTML("""

src/content/front_image.py

@@ -4,26 +4,23 @@ from src.utils import get_base64_image
 def image_tab():
     gr.HTML("""
     <style>
-    .full-width-img-container {
-        width: 100%;
-        overflow: hidden;
-        margin: 0;
-        padding: 0;
+    .scaled-img-container {
+        display: flex;
+        justify-content: center;
+        padding: 0.1em 0;
     }
-    .full-width-img {
-        width: 100%;
-        height: auto;
-        display: block;
+    .scaled-img {
+        transform-origin: top center;
     }
     </style>
     """)
-    
-    img_data = get_base64_image("assets/logo.png")
+
+    img_data = get_base64_image("assets/DubAI.png")
     logo_html = f"""
-    <div class="full-width-img-container">
+    <div class="scaled-img-container">
         <img src="{img_data}" 
-             class="full-width-img"
+             class="scaled-img"
              alt="Logo" />
     </div>
     """
-    gr.HTML(logo_html)
+    gr.HTML(logo_html)

src/content/others_tab.py

@@ -0,0 +1,17 @@
+import gradio as gr
+
+
+
+def pdf_tab():
+    with gr.Tab("📂 Inne"):
+        with gr.Column():
+            gr.HTML('<div style="font-size: 35px; font-family: Myriad, sans-serif; font-weight: bold; text-align: left;">📂 Inne</div>')
+            gr.HTML("""
+                <div style="font-size: 18px; font-family: Myriad, sans-serif;">
+                Chciałbyś dowiedzieć się więcej? Poniżej znajdują się dodatkowe pliki związane z projektem, które udostępniamy do pobrania.
+                <br><br>
+                </div>
+            """)
+            gr.File(value="assets/G13_DUBAI.pdf", label="🖼️ Plakat", interactive=True)
+            gr.File(value="assets/G13_DUBAI.pptx", label="📈 Prezentacja", interactive=True)
+            

src/content/results_tab.py

@@ -1,5 +1,6 @@
 import gradio as gr
 from pathlib import Path
+from src.utils import get_base64_image
 
 
 def get_files(dir_name):
@@ -14,6 +15,11 @@ def results_tab():
     with gr.Tab("📊 Wyniki"):
         with gr.Column(elem_classes="results-tab"):
             gr.HTML('<div style="font-size: 35px; font-family: Myriad, sans-serif; font-weight: bold; text-align: left;">🎵 Przykłady dubbingu</div>')
+            gr.HTML("""
+                <div style="font-size: 18px; font-family: Myriad, sans-serif;">
+                Poniżej przedstawiamy efekty naszego rozwiązania — przykładowe pary nagrań oryginalnych i wygenerowanych. Wśród nich znajdują się zarówno nagrania pojedyńczych wypowiedzi, jak i rozbudowane dialogi z muzyką w tle. Poszczególne wypowiedzi można odsłuchać, klikając na przycisk uruchamiający odtwarzacz audio.
+                </div>
+            """)
             with gr.Row():
                 gr.HTML('<div style="font-size: 20px; font-family: Myriad, sans-serif; font-weight: bold; text-align: center;">Oryginalne nagranie</div>')
                 gr.HTML('<div style="font-size: 20px; font-family: Myriad, sans-serif; font-weight: bold; text-align: center;">Wygenerowany dubbing</div>')
@@ -26,7 +32,14 @@ def results_tab():
             
             gr.HTML('<br><br>')
 
-            gr.HTML('<div style="font-size: 35px; font-family: Myriad, sans-serif; font-weight: bold; text-align: left;">Przykłady wpływu kontekstu na tłumaczenie</div>')
+# WPŁYW KONTEKSTU NA TŁUMACZENIE
+
+            gr.HTML('<div style="font-size: 35px; font-family: Myriad, sans-serif; font-weight: bold; text-align: left;">🈲 Przykłady wpływu kontekstu na tłumaczenie</div>')
+            gr.HTML("""
+                <div style="font-size: 18px; font-family: Myriad, sans-serif;">
+                Poniżej prezentujemy przykłady tłumaczeń wykonanych bez kontekstu oraz z uwzględnieniem kontekstu wypowiedzi. Zestawienie to ma na celu zilustrowanie, jak istotny wpływ na jakość i poprawność tłumaczenia może mieć kontekst w postaci wypowiedzi poprzedzającej i następującej po tłumaczonym fragmencie. Dzięki temu można zaobserwować różnice w interpretacji znaczenia, doborze słownictwa oraz płynności przekładu w zależności od dostępnych informacji kontekstowych.
+                </div>
+            """)
             gr.HTML("""
                     <div style="display:flex; gap:20px; flex-wrap: wrap; color:#000;">
 
@@ -34,9 +47,9 @@ def results_tab():
                     <h3 style="color:#000;">Przykład 1</h3>
                     <b>Dialog:</b><br>
                     <div style="background-color:#e0e0e0; border-radius:10px; padding:10px; margin-top:5px; margin-bottom:10px; color:#000;">
-                    Troll - Ick metal. Mouth stings.<br>
-                    Lambert - <b style="color:black;">You nuts?!</b><br>
-                    Geralt - Shut up and follow my lead.
+                    Troll &mdash; Ick metal. Mouth stings.<br>
+                    Lambert &mdash; <b style="color:black;">You nuts?!</b><br>
+                    Geralt &mdash; Shut up and follow my lead.
                     </div>
                     <b style="color:black;">Oryginalne:</b> Zwariowałeś?! ⭐<br>
                     <b style="color:black;">Bez kontekstu:</b> Ty orzeszku?! <span>❌</span><br>
@@ -47,16 +60,116 @@ def results_tab():
                     <h3 style="color:#000;">Przykład 2</h3>
                     <b>Dialog:</b><br>
                     <div style="background-color:#e0e0e0; border-radius:10px; padding:10px; margin-top:5px; margin-bottom:10px; color:#000;">
-                    Yennefer - Philippa, your eyesight, only just recovered and magically simulated. Didn’t you say you’d need some time to get accustomed?<br>
-                    Philippa Eilhart - <b style="color:black;">Did I?</b><br>
-                    Yennefer - I’d forgotten how irritating she can be. Come, Ciri.
+                    Yennefer &mdash; Philippa, your eyesight, only just recovered and magically simulated. Didn’t you say you’d need some time to get accustomed?<br>
+                    Philippa Eilhart &mdash; <b style="color:black;">Did I?</b><br>
+                    Yennefer &mdash; I’d forgotten how irritating she can be. Come, Ciri.
                     </div>
                     <b style="color:black;">Oryginalne:</b> Tak mówiłam? ⭐<br>
                     <b style="color:black;">Bez kontekstu:</b> Czy ja? <span style="color:black;">❌</span><br>
                     <b style="color:black;">Z kontekstem:</b> <b style="color:black;">Czy ja tak powiedziałam?</b> ✅
                     </div>
                     </div>
+
+                    <br>
+
+                    <div style="display:flex; gap:20px; flex-wrap: wrap; color:#000;">
+                    <div style="flex:2; background-color:#f5f5f5; color:#000; border:2px solid black; border-radius:20px; padding:15px; min-width:300px;">
+                    <h3 style="color:#000;">Przykład 3</h3>
+                    <b>Dialog:</b><br>
+                    <div style="background-color:#e0e0e0; border-radius:10px; padding:10px; margin-top:5px; margin-bottom:10px; color:#000;">
+                    Chamberlain Emhyr &mdash; Bow before His Imperial Majesty, The White Flame Dancing on the Graves of his Foes, Emhyr var Emreis!<br>
+                    Chamberlain Emhyr &mdash; <b style="color:black;">Bow.</b><br>
+                    Emhyr &mdash; I thought you bowed before no man.<br>
+                    </div>
+                    <b style="color:black;">Oryginalne:</b> Ukłon. ⭐<br>
+                    <b style="color:black;">Bez kontekstu:</b> Łuk. <span>❌</span><br>
+                    <b style="color:black;">Z kontekstem:</b> <b style="color:black;">Ukłon.</b> ✅
+                    </div>
+
+                    <div style="flex:2; background-color:#f5f5f5; color:#000; border:2px solid black; border-radius:20px; padding:15px; min-width:300px;">
+                    <h3 style="color:#000;">Przykład 4</h3>
+                    <b>Dialog:</b><br>
+                    <div style="background-color:#e0e0e0; border-radius:10px; padding:10px; margin-top:5px; margin-bottom:10px; color:#000;">
+                    Keira Metz &mdash; Find him immediately. We’re close to unraveling this, I can feel it.<br>
+                    Keira Metz &mdash; <b style="color:black;">What was that? It sounded for a moment like you’d joined the wraiths yourself...</b><br>
+                    Geralt &mdash; Had to fight a pesta.<br>
+                    </div>
+                    <b style="color:black;">Oryginalne:</b> Co to było? Brzmiało, jakbyś postanowił dołączyć do drużyny upiorów... ⭐<br>
+                    <b style="color:black;">Bez kontekstu:</b> Co to było? Brzmiało przez chwilę, jakbyś dołączył do cieni sam <span>❌</span><br>
+                    <b style="color:black;">Z kontekstem:</b> <b style="color:black;">Co to było? Na chwilę brzmiało to tak, jakbyś sam dołączył do upiorów...</b> ✅
+                    </div>
+                    </div>
                     """)
+            
+            gr.HTML('<br><br>')
+            
+# MOS
+            gr.HTML('<div style="font-size: 35px; font-family: Myriad, sans-serif; font-weight: bold; text-align: left;">📋 Test MOS')
+            gr.HTML("""
+                <div style="font-size: 18px; font-family: Myriad, sans-serif;">
+                Jednym z najważniejszych wyznaczników jakości mowy syntetycznej jest opinia drugiego człowieka. W tym celu przeprowadziliśmy test MOS (ang. <i>Mean Opinion Score</i>), który polega na subiektywnej ocenie jakości dźwięku przez słuchaczy. W badaniu wzięło udział 63 uczestników, którzy mieli za zadanie wysłuchać fragmentów nagrań i ocenić je w skali od 1 do 5, gdzie 1 oznaczało bardzo niską jakość, a 5 bardzo wysoką. Sprawdzona została zarówno naturalność wygenerowanego dźwięku (nMOS), jak i jakość transferu cech mowy (sMOS).
+                <br><br>
+                W <a href="#mosTable">tabeli</a> przedstawiamy średnie wyniki testów nMOS i sMOS, zarówno dla tłumaczenia z języka angielskiego na polski, jak i odwrotnie. Rezultaty są w obu przypadkach na wysokim poziomie, aczkolwiek nieco gorsze wyniki uzyskano dla syntezy z języka angielskiego na polski. Wynika to głównie ze złożoności fleksyjnej języka polskiego oraz znacznie mniejszego wsparcia modeli dla tego języka. Na <a href="#nmos">wykresach</a> przedstawiono szczegółowy rozkład ocen dla nMOS i sMOS.
+                </div>
+                <br><br>
+                <table id="mosTable" style="margin: 0 auto; border-collapse: collapse; max-width: 600px; width: 100%; font-size: 20px;">
+                    <thead>
+                        <tr style="border-bottom: 2px solid #000;">
+                            <th style="padding: 10px;"></th>
+                            <th style="padding: 10px;"><strong>EN &rarr; PL</strong></th>
+                            <th style="padding: 10px;"><strong>PL &rarr; EN</strong></th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr style="border-bottom: 1px solid #ccc;">
+                            <td style="padding: 10px;"><strong>nMOS</strong></td>
+                            <td style="padding: 10px;">4,02</td>
+                            <td style="padding: 10px;">4,38</td>
+                        </tr>
+                        <tr>
+                            <td style="padding: 10px;"><strong>sMOS</strong></td>
+                            <td style="padding: 10px;">4,08</td>
+                            <td style="padding: 10px;">4,51</td>
+                        </tr>
+                    </tbody>
+                </table>
+                <div style="text-align: center; font-size: 16px; font-family: Myriad, sans-serif; margin-top: 8px;">
+                    Średnie wyniki testu MOS.
+                </div>
+                <style>
+                    table tbody tr:hover {
+                        background-color: #f0f0f0;
+                    }
+                </style>
+            """)
+            
+            gr.HTML("""
+            <style>
+            .scaled-img-container {
+                display: flex;
+                justify-content: center;
+                padding: 0.1em 0;
+            }
+            .scaled-img {
+                transform-origin: top center;
+            }
+            </style>
+            """)
 
+            img_nmos = get_base64_image("assets/nmos.png")
+            img_smos = get_base64_image("assets/smos.png")
+            imgs_with_labels = f"""
+            <div style="display: flex; justify-content: center; gap: 40px; flex-wrap: wrap; text-align: center;">
+                <div>
+                    <img id="nmos" src="{img_nmos}" class="scaled-img" alt="nmos" style="max-width: 100%; height: auto;" />
+                    <div style="margin-top: 10px; font-size: 16px; font-family: Myriad, sans-serif;">Wyniki testu nMOS.</div>
+                </div>
+                <div>
+                    <img id="smos" src="{img_smos}" class="scaled-img" alt="smos" style="max-width: 100%; height: auto;" />
+                    <div style="margin-top: 10px; font-size: 16px; font-family: Myriad, sans-serif;">Wyniki testu sMOS.</div>
+                </div>
+            </div>
+            """
+            gr.HTML(imgs_with_labels)
 
                                 

src/models/translation.py

@@ -18,7 +18,7 @@ class TranslationService:
         self, 
         text: str, 
         source_lang: str = "PL",
-        target_lang: str = "EN"
+        target_lang: str = "EN-US"
     ) -> str:
         """Tłumaczenie tekstu"""
         result = self.translator.translate_text(
@@ -26,7 +26,7 @@ class TranslationService:
             source_lang=source_lang,
             target_lang=target_lang
         )
-        return result.text
+        return result.text.replace(".", ",")
 
 # Singleton pattern
 TRANSLATOR = TranslationService()