Moqups: Genel Bakış ve İnceleme

Bir fikri test etmeden harika veya korkunç olduğunu nasıl anlarsınız?

Tel çerçeveleme, maketler ve prototip oluşturma, dijital tasarımın gerekli parçalarıdır. Konseptlerinizi görselleştirmek, tasarımlarınızı simüle etmenize, farklı kullanıcı deneyimlerini denemenize ve herhangi bir şeyi canlı hale getirmeden önce çeşitli kullanıcı yolculuklarını ve akışlarını test etmenize olanak tanır.

Geçmişte, tasarımcıların tasarımlarını yazdırmaları ve müşteriye bir PDF ile sunmaları gerekiyordu. Bugün, bir tasarım halka açılmadan önce tasarım zorluklarını bulup çözmenize yardımcı olacak araçlar var; bir tasarımın estetik ve teknik bileşenlerini çözmek; ve deneyimi herkesten önce test edin.

Ayrıca danışanla olan ilişkinizi de yumuşatırsınız – eğer bir şeyi varsayarlarsa (ki yapacaklardır), daha sonra, çok geç olduğunda, “Ah, bunu düşündüm…” duymak yerine erken aşamalarda bununla başa çıkabilirsiniz. .

Moqups, tek bir ortamda tel kafesler, maketler ve prototipler oluşturmanıza yardımcı olabilecek web tabanlı bir tasarım aracıdır. Projeler arasında gezinebilir ve tasarımınızı düşük doğruluktan (başlangıç ​​aşamaları ve kaba taslaklar) yüksek doğruluğa (daha kapsamlı ve ayrıntılı) taşıyabilirsiniz. Bu gönderide, bir tur atmaya ve yazının sonundaki son düşüncelerim de dahil olmak üzere, yolun her adımında bu sürecin nasıl olduğunu size göstereceğim.

Moqups ile Neler Yapabilirsiniz?

Moqups ile yapabileceğiniz çok sayıda tasarım vardır: diyagramlar, akış şemaları, site haritaları, tel kafesler, maketler, çizelgeler ve grafikler. Onları geçelim.

Burada özellikle prototipleme hakkında konuşmadığımı fark edeceksiniz. Bunun bir nedeni var ve buna daha sonra değineceğim.

Diyagramlar ve Akış Şemaları

Hemen hemen her web tasarım projesi bir diyagram, akış şeması veya site haritası ile başlar ve ekip üyeleri yol boyunca referans için ona geri dönme eğilimindedir. Moqups ile her türlü diyagramı oluşturabilirsiniz:

• Kavram diyagramları
• Karar ağaçları
• Kullanıcı etkileşimlerini içeren akış şemaları
• Yazılım iş akışları için akış çizelgeleri
• zihin haritaları
• Site Haritaları
• Durum diyagramlarını kullanın

Akış şeması şablonlarıyla, her türlü diyagramda bir başlangıç ​​yapabilirsiniz. Bir akışı ihtiyaç duyduğunuz şekilde geliştirmek için bir Diyagram Genişletici de kullanabilirsiniz. Ayrıca, özelleştirmek için diyagramın görünümünü değiştirebilirsiniz.

Tel Çerçeveler ve Modeller

Tel çerçevelerle ekibiniz, bir projenin başlangıcında bilgi hiyerarşisi, sayfa yoğunluğu ve kullanıcı akışı gibi şeyleri anlayabilir. Basit şekiller ve yer tutucu metin, gelecekte ekleyeceğiniz daha gelişmiş tasarım öğelerini temsil eder. Henüz markalaşma veya tasarım konusunda endişelenmenize gerek yok; bunun yerine, web sitesinin yapısı ve temel gereksinimleri hakkında endişelenmeniz yeterlidir.

