Hergün yüzlerce sayfa geziyor, onlarca form dolduruyoruz. En azından günde birçok defa girdiğimiz e-posta adresimizden Facebook sayfamıza kadar bazen bu formları doldurmak can sıkıcı olabiliyor. Bir arayüzcü olarak da bu konularda birşeyler yapılabileceğime hep inanmış, hep yeni  şeyler denemişimdir. Bu konuda belki de yapılacaklar listesi tadında bir toparlama yapmak lazımdı. Buna göre birkaç satır başlığı şöyle oluşabilir:

• Kayıt formunda sadece 1 kez parola sormak da günü kurtarabilir. Form ne kadar kısa olursa, doldurmak için kullanıcının motivasyonu o kadar yüksek olacaktır. Sonuçta hiç tanımadığınız bir kişinin sorduğu soruları yanıtlamak sizin çok hoşunuza giden birşey olmasa gerek!
• Şehir ve ülke bilgisi istediğiniz alanları auto-suggest ile doldurabilirsiniz. Bu da formu doldururken zaman kazandıracaktır.
• Fatura adresini kayıt adresi ile otomatik olarak doldurabilirsiniz. Küçük bir düzenle linki ile kullanıcıya değiştirme alternatifi sunabilirsiniz.
• Newsletter vb. listelere kullanıcılarınızı otomatik eklemek daha sonraki ziyaretlerinin motivasyonunu düşürebilir. Ayrıc o formun güvenirliliğini ve sevecenliğini de yitirir. Bu tip seçimleri kullanıcının yapmasını bekleyin.
• Sadece belirlediği kullanıcı adı ve şifre yerine Facebook, Google vb. sistemler ile başka profilleriyle kullanıcının giriş yapmasını da sağlamak büyük zaman kazancıdır.

Kaynak: http://uxmovement.com/forms/innovative-techniques-to-simplify-sign-ups-and-logins

Flash ve Actionscript için performans düzenlemesi adına yaptığım araştırmalar sonucu bulduğum dokümanlardan aldığım notları orjinal halleri ile aşağıda paylaşıyorum. Bir çok detay var ama ince ince bu dokunuşları yapmak ve karşılığını görmek tatmin edici oluyor.

• This code sets framerate to 24 and should be written in document class
• [SWF(frameRate="24")]
• For simple shapes that are not interactive, use Shape objects. For interactive objects that don’t need a timeline, use Sprite objects.
• Use the getSize() method to benchmark code and determine the most efficient object for the task
• Set the reference to null, so that the garbage collector removes  the display object from memory
• Using vectors instead of bitmaps is good way to save memory. However, using vectors, especially in large numbers, dramatically increases the need for CPU or GPU resources. Using bitmaps is a good way to optimize rendering, because the runtime needs fewer processing resources to draw pixels on the screen than to render vector content
• When a filter is applied to a display object, the runtime creates two bitmaps in memory. These bitmaps are each the size of the display object. The first is created as a rasterized version of the display object, which in turn is used to produce a second bitmap with the filter applied.
• If the filter is not modified within 30 seconds, or if it is hidden or offscreen, the memory used by the non-filtered bitmap is freed.You may use loops more than 30 seconds.
• <param name=”hasPriority” value=”true” />
• This feature allows you to limit CPU usage by pausing and resuming the SWF file when content goes off and on the screen.
• Minimize the number of Timer objects and registered enterFrame handlers in your application.
• Use a single Timer object, and have operations triggered at multiples of the Timer object’s delay property interval
• In enterFrame event or Timer handlers, minimize the number of changes to the appearance of display objects that cause the screen to be redrawn
• To save CPU power, limit the use of tweening, which saves CPU processing, memory, and battery life.
• When working with the text property of the TextField class, use the appendText() method instead of the += operator. Using the appendText() method provides performance improvements.
• Use redraw regions to identify opportunities for optimization. (Right Click on swf than choose Redraw Regions) Remember that although some display objects are not shown, they still consume CPU cycles because they are still being rendered.
• To improve performance, set the visible property of the hidden running character to false or remove it from the display list altogether. You should also stop its timeline. These steps ensure that the display object is frozen and uses minimal CPU power.
• If possible, try not to place graphical content off-stage. Designers and developers commonly place elements off-stage to reuse assets during the lifetime of the application. Even if the off-stage elements are not shown onscreen and are not rendered, they still exist on the display list. The runtime continues to run internal tests on these elements to make sure that they are still off-stage and the user is not interacting with them.
• If your application includes animation, an adequate frame rate is at least 20 frames per second. Anything more than 30 frames per second is often unnecessary.
• If your application doesn’t include animation, a frame rate of 12 frames per second is probably sufficient.
• A good optimization can be made by using the bitmap caching feature. This feature caches a vector object, renders it as a bitmap internally, and uses that bitmap for rendering. The result can be a huge performance boost for rendering, but it can require a significant amount of memory. Use the bitmap caching feature for complex vector content, like complex gradients or text.
• However, if bitmap caching is enabled on a display object such as a movie clip that has its timeline playing, you get the opposite result. On each frame, the runtime must update the cached bitmap and then redraw it onscreen, which requires many CPU cycles. The bitmap caching feature is an advantage only when the cached bitmap can be generated once and then used without the need to update it.Changing the x and y properties of the object does not cause regeneration. However, any attempt to rotate it, scale it, or change its alpha value causes the runtime to regenerate the cached bitmap, and as a result, hurts performance.
• Avoid using filters on animated content, because it can cause performance problems.
• Use the bitmap caching feature and the opaqueBackground property to improve text rendering performance.
• GPU mode is set automatically when running content on mobile devices, for the best possible performance. Although wmode no longer must be set to gpu to get GPU rendering, setting wmode to opaque or transparent disables GPU acceleration.
• Smooth shapes to improve rendering performance.By using the Smooth tool in Flash Professional. Smoothing removes extra control points, reducing the final size of the SWF file and improving rendering performance.
• Starting with Flash Player 9.0.115.0 and AIR 1.0, the runtime can play AAC files (AAC Main, AAC LC, and SBR). A simple optimization can be made by using AAC files instead of mp3 files.The AAC format offers better quality and smaller file size than the mp3 format at an equivalent bitrate.
• To save memory, use the cacheAsBitmap property and activate it on each display object rather than on the container.Changing the alpha value forces the runtime to update the cached bitmap in memory whenever the alpha value is modified.

