Iqra V4.4 beta

18 views
Skip to first unread message

Akif Eyler

unread,
Feb 19, 2022, 9:29:19 AM2/19/22
to oku...@googlegroups.com
Bugün bulacağınız Iqra beta sürümünde şu yenilikler var:
* Renkler daha tutarlı -- önemli yerler sarı
* iPhone'da gözlenen sorunların çoğu aşıldı
* Tarayıcı Türkçe ayarlı değilse İngilizce açılıyor. 
(Şimdilik ortadaki L tuşu ile iki dil arasında geçiş sağladım, ileride daha zengin bir menü olmasını planlıyorum)

Şu anda iki önemli eksiğimiz var:
* Sure menüsü Türkçe
* Finder ile senkronize değil

Abdurrahman kardeşimizin yaptığı Finder (Rehber) zaten üç dilde çalışıyordu, şimdi diğer sayfalar da çok-dilli olma yönünde gelişiyor. Kıymetli yorumlarınızı beklerim.

__Akif Eyler__

Iqra V4β2.png

Gürsu Gülcü

unread,
Feb 19, 2022, 4:44:43 PM2/19/22
to oku...@googlegroups.com
Iqra hakkında daha önce fikir üretmeye çalışmış biri olarak şöyle bir öneride bulunmak isterim: Iqra'nın tasarımıyla ilgili bazı kararlar daha önceden kesinleşimiş olabileceğinden, eserin müellifinin kesinleşmiş kısımlarla ilgili bir spesifikasyon/vizyon aktarması tartışmanın verimini arttırabilir. Yani Iqra'nın tasarımını yönlendiren kriterler varsa bunlar önceden belirtilirse olmayacak alternatifler üzerinde durmaktan kaçınılabilinir. Neticede doğal olarak Iqra herkes için herşey olamaz. Hatta alternatifler "şöyle mi olsun böyle mi" şeklinde senaryolar haline getirilerek yönlendirme yapılırsa, ayrıca hedef kullanıcı kitlesi kimlerdir (Arapça bilgisi, Kuran bilgisi, kullandığı cihaz v.s.) türü detaylar paylaşılırsa isabetli fikir üretmek biraz daha kolaylaşabilir. -Gürsu Gülcü

--
Bu iletiyi Google Grupları'ndaki "Okuyun -- Iqra" grubuna abone olduğunuz için aldınız.
Bu grubun aboneliğinden çıkmak ve bu gruptan artık e-posta almamak için okuyun5+u...@googlegroups.com adresine e-posta gönderin.
Bu tartışmayı web'de görüntülemek için https://groups.google.com/d/msgid/okuyun5/CAC5h89ygfiQpuvAtD4GAE0vcVdYM8nS3y1oZ1Jjyu1XgfKQ5Sw%40mail.gmail.com adresini ziyaret edin.

Akif Eyler

unread,
Feb 20, 2022, 5:52:12 AM2/20/22
to oku...@googlegroups.com
Gürsu Kardeşim, bu projenin 2018'de yayınladığım vizyonu bugün çok ilkel görünüyor:

Bu proje (Kuran'daki) kelime listesini görsel bir şekilde ortaya koymak için oluşturuldu. Projenin başlangıcında, birkaç örnek kelime elle hazırlandı. Projenin asıl zorluğu ise elle yapılan tüm bu işlemleri Kuran-ı Kerim'deki 4700 farklı kelime için otomatik olarak gerçekleştirmek.
4 Haziran 2018 — İstanbul

Seçilen Arapça kelimelerin köküne bağlı bu arama yöntemi Kuran dilini bilenler ya da öğrenmek isteyenler için tasarlandı.
https://okuyun.github.io/Kuran/guideM.html

Bu vizyonu yazdığımda Mucem sayfası şu durumdaydı:
Yukarıda "ilkel" derken aklımda bu sayfanın gelişimi vardı.

Iqra projesi bir Mucem uygulaması olmanın çok ötesine ulaştı, el-hamdu lillah. Yakından izleyenler iyi biliyor ki, önceden iyi düşünülmüş bir tasarım dokümanımız hiç olmadı. İyi ki olmadı, çünkü böyle bir doküman bize ancak ayak bağı olurdu. Rüzgarın estiği yöne gittik, ama rüzgarlar hep doğru yönden esti. Gayret bizden, tevfik (başarı) kesinlikle yukarıdan...

Sizlerden gelen fikirlerin hepsini değerlendirdim ve önemli bir kısmını uyguladım. Uygulamadığım fikirler ya sıraya girmiştir, ya da bugünkü bilgimle imkansız/zor görünmüştür. Kendi fikirlerim yeterli olsaydı böyle bir grup kurmaz ve her sürümü size duyurmazdım. 

Öte yandan, bu proje kopyalamaya ve geliştirmeye müsait bir açık kaynak uygulamasıdır:
GNU License below is also applicable to Iqra4
Copied using GNU License
Proje, bir ucundan tutup ileri götürecek programcılarını bekliyor...


On Sun, Feb 20, 2022 at 0:44

Gürsu Gülcü

unread,
Feb 20, 2022, 12:40:23 PM2/20/22
to oku...@googlegroups.com
Ben çok genel yazınca yine farklı bir boyuttan cevap aldım. Söylemek istediğim şey şu:
Eminim gruptaki herkes projeye katkı yapmak istiyordur. Yapmıyor/yapamıyorsa da mutlaka bir sebebi vardır.
Grup katkı yapıyor/yapacaksa benim bir önceki mesajım boş sözlerden ibarettir, lütfen okumadan silin.
Arzu edilen katılımı göremiyor isek belki yazdıklarım yol gösterir, belki de göstermez, herkes kendisi takdir etsin.

--
Bu iletiyi Google Grupları'ndaki "Okuyun -- Iqra" grubuna abone olduğunuz için aldınız.
Bu grubun aboneliğinden çıkmak ve bu gruptan artık e-posta almamak için okuyun5+u...@googlegroups.com adresine e-posta gönderin.

Akif Eyler

unread,
Feb 21, 2022, 11:58:37 PM2/21/22
to oku...@googlegroups.com
On Sun, Feb 20, 2022 at 8:40 PM Gürsu Gülcü 
Söylemek istediğim şey şu:
Eminim gruptaki herkes projeye katkı yapmak istiyordur. Yapmıyor/yapamıyorsa da mutlaka bir sebebi vardır.
Grup katkı yapıyor/yapacaksa benim bir önceki mesajım boş sözlerden ibarettir, lütfen okumadan silin.

Estağfirullah Gürsu Kardeşim, hiç "boş söz" olur mu! Çok yararlı yorumlar yapıyorsun, değerli katkılarını beklerim. Herkes katkı yapsın diye bir beklentim yok, sadece "projeye önemli katkınız olabilir" diyorum.

Sure menüsü de yapıldı, ama şu anda hâlâ beta sürümündeyiz, çünkü sonuçlanmamış konular var:

* Arapça desteğini ekleyen Abdurrahman'a teşekkür ederim, yapılan iş bir çift gözün teyidini bekler

* Renkler konusunda bir tek yorum geldi:
Bu şekilde hem okuması daha kolay olur diye düşünüyorum hem de daha profesyonel görünüyor. Pastel renklerde genel olarak fayda vardır.

* Dil seçimi iki yerden yapılıyor: 1) Giriş sayfasındaki sarı L butonu, 2) Finder'da meal seçimi. L butonu yerine ne olabilir?

* Finder yazılımında meal seçmekle dil değişiyor. Yeni modelde ise yazılım dili ile meal dili bağımsız ayarlanıyor. Bu iki modülün farklı davranması uygun mu?

__MAE
Iqra V4β4.png
Iqra Arapça.png

Gürsu Gülcü