Maketler ile ekibiniz tasarımın ilk aşamalarında geri bildirim alabilir. İçeriği görselleştirmek ve çok basit bir şekilde nasıl işlev göreceğini göstermek için tel kafesin taslağını oluşturacaksınız. Tasarım, daha iyi görünmesi ve nihai sonucu görselleştirmesi için bağlama oturtulur. Müşteriler, bir sayfada bir tasarım görmek yerine, tasarımın web sitelerinde veya uygulamalarında nasıl görüneceğini görebilir.

Size Uygun Her Şekilde Yaratın

Moqups'un güzelliği, tel çerçeveleriniz ve maketleriniz arasında istediğiniz gibi gidip gelebilmenizdir – ve mutlaka birini diğerinden önce oluşturmanız gerekmez. Örneğin, bir tel kafes ve ardından bir maket ile geleneksel yoldan başlayabilirsiniz. Daha sonra, maketi değerlendirirken ihtiyaç duyduğunuzu fark ettiğiniz ince ayarları yapmak için tel kafese geri dönebilirsiniz. Veya önce bir maket oluşturabilir, ardından ayrıntıları anlamak için tel çerçeveleme aşamasına geçebilirsiniz. Ayrıca maketi tamamen atlayabilir ve bir tel kafesten düşük kaliteli bir prototip oluşturabilirsiniz.

Grafikler ve grafikler

Bilgileri ekibinize, müşterilerinize veya yatırımcılara görsel olarak sunmanız gerekiyorsa, Moqups her türlü çizelge ve grafiği oluşturmanıza olanak tanır:

• Alan çizelgeleri
• Çubuk grafikler
• Sütun grafikleri
• çörek çizelgeleri
• Çizgi grafikler
• Pasta grafikler

Moqups Özellikleri

İşte Moqups'un ana özellikleri ve ardından ek faydaların kısa bir listesi.

Grafikler ve Yazı Tipleri ile Yerleşik Kitaplık

• Yerleşik kitaplık binlerce simge seti içerir. Ayrıca, popüler kullanım örnekleri için tasarlanmış kullanıma hazır şablonların yanı sıra Android ve iOS mobil uygulama tasarımı için özel şablon kitleri de bulunmaktadır.
• Nesneleri hizalayın, yeniden boyutlandırın, döndürün veya stillendirin. Ayrıca öğeleri toplu olarak düzenleyebilir, gruplayabilir, kilitleyebilir ve yeniden adlandırabilirsiniz. Özel kılavuzlar, ızgaralar ve cetveller ile hassas ayarlamalar yapılabilir.
• Google Fonts, yüzlerce yazı tipi arasından seçim yapabilmeniz için entegre edilmiştir. Gelişmiş kontroller, metni tasarımlarınıza uyacak şekilde değiştirmenize olanak tanır. (Logolar için En İyi Yazı Tiplerini Nasıl Seçeceğinizi öğrenmek ister misiniz? Bunun için bir makalemiz var.)

Projelerinizi Organize Edin

• Sayfalarınızı yeniden sıralamak veya klasörler halinde düzenlemek için sürükleyip bırakın.
• Sayfalar Paneli, klasörlerinizde arama yapmayı ve gezinmeyi kolaylaştırır.
• Ana Sayfalar ile, değişiklikleri ilişkili tüm sayfalara otomatik olarak uygulayabilirsiniz.

Entegrasyonlar ve İşbirliği

• Moqups, Dropbox, Google Drive ve Slack gibi araçlarla entegrasyonlara sahiptir.
• Ekibiniz bulut sayesinde uzaktan çalışırken işbirliği yapabilir (ve işte ekibinizin sohbet etmesi için daha fazla yol).
• Doğrudan tasarımın kendisi hakkında geri bildirim alın ve çeşitli sürümleri birbirine göndermek zorunda kalmadan düzenlemeler yapın.

Daha fazla özellik

• Kullanımı kolay sürükle ve bırak düzenleyici (yeni başlayanlar bir öğrenme eğrisi yaşayabilir, ancak önemli değildir)
• Kendi resimlerinizi yükleyin
• Öğeleri sıralarken ek hizalama
• Kaliteden ödün vermeden ölçeklendirin
• Çalışmanızı PDF veya PNG olarak dışa aktarın

