Sürekli yeni projeler üretiyor, çoğunlukla hızlı bir şekilde basit arayüzler hazırlıyorsanız elinizin altında bir ui library oluşturmuşsunuz veya hazır bir arayüz setini kullanıyor olabilirsiniz. İnternette onlarcasını bulabileceğiniz kitlerin hepsi farklı amaçlara hizmet eden farklı çözümler sunan kitler genelde.

Çok basit bir örnek senaryo vereceğim, php tabanlı bir proje hazırlıyorsunuz, on yüzünü yazdınız ve implemente ettiniz. Sırada bir yönetim paneli hazırlamak var yazdığını koda ve veritabanına. Bunun için çok farklı yollar izledim yıllardır, son birkaç yıldır artık oturttuğum bir html4, less/css altyapım var. Basit bir MVC ile phptal ile view'lar phptal templateleri olarak buluyor ve less'leri derleyerek sade bir arayüzde kullanıyorum herşeyi.

Ama twitter bootstrap fikirlerimi biraz değiştirmeye başladı. View'larima çok fazla dökünmadan sadece html çıktılarımı biraz oynayarak twitter bootstrap'i projelerimden birine çok pratikçe entegre etmeyi başardım ve her geçen gün isimi daha kolaylaştırdığını görüyorum.

Güzel yani twitter tarafından geliştirilen bir arayüz kiti, daha da güzel yani açık kaynak kodlu ve birçok kişinin geliştirilmesine katkıda bulunduğu bir proje. Dolayısıyla crossbrowser problemleri çok fazla yok. Hatta eğer arayüzünüzü doğru tasarlarsanız responsive bir arayüzü de çok kafa yormadan sağlayabiliyorsunuz. http://twitter.github.com/bootstrap/scaffolding.html

Neredeyse bütün arayüz elementlerini düşünmüşler. Dolayısıyla bir web uygulaması için birçok hammal is yükünü üstünüzden alıyor. http://twitter.github.com/bootstrap/components.html

Neyse, proje sayfasından örnek uygulamaları, jquery geliştirmelerini ve github deposuna ulaşacağınız linki bulabilisiniz.

http://twitter.github.com/bootstrap/

Açık kaynak kodlu yazılımların çoğalıyor olduğunu görmek çok güzel, hem de bir çok enterprise uygulamanın olduğu, ülkenin mevzuati gibi lokal bağlılığı olan bir uygulama geliştirmek çok kolay değil. Şimdi size açık kaynak kodlu, php tabanlı bir muhasebe uygulamasından bahsedeceğim.

Brika. gün önce aldığım big mesajda projenin geliştiricisi Mustafa Tanriverdi, bu yazılımdan bahsetti. Hızlıca inceleme fırsatım oldu ve uygulamanın arayüzü gayet özenli bir şekilde sade şekilde hazırlanmış olması, klasik, sıkıcı muhasebe yazılımlarının arayüzlerine benzememesi dikkatimi çekti.

Su an fonksiyonalite olarak daha geliştirilmeye ihtiyacı olduğunu düşünüyorum, muhasebeden çok anlamasam da babamın ve ablamin mali müşavir olması bu konudaki yazılımların nasıl çalıştıklarını, ne gibi eksikleri olduğunu ve sektörde özelleştirilebilir uygulamalara çok büyük ihtiyaç olduğunu biliyorum. Dolayısıyla açık kaynak kodlu bir projenin bu potansiyelde ortaya çıkacağını söyleyebilirim.

Projenin daha çok geliştirici gücüne ihtiyacı var. Eğer ilginizi çeken bir alan ise, yardım etmek için proje sayfasındaki iletişim sayfasından iletişime geçebilirsiniz.

Proje sayfasi: http://tilpark.com/w/tilpark-muhasebe/

"Yil 20XX olmuş hala IE ile uğraşıyoruz" diyeceğiz herhalde yıllar sonra da. Bu süreçte ie'ye tekmeyle de olsa html5'i en azından etiketleri tanıması için en basit çözüm olarak iki şey yapmanız gerekiyor.

Birincisi IE'nin dom ağacında html5 etiketlerine ait hiçbir initialization yok. Bunu tetiklemek için kullandığınız her html5 etiketi için en az bir tane element üretmeniz yetiyor. Sonrasında IE dökümandaki tüm elementleri dom ağacınızda tanımaya başlıyor. Bunun için:

<script type="text/javascript">
	elements = "article footer header nav sidebar section".split(' ');
	for (i in elements) { document.createElement(elements[i]); }
</script>

Tamam etiketler tanınır hale geldi ama daha büyük problem ise IE görsel olarak bu etiketlerle ne yapacağını bilemediği için default stillerini uyguluyor. Anlam veremeyeceğiniz marginler, değişik element türleri olarak bütün etiketler birbirine girmiş oluyor arayüzde. CSS ile tüm html5 etiketlerini blok element ayarlayıp basitçe resetlemek için:

section, header, nav, footer, article {
    display: block;
    padding: 0;
    margin: 0;
}

yapabilirsiniz. Bu sayede IEnin eski sürümleri 6,7,8 (emin değilim belki 9 da) html5i bir parça olsun tanır ve insan gibi gösterir hale gelebiliyor. Ama unutmayın daha birçok sorunu düzeltmeye çalışmak uğraşmak zorunda kalabilirsiniz.

Less dosyalarıyla çalışıyorsanız ve eğer arayüz geliştiriyorsanız yazdığınız kodu tarayıcıda anlık olarak görmek isteyeceksiniz. Less dosyalarını kaydettiğiniz gibi derleyen aşağıdaki araçlarla hangi platformda çalışıyor olursanız olun otomatik olarak derletebilirsiniz.

Less derleyicilerini toparladığım ufak bir yazı hazırladım: http://mfyz.com/dokuman/127/less-dosyalarinizi-anlik-csse-cevirin

Şu an kullandığımız bilgisayarların ilk prototiplerinden beri insanoğluyla etkileşimini sağlayan araçlar, kontrolleri oldu ilk kontrol tabi ki klavye, numpad gibi düğmeli cihazlardı. 90’larda Apple’ın bilgisayar faresini üretmesiyle daha hassas etkileşimi sağlar olduk. Hâlâ da klavye ve fare, en güçlü iki kontrol olarak hayatımızda. Bir yandan her gün taşıdığımız ve bilgisayar kadar etkileşimde olduğumuz mobil cihazların minimal olma zorunluluğu nedeniyle çok farklı kontrol denemelerine şahit olduk cep telefonlarında. Tekerlekler, navigasyon topları, dokunmatik butonlar ve nihayetinde dokunabilir ekranlar…



Elektronik cihazlarlar ile etkileşimi sağlayan kontrollerin gelişimini destekleyen en büyük şey bence oyun endüstrisi oldu. Hâlâ da oyun endüstrisi bu alana ciddi katkılar yapıyor. Aynen uzay araştırmaları veya savaşların araba, uçak üretimine katkısı gibi. Oyun endüstrisinin katkısının bu kadar büyük olmasının nedeni ise oyunların her geçen gün daha gercekçi bir deneyim sunmaya calışmaları. Bunu zaten yazılımsal olarak uç noktalara götürmeyi başardı oyun sektörü. Şu an gerçeklikten ayırmakta zorlanacağınız kalitede oyun grafikleri görebiliyoruz hemen hemen her oyunda. Bu gerçekliğe yakınlaşma arzusu tabi ki insan vücudunun yaptığı fiziksel hareketleri dijital ortamda tanımlayabilme üzerine geliştirilen teknolojik cihazların üretimini tetikledi. Bunlar, eğer bir kontrol varsa fiziksel dünyaya tepki veriyor, hareket yönünü, şiddetini, doğrultusunu, ivmesini gibi her detayı büyük bir hassasiyetle yakalar hale getirdi şu anki oyun kontrollerini.

Bu gelişimin iş dünyasına yansıması bence çok olumlu. Çünkü bu uyarlamayı uzun süre oyun konsolları - bilgisayar ayrımı şeklinde gördük ve bu uyarlamayı yakalayamadı iş dünyasına hizmet veren teknoloji şirketleri. Mobil cihazlar ise kullanım amaçlarından dolayı ne oyun endüstrisiyle ne de gerçek dünyayı kopyalama eğiliminde idi.

