https://myvirtualclient.pl/pl

1<!DOCTYPE html>
2<html lang="pl">
3<head>
4    

4<script>
5    (function() {
6        var host = window.location.hostname;
7        var target = 'myvirtualclient.pl';
8        if (host !== target && (host.indexOf('web.app') > -1 || host.indexOf('firebaseapp.com') > -1)) {
9        window.location.replace('https://' + target + window.location.pathname + window.location.search);
10        }
11    })();
12    </script>

12
13
14    <meta charset="utf-8" />
15    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
16    <title>My Virtual Client</title>
17    <meta name="description" content="Aplikacja edukacyjna dla studentów architektury, która symuluje interakcję z wirtualnym klientem, stawiając realistyczne wymagania projektowe." />
18    <link rel="icon" type="image/x-icon" href="/assets/images/favicon.ico">
19    <link rel="alternate" hreflang="pl" href="https://my-virtual-client.web.app/pl/index" />
20    <link rel="alternate" hreflang="en" href="https://my-virtual-client.web.app/en/index" />
21    <link rel="alternate" hreflang="x-default" href="https://my-virtual-client.web.app/pl/index" />
22
23    <link rel="canonical" href="https://myvirtualclient.pl" />
24    <link rel="preconnect" href="https://fonts.googleapis.com" />
25    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
26    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700;900&family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-25..0&display=swap" rel="stylesheet" />
27    <link rel="preload" as="style" onload="this.rel='stylesheet'" rel="stylesheet" href="https://unpkg.com/[email protected]/css/basscss.min.css" />
28    <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
29    <link rel="preload" as="style" onload="this.rel='stylesheet'" rel="stylesheet" href="/assets/styles/styles.css" />
30
31
32    <link rel="preload" as="image" href="/assets/images/houses-image.png">
33    <link rel="preload" as="image" href="/assets/images/wave.svg">
34    <link rel="preload" as="image" href="/assets/images/logo.png">
35</head>
36
37<body class="dark-bg">
38    <nav class="glass fixed justify-center">
39        <div class="container flex justify-center relative">
40            <a href="#"><img class="logo mr2" src="/assets/images/logo.png" alt="My Virtual Client Logo" /></a>
41
42            <button class="menu-button" aria-expanded="false" aria-controls="nav-list" aria-label="Otwórz menu">
43                <span class="material-symbols-outlined icon-menu">menu</span>
44                <span class="material-symbols-outlined icon-close" style="display:none;">close</span>
45            </button>
46
47            <ul id="nav-list" class="nav-items flex items-center">
48                <li class="nav-item"><a class="nav-link" href="#video" tabindex="-1">O projekcie</a></li>
49                <li class="nav-item"><a class="nav-link" href="#about-us" tabindex="-1">O nas</a></li>
50                <li class="nav-item"><a class="nav-link" href="#contact" tabindex="-1">Kontakt</a></li>
51            </ul>
52            <span class="spacer"></span>
53            <div class="lang-picker-container">
54                <label for="lang-select" class="sr-only">Wybierz język</label>
55                <div class="lang-select-wrapper">
56                  <select id="lang-select" class="lang-select" onchange="location = this.value;">
57                      <option value="/pl" selected>PL</option>
58                      <option value="/en" >EN</option>
59                  </select>
60                  <span class="material-symbols-outlined lang-icon" aria-hidden="true">expand_more</span>
61                </div>
62            </div>
63        </div>
64    </nav>
65
66    <main>
67        <section class="hero items-center justify-center">
68            <div class="futuristic-data-bg">
69                <img src="/assets/images/wave.svg" alt="Falujące tło futurystyczne" aria-hidden="true" />
70            </div>
71            <div class="blob-bg">
72                <div class="blob blob-1"></div>
73                <div class="blob blob-2"></div>
74            </div>
75            <div class="background container-fluid row p0">
76                <div class="left-panel-bg col col-12 sm-col-6"></div>
77                <div class="right-panel-bg col col-12 sm-col-6"></div>
78            </div>
79            <div class="hero-text container p0 row">
80                <div class="left-panel col col-12 sm-col-6">
81                    <h1 class="title fade-in">
82                        My Virtual<br /><span class="brand-title">

