Our goal is to create a children's game which helps to learn the Amharic language as an open source project. This project was started at the #swihack hackathon. The challenge description and background to this can be found at our project page.
We are running this code just using a local web server, i.e.:
$ npm i
$ python -m http.server
Sample commands to be used while playing with it in the browser
setInterval(() => {words.children.level1.children.level2.children.level3.children.arrow2.rotate(45)}, 400)
15
words.children.level1.children.level2.children.level3.children.arrow1.visible = false
false
For a basic intro to the Amharic Alphabet, visit Wikipedia and WikiHow.
Design and technical aspects we are paying special attention to include:
- Target audience (age range of the audience, where in the world are we focusing on)
- Internet bandwidth, wide device and browser compatibility.
- Accessibility (Colours, Sounds, use of assistive technology)
- Ability to easily embed interactive product into online media.
We have looked into some existing language learning and children's games, to get a sense of the market and success criteria for such a project.
Name | What works | What it doesn't have |
---|---|---|
Duolingo | Memorable/cute owl (you can collect outfits), Wide variety of languages, User can select points and unlock features, Different levels, Ability to share and have friends, Leaderboards | Interactive aspects/ Drag and Drop, Too complex for young children. ( Too many features), Drag and Drop, Not exposed to real voices/ real conversations |
Talking ABC... | Unique clay models, each letter of the alphabet has a talking clay animal related to it. Simplistic design, but colourful and eye-catching. | No touch/drag interactions with the actual letters. Not easy to create clay models for every alphabet |
Anton | Simple interface, Cute graphics, allows user to draw out the letters | ... |
AmharicFidelTracing | Simple and easy to use, provides the ability to change icon | Colours are not attractive, graphics are not accessible |
ABC Xenegugeli | Beautiful graphics, animations and sounds. Easy to use animated interface for drawing letters. Translated into several languages. Cross-media. | Linear game play. Expensive. Only younger players would be motivated to keep playing. |
We have started working on a spreadsheet, based on a Wikipedia table, to map the letters and create a data model around the game's mechanisms. The version we are editing is currently here: https://ethercalc.org/=404fkrhfbv and in the GitHub data
folder.
Here are some related data resources that we have looked at:
- Old Newspapers at Kaggle includes several in Amharic
- A-Z Handwritten Alphabets at Kaggle (see example app)
- Ethiopia Data Portal
- Amharic Keyboard
- Wikimedia Common Strokes
- Refugee Phrasebook
- OpenWords
Starting the project off with trying to spell our names.
T-1h: focus time
[ DEMO SITE ]
We are currently using the Paper.js library to create animations and interactivity around the game concept. And we're creating a basic web site around it using Tachyons for a responsive layout.
Our process captured in a few tweets:
- Learning to write the old fashioned way https://twitter.com/loleg/status/1230808396380635137/photo/1
- Fueling the fires of cultural debate on social media https://twitter.com/s1mnhao3IfydQfp/status/1231169134165143556
- Connecting to volunteer programmers around the world https://twitter.com/bk_conazole/status/1230867559597121540
- Hack hack hack hack hack...stop! https://twitter.com/nigigebi/status/1230862935901245443
- Protype meets children https://twitter.com/nigigebi/status/1231249541334212608
The challenge presentation along with some of the illustration and typography work that it comes with can be seen on YouTube, and our final presentation is here.
If we end up making something reasonably playable, we would like to try to publish it somewhere like itch.io
Things we would have liked to, but haven't (yet) ended up using include:
- Character recognition: charec, @gugray, @adityajn105, tensorflow.js ..
- Game frameworks: Phaser, Melon, Kontra ..
- Reactive frontend: Vue.js, React, ..
Please visit our GitHub issues if you would like to contribute.