Apple iPhone’u çıkardığında bu uyarlamaların bazılarını yaptı. Telefon olarak kullanılmaya başlanan bu elektronik cihaz, aslında gerçek dünyaya tepki veren en küçük cihazlardan biriydi ilk çıktığında. Apple’ın yaptığı bu uyarlama sadece farkedildi, uzun süre bu farklılığın avantajını yakalayamadı girişimciler. Bunun üstüne çok çalışma yapıldığını da zannetmiyorum ilk iPhone dünyada yayıldığı dönemde. Asıl ivmeyi iPad ile gördüğümü söyleyebilirim. Çünkü büyük bir ekran üstündeki dokunmatik etkileşim çok farklı bir deneyimdi tüm teknoloji tüketicileri için. Bunu ilk uyarlayan tabi ki uygulama geliştiren şirketler oldu, daha çok oyun şirketleri bunu yaptı ama zaten aynı cihaz üstünde olduğu için bir çok uygulamada da oyunlara benzer el hareketleri ile uygulamayı yönetme alışkanlıkları oturdu tüketicilerde. Sürüklemek, iki parmak ile büyütmek, birden fazla parmak kullanarak etkileşime girmek vs…

Şimdi ise web tarayıcıları üstünde bir çok site arayüzünü sadece görüntü olarak tablet cihazlarda uygun görünecek hale getirmiyor, aynı zamanda etikleşimlerini de bu cihazlara ve dokunabilirlik özelliklerine göre değiştiriyorlar.

Bir örnek vermek gerekirse, bir alış-veriş sitesi ürünleri listelerken sepete atmak için veya sepetteki ürünleri çıkartmak için ekle/sil gibi butonlar kullanıyor sitesinde. Tablet uyumlu sitesi ise aynı işi, ürünü kullanıcının parmaklarını kullanarak ürünü sürükleyerek sepet resmi olan bir kutuya bırakmasını isteyerek sunuyor bu özelliğini. Benzer şekile ürünü sepetten çıkarmak için de kullanıcının ürünü çöp kutusuna atmasını isteyerek yapıyor. Eskiden bu kadar radikal alışkanlıkları kullanıcıya sunmak intihar olarak sayılırdı, şimdi ise kullanıcı bu alışkanlıklara zaten sahip, bu alışkanlığa sahip olmasa bile çok kolay kabul edebiliyor çünkü uygulamanın kullanıcıdan istediği şey, kullanıcının normal hayatta yaptığı şeyler ve daha doğal. Çünkü gerçek dünyayı kopyalıyor. Aynen masanızın üstünde, ürün fotograflarını çöpe atmak veya bir kutuya toplayıp biriktirmek gibi düşünün bu uyarlamayı.

Daha basit bir örnek ise, bir resim galerisinde ileri/geri butonlarına basarak bir önceki veya bir sonraki resmi görüntüleyen bir site, artık resmin üstünde parmakları kaydırma hareketini algılayıp buna göre tepki veren siteler olarak yeniden tasarlanıyorlar.

Evet çok fazla örnek yok bunu kolaylıkla farkedebileceğiniz ancak şu an web sitelerindeki kullanıcı deneyimi trendi bu yöne doğru gidiyor.

Son kullanıcıya yakın örnekler bu gelişimi hissetmek için doğru örnekler olmayabilir. Fakat çevremde çok fazla kurumsal dünyada bu uygulamaları geliştiren veya bu tarz uygulamaları geliştirmek için büyük bütçelerle projelendirmeye calışan büyük kurumsal markalar var.

Biraz daha ilerisine bakmaya calışırsak, şu an Microsoft’un oyun konsolu Xbox’un hiç bir kontrol olmadan oyundaki kontrolleri yapmanızı sağlaması bence vizyonel bir örnek. Xbox’un Kinect konsolunda oyunda eğer bir boksörü canlandırıyor ve bir dövüş içinde iseniz, karakterinizi gerçekten yumruk atarak, televizyonun karşısında fiziksel olarak eğilerek veya sağa sola kayarak kontrol ediyorsunuz. Ufak bir kamera aracılığı ile hareketleriniz 3 boyutlu dünyada yansılanıyor ve bunu oldukça başarılı bir şekilde yapıyor.

Kontrolsüz olmak zorunda değil, dokunmatik ekranlar da kontrolsüz bir ortam olarak görülebilir. Yani artık gördüğümüz şeylere dokunarak veya dokunmadan işaret ederek yönetiyoruz dijital dünyayı. Yani artık teknolojik aletleri bir aracı kontrol ile yönlendirmekten çok onların bizi anlamasını sağlıyoruz etkileşime girebilmek için.

Oldukça heyecan verici şeyler göreceğiz önümüzdeki yıllarda.