For more:
http://help.adobe.com/en_US/flash/cs/using/WSd60f23110762d6b883b18f10cb1fe1af6-7b1ba.html

Adobe Creative Suite serisinin 5.5 sürümünü duyurdu. Bazı ürünlerinde büyük yeniliklere giderken Flash Professional’ı da unutmamış. Aşağıda linkini verdiğim videoda yeniliklerden bahsedilmiş. Öne çıkan özellikleri ise şu şekilde:

• Yenilenen Flash Project paneli
• Sahne genişliği ayarı ile otomatik olarak stage content’i de genişletebilme
• Android ve Iphone için geliştirilmiş export settings
• Advanced Layer Composition (Cut Layer, Paste Layer vs.)
• Share Assets (Bir fladaki bir asset’i başka bir fla’da paylaşma ve bunları sync edebilme)
• Export as Bitmap (Movieclipleri bitmap olarak export edebilme – Performans adına yapılabilecek en iyi şeylerden birisi)

PES 2011 ve daha önceki versiyonlarında olduğu gibi bir sonraki versiyon çıkana kadar (genelde ekim ayında) o sene boyunca çeşitli takımlarla kupalar ve menajerlikler oynuyorum. Sezon başında  yeni bir menajerlik açtığımda herşey sorunsuz olabiliyor. Oynama sıklığım da işin üzerine eklenince takımın sezondaki performansından bağımsız bir performans oluşuyor. Fakat bir maçını izleyip de gaza geldikten sonra bir takımın menajerliğine başladığımda bazen içime sinmeyen durumlar oluşabiliyor. Aslında sezonun her aşamasında yeni bir menajerliğe başlandığında PES bana şöyle bir soru sorsa: “Takımın gerçek fikstür ve sonuçları, puan tablosu ve kadrosu ile mücadele eder misin?” Ben bu soruya hemen evet derim. Ben evet deyince PES hemen sunucularına bağlansa ve gerekli güncellemeleri yapsa. Ben de örneğin ligin 13. haftasında kendi liginde 15. sırada olan bu takımı o sezon için şampiyon yapmaya çalışsam daha gerçekçi olurdu.

Peki bu güncellemeler ne işe yarayacak?

• Sezon arasında vb. durumlarda kadro güncellemesi derdimiz kalkacak ortadan.
• Daha gerçekçi ve zor bir deneyim sağlayacak.
• Hatta bu senkronize edilmiş veriler ile yapılan maçları ve takım istatistiklerini kendi sitesinde yayınlarsa o sezon ligde kimin şampiyon olacağı veya kimin ligi nerde bitireceği de simule edilmiş olur.

Daha önceki yazılarda da altını çizmiştim tasarım dünyasında tipografi (typography) çok önemli bir konudur. Tasarım denince akla gelenlerden biridir ve web tasarımı için de artık günümüz tarayıcılarının geliştirilmesiyle gündeme gelmiştir. Web tasarımında typography kullanmak için sınırlarımız var elbette. Bu sınırlar tarayıcıların çizdiği sınırlar da olsa bazı yöntemler ile bu sınırları genişletebiliyoruz. Fakat bazen bu sınırlarda kalmamız gereken durumlar olabiliyor. Bu durumları özetlemek ve hangi durumda hani fontu kullanmak gerekir denildiğinde karşımıza şöyle bir liste geliyor:

• Text ağırlıklı bir site yapıyorsanız : “Serif” tipli fontlar kullanmalı ve 14px’den büyük 10px’ten küçük kullanmamalıyız.
• Başlıklarda zorunda kalmadıkça çok fazla italic, tamamı büyük harften oluşan veya tamamı küçük harten oluşan kombinasyonlardan kaçınmalıyız.
• Başlıklar için “Sans Serif” tipli fontlar kullanmalıyız ve gereksiz yere çok fazla büyük kullanmamalıyız.

Bu gibi konular için ise “Web Safe Fonts” dediğimiz windows veya mac ile gelen ve her bilgisayarda olan sistem fontlarını kullanabiliriz. Bu fontlar neler dersek eğer şöyle bir liste ile karşılaşırız:

• Serif
  • Bookman Old Style – web-safe for Windows 7
  • Cambria – web-safe for Windows Vista but not for Windows 9x/2K/XP
  • Constantia – web-safe for Windows Vista but not for Windows 9x/2K/XP
  • Times New Roman – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Georgia – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Garamond – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Palatino Linotype – this font is included in Windows 2000/XP
  • Book Antiqua – this font was bundled with Windows 98
• Sans Serif
  • Andale Mono – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Arial – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Arial Black – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Calibri – web-safe for Windows Vista but not for Windows 9x/2K/XP
  • Candara – web-safe for Windows Vista but not for Windows 9x/2K/XP
  • Century Gothic – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Charcoal – Web-safe for Windows 7
  • Corbel – web-safe for Windows Vista but not for Windows 9x/2K/XP
  • Impact – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Symbol
  • Tahoma – Web-safe for Windows 7
  • Trebuchet MS – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Verdana – web-safe for both Windows Vista and Windows 9x/2K/XP
  • Webdings

Kaynak: Introduction to Web Typography | CreativeFan.

Tasarım denince akla gelen birkaç önemli konu başlığından bir tanesi de şüphesiz fontlardır. Font dediğimiz nesne nedir diye kendimize sorduğumuzda birçok cevap alabileceğimiz kaynak mevcut.  Font nedir ve nasıl kullanılır diye kendimize sorduğumuzda ise alacağımız cevap typography olsa gerek. Günümüz web tasarım dünyasında ise geldiğimiz nokta bu tartışmalar tazeliğini devam ettirirken bir yeni tartışma daha eklenmiş durumda. Web Fontları!

Web fontları kullanımı aslında bundan kısa bir zaman önce sıklıkla kullanılmaya başlanmış bir yöntem. Bağlantı hızlarının ve tarayıcı teknolojilerinin hızla gelişmesi ile günümüzdeki tasarım trendlerinin de etkisiyle görsel gücü yüksek, zengin içerikli arayüzler tasarlamak da artık başlı başına bir iş haline gelmiş durumda. Bu durum için de tasarımcılar mevcut typography bilgileri ışığında farklı fontlar kullanmaya başlamış durumdalar. Bu fontların kullanımı arama motorları ve öncesinde imajlar (jpg, png) halinde yapılan çalışmayı siteye eklemek suretiyle gerçekleşiyordu. Ama artık geldiğimiz noktada arama motorlarının öneminden dolayı ve tarayıcıların yeni teknolojileri sayesinde alternatif yöntemlere kavuşmuş durumdayız. Bu yöntemler nedir diye sorduğumuzda ise şu vevapları alıyoruz:

1. @font-face kullanımı
2. Google Fonts Api
3. Font Stacks
4. cufon tarzı 3. parti uygulamalar

Kaynak: The Problem with Web Fonts | Codrops.

Web tasarımı günümüzün en sıcak konularından birisi. Bu konuda sektör standartları, tasarım akımları, yarışmalar vb. bir çok olay gerçekleşmekte. Bu olayların gölgesinde bir de web tasarım yaparken nelere dikkat etmek ve kaçınmak lazım sorusunun cevabı akıllara gelmekte.

Bu konu ile ilgili yazılanlardan özet çıkarmak gerekirse kaçınmamız gerekenler konusunda şöyle bir liste oluşmakta:

1. Pop-up pencereler
2. Arkaplan müzikleri
3. Büyük görsel ve video dosyaları
4. Gereksiz sorulardan oluşan anketler
5. Yatay scroll ile ilerlenen siteler
6. Okunurluğu çok kötü olan fotnlar
7. Sonu gelmeyen animasyonlar (sonsuz döngü)
8. Yanıp sönen yazılar
9. Çok uzun yazılar
10. Extra extra giriş sayfaları (dil seçimi, intro vb.)
11. Geri tuşuna basıp gelindiğinde session’ı düşen sayfalar
12. Çok fazla benzer kelime kullanımı
13. Yeni pencerede açılan kritik linkler