unread,
Feb 22, 2022, 6:00:28 AM2/22/22
to oku...@googlegroups.com
Peki, nereden geldik, nereye gidiyoruz gibi felsefi soruları bir kenara bırakıp genelde yaptığım gibi ilk izlenimlerimi aktayarım:
- Genel olarak pastel renklerle daha ciddi durmuş, yalnız etkileşimde bulunacak bileşenlerin renkleriyle bağırmasında ve üzerine gidince hareketlenmesinde fayda görürüm (renk-büyüklük değişimi, hafif bir rotasyon v.b.). Tabi ben masaüstü kullanıcısıyım ve "hover event"ten bahsediyorum, tablette kısa bas-uzun bas gibi ayrımlar var, o tarafları kullanmadığım için pek yorum yapamayacağım.
- Özellikle "T" tercüme butonun sarısı arka plandaki mavinin tonlarını taşıdığı için bende "inaktif galiba" (grayed out) zannı yarattı. Basılacak her düğme ayrı ayrı renklerde değil aynı sarının tonlarında olsa iyi olur, aktif mi değil mi  tereddütünü gidermek için.
- "L" butonu ilk bakışta hiç bir şey ifade etmiyor. Web sitelerinde bazen bayrak koyuyorlar ama İngilizce için Britanya bayrağı mı Amerikan bayrağı mı kullanırsınız gibi sorulara sebep oluyor. Arapçada daha da problemli olabilir, Mısır mı, Suudi mi, birini koysanız diğerinin tepkisi ne olacak gibi. Yine de bir ikon bulmak gerek. Ayrıca ya tek tıkla istenilen dile geçiş yapmak gerek, öyle x mod Nr.of Langs türü bir parametrenin istenen değere ulaşmasına kadar kiliklemek yerine. Üstelik bu kilik sonucunda buton kesinlikle aynı yerde kalmalı ki bir daha bassın, ekranda her klik sonrasında "benim butonum nereye gitti" dedirtmek olmaz, Chrome'da tab'leri art arda kapatırken "kapat" butonunun hep aynı yerde kaldığı gibi, ki birçok kere zahmetsizce tıklayabilesiniz.

5-10 dakikada gözüme çarpanlar bunlar. Herkes bir 5 dakika kullanırsa kim bilir ne fikirler ortaya çıkar.


--
Bu iletiyi Google Grupları'ndaki "Okuyun -- Iqra" grubuna abone olduğunuz için aldınız.
Bu grubun aboneliğinden çıkmak ve bu gruptan artık e-posta almamak için okuyun5+u...@googlegroups.com adresine e-posta gönderin.

Akif Eyler

unread,
Feb 23, 2022, 12:30:41 AM2/23/22
to oku...@googlegroups.com
İşte katkı böyle olur, yarım saatte çoğunu kolayca uyguladım. Üstelik, bu yorumlar tasarımı daha iyi tanımlamaya yol açtı.

On Tue, Feb 22, 2022 at 2:00 PM Gürsu Gülcü 
- Genel olarak pastel renklerle daha ciddi durmuş, yalnız etkileşimde bulunacak bileşenlerin renkleriyle bağırmasında ve üzerine gidince hareketlenmesinde fayda görürüm (renk-büyüklük değişimi, hafif bir rotasyon v.b.). 
Sarı butonlarda hover uyguladım, panel içi butonlarda da kolayca yapabilirim
 
- Özellikle "T" tercüme butonun sarısı arka plandaki mavinin tonlarını taşıdığı için bende "inaktif galiba" (grayed out) zannı yarattı. Basılacak her düğme ayrı ayrı renklerde değil aynı sarının tonlarında olsa iyi olur, aktif mi değil mi  tereddütünü gidermek için.
Tasarım konusu olduğu için repoda özel cevap yazdım:
 