82Client</span>
83                    </h1>
84                </div>
85                <div class="right-panel fade-in-left col col-12 sm-col-6">
86                    <p class="description-hero text-light center">Aplikacja edukacyjna dla studentów architektury, która symuluje interakcję z wirtualnym klientem, stawiając realistyczne wymagania projektowe. Celem jest lepsze przygotowanie przyszłych architektów do pracy w zawodzie poprzez naukę dostosowywania projektów do rzeczywistych ograniczeń i oczekiwań.</p>
87                    <div class="btn-group flex">
88                        <a href="/app" class="btn neon-btn">Wypróbuj</a>
89                        <a href="#video" class="btn outline-btn">Dowiedz się więcej</a>
90                    </div>
91                </div>
92                <img class="buildings" src="/assets/images/houses-image.png" alt="Wizualizacja budynków jednorodzinnych - projekt My Virtual Client" />
93            </div>
94            <article class="affiliations flex p2">
95                <div class="col flex items-center">
96                    <img id="pwc-techminds-logo" class="footer-logo" src="/assets/images/pwc-techminds-logo.jpg" alt="Logo konkursu PWC TechMinds"/>
97                    <p class="ml1">Zwycięski projekt konkursu grantowego <stong>PwC TechMinds - 4. Edycja w kategorii uczelnie wyższe</strong></p>
98                </div>
99                <div class="col flex items-center">
100                    <div class="flex flex-row item-center">
101                        <img id="polsl-logo" class="footer-logo" src="/assets/images/polsl-logo.png" alt="Logo Politechniki Śląskiej"/>
102                        <img id="pwc-logo" class="footer-logo" src="/assets/images/pwc-logo.png" alt="Logo PwC"/>
103                    </div>
104                    <p class="ml1">Aplikacja stworzona dzięki wsparciu <strong>PwC Polska</strong> oraz <strong>Politechniki Śląskiej</strong></p>
105                </div>
106            </article>
107        </section>
108
109        <section id="video">
110            <h2 class="center mb3">O projekcie</h2>
111            <div class="container row">
112                <video id="video-player" controls>
113                    <source src="/assets/video/film.mp4" type="video/mp4" />
114                    <track kind="subtitles" src="/assets/video/subtitles_pl.vtt" srclang="pl" />
115                    Twoja przeglądarka nie wspiera odtwarzania wideo.
116                    <a href="/assets/video/film.mp4">Link do filmu.</a>
117                </video>
118            </div>
119
120            <div class="container flex clearfix justify-center mt2">
121                <article class="expert-card card col col-12 sm-col-12 md-col-6 lg-col-4 glass elevated" data-aos="fade-up-right">
122                    <div class="row flex items-center justify-center">
123                        <img class="spec-photo" alt="Zdjęcie Agnieszki Labus" src="/assets/images/a-labus.jpg" />
124                        <h3 class="name">Agnieszka Labus</h3>
125                    </div>
126                    <p class="description">Architektka i naukowczyni, której misją jest tworzenie przyjaznych miast na całe życie. Adiunktka w Katedrze Urbanistyki i Planowania Przestrzennego na Politechnice Śląskiej.</p>
127                </article>
128                <article class="expert-card card col col-12 sm-col-12 md-col-6 lg-col-4 glass elevated" data-aos="fade-up">
129                    <div class="row flex items-center justify-center">
130                        <img class="spec-photo" alt="Zdjęcie Tomasza Bradeckiego" src="/assets/images/t-bradecki.jpg" />
131                        <h3 class="name">Tomasz Bradecki</h3>
132                    </div>
133                    <p class="description">Dziekan Wydziału Architektury Politechniki Śląskiej, założyciel grupy badawczej URBANMODEL.</p>
134                </article>
135                <article class="expert-card card col col-12 sm-col-12 md-col-6 lg-col-4 glass elevated" data-aos="fade-up-left">
136                    <div class="row flex items-center justify-center">
137                        <img class="spec-photo" alt="Logo firmy ADC Maciej Tutaj" src="/assets/images/adc-logo.jpg" />
138                        <h3 class="name">Maciej Tutaj</h3>
139                    </div>
140                    <p class="description">Architekt z wieloletnim doświadczeniem zawodowym, specjalizujący się w prowadzeniu kompleksowych projektów.</p>
141                </article>
142            </div>
143        </section>
144
145        <section id="about-us">
146            <div class="header-bar text-light p3 mb2">
147                <h2>O nas</h2>
148            </div>
149            <div class="container p3 description">
150              <article class="p1">
151                  <p>Jesteśmy studentkami na <a href='https://www.polsl.pl/rar/' rel='noopener noreferrer' target='_blank'>Wydziale Architektury Politechniki Śląskiej w Gliwicach</a>, gdzie razem realizujemy wiele projektów, zarówno podczas zajęć na uczelni, jak i w Kole Naukowym <a href='http://urbanmodel.org/pl/grupa-badawcza/' rel='noopener noreferrer' target='_blank'>URBANMODEL</a>, do którego należymy.</p>                   <p>Obie pełnimy funkcję redaktorek monografii <a href='https://repolis.bg.polsl.pl/dlibra/publication/88552/edition/78699' rel='noopener noreferrer' target='_blank'>Modele struktury Metropolii GZM – gra w Metropolię</a> odpowiadając za treść oraz za projekt kart, które stworzyłyśmy wraz z grupą innych studentów. Karty tej gry są aktualnie <a href='https://esklep.polsl.pl/s