Kaynak: 15 Annoying Website Designs You Must Avoid.

Google her zaman bizi şaşırtmaya devam ediyor. Bazı yerel markaların reklamlara ne kadar çok para harcadıklarını, marka değerlerini yükseltmek adına neler yaşadıklarını gülümseyerek takip ediyorum. Tabi ki dünyadaki en önemli teknoloji şirketlerinden biri olan (bana göre en iyisi) Google yine bir konsept proje ile hem bize teknolojisinin ve kullanımının havasını atıyor hem de bir markanın değeri nasıl yükseltilir onu gösteriyor.

Marka değeri dediğimiz olay nedir diye sorduğumuzda bir çok cevap alabiliriz. Hatta bir çok bilimsel / sektörel yaklaşım da olabilir ama gözlemlediğim kadarıyla şunu söyleyebilirim ki kullanıcılarınızın sevgisini arttıracak, size bağımlı kılacak ve sizi bir başkasına anlatacak ne yaparsanız o derece markanız değerlenir.

Kaynak: Google ve Sanat: Google Art Project Google AdWords Sosyal Medya | Dijital Pazarlama AdresGezgini.

Flash Player son zamanlarda gelişimini yine sektörden aldığı geribildirimler ile heyecan verici bir biçimde devam ettiriyor. Son olarak eklenen özellikler ile günümüzde sıkça karşılaştığımız video içeren zengin uygulamalarda oldukça avantajlı konuma gelmekteyiz.

Video ve Flash bir araya geldiğinde en çok bahsedilen konu kaynak tüketimidir. Geçtiğimiz dönemlerde wmode olarak eklenen gpu ile ekran kartı üzerinden izleyebileceğimiz video ve/veya 3D uygulamalar ile performans olarak başka bir boyuta geçebiliyorduk. Yine yeni eklenen StageVideo ile performans konusunda büyük aşama kaydedilmiş.

Flash Player 10.2 RC olarak inidirip deneyebileceğiniz bu player versiyonuna ait gelişmeleri de Adobe MAX 2010′da sıkça takip etmiştik.

Yeni Flash Player ile karşımıza çıkan özellikler ise ana başlıklarda şu şekilde sıralanmakta:

• Stage Video hardware acceleration
• Internet Explorer 9 hardware accelerated rendering support
• Native custom mouse cursor
• Support for full screen mode with multiple monitors

Kaynak: Adobe Labs – Adobe Flash Player 10.2.

Tasarımcı olmak ya da tasarmcı doğmak hep tartışılan konulardır. Ben tasarımcı olunduğundan çok tasarımcı doğulduğuna inananlardanım. Herkesin belli açılardan bir bakışı ve tasarım yetisi vardır. Bu bakış açısı doğuştan gelen yeteneklere göre sizi sıralandırır. Bir de işin eğitimini aldığınızda sizi diğerlerinden sıyırır. İşte diğerlerinden sıyrılma konusunda “Fight Club” metodu olarak adlandırılan bir yaklaşımdan haberdar olmalıyız.

Fight Club filmin izleyenler bilir ki o filmde aslında saplantılarından çıkmak için kendi dünyasında yarattığı bir karakter ile yaşayan bir adam vardır. İşte bu filmdeki olaylar da bu bakış açısından hareketle gelişmekte. Bu filmdeki bu düşünceyi bir tasarımcıya uyguladığımızda ise çok farklı bir yaklaşım doğuyor.

Fight Club metoduna göre kendiniz değerlendirdiğinizde kısaca şu tip başlıklar ortaya çıkıyor:

• Siz özgün bir tasarımcı değilsiniz! Mutlaka yaptığınızı bir başkası daha önce yapmıştır.
• Sizin tasarımı nasıl ve nerde yaptığınızı kimse önemsemez, tasarım olarak ne yaptığınız önemlidir.
• Kimse sizi tasarımcı olarak sizin hayal ettiğiniz kadar önemsemez.
• Hiç bir tasarımı elinizden çıkardıktan sonra artık siz yönetemezsiniz.
• Bir gün gelecek ve tasarım yetileriniz, stiliniz ve yetkinlikleriniz ölecektir.

Kaynak: The Fight Club Method to Accelerating Your Design Career Tenfold | Onextrapixel – Showcasing Web Treats Without A Hitch.

Images from the film Fight Club, property of 20th Century Fox, taken from http://movie-memorabilia-emporium.blogspot.com/2010/03/fight-club-1999-promotional-photos-high.html