- "L" butonu ilk bakışta hiç bir şey ifade etmiyor. Web sitelerinde bazen bayrak koyuyorlar ama İngilizce için Britanya bayrağı mı Amerikan bayrağı mı kullanırsınız gibi sorulara sebep oluyor. Arapçada daha da problemli olabilir, Yine de bir ikon bulmak gerek.
Bayrak olmaz! Çünkü dil devletten üstündür, bayraklar değişir, dil aynı kalır.

Dil simgesinde tasarımcıların vardığı nokta A harfi:
https://competition.adesignaward.com/design.php?ID=22868
https://en.wikipedia.org/wiki/Language_Icon
A'yı zaten kullandığımız için sanırım L şimdilik kalabilir, sonunda ikisi de menü olacak

Aramızda konunun uzmanları var, profesyonel bir yorum iyi olurdu
 
- Ayrıca ya tek tıkla istenilen dile geçiş yapmak gerek. Üstelik bu kilik sonucunda buton kesinlikle aynı yerde kalmalı ki bir daha bassın, ekranda her klik sonrasında "benim butonum nereye gitti" dedirtmek olmaz,
Evet, sol üst köşeye sabitledim, çok daha güzel oldu

Bazı telefonlarda sure numarasını kapatıyor, buna da bir çare buluruz
 
5-10 dakikada gözüme çarpanlar bunlar. Herkes bir 5 dakika kullanırsa kim bilir ne fikirler ortaya çıkar.
Fikirler çok var ama yazıya sığmıyor :) 
 
__Akif Eyler__

Celalettin Penbe

unread,
Feb 27, 2022, 9:53:32 AM2/27/22
to oku...@googlegroups.com
İşte katkı böyle olur, yarım saatte çoğunu kolayca uyguladım. Üstelik, bu yorumlar tasarımı daha iyi tanımlamaya yol açtı.

Evet, maşaallah, gerçekten Gürsu hocamın katkıları ne kadar güzel oldu, uygulama küçük ama ehemmiyetli dokunuşlarla bence çok güzel bir yere geldi, albenisi ve uygulama alanı genişledi. Açıkçası kendi adıma son sorularınız ve geliştirmelerle ilgili cevap vermeyişimin sebebi bu konularla ilgili dişe dokunur fikirlerimin olmaması ve genel ifadeler ve bölük pörçük düşünceler yerine daha derli toplu iletmek istemem.
 
Öncelikle renkler pastel olunca bence de daha güzel durmuş. Daha güzel bir opsiyon olursa iletirim inşallah. Son web görünümünü mail içinden görmek için aşağıya ekran görüntüsünü koydum. Bu arada bazı ayet numaralarının mavi renkli olduğunu ve bunlara basınca benzer ayetleri gösterdiğini yeni fark ettim, sanırım bu özellik yardımda bulunmuyor veya ben atlamışım.

image.png

Nice to have: Yukarıdaki resimde görünmeyen en alttaki genişlik ayarlama çubuğunun webde çalışması çok zor, acaba onun yerine genel olarak kullanılan sayfa yanlarından boyut ayarlama kullanımı yapılabilir mi? Mesela şu örnek sayfada sizinki gibi 3 tane ayrı bölme var ve her bir bölmenin ayrım noktasına gelince fare çift başlı oka dönüşerek kolayca ilgili bölme daraltılıp genişletilebiliyor. Burada da bu şekilde bir uygulama olabilir, tabi mobilde çalışmaz sanırım sadece webde geçerli olur.

Dil simgesinde tasarımcıların vardığı nokta A harfi: 
A'yı zaten kullandığımız için sanırım L şimdilik kalabilir, sonunda ikisi de menü olacak
Aramızda konunun uzmanları var, profesyonel bir yorum iyi olurdu

Bence menü yerine bu şekilde düğme olarak kalması daha uygun gibi görünüyor. Ancak birkaç kişide denedim, ben söylemeden dili nereden değiştireceğini bilemedi, Google Translate'inkine benzer
Google_Translate_Icon.png

daha modern ve evrensel bir simge olabilir, mesela:
png-clipart-google-translate-speech-translation-language-google-blue-angle-thumbnail.png    512x512bb.jpg   a-ye.png   540-5404950_languages-clipart.png    Google-Translate-icon.png   lang.png    language.png

Ayrıca ana sayfaya dönmek için de bence A harfi yerine image.png gibi bir ev simgesi çok daha kullanışlı olacaktır, aynı şekilde denediğim kişiler A harfini maalesef ana sayfa olarak algılayamadı. Harfleri kullanmanızı anlıyorum ama son kullanıcı açısından simgeler daha anlaşılır geliyor (https://fonts.google.com/icons sayfasındaki simgeler kullanılabilir.)

Arapça çeviriyle ilgili kontrol için ilettiğim bir arkadaş gayet güzel olduğunu söyledi, yalnızca ana sayfadaki ilk pasajın son kısmıyla ilgili bir öneride bulundu (يمكنك البدء بأي طريقة تودها مما يلي) sesli yorum olduğu için onu da size mesajla iletirim inşallah.

Benim gözüme çarpanlarsa, çevirilerde parantez içindeki ifadelerin bulunmaması (Sayfa veya Sure:Ayet) ve (Arapça ya da meal), bir de en alttaki For expert use only kısmı. Ayrıca İngilizcede   düğmeleri çevrilmeden kalmış.

Rehber ve kılavuza gelince, bu kısım işin en zor kısmı gibi görünüyor. Açıkçası günlerdir dönüş yapmadığımın bir sebebi de bunun üzerinde kafa yoruyor olmamdı. Zira elinizdeki ürün ne kadar faydalı olsa da ancak onu tanıtabildiğiniz kadar makbul görüyor. İnsan ancak ilgisini çekiyorsa ve anlıyorsa duyuyor ve dinliyor. İster amatör ister uzman olsun kullanıcıların bir şekilde merakını celbedip konuyu anlamalarını, dolayısıyla dinlemelerini sağlamalıyız. Bunun için mevcut yardım sayfası ve videolar kullanılarak güzel ve ilgi çekici bir sunum hazırlanabilir. Bunun üzerinde çalışıyorum, kolaymış gibi görünüyor ama güzel, sade ve etkili bir çalışma için bazen 1-2 ay gerekebiliyor, inşallah bitirebilirsem size gönderirim.

Ondan sonrası kullanmaya geliyor ki bu da ikinci aşama. Burada geleneksel ve yazılı yardım metinlerinden çok interaktif bir zemin gerekiyor ki kullanıcı anında deneyebilsin ve uygulamaya dahil olsun (malumunuz yazılımda kullanılan öğrendiğiniz kodu anında uygulayabildiğiniz Codepen türü ortamlara benzer). Bunun için aklıma gelen 2 yöntem var:
1. Bir web sayfası üzerinden interaktif olarak kullanıcıyı yönlendirip uygulamayı sanal olarak kullandırmak. Google'ın yeni Pixel telefonları için bu şekilde bir sitesi var: https://partnerdash.google.com/apps/simulator/ Adım adım sizi telefona dokundurarak yönlendirip öğretiyor. Ancak bunun için ciddi bir yazılım bilgisi gerekiyor arka tarafta, maalesef otomatik yapabileceğim bir site bulamadım.
2. Web sayfasına ilk girildiğinde (ya da istek üzerine tekrar tetiklendiğinde) interaktif ipuçları balonlarıyla bir ilk kullanım rehberliği sunmak (interactive guide/product tour). Örnek olarak Helppier sayfasına bakılabilir. Profesyonel siteler abonelik usulü çalıştığı için yazmak daha iyi ama yine ciddi bir yazılım bilgisi gerekiyor, maalesef çok aramama rağmen ücretsiz bir çözüm bulamadım.

Belki ilerisi için değerlendirirsiniz, yeni fikirlere mülhem olur ya da yazılımcı olanlar yardımcı olabilir diye paylaşmak istedim.

selamlar..

Akif Eyler

unread,
Feb 27, 2022, 12:34:06 PM2/27/22
to oku...@googlegroups.com
Teşekkürler

On Sun, Feb 27, 2022  Celalettin Penbe 
Bu arada bazı ayet numaralarının mavi renkli olduğunu ve bunlara basınca benzer ayetleri gösterdiğini yeni fark ettim, sanırım bu özellik yardımda bulunmuyor veya ben atlamışım.
Benzer ayetleri bulmak yardım sayfasında var:

 
Mesela şu örnek sayfada sizinki gibi 3 tane ayrı bölme var ve her bir bölmenin ayrım noktasına gelince fare çift başlı oka dönüşerek kolayca ilgili bölme daraltılıp genişletilebiliyor. Burada da bu şekilde bir uygulama olabilir, tabi mobilde çalışmaz sanırım sadece webde geçerli olur.
Nasıl yapılacağını bilsem hemen yapardım :)
Bu örnek React kullandığı için bize yaramaz
(plain javascript örneği lazım)
 
 
Bence menü yerine bu şekilde düğme olarak kalması daha uygun gibi görünüyor. Ancak birkaç kişide denedim, ben söylemeden dili nereden değiştireceğini bilemedi, Google Translate'inkine benzer daha modern ve evrensel bir simge olabilir,
Modern simgeleri sevmedim, Dünya simgesi aynı işi görüyor
 
Ayrıca ana sayfaya dönmek için de bence A harfi yerine image.png gibi bir ev simgesi çok daha kullanışlı olacaktır, aynı şekilde denediğim kişiler A harfini maalesef ana sayfa olarak algılayamadı. 
Bunu hemen düzelttim -- böylece  A ve L harfleri yerine Ev ve Dünya simgeleri geçti

 
Arapça çeviriyle ilgili kontrol için ilettiğim bir arkadaş gayet güzel olduğunu söyledi, yalnızca ana sayfadaki ilk pasajın son kısmıyla ilgili bir öneride bulundu.
Ben de ilgili arkadaşa ilettim, kim olduğunu tahmin edersiniz

 
Benim gözüme çarpanlarsa, çevirilerde parantez içindeki ifadelerin bulunmaması (Sayfa veya Sure:Ayet) ve (Arapça ya da meal), bir de en alttaki For expert use only kısmı. Ayrıca İngilizcede   düğmeleri çevrilmeden kalmış.
Üç kısa cevap var:
* her ifade tercüme edilmez, ek açıklama her dilde gerekmiyor
* uzmanlar zaten İngilizce bilir, bilmeyenler oraya bakmasın
* Türkçe sayfaların linki başka dilde olsa ne fayda?
 

Bunun üzerinde çalışıyorum, kolaymış gibi görünüyor ama güzel, sade ve etkili bir çalışma için bazen 1-2 ay gerekebiliyor, inşallah bitirebilirsem size gönderirim.
Acelemiz yok, merakla beklerim

 
Belki ilerisi için değerlendirirsiniz, yeni fikirlere mülhem olur ya da yazılımcı olanlar yardımcı olabilir diye paylaşmak istedim.
Çok iyi yaptın ama Ramazan sonuna kadar yeni bir özellik eklemiyorum
(bunlara yıldız koydum, daha sonra bakayım inşaallah)

__MAE 

Akif Eyler

unread,
Mar 22, 2022, 4:06:00 AM3/22/22
to oku...@googlegroups.com
Başka bir şey ararken şu linkin yanlış olduğunu fark ettim
Benzer ayetleri bulmak yardım sayfasında var:
Bu linkler yeni değil, arşivde doğru olsun diye ekliyorum.

Github linklerinde önemli bir sadeleştirme yaptılar, artık "html" uzantısı gerekmiyor
(dosyanın adında html ya da md uzantıları var, link yazarken gerekli değil)

__MAE

Reply all
Reply to author
Forward
0 new messages