13 Materyal Tasarımı İlham Kaynağı


2014 yılında Google, Materyal Tasarımı dilini yayınladığını duyurdu. Orijinal hedefleri, Android cihazlar için uygulama tasarımıyla ilgili sorunları çözmekti. Argüman, düz tasarımın daha küçük ekranlara iyi bir şekilde çevrilmediğiydi. Net görsel ipuçlarından yoksun bir tasarımın, mobil kullanıcıların harekete geçme becerisini engellediğini hissettiler.

Google'ın tasarımdan sorumlu başkan yardımcısı Matias Duarte şunları söyledi:

“Gerçek kağıttan farklı olarak, dijital materyalimiz akıllıca genişleyebilir ve reform yapabilir. Malzemenin fiziksel yüzeyleri ve kenarları vardır. Dikişler ve gölgeler, dokunabilecekleriniz hakkında anlam verir.”

Ve temel olarak şu anda malzeme tasarımı budur: tasarım öğelerini dokunulabilir hale getirmenin bir yolu.

Google, yeni tasarım dilini ve yönergelerini yayınlayarak, Android uygulaması kullanıcıları için UX sorunlarını ve kafa karışıklığını çözmeyi umuyordu. İki yıl sonra, tasarım dilleri mobil uygulamalar alanını aştı ve artık web tasarımında düzenli olarak kullanılan bir ilke haline geldi.

13 Materyal Tasarımı İlham Kaynağı

Yaratıcıları olarak, Google'ın kendi mülkleri, muhtemelen mevcut malzeme tasarımının en iyi örnekleri olacaktır. Bununla birlikte, şaşırtıcı sayıda ilham ve vitrin web sitesi konuya adanmıştır. Bu, mevcut favorilerimizin bir koleksiyonudur:

1. Behance

Behance
Tasarım ilhamını sifonlamak için mükemmel bir web sitesi örneği olan Behance, referans gösterebileceğiniz sayısız örnek panosuna sahiptir. Behance ayrıca, ızgaradan ustaca öne çıkan kutular, doğrudan dikkat çekmeye yardımcı olmak için gölgeli arka planlar ve tıklanabilir eylemler için net göstergeler ile malzeme tasarımını kendi başına yeterince iyi kullanır.

2. Kod Kalemi

kod kalemi
“Web'in ön uç tarafı için oyun alanı” olarak adlandırılan CodePen, malzeme tasarımı söz konusu olduğunda bir geliştiricinin altın madenidir. Sadece bazı gerçekten harika malzeme tasarımı örneklerini çalışırken görmekle kalmıyor, aynı zamanda geliştiricilerin bu tasarımı veya animasyonu oluşturmak için kullandığı temel CSS, HTML ve JavaScript'i de görebilirsiniz.

3. Top sürme

top sürme
Eğer aşina değilseniz, Dribble tasarımcılar, geliştiriciler, sanatçılar ve diğer görsel olarak yaratıcı bireyler için bir sosyal ağdır. Sitelerinde "materyal tasarımı" araması, hem web hem de uygulama tasarımında malzeme tasarımının gerçekte ne kadar yaygın olduğunu göstermeye gider. Burada bir simge kadar basit bir şeyden eksiksiz bir web sitesi tasarımına kadar ilham alabilirsiniz.

4. Google Design'ın Materyal Tasarım Ödülleri

Google Tasarım Ödülleri
Google, Material Design'ı piyasaya sürmesinden bir yıl sonra, sınıfının en iyisi altı uygulamayı ilk Materyal Tasarım Ödülleri ile onurlandırdı. Bu listede yer alan 12 onursal sözle birlikte birçok web sitesini tanıyacaksınız. Kullanmıyorsanız veya şu anda uygulamalarını kullanmıyorsanız, onlara hemen bir göz atmanızı şiddetle tavsiye ederiz. Google, birini yenilikçi olarak etiketlemek için zaman ayırırsa, bakmaya değer.

İşte 2015'in kazananlarından öne çıkan bir makara:

5. Malzeme ile Yapılan

Malzeme ile yapılmış
Kasım 2014'e kadar uzanan bu web sitesi, malzeme tasarımı için harika bir ilham kaynağı olarak hizmet ediyor. Sitenin büyük bir kısmı, malzeme tasarım tekniğini kullanan web sitelerinin ve mobil uygulamaların yüksek çözünürlüklü ekran görüntülerini sergiliyor. Ve bu ilham verici örneklerde kaybolmak kolay olsa da, sağ üst kenar çubuğunda geliştiriciler için ekledikleri referans materyaline göz atmayı unutmayın. Bu rotaya gitmeyi seçerseniz, bunlar işinize yarayacaktır.

6. Materyal Tasarım Blogu

Materyal Tasarım Blogu
Bu blog, yalnızca bu konuyla ilgili olarak ilginizi çekebilecek bir dizi araç ve konuyu kapsadığı için değil, aynı zamanda tasarım tekniğini kullanma konusunda başarılı bir iş çıkardığı için favorilerimizden biri. Animasyonlarını çalışırken görme şansınız olmadıysa, siteyi ziyaret edin ve blog yazılarından herhangi birine tıklayın.

7. Malzeme Yukarı

MalzemeYukarı
Uplabs web sitesi ailesinin bir parçası olan MaterialUp, yalnızca materyal tasarımı konusuna odaklanır: web sitesi örnekleri, mobil uygulama ekran görüntüleri, araçlar, ipuçları ve daha fazlası. Şu anda işinize yarayacak bir şey bulamasanız bile, web sitelerinin tasarımına bir göz atın. Düzen ve görünüm Google Drive'ı andırıyor, değil mi? Güvenebileceğiniz bir kaynak arıyorsanız, bu tasarım ilkelerini kendileri yerine getirme konusunda iyi iş çıkaran bir kaynaktan daha iyi kime başvurabilirsiniz?


8. Pinterest

Pinterest
Tasarım ilhamı için en iyi kaynak olarak adlandırılan bir resim toplama sitesi olacak olsaydı, Pinterest bu onuru Behance ile paylaşırdı. "Materyal tasarımı" terimi için hızlı bir arama ile, bu tasarım trendini iyi bir şekilde kullanan web sitelerinin ve uygulamaların videolarına ve resimlerine anında erişebilirsiniz.

9. Reddit

Reddit
Tasarım ilhamı ararken muhtemelen gitmeyi düşündüğünüz ilk yer Reddit değildir. Bakın ve bakın, bir Materyal Tasarımı alt reddit var. Buradaki gönderilerin yaklaşık yarısı, insanların malzeme tasarımını geliştirmek için yaptıkları tasarım yenilemeleridir. Diğer yarısı ise tasarımların geri bildirim almak istediği özgün tasarım gönderileridir. Materyal tasarımına yoğun bir şekilde yatırım yapıyorsanız, bu, benzer düşünen kişilerle diğer tasarımları incelemek ve tartışmak için harika bir yer olacaktır.

10. Tumblr – Materyal Tasarımı

MateSign
Android uygulamaları, iOS uygulamaları, web siteleri veya başka bir şey tasarladığınızdan bağımsız olarak, materyal tasarımının nasıl düzgün bir şekilde yürütüleceği hakkında daha fazla bilgi edinmek istiyorsanız, bu kontrol etmek için iyi bir kaynaktır. Bu Tumblr beslemesinde gezinin ve bir sonraki projeniz için ilham kaynağı olacak tüm farklı içerik türlerinin örneklerini bulacaksınız.

11. Tumblr – Malzeme Kalıpları

Malzeme Modelleri
İlham verici bir Tumblr feed'inin başka bir örneğinde, Material Patterns, bu tür kaynaklarda görmeye alışık olduğumuzdan çok daha fazla çeşitlilik sergiliyor. Seyahat rezervasyonu uygulamalarından müzik çalarlara ve sosyal medya sayfalarından harita uygulamalarına kadar bu, malzeme tasarımı meraklıları için mükemmel bir kaynaktır. Çok fazla renk, harika animasyonlar ve gezinmek için harika bir içerik karışımı var.

12. Malzeme Paleti (bonus kaynak)

Malzeme Paleti
Malzeme tasarımı söz konusu olduğunda Malzeme Paletini bir ilham kaynağı olarak adlandıracak kadar ileri gitmesem de, malzeme tasarımınızın ihtiyaç duyduğu parlak renk paletini bulmak için bu kesinlikle harika bir kaynak. Herhangi iki rengi seçin ve ardından uygulamanın en iyi malzeme tasarımı uygulamalarına dayalı olarak web sitenizin yeni renk paletini oluşturmasına izin verin.

13. Google'ın Materyal Tasarım Kaynakları (bonus kaynak)

Google Kaynağı
İşte tüm malzeme tasarımı ihtiyaçlarınız için başka bir bonus kaynağı. Elbette, Google Design web sitesi malzeme tasarımının nasıl yürütüleceği konusunda mükemmel bir modeldir, ancak burada en önemli olan şey, tasarımcıların ve geliştiricilerin web siteleri, uygulamalar ve daha fazlası için mükemmel malzeme tasarımını oluşturmalarına yardımcı olmak amacıyla Google'ın sağladığı tüm kaynaklardır.

Çözüm

Google, 2014 yılında Materyal Tasarımı tasarım dilini bulduğunda, son kullanıcı her zaman misyonlarının ön saflarında yer aldı. Navigasyon ve kullanıcı deneyiminin daha sezgisel hale gelmesi için uygulama (ve daha sonra web) tasarımı nasıl geliştirilebilir? Çözümleri yeterince basitti: geçmişte neyin işe yaradığını (yani minimalist ve duyarlı tasarımlar) üzerine inşa edin ve ona daha fazla gerçek yaşam kalitesi aşılayın.

Başlamaya hazır olduğunuzda, Google'ın yönergelerini ve teknik özelliklerini incelemek için biraz zaman ayırın. Çalışmanız için size sağlam bir temel sağlayacaktır. Ardından, tasarlamaya başlamaya hazır olduğunuzda, tasarım sürecinize ilham vermek ve malzeme tasarımınızı benzersiz bir yöne çekmek için yukarıdaki malzeme tasarım kaynaklarını kullanabilirsiniz.

Şimdi size gelelim: Materyal tasarımın kalıcı olacağını mı düşünüyorsunuz yoksa geçici bir heves mi?

Legend_art / Shutterstock.com'dan makale küçük resmi

Copyright statement: Unless otherwise noted, this article is Collected from the Internet, please keep the source of the article when reprinting.

Check Also

Divi's Theme Builder ile Özel Global Başlık Nasıl Oluşturulur

Artık Tema Oluşturucu burada olduğuna göre, web sitenizi A'dan Z'ye kurmanıza yardımcı olacak yeni eğitimlere dalmak için sabırsızlanıyoruz. Buna Divi'nin yerleşik seçeneğini kullanarak özel başlıklar oluşturma da dahildir. Bu eğitimde Divi's Theme Builder'ı kullanarak global bir başlık oluşturmaya odaklanacağız. Bu sayfaya veya gönderiye farklı bir başlık atamadıysanız, web sitenizin her yerinde genel bir başlık görünecektir.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir