web-gelistirme-sc.com

CMS Arayüz Mantığı. - Bu en iyi yaklaşım mı?

Bir cms sistemi geliştiriyorum. Şu anda bir menüye yeni menü öğeleri eklemek için Arayüz üzerinde çalışıyorum. (Cms Logic nedeniyle menüler sabittir, kullanıcı menüler ekleyemez veya kaldıramaz, yalnızca tüm menü öğelerini silebilir ve menülere veya menü öğelerine menü öğeleri atayabilir).

Yeni bir menü öğesi eklemek için kullanıcının menülerin üzerindeki büyük alanı tıklaması gerekir (bkz. İmg 2). Bu, giriş alanlarının görünmesini sağlar. Girişlerinizi kaydetmek, “Atanmamış” kutusunda yeni bir menü öğesinin görüntülenmesine neden olur. Menü öğesini konumlandırmak için menüden istediğiniz konuma sürüklemeniz yeterlidir.

Bir menü öğesini silmek istiyorsanız, onu çöp kutusuna sürüklemeniz yeterlidir. Sadece tıklattığınız bir öğeyi düzenlemek isterseniz, öğe vurgulanır ve giriş alanları (yeni bir öğe eklemek için olanlar gibi) seçtiğiniz menü öğesinden gelen bilgilerle dolu görünür. Sadece değiştirin ve kaydet'i tıklayın. Bir öğenin konumunu değiştirmek için öğeyi istediğiniz konuma sürüklemeniz yeterlidir.

Umarım her şeyi anlamak kolaydır.

Sorularım:

Bu fikrin kullanımı kolay ve mantıklı mı? Bunu yapmanın en iyi yolu mu yoksa daha iyi bir fikriniz mi var? İyileştirme için yorumlarınız/fikirleriniz var mı?

cms ui img 1 img 1

cms ui img 2 img 2

// Güncelleme.

Tamam, ben bir maket yaptım. Anladığım kadarıyla ArchieVersace'ın tüm yorumlarını dahil ettim. Düzenleme modal kutusuna gelince: sadece hızlı bir taslaktır, bu yüzden gerçek girdi, boyut, ...

Navigation TreeAdd/Edit BoxTrash Bin

// Güncelleme 29.10.2010

Şu anki değişikliklerim:

  • çöp kutusu yok
  • dikey ağaç yapısı
  • ekle düğmesi (menü adının yanında, ancak yeniden konumlandırılabilir)
  • 3 Menüyü (projelerimin ortalama tutarı) yan yana koymadan önce konum seçmeden oluşturulduysa menülerin üzerindeki atanmamış menü öğesi birbirinin yaklaşık 300 piksel genişliğe sahiptir. Bu yeterli olmalı, çünkü neredeyse hiç daha geniş bir menüye sahip değilim. Menüyü daraltmak için düğmeler ekleyeceğim, ancak başlangıçta tüm öğelerin daraltılmadığını (ancak belki de son tercihi çerez aracılığıyla kaydedeceğim).

Zaten benim cms için javascript gerektirir, wordpress gibi dağıtılmayacak, ancak proje başına satılan, bu yüzden js gerektirebilir. Bu, menü konumlandırması için bir geri dönüşe (kaydet/iptal et) gerek olmadığı anlamına gelir.

Kullanıcım sistemi neredeyse günlük olarak kullanıyor olabilir, ancak bazıları web sayfalarının içeriğini yalnızca birkaç ayda bir güncelleyebilir. Bu yüzden olabildiğince kolay olması gerektiğini düşünüyorum. Bu nedenle, her zaman görünür olan başka bir ekle düğmesi eklemenin hayati olduğunu düşünüyorum. Bu düğmeyle bir menü öğesi eklenmesi, hiçbir menüye atanmamış bir menü öğesiyle sonuçlanır. Bu durumda, yeni oluşturulan öğeyi tutarak menülerin üzerindeki kısım görünebilir.

Bunun iyi bir fikir olduğunu düşünüyormusun? Henüz bir menü öğesi oluşturulmamışsa görünür olmayacak/yer kaplamayacaktır.

alt text

8
Lukas Oppermann

Menünün yatay düzeninin kafa karıştırıcı olabileceğini düşünüyorum. Birincisi, hiyerarşik mantıklı değil - Neden sadece ilk seviye yatay olarak düzenlenmiş ve diğer seviyeler dikey? Başka bir sorun, daha fazla birinci seviye ürün olduğunda ne olur? Yatay kaydırma çoğu durumda mükemmel bir çözüm değildir. Her şeyi dikey hale getirir ve daha önce yaptığınız gibi alt öğeleri girintiye alırım.

Bence çöp kutusu ve meta menü bölümleri gereksiz. Her menü öğesi için doldurmanız gereken yalnızca 3 girişiniz varsa, çöp kutusundan kurtarma işlemi o kadar büyük değildir. Ayrıca, yeni bir menü oluştururken meta menü bölümünün işlevselliği mevcut bir kopyayı değiştirebilir. (Sitedeki tüm sayfalar otomatik olarak doldurulursa, yine ölçek düşünmeniz gerekir). Her iki bölüm de bir düzenleme menüsü öğesi bölümü ile değiştirilebilir.

Bunun dışında harika görünüyor. Modelinizin sadeliğini seviyorum.

0
Virtuosi Media

Bu ekranlara uzun bir açıklama yapmadan bakarsam, ne yapacağımı, neyi tıklayacağınızı ve siparişin etkileşimin ne olduğunu anlamak zor. Tek başına şunu söylemek gerekir: harika bir kullanıcı arayüzü genellikle minimum açıklamaya ihtiyaç duyar (iPhone veya Wii gibi bir şey düşünün, burada başlamak için bir metin paragrafına ihtiyaç duymadan ne yapmanız çok hızlı bir şekilde açıktır) .

Yapacağım ilk şey, bu ekranları birkaç kişiye (IRL) göstermek ve açıklamanız olmadan nasıl tepki verdiklerini görmek. Anlıyorlar mı? Neye baktıklarını ve onlardan ne beklediklerini biliyorlar mı? Değilse - bir şeyleri açıklamanız gerekiyorsa - o zaman ekranları yeniden düzenlemeyi düşünmelisiniz. Bunu, kullanıcılardan geri bildirim toplayarak veya uygulamanın bir prototipini oluşturarak ve kullanıcıların kullanmasını sağlayarak yapabilirsiniz (onlara ne yapmaları gerektiğini önermeye dikkat edin - yanlarına takılmalarına izin verin).

Bu aşamada aldığınız geri bildirim, buradaki insanların size verebileceği görüşlerden çok daha yararlı olacaktır.

Ayrıca, resimleriniz şu anda siyah beyaz tel çerçeveler olduğundan, tasarıma bakan insanlar için görsel ağırlığı anlamanın, aslına uygunluğu biraz artırmanız, renk eklemeniz ve tipografiyi farklı derecelerde kullanmanızdan daha zor olacağını düşünün. gözlerimin ekran üzerinde nasıl hareket etmesi gerektiğiyle.

2
Rahul

Size (aşağıda olduğu gibi) bazı etkileşimlerle ilgili yardım sunabilirim, ancak ne elde etmeye çalıştığınızı bilmediğim için sadece sınırlı bir kullanım olacaktır. Gerçekten yapmanız gereken, sistemin gereksinimlerini belirtmektir. Kullanıcılarınız neyi başarmaya çalışıyor? Sistemi ne sıklıkla kullanacaklar? Beceri seviyeleri nelerdir? vb.

Örneğin, sistemin seyrek bir kullanıcısı, kullanımlar arasında nasıl kullanılacağını unutabilir, bu nedenle bu durumda arayüzün kullanımını ve alımını çok basit hale getirmeniz gerekir. Ancak, kullanıcılarınız sık sık ziyaret ediyorsa, aşırı basitleştirilmiş bir yaklaşım, kullanıcılar uzun süre yeni başlayanlar için kalmadıkları için sinir bozucu olabilir; çok hızlı bir şekilde ekstra güç isteyen ara kullanıcılar olacaklar. Kullanımı zor bir şey yaptığınızı söylemiyorum ama orta düzey kullanıcılar için ekstra güç ve karmaşıklık eklemekten korkmamalısınız.

Verdiğiniz model açısından, bazı özel öneriler:

  • Atanmamış olanları kaldırın, panelleri kullanıcıya boşaltmak için yeterli alan işlevselliği sunmadığından ekleyin ve çöpe atın.
  • Kullanıcı ekle düğmesini eklemek ve konumlandırmak yerine istediği yere ekleyebilmek için add düğmesini de eklendiği yere yerleştirin.
  • Kullanıcı bir menü öğesini yapılandırmak istediğinde, bilgileri toplamak için alanları içeren gri bir kutu gösterin
  • Her menü öğesine bir düzenleme ve silme düğmesi ekleyin
  • Sözleşme ekleyin ve menüdeki her bir seviyeye genişletme düğmeleri, varsayılan olarak tüm seviyeler sözleşmeli.
  • Daha uzun menü öğeleri için iyi bir alan bırakın
  • Kaydet ve iptal düğmeleri gibi geri alma seçenekleri eklemeyi düşünmelisiniz

Aşağıda mock up: alt text

1
ArchieVersace

Başka bir Güncelleme. alt tree

Ekle düğmesini kaybetmekten emin değilim. Kullanıcılar menü öğelerini nasıl kolayca ekleyebileceklerini anlayabilirler mi?

Ayrıca, menü öğelerini aynı düzey veya alt düzey olarak eklemeyi nasıl mümkün kılabilirsiniz? Şimdi bir tane muhtemelen bana alt seviye olurdu (aslında bunun için düğme biraz sağa taşınmalıdır). Ancak, istediğiniz yere aynı düzeyde yeni bir öğe nasıl eklersiniz?

Altbilgi menüsünde, bir menü öğesini farklı bir konuma sürüklemenin nasıl görüneceğini göstermeye çalıştım.

0
Lukas Oppermann