material design

Material Design Öne Çıkarılmış Menü Tasarımı

Vatanay Özbeyli 2 Yorum CSS3, HTML5, jQuery, Öne Çıkanlar

Web sitenize NTVspor veya Yerel Futbol‘da da kullanılan material design menü tasarımını eklemek ister misiniz? Özellikle mobil erişimlerde öne çıkarılmasını istediğiniz içerikleri listelemenize yardımcı olacak bu tasarımı hazırlamak tahmin ettiğinizden de basit.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku


10 Ücretsiz Material Design HTML Template

Vatanay Özbeyli Yorum yazın Listeler, Öne Çıkanlar

google-material-design2014 yılında duyurulan Material Design‘ın günden güne genişleyen kullanım kitlesi ile popülerliği günden güne daha da büyüyor. Android telefonlarımızdan gezdiğimiz web sitelerine kadar her yerde karşımıza çıkan bu tasarım trendini siz de web sitenizde kullanmak ister misiniz?

Merak etmeyin bu iş artık eskisi kadar zor değil. Aşina olduğumuz onlarca web tasarım kütüphanesi artık Material Design skinleriyle birlikte geliyor.

Sizler için en iyi ve ücretsiz 10 Material Design kütüphanesini seçtik.
(daha&helliip;)

Devamını Oku

Sayfalar: 1 2 3 4 5 6 7 8 9 10

Google Material Design Menu #2

Vatanay Özbeyli 1 Yorum CSS3, HTML5, jQuery

google-material-design-menu2Google‘ın tasarım devrimi üzerine konuşmaya devam ediyoruz. Material Design’ın günden güne web tarafına uyarlanan örnekleri bizim makalelerimizde de yerini buluyor. Daha önce buradaki makalemizde şık bir Material Design menü örneği hazırlamıştık.

Şimdi de ekranın büyük bir kısmını kaplayan, daha büyük yapıdaki bir başka menü tasarımı konu edeceğiz. HTML5, CSS3 ve jQuery desteğiyle hazırlayacağımız bu tasarım soğuk renklerden oluşuyor.

Bu makalemizde üzerine tıklandığında büyük ölçülerde açılan ve içeriği aksi yöne ittiren şık bir menü tasarımı hazırlayacağız. İkinci Material Design menü örneğiyle sizlerleyiz!

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

Material Design Iconları

Vatanay Özbeyli 2 Yorum Diğer Konular & İpuçları

google-material-designMaterial Design ile birlikte kullanılan iconlar “Material Design Iconic Font” isimli proje altında bir araya getirildi. Toplamda 744 adet icon vektörel formatta, web tasarımında kullanabileceğiniz şekilde sizleri beklemekte. Diğer popüler icon setleri Glyphicon ve Font Awesome’dan farklı bir ruha sahip bu icon tasarımları günden güne daha da popülerleşecek gibi.

Sergey Kupletsky tarafından hazırlanan bu icon setini ücretsiz bir şekilde kullanabilirsiniz.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

Bootstrap Material Design

Vatanay Özbeyli 2 Yorum Bootstrap, İlham Verenler

bootstrap-materialdesignGoogle’ın yeni nesil kullanıcı dostu tasarım prensipleri ile Twitter’ın CSS kütüphanesini bir arada kullanmaya ne dersiniz?

Material Design‘ı mobil ortamda yeni yeni görmeye başlamışken web tarafında işler daha hızlı ilerliyor. Web geliştiricileri günden güne yeni Material Design elemanları paylaşırken şimdi de Bootstrap tarafında hareketlenmeler yaşanmaya başladı. FezVrasta, GitHub sayfasında paylaştığı bu web önyüzüyle son günlerde fazlasıyla popüler. (daha&helliip;)

Devamını Oku

Instagram, Material Design ile Tasarlansaydı?

Vatanay Özbeyli 4 Yorum İlham Verenler

google-material-designGoogle’ın ses getiren tasarım trendi Material Design ile hazırlanmış konsept tasarımlar günden güne kendini gösteriyor. Tasarımcılar özellikle günlük hayatta bol bol kullandığımız uygulamalara değinmekte.

Bugün de Emmanuel Pacamalan tarafından hazırlanmış Instagram konseptini sizlerle paylaşıyor olacağız.

Başlamadan önce Material Design ile ilgili daha fazla şey öğrenmek isterseniz;

(daha&helliip;)

Devamını Oku

Google Material Design Menu

Vatanay Özbeyli 3 Yorum CSS3

material-design-menuGoogle‘ın ses getiren tasarım trendi Material Design üzerine konuşmaya devam ediyoruz. Bugün Bennett Feely tarafından CSS ile hazırlanan menü örneğini sizlerle paylaşacağız.

Bennett’in örneği Material Design’ın estetik ve animatif tarafını başarılı bir şekilde yansıtmakta.

Web öğelerinin sadece spesifik kısımlarını CSS ile göstermemizi sağlayan clip-path tanımı da bu tasarımda faydalı bir şekilde kullanılmakta.

Eğer hazırsanız başlayalım.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

CSS ile Material Design’ın Ripple Efekti

Vatanay Özbeyli 13 Yorum CSS3, jQuery

google-material-designGoogle‘ın ses getiren tasarım trendi Material Design ile birlikte görmeye alıştığımız dalgalanma efektini CSS ve jQuery ile hazırlamak mümkün. Bu şık efekt kullanıcıya tıklama hissiyatını vermenin yeni yolu. Özellikle web sayfanızın mobil ekranlarında kullanmanızı önerebileceğimiz bu tasarımın örneğini aşağıdan görüntüleyebilirsiniz.

Bu dersimizde su dalgalanmasını andıran bir tıklama efekti hazırlayacağız.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku