Kaynaklar Tasarım

Speculo ile Online Renk Paletlerini Görselleştir

Yapacağınız web tasarımın font, renk ve stillerini önceden görsel olarak ayarlayabileceğiniz web uygulaması olan Speculo ‘dan bahsettik.

Bir tasarıma başlamadan önce butonların nasıl görüneceğinden, metinlerin nasıl görünceğine kadar bir çok özelliğin belirlenmesi gerekir. Tüm bunları bir web uygulamasıyla dinamik olarak ayarlamanıza imkan veren Speculo bu iş için biçilmiş kaftan.

Speculo gibi bir web uygulaması sayesinde renk paletlerni tarayıcınızda dinamik olarak inceleyip karşılaştırabilirsiniz.


Bu uygulama tamamen ücretsizdir ve Chrome’dan Edge’e kadar tüm önemli tarayıcılarda çalışır. Wireframe olarak tasarlanan altı farklı açılış sayfası demolarını gösteriyor.

Varsayılan olarak, Bootstrap’ın stilini taklit eden basit renk düzenleri kullanırlar. Bu renklerin herhangi birini kolaylıkla değiştirilebilir ve sayfada otomatik olarak güncellenir.

Ayrıca her bir tasarıma nasıl göründüklerini görmek için yazı biçimini değiştirebilirsiniz. Bu uygulama sadece 7 farklı yazı tipini destekliyor:

  • Arvo
  • Lato
  • Open Sans
  • Roboto
  • Montserrat
  • Helvetica Neue
  • BLOKKNeue

Açılış sayfası çok detaylı değildir, bu nedenle bu uygulama, tasarım sürecindeki sonraki aşamalarda yardımcı olamaz.

Bununla birlikte, hızlı fikirleri yakalamak isteyen tasarımcılar hemen bu web uygulamasına aşık olacaklar. Özel bir paylaşım bağlantısıyla bile verebileceğiniz HEX kodlarıyla tüm renkleri değiştirmenizi sağlar.


Sitede ayrılan bölümlerin herhangi birinin üzerine gelirseniz, yakınlaştırmak ve daha yakından incelemek için tıklayabilirsiniz. Yazı tiplerini ve renkleri yakından görebilmeniz için otomatik olarak bir tam ekran görünümü yakınlaştırır.

Logonun yanında bulunan bağlantı simgesine tıklayarak oluşturduğunuz paleti export edebilirsiniz. Export çıktısı sayesinde CSS olarak alıp projenize direk uygulayabilirsiniz.

Yine, bu şablonların gelişimin sonraki aşamalarındaki projelere yardımcı olacak kadar ayrıntılı olduğunu düşünmüyorum. Ancak, fikirlerinizi hızlıca görsele dökmek ve sadece renklerle oynamak istiyorsanız mükemmel bir araçtır.

Nasıl yapıldığını görmek için GitHub‘daki kaynak koduna göz atabilirsiniz. Uygulamayı geliştirmeye yardımcı olmak için yine GitHub ile yapabilirsiniz.

Bu makalede yapacağınız tasarımın stillerini önceden belirlemek için kullanabileceğiniz Speculo web uygulamasından bahsettik. Bu konu hakkındaki düşüncelerini yorum yaparak bizlerle paylaşabilirsiniz.



Yazar hakkında

Bilal UÇAR

Web Developer @Webmaster.Kitchen.
Wordpress üzerinde çalışmalar yapıyorum. Bu konuda öğrendiklerimi mutfakta paylaşıyorum. Siz de yaptığınız çalışmaları, edindiğiniz bilgileri paylaşabilirsiniz.
Yorum alanı ile mutfağa katkıda bulunun.

Yorumlar

Bir yorum yaz