Moqups'u Kullanmak

Moqups ile olan deneyimimi anlatmak için hemen konuya gireceğim. Olan çok şey var – kafa karıştırıcı değil, sadece çok şey var – bu yüzden oynadığım ve harika veya faydalı olduğunu düşündüğüm özelliklerden bahsedeceğim. Makalenin sonunda, genel dezavantajlar ve kimler için en iyisi de dahil olmak üzere Moqups hakkında genel düşüncelerimi ve hislerimi vereceğim.

Moqups'a Başlarken

Moqups'u kurmak son derece kolaydır ve ücretsiz hesapla başlamanızı öneririm (bununla ilgili neler içerdiğinden daha sonra Fiyatlandırma bölümünde bahsedeceğim).

Tasarım Oluşturma

Sürükle ve bırak düzenleyicisini gerçekten seviyorum. Bazı editörlerde, bir öğeye tıklarsınız ve hemen projede görünür ve ondan kurtulmak için sıkıntı olabilir. Moqups, eklediklerim üzerinde biraz daha kontrolüm olduğunu hissettiriyor ve seçenekleri, yanlışlıkla bir şeye tıklayıp farkında olmadan ekleyeceğimden endişe etmeden keşfetmeme izin veriyor. Ayrıca, bir öğeyi projenize sürüklerken, neye benzeyeceğini görebilir ve sonra istemediğinize karar verirseniz hemen geri koyabilirsiniz.

Tasarımla Çalışmak

Farenizi tasarımınızdaki farklı öğelerin üzerine getirdiğinizde, size farklı sayfa öğelerini göstermek için mavi bir anahat görünür. Bir öğeyle çalışmak için onu tıklatarak seçin. Sağda özel seçeneklerle bir menü açılacaktır.

Proje Renkleri

Renk seçicinin “Proje Renkleri” bölümünü beğendim. Bu, sol üst köşedeki kalbin rengini metnin rengiyle eşleştirmeyi kolaylaştırdı.

Öğeleri Şablon Olarak Kaydetme

Moqups'un yararlı bir özelliği, öğeleri şablon olarak kaydedebilmeniz ve ardından bunları olduğu gibi diğer sayfalara kolayca ekleyebilmenizdir. Orijinal tasarım korunur – renk, boyut vb. Bu, tasarımınızda süreklilik yaratmanıza yardımcı olur.

İşbirliği Özellikleri

Bir Google Drive kullanıcısıysanız, yorum yapmak alışık olduğunuz şekilde görünecek ve davranacaktır. Yorum eklemek son derece kolaydır ve yerleşiminin anlamlı olması için yorumu yazmadan önce veya sonra taşıyabilirsiniz.

Yine de çok sayıda ortak çalışanınız ve yorumunuz varsa, bu küçük yorum bölmesi hızla kontrolden çıkabilir. Ekibiniz için, yorumların artık gerekli olmadığında çözümlenmiş olarak işaretlendiği bir kural oluşturmak isteyebilirsiniz.

Moqups Fiyatlandırma

Ücretsiz planla, 200'e kadar nesne içeren bir proje yapabilirsiniz. Bu, boş bir belgeyle çalışmak ve bir şablon kullanmak arasında seçim yaparken göz önünde bulundurulması gereken bir şeydir. 200 nesnenin 125'ini hemen kullanan Açılış Sayfası Tel Çerçeve şablonunu seçtim. İçeri girip bazı nesneleri silebilirim elbette ama bazı insanlar için sıfırdan başlamak daha mantıklı olabilir.

Ücretsiz planın iyi olduğu tek şey Moqups'u test etmektir, çünkü tasarlamanız gereken tek bir projeniz olmayacak. Fiyatlandırma, yıllık olarak ödenen aylık 13 dolardan başlar. Her plan, sınırsız proje oluşturmanıza ve sınırsız nesne kullanmanıza izin verir, bu nedenle ana düşünce, Moqups'u kaç kişinin kullanacağıdır.

