1) There are a couple of features I want on the Quran reader website, the first is using Hyperdisken-Popcorn.js to create a clickable word for word Quran, when user click on the word the audio would play the word.
Check the website below for a demo of how it works.
How it work:

<div style="background-color: transparent; "
</div><div style="background-color: transparent; "The JavaScript automatically creates the timing for each word based on the sentence timing but some times the timing is not always correct, so I suggest a way to quickly and easily change the timing that is generated in the html (just need to change the milliseconds) and allow users to report any problem with the site or the audio timing etc. below is an image from universal subtitle, this is a tool they created to add timing s to subtitles this can be used with the word for word timing for the site. they also have the code avalable on github</div><div style="background-color: transparent; "</div><div style="background-color: transparent; "


By have the essential tools and buttons in the header and footer and place the rest in the collapsible div this would allow uses to concentrate just on the text and be able still to access the site features.  
Another feature the site should have it the ability to filter surah’s using []it would allow users to quickly find the surah they want by number or by name.  

<div style="background-color: transparent; "[]</div>

Another good feature would be allow users to select groups of words or ayahs and be able to repeat it, I know the site has this feature already but just need little tweaks to better support mobile devices.

2) Currently the problem with global Quran it displays double text when you click on more than one option it will make it difficult for users to select which type of layout they want, one solution is display one text but with different styles based on the options and also simple buttons like allahsquran website where users can select to display the Arabic, translation word for word and tajweed.

<div style="background-color: transparent;"
</div><div style="background-color: transparent;"

check out []

3) Audio tafseer of the Quran - I have on my website a really good English audio -tafseer []what we can do is using the same word for word timing feature we can highlight certain word related to the audio so users have a visual clue what the tafseer is talking about. Also when playing the Quran audio the word would highlight whilst it plays the audio.   


blog comments powered by Disqus