-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
5c4db0a
commit b4b4b96
Showing
4 changed files
with
1,557 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,260 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Interactive Resume - Gibran BANHAKEIA</title> | ||
| <link rel="stylesheet" href="styles.css"> | ||
| </head> | ||
| <body> | ||
| <div id="particles-js" class="video-background"></div> | ||
| <div id="progress-bar"></div> | ||
| <button class="toggle-switch" onclick="toggleDarkMode(); playClickSound();">Toggle Dark Mode</button> | ||
| <button class="mood-toggle" onclick="toggleMood(); playClickSound();">Mood</button> | ||
| <button class="language-selector" onclick="toggleLanguage(); playClickSound();">EN</button> | ||
| <div class="resume-container"> | ||
| <div class="main-content"> | ||
| <header class="header"> | ||
| <div class="photo"> | ||
| <img src="https://media.licdn.com/dms/image/D4E03AQEL7N_-0eK2VQ/profile-displayphoto-shrink_400_400/0/1702919910756?e=1727308800&v=beta&t=TR8A3dE-iRsxh30W4uPURT8mzaYsrmw7w5oq0c9WVXQ" alt="Gibran BANHAKEIA"> | ||
| </div> | ||
| <div class="contact-info"> | ||
| <h1>Gibran BANHAKEIA, PhD</h1> | ||
| <p>Email: <a href="mailto:[email protected]">[email protected]</a></p> | ||
| <p>Email: <a href="mailto:[email protected]">[email protected]</a></p> | ||
| <p>Phone: <a href="tel:063-692-1479">063-692-1479</a></p> | ||
| <p>LinkedIn: <a href="https://www.linkedin.com/in/gibran-banhakeia-phd-306a361a4/" target="_blank">linkedin.com/in/gibran-banhakeia-phd-306a361a4/</a></p> | ||
| </div> | ||
| </header> | ||
|
|
||
| <nav class="navbar"> | ||
| <button onclick="showSection('summary'); playClickSound();">Summary</button> | ||
| <button onclick="showSection('experience'); playClickSound();">Experience</button> | ||
| <button onclick="showSection('education'); playClickSound();">Education</button> | ||
| <button onclick="showSection('skills'); playClickSound();">Skills</button> | ||
| <button onclick="showSection('projects'); playClickSound();">Projects</button> | ||
| <button onclick="showSection('timeline'); playClickSound();">Timeline</button> | ||
| <button onclick="showSection('testimonials'); playClickSound();">Testimonials</button> | ||
| <button onclick="showSection('contact'); playClickSound();">Contact</button> | ||
| <button onclick="showSection('faq'); playClickSound();">FAQ</button> | ||
| </nav> | ||
|
|
||
| <main class="content"> | ||
| <section id="summary" class="section active-section typewriter"> | ||
| <h2>Computational Linguist & Translator</h2> | ||
| </section> | ||
| <section id="experience" class="section"> | ||
| <h2>Experience</h2> | ||
| <h3>Polyglot Translator</h3> | ||
| <p>New York Circle for Translators - January 2018 to Present</p> | ||
| <p>Leading a team of linguists in analyzing large datasets to improve machine translation and natural language processing models. Developed a new framework for evaluating linguistic accuracy, resulting in a 20% increase in model performance.</p> | ||
| <h3>Linguist & Translator</h3> | ||
| <p>IAPTI - June 2018 to Present</p> | ||
| <p>Conducted extensive research on language patterns and text analysis. Collaborated with interdisciplinary teams to publish findings in peer-reviewed journals. Presented research at international conferences, enhancing the company's reputation in the field.</p> | ||
| <h3>Polyglot Translator</h3> | ||
| <p>Translator within UNDP for National Biodiversity Targets (French to English) - January 2023 to Mars 2023</p> | ||
| <p>Translation and Proofreading tasks from English to Spanish</p> | ||
| </section> | ||
| <section id="education" class="section"> | ||
| <h2>Education</h2> | ||
| <p>PhD in North African Studies - University of Lorraine - November 2021 to Present</p> | ||
| <p>Master of Translation and Literature - Faculty of Nador - 2017 to 2020</p> | ||
| <p>Master of World Literature and Comparative Studies - Paris University - 2019 to 2020</p> | ||
| </section> | ||
| <section id="skills" class="section"> | ||
| <h2>Skills</h2> | ||
| <div class="skill"> | ||
| <label for="Translation Studies">Translation Studies</label> | ||
| <progress id="Translation Studies" value="90" max="100"></progress> | ||
| </div> | ||
| <div class="skill"> | ||
| <label for="Proofreading">Proofreading</label> | ||
| <progress id="Proofreading" value="85" max="100"></progress> | ||
| </div> | ||
| <div class="skill"> | ||
| <label for="HTML Developing">HTML Developing</label> | ||
| <progress id="HTML Developing" value="80" max="100"></progress> | ||
| </div> | ||
| <div class="skill"> | ||
| <label for="Multi-tasks">Multi-tasks</label> | ||
| <progress id="Multi-tasks" value="75" max="100"></progress> | ||
| </div> | ||
| <div class="skill"> | ||
| <label for="Team-spirit">Team-spirit</label> | ||
| <progress id="Team-spirit" value="70" max="100"></progress> | ||
| </div> | ||
| <div class="skill"> | ||
| <label for="project-management">Project Management</label> | ||
| <progress id="project-management" value="65" max="100"></progress> | ||
| </div> | ||
| </section> | ||
| <section id="projects" class="section"> | ||
| <h2>Projects</h2> | ||
| <h3><a href="javascript:void(0)" onclick="openModal('project1'); playClickSound();">Translation Studies & NLP</a></h3> | ||
| <p>Developed Translating Strategies, Developed and implemented new ways to enhance the performance of natural language processing models, resulting in a 30% reduction in error rates.</p> | ||
| <h3><a href="javascript:void(0)" onclick="openModal('project2'); playClickSound();">AI Training and Translating Complex Tasks</a></h3> | ||
| <p>Designed a comprehensive tool for translating, training and analyzing language data, which was adopted by several research teams for their studies. The tool's user-friendly interface and robust features greatly improved the efficiency of data analysis workflows.</p> | ||
| </section> | ||
| <section id="timeline" class="section"> | ||
| <h2>Timeline</h2> | ||
| <div id="timeline"></div> | ||
| </section> | ||
| <section id="testimonials" class="section testimonials"> | ||
| <h2>Testimonials</h2> | ||
| <div class="testimonial"> | ||
| <h3>John Doe, Colleague</h3> | ||
| <p>Gibran is a highly skilled linguistics analyst with a keen eye for detail. His innovative approach to problem-solving has been a great asset to our team.</p> | ||
| </div> | ||
| <div class="testimonial"> | ||
| <h3>Jane Smith, Manager</h3> | ||
| <p>Working with Gibran has been a pleasure. His dedication and expertise in applied linguistics are truly impressive.</p> | ||
| </div> | ||
| </section> | ||
| <section id="contact" class="section contact-form"> | ||
| <h2>Contact</h2> | ||
| <form> | ||
| <input type="text" name="name" placeholder="Your Name" required> | ||
| <input type="email" name="email" placeholder="Your Email" required> | ||
| <textarea name="message" placeholder="Your Message" required></textarea> | ||
| <button type="submit" onclick="playClickSound();">Send</button> | ||
| </form> | ||
| </section> | ||
| <section id="counters" class="section counters"> | ||
| <div class="counter"> | ||
| <h3 id="yearsExperience">0</h3> | ||
| <p>Years of Experience</p> | ||
| </div> | ||
| <div class="counter"> | ||
| <h3 id="projectsCompleted">0</h3> | ||
| <p>Projects Completed</p> | ||
| </div> | ||
| </section> | ||
| <section id="faq" class="section faq"> | ||
| <h2>FAQ</h2> | ||
| <h3 onclick="toggleFAQ('faq1'); playClickSound();">What is your educational background?</h3> | ||
| <p id="faq1">I have a PhD in Applied Linguistics from the University of Example, and a Master of Science in Computational Linguistics from the same institution.</p> | ||
| <h3 onclick="toggleFAQ('faq2'); playClickSound();">What are your main skills?</h3> | ||
| <p id="faq2">My main skills include data analysis, natural language processing, machine learning, Python, R, and project management.</p> | ||
| <h3 onclick="toggleFAQ('faq3'); playClickSound();">Can I contact you for collaboration?</h3> | ||
| <p id="faq3">Yes, please use the contact form above to get in touch with me regarding collaboration opportunities.</p> | ||
| </section> | ||
| <section id="3d-model" class="section three-js-container"> | ||
| <h2>3D Model Viewer</h2> | ||
| <div id="three-js-container"></div> | ||
| </section> | ||
| </main> | ||
|
|
||
| <div class="download-button"> | ||
| <a href="path/to/your/resume.pdf" download onclick="playClickSound();">Download Full Resume (PDF)</a> | ||
| </div> | ||
|
|
||
| <!-- Modal for Project 1 --> | ||
| <div id="project1" class="modal"> | ||
| <div class="modal-content"> | ||
| <span class="close" onclick="closeModal('project1'); playClickSound();">×</span> | ||
| <h2>Project 1: NLP Model Improvement</h2> | ||
| <p>Developed and implemented new algorithms to enhance the performance of natural language processing models, resulting in a 30% reduction in error rates.</p> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Modal for Project 2 --> | ||
| <div id="project2" class="modal"> | ||
| <div class="modal-content"> | ||
| <span class="close" onclick="closeModal('project2'); playClickSound();">×</span> | ||
| <h2>Project 2: Language Data Analysis Tool</h2> | ||
| <p>Designed a comprehensive tool for analyzing language data, which was adopted by several research teams for their studies. The tool's user-friendly interface and robust features greatly improved the efficiency of data analysis workflows.</p> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Language Proficiency Section --> | ||
| <section class="languages"> | ||
| <h2>Languages I Master</h2> | ||
| <div class="language"> | ||
| <label for="english">English</label> | ||
| <div class="progress-bar"> | ||
| <div class="progress progress-blue" style="width: 95%;"></div> | ||
| </div> | ||
| </div> | ||
| <div class="language"> | ||
| <label for="french">French</label> | ||
| <div class="progress-bar"> | ||
| <div class="progress progress-green" style="width: 90%;"></div> | ||
| </div> | ||
| </div> | ||
| <div class="language"> | ||
| <label for="spanish">Spanish</label> | ||
| <div class="progress-bar"> | ||
| <div class="progress progress-red" style="width: 85%;"></div> | ||
| </div> | ||
| </div> | ||
| <div class="language"> | ||
| <label for="arabic">Arabic</label> | ||
| <div class="progress-bar"> | ||
| <div class="progress progress-blue" style="width: 100%;"></div> | ||
| </div> | ||
| </div> | ||
| <div class="language"> | ||
| <label for="berber">Berber</label> | ||
| <div class="progress-bar"> | ||
| <div class="progress progress-green" style="width: 100%;"></div> | ||
| </div> | ||
| </div> | ||
| <div class="language"> | ||
| <label for="russian">Russian</label> | ||
| <div class="progress-bar"> | ||
| <div class="progress progress-red" style="width: 50%;"></div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
|
|
||
| <!-- Certificates Section --> | ||
| <div class="pie-chart-container"> | ||
| <canvas id="certificatesPieChart"></canvas> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Pie Chart Section --> | ||
| <div class="right-side"> | ||
| <div class="pie-chart-container"> | ||
| <canvas id="competencePieChart"></canvas> | ||
| </div> | ||
| <div class="pie-chart-container"> | ||
| <canvas id="softwarePieChart"></canvas> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Audio element for button click sound --> | ||
| <audio id="button-sound" src="https://cdn.aframe.io/360-image-gallery-boilerplate/audio/click.ogg" preload="auto"></audio> | ||
|
|
||
| <audio id="background-audio" loop> | ||
| <source src="path/to/your/sound.mp3" type="audio/mpeg"> | ||
| Your browser does not support the audio element. | ||
| </audio> | ||
|
|
||
| <!-- PWA Install Button --> | ||
| <button class="install-button" id="installButton" onclick="playClickSound();">Install App</button> | ||
|
|
||
| <!-- AI Chatbot --> | ||
| <div class="chatbot"> | ||
| <div class="chatbot-header">Ask Me Anything!</div> | ||
| <div class="chatbot-messages" id="chatbotMessages"></div> | ||
| <div class="chatbot-input"> | ||
| <input type="text" id="chatbotInput" placeholder="Type your message here..."> | ||
| <button onclick="sendMessage(); playClickSound();">Send</button> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div id="text-animation-container"></div> | ||
|
|
||
| <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script> | ||
| <script type="text/javascript" src="https://unpkg.com/vis-timeline/dist/vis-timeline-graph2d.min.js"></script> | ||
| <link href="https://unpkg.com/vis-timeline/styles/vis-timeline-graph2d.min.css" rel="stylesheet" type="text/css" /> | ||
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/i18next.min.js"></script> | ||
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/i18nextBrowserLanguageDetector.min.js"></script> | ||
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/i18nextXHRBackend.min.js"></script> | ||
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/particles.min.js"></script> | ||
| <script src="scripts.js"></script> | ||
| </body> | ||
| </html> |
Oops, something went wrong.