animation | bildirgec.org

CSS3 ve HTML5 ile artık web sitelerimiz daha renkli ve daha interaktif bir şekle giriyor. Yeni özellikler sayesinde hem görsel açıdan tatmin edici çalışmalar yapılırken hem de herhangi bir eklentiye gereksinim kalmıyor. Aşağıdaki benzersiz HTML5 ve CSS3 uygulamalarının nasıl yapıldığını detaylı olarak öğrenebilir ve benzer çalışmalarda bulunabilirsiniz. İlgi Çekici css3 ve html5 Uygulamaları;

Animated 404 Page
(Animasyonlu 404 Sayfası)

jQuery de kullanılarak yapılan bu animasyon uygulaması ile 404 sayfalarını renklendirebilir ve hareketli animasyonları sayfalarınıza taşıyabilirsiniz. Roketten farklı olarak farklı grafikleri kullanarak animasyonlar yaratmanız mümkün.

Building a custom HTML5 video player with CSS3 and jQuery
(CSS3 ve jQuery kullanarak Özel HTML5 Video Oynatıcısı)

Html5'in getirdiği yeniliklerden biri olan video oynatıcısını tam olarak anlatan bu ders sayesinde HTML video oynatıcıları hakkında büyük bir bilgi sahibi olacaksınız. Yeni getirilen html5 video formatının tüm özelliklerini anlatan bu muhteşem uygulama ile siz de kendi HTML5 Video Oynatıcınızı yaratabilirsiniz.

CSS3 Tile Flip Animation Tutorial
(CSS3 Tile Flip Animasyon Eğitimi)

HTML5, henüz geliştirilme ve dağıtım aşamasında olsa, hatta birçok tarayıcı sürümü tarafından desteklenmemiş olsa da oldukça sevilen bir dil halini aldı. Klasik web yapısını tümüyle değiştiren bu farklı dil ile herhangi bir eklentiye gerek kalmadan tümüyle dinamik tasarımlar oluşturulabiliyor. Tamamen açık kaynak kodlu olduğu için aşağıdaki uygulamaları inceleyebilir ve siz de benzer çalışmalar yapabilirsiniz. Muhteşem HTML5 Efektleri;

Breathing Galaxies

Noise Field

Keylight

Aşağıda yer alan basit ama kullanışlı jQuery uygulamaları her web servisinde kullanılabilir. Basit arayüzlü ve kullanımlı olan aşağıdaki tasarımaları web siteniz ile uyumlu hale getirebilir ve ücretsiz olarak kullanabilirsiniz. işte muhteşem 5 jQuery uygulaması;

Image Blur - Demo

Image Blur, her web uygulamasında kullanılabilecek oldukça hoş bir jQuery uygulamasıdır. Resimlere ilginç bir bulanıklık efekti veren bu uygulama resmin üzerine gidildiğinde netleşmeye başlayarak eski haline dönüyor. Tam tersinin yapılması ve geliştirilmesi muhtemel bir uygulama.

SeaHorse - Demo

Seahorse gelişmiş bir form denetim uygulamasıdır. Bu muhteşem uygulama ile web sitenize yerleştireceğiniz tüm formları kontrol edebilirsiniz. En fazla kaç karakter yazılacağı, istediğiniz karakterleri engelleme, metin veya sadece sayı bulunması gibi seçenekleri etkileyebildiğiniz gibi herhangi ek işleme css kodlarına gerek formlardaki yazı renklerini anında değiştirmeniz mümkün. Ayrıca ip adresi, e-mail adresi kontrolü de yapabilmekte. Bu ve buna benzer bir çok denetime bu uygulama ile sahip olabilirsiniz.

Birçok web projesinde kullanabileceğiniz Panning Slideshow, jQuery ile yapılmış bir slayt uygulamasıdır. Özellikle farklı geçiş efektiyle dikkan çeken Panning Slideshow oldukça kullanışlı ve hoş görünüme sahip bir uygulama.

4 veya daha fazla fotoğraf kullanabildiğiniz Panning Slideshow fotoğraflar arası farklı geçiş efektini sunar. Sağa-Sola veya çapraz olarak ilerleyen bu uygulamayı birçok web projenizde ücretsiz olarak kullanabilirsiniz. Oldukça kolay kullanımı olan Panning Slideshow ile istediğiniz fotoğrafları web sayfanızda yayınlayabilir veya ürünlerinizi tanıtabileceğiniz farklı bir araç olarak kullanabilirsiz. Tüm bunları yaparken hiçbir eklenti olmaksızın kolaylıkla kullanabilirsiniz.