151hop-full-width/strona-glowna-2/gadzety/gra-w-metropolie-gzm/' rel='noopener noreferrer' target='_blank'>dostępne w sprzedaży</a>.</p>                   <p>W Kole Naukowym kontynuujemy rozwój tego projektu, rozbudowując go o grę planszową, która również jest dostępna w sprzedaży. Razem rozwijamy się zawodowo, dzieląc się wspólnymi zainteresowaniami oraz poglądami na temat potrzeby rozwoju sposobów nauczania. Chcemy wzbogacić edukację, wprowadzając elementy, które są zarówno przemyślane, jak i atrakcyjne dla wykładowców oraz studentów. Naszym celem jest stworzenie narzędzi, które będą wspierały rozwój nauki i edukacji architektonicznej w sposób nowoczesny i angażujący.</p>                   <p>Stworzyłyśmy razem, od zera (za pomocą HTML, CSS i JS), stronę internetową – MyVirtualClient.pl promującą nasz pomysł, którą Państwo właśnie przeglądają.</p> 
152              </article>
153            </div>
154
155            <div class="container p3 flex clearfix justify-center">
156                <div class="col-12 lg-col-6 md-col-12 sm-col-12 p1">
157                    <article class="about-us-card text-light card glass elevated" data-aos="fade-up">
158                      <div class="flex flex-column items-center justify-center">
159                        <img class="about-us-photo" alt="Photo of Izabela Mularczyk" src="/assets/images/i-mularczyk.jpeg" />
160                        <div class="flex items-center justify-center">
161                          <h3 class="name">Izabela Mularczyk</h3>
162                          <a href="https://www.linkedin.com/in/izabela-mularczyk-3b3184296/" target="_blank"><img class="linkedin-logo ml1" src="/assets/images/linkedin-logo.png" alt="LinkedIn"></a>
163                        </div>
164                        <div class="description pl1 pr1 pt1">
165                            <p>Interesuję się projektowaniem nowoczesnych i funkcjonalnych rozwiązań, które łączą architekturę, design i technologię. Szczególnie interesuje mnie rozwój technologii BIM (Building Information Modeling) oraz jej zastosowanie w procesie projektowym, koordynacji międzybranżowej i usprawnianiu pracy zespołów projektowych.</p><p>Rozwijam także swoje umiejętności w zakresie programowania front-endowego oraz tworzenia stron internetowych, traktując je jako narzędzia wspierające projektowanie i komunikację w architekturze.</p><p>Moje zainteresowania integracją technologii z architekturą pozwoliły mi wyjść poza tradycyjne ramy projektowania i tworzyć rozwiązania wspierające edukację studentów. Jestem współautorką monografii oraz gry karcianej „Modele struktury Metropolii GZM – gra w Metropolię” oraz autorką aplikacji webowej stworzonej dla Koła Naukowego URBANMODEL działającego na Wydziale Architektury Politechniki Śląskiej.</p><p>Aplikacja pełni rolę wirtualnych kart wiedzy, które uzupełniają grę planszową &quot;Gra w Metropolię – Metropoli&quot;. Po zeskanowaniu kodów QR gracze uzyskują dostęp do dodatkowych treści, takich jak pytania z wiedzy o Górnośląsko-Zagłębiowskiej Metropolii. Aplikacja dostępna jest pod poniższym linkiem: <a href='https://www.grawosiedle.polsl.pl/game/' rel='noopener noreferrer' target='_blank'>Quiz – Gra w Metropolię GZM</a>.</p><p>W wolnym czasie rozwijam zarówno kompetencje technologiczne, jak i projektowe, poszukując sposobów integracji architektury, BIM oraz narzędzi cyfrowych w celu tworzenia rozwiązań wspierających proces projektowy i edukację architektoniczną.</p>
166                        </div>
167                      </div>
168                    </article>
169                </div>
170                <div class="col-12 lg-col-6 md-col-12 sm-col-12 p1">
171                    <article class="about-us-card text-light card glass elevated" data-aos="fade-up">
172                      <div class="flex flex-column items-center justify-center">
173                        <img class="about-us-photo" alt="Photo of Magdalena Sikora" src="/assets/images/m-sikora.jpg" />
174                        <div class="flex items-center justify-center">
175                          <h3 class="name">Magdalena Sikora</h3>
176                          <a href="https://www.linkedin.com/in/magdalena-s-315b512b9" target="_blank"><img class="linkedin-logo ml1" src="/assets/images/linkedin-logo.png" alt="LinkedIn"></a>
177                        </div>
178                        <div class="description pl1 pr1 pt1">
179                            <p>Moją pasją są grafika, design i projektowanie 3D, które rozwijam zarówno w kontekście edukacyjnym, jak i poza uczelnią. W trakcie studiów współtworzyłam monografię oraz grę karcianą Modele struktury Metropolii GZM – gra w Metropolię, angażując się zarówno w warstwę wizualną projektu, jak i w treść.</p><p>Projektowanie graficzne oraz tworzenie form trójwymiarowych traktuję jako przestrzeń do rozwijania kreatywnych idei i poszukiwania nowych rozwiązań. W moich projektach estetyka i funkcjonalność idą w parze, przyciągając uwagę i jednocześnie klarownie komunikując zamysł.</p><p>Posiadam również doświadczenie w projektowaniu identyfikacji marki. Tworzę projekty logo, wizytówek oraz różnego rodzaju materiałów wspierających wizerunek firmy i działania promocyjne. W pracy nad identyfikacją skupiam się na budowaniu spójnego charakteru marki, który pozwala wyróżnić ją na tle innych. Każdy projekt traktuję indywidualnie, dobierając rozwiązania najlepiej odpowiadające potrzebom klienta lub projektu.</p><p>W wolnej chwili tworzę plakaty zarówno cyfrowe, jak i manualne, traktując je jako przestrzeń do eksperymentów z kompozycją, typografią i formą. Łączę tradycyjne techniki z narzędziami cyfrowymi, rozwijając swój własny styl. Dodatkowo tworzę filmy wideo, doskonaląc montaż, dzięki któremu moje historie zyskują większą dynamikę.</p>
180                        </div>
181                      </div>
182                    </article>
183                </div>
184            </div>
185        </section>
186
187        <section id="contact" class="mb2 p2">
188         <div class="container flex items-center justify-center">
189            <div class="col header-col col-12 lg-col-6 md-col-12 sm-col-12 flex items-center justify-center">
190               <h2 class="center text-light">Skontaktuj się z nami</h2>
191            </div>
192            <div class="col col-12 lg-col-6 md-col-12 sm-col-12">
193               <div class="card glass">
194                  <p class="center">Masz pytania dotyczące aplikacji lub potrzebujesz wsparcia?</p>
195                  <p class="mt1 center">Napisz do nas!</p>
196                  <div class="flex items-center justify-center mt1">

197                     <span class="material-symbols-outlined mr1">mail</span>
198                     <a href="mailto:[email protected]" class="email-link">[email protected]</a>
199                  </div>
200               </div>
201            </div>
202         </div>
203      </section>
204    </main>
205
206    <footer class="main-footer">
207        <div class="container p2 flex justify-center">
208            <div class="footer-links-container flex flex-wrap justify-center py3">
209                <a href="/pl/rodo.html" target="_blank" class="footer-legal-link">Obowiązek informacyjny RODO</a>
210                <a href="/pl/tos.html" target="_blank" class="footer-legal-link">Regulamin serwisu</a>
211                <a href="/pl/privacypolicy.html" target="_blank" class="footer-legal-link">Polityka prywatności</a>
212                <a href="/pl/cookies.html" target="_blank" class="footer-legal-link">Polityka Plików Cookies</a>
213            </div>
214            <div class="footer-copyright p2 pb3 pt0 center">
215                &copy; 2026 My Virtual Client. Stworzone z ❤️ do Architektury
216            </div>
217        </div>
218    </footer>
219
220    

220<script src="/assets/scripts/menu.js"></script>

220
221    

221<script src="https://unpkg.com/aos@next/dist/aos.js"></script>

221
222    

222<script>AOS.init();</script>

222
223</body>
224</html>