Tek kişilik bir tasarım ekibi değilseniz, Yaratıcı Ekip paketini isteyeceksiniz. Ne kadar çok kişi eklerseniz, kullanıcı başına maliyet o kadar az olur. Örneğin, 50 kullanıcınız varsa, aylık toplam 149 ABD Doları (yıllık olarak ödenir) için kullanıcı başına maliyet 3 ABD Dolarıdır.

Bazıları Moqups fiyatlandırmasının çok önemli olduğunu düşünürken, diğerleri bunun çok maliyetli olduğunu düşünebilir. Onu ne kadar kullanacağınıza ve ondan alacağınız değere bağlı.

Not Ücretsiz planla, kredi kartı gerekmez – test etmek ve ardından size uygun olmadığına karar vermek isterseniz, ücret alınmadan önce iptal etmeyi hatırlamak zorunda kalmazsınız.

Moqups Zayıf Noktalar

• Moqups'un en büyük dezavantajı, çevrimdışı olarak kullanamamanızdır. Öte yandan, tarayıcı tabanlı olması bazı insanlar için çok uygundur.
• Gelişmiş prototipleme ihtiyaçlarınız varsa veya özellikler konusunda seçiciyseniz, bu muhtemelen sizin için bir araç değildir.
• Moqups'un gecikmeli olabileceğini, yüklenmesinin uzun sürebileceğini ve hatta beklenmedik bir şekilde kapanabileceğini söyleyen incelemeler okudum, ancak bunların hiçbirini yaşamadım. Ancak, zengin içerik eklerken ve ek sayfalar oluştururken göz önünde bulundurulması gereken bir şeydir. Tasarımımda hiç fotoğraf veya video yoktu, bu yüzden işleri hızlandırmaya yardımcı olmuş olabilir. Projeleriniz çok sayıda zengin unsur içerecekse, denemek için ücretsiz plandan yararlanın.

Moqups Kimler İçin En İyisidir?

Moqups, geliştirici olmayanların proje planlamasının ilk aşamalarında kavramsallaştırması için harikadır. Örneğin, bir işletme sahibi veya proje yöneticisi fikirlerini geliştirme ve tasarım ekibine iletebilir ve bu ekip daha sonra gerçek ürünü veya yüksek kaliteli bir işlemeyi oluşturmak için daha gelişmiş yöntemler kullanmaya devam edecektir.

Moqups, maketler ve tel çerçeveleme için özellikle yararlıdır, ancak prototip oluşturma söz konusu olduğunda o kadar güçlü değildir. Moqups, diğer prototipleme araçları kadar çok özelliğe sahip değildir ve stil öğeleri de rekabetçi araçlar kadar çok şekilde özelleştirilemez. Web sitelerinde neredeyse hiç bahsedilmiyor.

Son düşünceler

Genel olarak, Moqups kullanmayı sevdim – ve keşke web sitemi tasarlarken bunu bilseydim, çünkü çizdiğim kalem ve kağıt tasarımından çok daha gerçekçi. Söylediği gibi çalıştı ve birçok seçenek olsa bile, hiçbir şeyi anlamak çok zor değildi. Daha önce herhangi bir grafik tasarım aracıyla çalıştıysanız – ki yapmış olduğunuzu tahmin ediyorum – bu aracı almak zor olmayacaktır. İlk kez kullanabilir ve günün sonunda (veya saatin sonunda) bir projeyi bitirebilir ve ardından geri dönüp ilk seferde kaçırdığınız tüm seçenekleri keşfedebilirsiniz.

Görselleştirme araçlarının amacı nihai bir ürün elde etmektir, değil mi? Harika topluluğumuzun çalışmalarıyla Divi tasarım vitrinimize göz atın.

Görsel Üretim / Shutterstock.com aracılığıyla öne çıkan görsel