jQuery oldukça genişleyen bir kütüphane. Artık jQuery ve HTML5 sayesinde web sayfalarımızda flash ve benzeri eklentiler olmaksızın farklı efektler ve animasyonlar yaratabiliyoruz. Aşağıdaki jQuery efektlerini ve animasyonlarını sizde web sayfanızda yayınlayabileceğiniz gibi ücretsiz olarak indirebilir ve inceleyerek benzer çalışmalar yaratabilirsiniz. İşte muhteşem jQuery Efektleri ve Animasyonları

Canopy

Ball Pool

Starfield

CSS3 ile css ve web tasarımı birbirinden farklı birçok özellik kazandı. Her türlü yazı tipini web sayfalarında kullanabilme, css ile oluşturulan animasyonlar, şık buton tasarımları gibi birçok örnek bulunmakta. Bu örnek ve uyguları öğrenmek ve css3'ü tamamen tanımak için birçok uygulama ve makale bulunmakta. Fakat css3 tarayıcıların eski sürümşerinde çalışmıyor. Bunu dikkate alarak da web sayfanızı şekillendirmelisiniz. İşte birbirinden farklı css3 uygulamaları;

11 classic CSS Techniques Made Simple with CSS3 | Demo

Klasik css'den farklı olarak css3'teki farklılıkları açıklayan bu yazıyı css3'e geçen herkesin okuması gerek. Css3'teki animasyon, yazı tipi değişimi ve vurgusu, köşesiz blok yapımı gibi konularda içinde bulunan çok eğitici bir yazı.

Mock-Up Interface Using CSS3 Colour | Demo

Css3 ile transparan bloklar yapabileceğinizi gösteren çok hoş bir uygulama. İstediğimiz herhangi bir bölümü ya da sayfanın tümünü transparan hale getirmek mümkün.

Dijital artistler genelde photoshop ve painter tarzı programlar kullanırlar. Bunların yanında internet üzerinde online bir şekilde çizim yapıp bunları yayınlayanlar da var. Sadece profesyonellere değil herkese açık olan siteler de bulunmakta, bunlardan populer ve sosyal yapıda olanlarını merak ediyor musunuz? Hemen farenizi elinize alın ve içinizde bastırılmış vaziyette bulunan sanatsal yönünüzü dışa vurun!

http://www.ratemydrawings.com/

Üyelik üzerine kurulu ve oylama sistemiyle çizilen resimleri derecelendirme özelliğine sahip olan bu sitede çizim alanı olarak flash ve java kullanılmakta. Çok hızlı bir büyüme sürecinden sonra kendini iyice geliştiren bu sitede flash ile yapılan çizimlerin video kaydı tutulabilmekte, java ile çizilen resimlerin ise videosu alınamamaktadır. Flash çizimlerin çizgileri vektörel bir yapıda olduğu için java ile yapılanlara nazaran daha kırık gözükebilmektedir ama bu flash ile yapılan çizimlerin daha kötü olacağı anlamına gelmiyor. Sitede forum, topluluklar, çizim dersleri, aynı anda aynı tuval üzerinde çizim yapabilmemizi sağlayan drawchat bölümü ve deviantart tarzı kolleksiyonların oluşturulabildiği bölümler bulunmakta. Sık sık düzenlenen yarışmalarda grafik tablet hediye eden bu site aynı zamanda 22 dolara 35" x 23" ebatında posterlerin de satışını yapıyor.

Photoshop (*), her çeşit tasarımcı için önemli bir araçtır. o, tasarımın birçok çeşidinde ve daha başka bir dolu yerde kullanılıyor. hatta photoshopu animasyon yapımında da kullanabilirsiniz.
eğer normal photoshop derslerinden sıkıldıysanız ya da onlar size artık kolay geliyorsa (aslında bunlar çok daha kolay) bu bildiri tam size göre.

daha önce şurada da birkaç örneği bulunan gif formatında animasyonlar yapabilmeniz ya da kendi hareketli avatarınızı, imzanızı kolaylıkla yapabilmeniz için bu bildiride 24 adet ücretsiz photoshop dersine yer vereceğiz.

1 - hareket eden böcek animasyonu

2 - kar temalı çalışmalar için animasyon dersi