Web Tasarımcıları için On Yaşam Tarzı Kılavuz Araçları - Best of
bir yaşam tarzı rehberi bir UI elemanları ve kalıplarının dokümantasyonu geliştiricilerin kullanmasına izin vermek amacıyla bir siteden veya uygulamadan toplanan tüm projeleri boyunca tutarlı stiller. Geçmişte, geliştiriciler el ile stil kılavuzları oluşturdular, bu da çok iş. Bir süre sonra iş akışını otomatikleştirmeye başladılar ve ön uç kodu dönüştüren stil araçları iyi organize edilmiş UI kütüphaneleri görünmeye başladı.
Yaşam tarzı kılavuzları kod stili kılavuzları, Sonuncusu, yaşam tarzı rehberleri olurken okunabilir ve korunabilir kodun nasıl yazılacağı hakkında kurallar içerdiğinden düğmeler, widget'lar ve tipografik öğeler için CSS sınıfları gibi ön uç desen koleksiyonları. Kod stili kılavuzları kod tutarlılığı, yaşam tarzı rehberleri görsel tutarlılık site genelinde.
Bu yazıda, size yardımcı olabilecek 10 kullanışlı araç bir araya getirdik kendi yaşam tarzı rehberinizi yaratın.
1. Stylify Beni
Bu araç çok eğlenceli: sadece analiz etmek istediğiniz web sitesinin linkini yapıştırın ve stil rehberi bir fare tıklamasıyla oluşturulduğunu izleyin. İle Stylify Beni, renkler, yazı tipleri, boyutlandırma ve boşluk dahil bir sitenin kalıplarına hızlı bir şekilde göz atabilirsiniz. İşlem tamamlandıktan sonra, stil kılavuzunu PDF olarak indirin.
2. fabrikatör
Fabrikatör kendi UI araç setinizi oluşturmanıza, tasarım sisteminizi düzenlemenize ve araç kiti kodunuzdan bir stil kılavuzu oluşturmanıza olanak sağlar. Bir ekip içinde çalışıyorsanız, diğer geliştiricilerin kullanımını kolaylaştırmak için belgeleri Markdown'da yazabilirsiniz. Size yardımcı olabilir tasarımınızı / kodlama rutini düzenleyin istediğin gibi.
3. Frontify
Frontify Dijital maketlerden tel kafeslemeye kadar her şeyi içerir. Ayrıca, sorunsuz ve minimalist bir tasarım süreci sunan ve sorunsuz bir şekilde çalışan bir stil rehberi aracına sahiptir. Ücretsiz kaydolabilir ve gerekli tüm bilgileri manuel olarak ekleyebilirsiniz. İşlem, renk paleti, yazı tipi seçenekleri, simgeler, logolar, muhtemelen sloganlar veya tercih edilen web kopyasını içermelidir..
4. Aigis
İle Aigis, Herhangi bir metin dosyasından stil kılavuzları oluşturabilirsiniz (ör.. .css, .SCSS, .styl, .md). Ayrıca Belgeleri Markdown'a da yazabilir ve site temanızı kişiselleştirebilirsiniz..
5. Hologram
hologram Trulia tarafından yaratılmıştır ve stil rehberleri oluşturmak için mükemmel bir çözümdür. Bu bir yakut mücevher olduğunu CSS’inizdeki yorumları ayrıştırır müthiş stil rehberleri oluşturmak için. Hologram, stil rehberinizin daha kolay üretilmesini sağlamak için bazı temel stillere ve navigasyonlara sahip bir şablonlama sistemine sahiptir..
6. Styledown
İle Styledown, CSS stil kılavuzlarını kolaylıkla yazabilirsiniz. Markdown tabanlı stil kılavuzu jeneratör. Platform nötr olduğu için çoğu web geliştirme kurulumunda çalışacaktır. Onu çalıştırmak ve çalıştırmak için çok az gerektirir. Ayrıca, CSS’nize eklemeniz gereken yorumlar çok az. CSS belgelerinizi satır içi CSS yorumlarında veya ayrı bir Markdown dosyası olarak oluşturabilirsiniz..
7. KSS
KSS (Knyle Stil Sayfaları) öncelikle bir dokümantasyon özellikleri ve bir stil rehberi formatı olan kendi yorum sözdizimi. KSS ayrıca, ayrıştıran bir Ruby kütüphanesi içerir .şımarıklık, .SCSS, ve .css KSS kuralları ile belgelenen dosyalar düzgün bir stil kılavuzuna dönüştürülür. KSS, daha gelişmiş kullanıcılar ve profesyonel ekipler içindir, çünkü kodlama bilgisi gerektiren bir stil rehberi oluşturmak.
8. SC5 Stil Kılavuzu Jeneratör
İle SC5 Stil Kılavuz Jeneratör stil kılavuzlarını doğrudan tarayıcınızda oluşturabilir ve düzenleyebilirsiniz. Bu KSS dayalı stillerinizi görüntülemenize, aramanıza ve test etmenize yardımcı olan AngularJS destekli kullanıcı arayüzü gibi bazı harika özelliklerle birlikte. SC5, aynı belge gösterimini KSS ile kullanır. SASS, LESS, PostCSS ve saf CSS stil sayfalarını destekler.
9. Styledocco
StyleDocco kullanışlı bir Node.js uygulaması bu stil sayfalarınızdan stil kılavuzları oluşturur. Npm ile yükleyebilirsiniz. Oluşturulan stil kılavuzunda, StyleDocco uyguladığınız stillerin bir önizlemesini ve bir HTML kodu örneği gösterir.
StyleDocco'nun giriş sayfasında, biri varsayılan stil sayfasından oluşturulan ve diğeri Bootstrap sitesinden oluşturulan iki stil kılavuzu örneği bulabilirsiniz. Örnekler ayrıca, SytleDocco'nun kullandığı dokümantasyon sözdizimini almanıza yardımcı olabilir..
10. Desen Laboratuvarı
Desen Laboratuvarı oluşturmanıza yardımcı olan bir araç koleksiyonudur. modüler tasarım sistemi. Pattern Lab, bir sitedeki tüm stil öğelerini bir araya getiren ve bunlardan şablonlar ve sayfalar oluşturan özel bir statik site üreticisidir. Projenizin görevi olabilir desen kitaplığı ve ön stil rehberi. Pattern Lab, stil bileşenlerinizi aynı anda görmenizi sağlar soyut ve bağlamda.
