Wire Framing: Daha İyi Bir WordPress Teması ve Eklentisi Geliştirme Yeni Başlayan Kılavuz
Daha önce hiç ‘tel kız çerçeveleme’ duymadıysanız, şimdi bu konuda yapabileceğiniz her şeyi öğrenmenin zamanı geldi. Çözümünüzün yapısını ve biçimini geliştirme tekniği, genel geliştirme stratejinizin önemli bir parçası olmalıdır. Bunun nedeni, daha eksiksiz ve daha kararlı özelliklere sahip bir WordPress eklentisi ve tema oluşturmanın bir yoludur. Örneğin, kod düzenleyicisini açmadan önce bir çerçeve resmine sahip olmak size son tasarımınızın nasıl görüleceğine dair genel bir resim verir ve kullanıcı deneyimini (UX) mükemmelleştirmek için daha fazla fırsat sağlarsınız. Tabii ki, UX başarılı bir çözümün en önemli yönlerinden biridir. Dahası, tüm tasarımı tamamlayana kadar parçalar üzerinde çalışarak bir çerçeve görüntüsünü sahte bir kontrol listesi olarak kullanabilirsiniz.
Bu yazı, neden gerekli olduğu ve nasıl yararlı olabileceği de dahil olmak üzere tel çerçeveleme konusunu daha ayrıntılı olarak görecektir. Ayrıca Balsamiq Cloud gibi kendiniz uygulamak için kullanabileceğiniz bazı araçlar da toplayacağız. Başlayalım! Tel çerçeve nedir? Hadi baştan başlayalım. ‘Tel çerçeve’ terimi aslında moda endüstrisinden gelir, burada tam anlamıyla tel çerçevelerden yapılmış bir manken için bir terimdir. Tabii ki, dijital çağda anlam değişti. Temel terimlerle, tel çerçeveleme düşük sadakatli bir web sayfası sürümü oluşturmak için bir yöntemdir. Amaç, düğmeler, grafikler ve önleyen içerik gibi aşırı unsurlar olmadan tasarım yapınızı ve yerleşiminizi geliştirmektir. Bu işlemden kaynaklanan tasarıma tel kafes denir:
İhtiyaç duyulmayan özellikleri keşfetmeden önce eklemek istediğiniz her öğenin kullanımını belirleyebilirsiniz.
Ayrıca para, zaman, enerji ve kaynaklar israf etmeden özellikleri silme fırsatınız var. Ücretsiz ürün veya freemium yapan birçok geliştirici için bu ana husus olacaktır.
Tel çerçeveler, diğer ekip üyeleriyle işbirliği yapmanıza olanak tanır. WordPress gelişiminin açık kaynaklı doğası göz önüne alındığında, bu size tüm topluluktan (veya yalnızca müşterilerinizden) tasarımınıza geri bildirim girme fırsatı sunar.
Bu faydanın mükemmel bir örneği için, lezzetli beyinler gibi WordPress geliştiricilerini görebilirsiniz. Bu geliştirici daha önce tel çerçeveleme ile ilgili tartışmalar da dahil olmak üzere bir eklenti yaptıkları hakkında bir makale yazdı. Bu durumda, fikir alışverişinde bulunmayı bitirdikten sonra Google belgeleriyle ve geliştirmeye başlamadan önce Balsamiq Cloud’u (daha sonra konuşacağımız) kullanıyorlar. Elbette, her geliştiricinin bir ekibi veya hatta güvenilir bir geri bildirim kaynağı olmayacak. Peki yalnızsan ne yapabilirsin? Wirify gibi araçların bir rol oynadığı yer burası. Bu, kare görüntü olarak gördüğünüz mevcut web sitesini gösteren ücretsiz bir tarayıcı uzantısıdır (premium sürüm mevcut olmasına rağmen):
Bu size kendi tasarımınız için ilham verebilir (eklenti geliştiricileri bunun daha az kullanışlı olduğunu varsayabilir). En azından, gereken her şeye girip girmediğinizi görmek için nişinizdeki diğer temalara göz atabilirsiniz. Bunu bitirdikten sonra, hoş bir parça için zamanı – kendi tasarımınızı yapın!
Geliştirme sırasında tel çerçeve kullanmaya nasıl başlayabilirsiniz? Tüm tel çerçeve işlemi iki bölüme ayrılabilir: fikir ve doğrulama. Her ikisi hakkında hızlı bir şekilde konuşalım: Fikir: Bu ilk aşamayı, çok yakın analiz etmeden bir dizi tel çerçeve tasarımını yapacağınız beyin fırtınasının bir uzantısı olarak düşünebilirsiniz. Ne kadar çok fikriniz varsa, o kadar iyi, çünkü daha sonra rafine edilmeniz için daha fazla seçenek sunar.
Doğrulama: Daha önce yaptığınız fikirleri anlamak için mümkünse başkalarını dahil ettiğiniz yer burasıdır. Buradaki amaç, tasarımlarınızın sayısını azaltmak ve kalan kaliteyi artırmaktır. Doğrulama aşamasında, son kullanıcının ihtiyaçlarını düşünürken, proje hedefleri ile birlikte son tasarıma doğru çalışırsınız. Tel çerçeveleme olduğunda ana endişelerinizden ikisi, müşterilerin kendi hedeflerine ulaşmalarına nasıl yardımcı olabileceğinizi sağlamak ve tasarımınızın gerçek dünyada gerçekten çalışıp çalışmadığını belirlemektir. UX Mastery, bu sorun hakkında yararlı bir kapsamlı rehber sunar, bu da her aşama hakkında daha ayrıntılı olarak açıklar.
Tabii ki, tel çerçevelemenin tüm sürecinizle eşleştiği yerde de önemlidir ve bunu proje başına projelere göre düşünmek istersiniz. Örneğin, Basecamp geliştirme ekibi genellikle kağıt tasarımından doğrudan kodlama aşamasına geçmeyi tercih ederek özel araçların kullanımını atladı. Bu sizin için uygun olabilir, ancak iskelet görüntüleri yapmak için daha gelişmiş çözümlerin bazılarını görmek de iyi bir fikirdir. Tel çerçeveler yapmak için hangi çözümler mevcuttur? (3 seçenek) (elbette) tel çerçevelemede size yardımcı olacak birçok araç, ancak uygun çözümü seçmek biraz araştırma gerektirir. İşte dikkate almak istediğiniz üç ana seçenek.
1. Grafik Editör (Photoshop veya Illustrator gibi)
En sevdiğiniz grafik düzenleyiciniz kullanmak için mükemmel bir araç olabilir çünkü dışarıda zaten biliyorsunuzdur. Bu, çerçeve görüntüleri çok hızlı yapmanızı sağlar. Basit eklentiler (veya hatta ücretsiz temalar) için, tel çerçevenizle çok ayrıntılı olmanız gerekmeyebilir, bu da Mockup Photoshop’u hızlı bir şekilde ideal hale getirir. Photoshop ve Illustrator’ı vurguladık çünkü her ikisi de çok popülerdi, ancak Sketch ve Serif’in afinite serisi gibi seçim yapabileceğiniz başka çözümler vardı. Tasarımınızın dinamik olmayacağını veya basit grafik çerçeve görüntülerinin kullanımını etkileyebilecek işbirlikçi olması gerektiğini unutmayın. WordPress eklentileri (Mockup gibi), WordPress’in doğrudan gösterge tablosundan çalıştırabileceğiniz özel bir tel çerçeve aracına sahip olduğuna dikkat edilmelidir. Ancak, önerebileceğimiz tek çözüm Mockup:
Bu eklenti, tasarımınızı ekleme ve yönetme yeteneği gibi bir dizi yararlı özellik sunar. Ayrıca istemcinize doğrudan WordPress kontrol panelinden yorum ekleme, tasarımı onaylama ve daha fazlasını sunar. Tabii ki, bu eklentinin bir yıldan fazla bir süredir güncellenmediğini göstermeliyiz. Bu, özellikle üretim veya profesyonel ayarlarda kullanıyorsanız, önce geçerli WordPress sürümüyle test etmek isteyebileceğiniz anlamına gelir.
3. Çevrimiçi Araçlar (Balsamiq Cloud gibi) Son olarak, birçok çevrimiçi tel çerçeve aracı mevcuttur. Özellikle Balsamiq Cloud, takımda işbirliği yapmak için çok uygundur ve ayrıca hoş bir görünüme sahiptir:
Photoshop veya Illustrator gibi en sevdiğiniz grafik düzenleyiciniz özel bir araç olmayabilir, ancak sığ bir öğrenme eğrisi avantajına sahiptir. WordPress, Mockup eklentisi gibi orijinal araçlar sağlar. Bununla birlikte, en son çözüm sahada çok incedir, bu nedenle profesyonel kapasitede kullanırken dikkatli olun.
Ayrıca çok sayıda çevrimiçi tel çerçeve aracı vardır. Balsamiq Cloud’u sevmiyoruz (esas olarak işbirlikçi işlevselliği nedeniyle).