This site is dedicated to the Circassian language and is created for two main purposes:
- to raise awareness about the challenges this language is currently facing, and
- to introduce an interactive alphabet as an alternative to the static pages available online.
These are native speakers that for different reasons stopped speaking the language and are looking for an online material to get re-engaged with it.
- As a user, I want to quickly get an overview of the material the site is offering.
- As a user, I want to understand how this site can help me to re-engage with the language and how exactly it can be used for this purpose.
The user did most likely land on the site by accident as this was not a result of an intentional search.
- As a user, I want easily understand the main purpose of the website.
-
Green is used on the site as it is the colour of the Circassian flag: #2d706c
-
Text: #704214
-
Background colour for container boxes: #f7d4bb
-
Background colour for pages: #FFF1E5
The purpose of the Hub page is to give an overview of the site's contents.
The About page is created in a newspaper style featuring the main challenges the Circassian language is currently facing.
This page introduces one of the standards used for the Circassian language - the Kabardian and lists the letters and word examples in both, Cyrillic and Latin, accompanied by their sounds.
Letters in Cyrillic starting with the same letter in Latin transcription can be highlighted via keyboard. Letters marked up as belonging to one group will change their size and text colour when a corresponding keyboard key is pressed.
On this page the user can listen to a poem read by two native speakers. They can also read the poem and record their voice.
The Contact page provides an option to connect with people concerned about the challenged the Circassian language is facing and share feedback and ideas on how to preserve it.
Please refer to TESTING.md file for:
- Validation of all languages
- PageSpeed Insights scores
- Manual Testing, Accessibility and Bugs
- HTML was used to provide structure for this project and highlight the semantic elements of tits content.
- CSS was used to style the HTML elements.
- JavaScript was used to add sounds to the site.
- GitHub is the hosting site used to store the code for the website.
- Git was used as a version control software to commit and push the code to the GitHub repository.
- Google Fonts was used to import fonts.
- GIMP was used to create favicon for the site.
- WEBP Converter used to convert images to webp format.
- Google Chrome Lighthouse was used during the testing of the website.
- Google Chrome Developer Tools was used during testing, debugging and making the website responsive.
- W3C HTML Validator was used to check for errors in the HTML code.
- W3C CSS Validator was used to check for errors in the CSS code.
- FabForm used for backend on the contact form.
- Balsamiq used to create wire frames.
- Am I Responsive used to generate site's appearances on different devices and to check its responsiveness on them.
- Father Drawing for the alphabet page.
The content on the About page is based on the sources below:
- Open Caucasus Media, Activists mark Circassian Language Day in Russia and Georgia
- Open Caucasus Media, Vulnerable and divided: the uncertain state of the Circassian language
- A story about how the Kabardian language is getting forgotten
- A Grammar of the Kabardian Language by J Colarusso
- adyghabza playlist: letters and poem recordings
- amaltus.com: some word recordings
- Kabardian Phrases: some word recordings
- Parts of the HTML and CSS was borrowed from the Code Institute's Love Running main page.
- Newspaper Style Design by Silke V was used on the About page.
- Mic Button Animation and Audio Recording Functionality on the Read and Record a Poem page were adapted from the Youtube tutorial by Tyler Potts.
Two features are planned for the site:
- an option to navigate through the letters groups starting with the same latin letter on the Alphabet page with the keyboard
- an interactive page with a poem in Kabardian that will allow to take user's voice input and compare it with the recording done by a native speaker; the result of this interaction will be a calculated score that will represent the pronunciation accuracy.
- style nav bar so that it is clear where you are - on which page
- add favicons for sises below:
<link rel="apple-touch-icon" sizes="180x180" href="assets/favicon/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="assets/favicon/favicon-32x32.png"> - add 404 page
- add animation to the hub: the logo text and the text in the circle will be switching to indicate that this is the same text
- create and add the remaining images to the alphabet letters
- replace special characters with their corresponding unicodes
WIP
https://cohenpr-xpf.github.io/XPF/conv_resources/info/kbd.html
https://cohenpr-xpf.github.io/XPF/Convert-to-IPA.html
A tool for transcribing orthographic text as IPA (International Phonetic Alphabet) incl Kabardian epitran
https://github.com/persephone-tools/persephone
https://stackoverflow.com/questions/68489707/ is-there-a-python-library-i-could-use-to-convert-audio-to-phonemes
https://stackoverflow.com/questions/30705028/convert-sound-to-list-of-phonemes-in-python
https://github.com/xinjli/allosaurus
https://github.com/crim-ca/speech_to_phonemes?tab=readme-ov-file
https://github.com/ASR-project/Multilingual-PR
https://github.com/AdolfVonKleist/Phonetisaurus
https://espeak.sourceforge.net/
https://github.com/topics/low-resource-languages?l=python
https://elpis.readthedocs.io/en/latest/
https://www.reddit.com/r/linguistics/comments/7xnq4o/text_to_speech_for_dying_language/
https://deepmind.google/discover/blog/wavenet-a-generative-model-for-raw-audio/
https://www.lti.cs.cmu.edu/research/dissertations/2023/xinjianl_phd_lti_2023.pdf
A SHORT GRAMMAR OF EAST CIRCASSIAN (KABARDIAN)
https://circassianworld.com/pdf/A_Grammar_of_East_Circassian_Kabardian.pdf
https://github.com/Adityapanther/Audio-Recorder-App-in-Vanilla-javascript
https://javascript.plainenglish.io/an-ultimate-guide-to-voice-recording-with-javascript-119e505780cd
https://github.com/vocaroo/simple-audio-recorder
https://www.youtube.com/watch?v=sbf6vQ8xym4
https://miguelvieira.io/projects/KVFUHZVl0AZQhlKy27nn/videos/zZn0l7JTLbW3Vysl6QCm
https://www.youtube.com/watch?v=B3wWIsNHPk4
https://github.com/markjivko/markjivko.github.io/blob/master/tutorials/B3wWIsNHPk4/index.html
https://www.youtube.com/watch?v=3OnMBtOyGkY
https://www.youtube.com/watch?v=sbf6vQ8xym4
https://www.youtube.com/watch?v=VwaR2VkvpzM
https://stackoverflow.com/questions/33947885/left-column-and-stacked-right-column-using-flexbox-css https://codepen.io/dloewen/pen/qOzogG
https://stackoverflow.com/questions/27368778/how-to-toggle-audio-play-pause-with-one-button-or-link
https://lingvoforum.net/index.php/topic,8655.100.html?PHPSESSID=7075c0dbcd46a3312d74c86e6de9a7cd