sky-kuran

byHakan Turk

**Rol:** Sen uzman bir Full-Stack Web Geliştiricisi ve UX/UI Tasarımcısısın. İslami eğitim ve ezber uygulamaları geliştirme konusunda tecrübelisin. **Görev:** Kullanıcının A'lâ Suresinden Nâs Suresine kadar olan sureleri kolayca ezberlemesini sağlayacak, interaktif, web tabanlı bir Kuran ezberleme uygulaması (HTML/CSS/JS veya React kullanarak) kodlamak. **Tasarım ve Arayüz (UI/UX):** * **Tema:** Geleneksel "Mushaf" teması. Arka planlar göz yormayan krem/parşömen renginde (#FDFBF7), yazılar okunaklı koyu kahverengi veya siyah olmalı. Arapça metinler için "Amiri", "Scheherazade" veya "Uthmani" gibi geleneksel fontlar kullanılmalı. * **Düzen:** Her ayet, sayfada ayrı bir blok/satır halinde alt alta sıralanmalı. Tasarım tamamen mobil uyumlu (responsive) olmalı. **Temel Özellikler:** 1. **Ayet İçeriği:** Her ayet bloğunda şunlar bulunmalı: * Arapça orijinal metin (Büyük ve okunaklı). * Türkçe okunuşu (Transliterasyon - alt kısımda daha küçük fontla). * Türkçe manası/meali (Diyanet veya benzeri güvenilir bir kaynak). 2. **İnteraktif Okuma:** Kullanıcı ekrandaki herhangi bir ayete dokunduğunda/tıkladığında sadece o ayetin okunuşu sesli olarak başlamalı. 3. **Çoklu Hafız Seçeneği:** Üst kısımda şık bir açılır menü (dropdown) olmalı. Kullanıcı buradan Ahmet el-Acemi, Mahir el-Muaykili, Mişari Raşid el-Afasi gibi farklı hafızları seçebilmeli. 4. **Senkronizasyon (Kalibrasyon) ve Takip:** * Ses ve metin tam senkronize çalışmalı. * Okunan ayet o an vurgulanmalı (highlight - arka planı hafifçe koyulaşmalı) ve okunan ayetin yanında kullanıcıyı yönlendiren hareketli bir ok (indicator) belirmelidir. Ayet bitince ok kaybolmalı veya sonraki ayete geçmelidir. 5. **Veri Kaynağı:** Tüm Arapça metinleri, mealleri ve hafızların ses dosyalarını statik olarak eklemek yerine ücretsiz ve stabil çalışan `api.alquran.cloud` (veya benzeri bir Kuran API'si) üzerinden çekmelisin. **Çıktı Formatı:** Bana öncelikle uygulamanın ana iskeletini (HTML), ardından Mushaf temasını yansıtan stil dosyasını (CSS) ve en son API entegrasyonunu, ses senkronizasyonunu ve ayet takibini yapacak JavaScript kodlarını eksiksiz, çalışır durumda ve açıklayıcı yorum satırlarıyla birlikte ver.

HomeProgressSurah
Home

Comments (0)

No comments yet. Be the first!

Surah design preview
Home: Browse Surahs
Surah: Read Verses
Surah: Select Reciter
Surah: Listen to Verse