Ana içeriğe geç

Arayüz Rehberi

Perigma, masaüstü uygulamalarda, mobil cihazlarda ve web tarayıcılarda kullanım kolaylığı sağlayan duyarlı (responsive) bir arayüze sahiptir. Bu rehberde, arayüzün ana bileşenlerini ve nasıl kullanılacağını öğreneceksiniz.


Masaüstü Arayüzü

Masaüstü uygulamalarda ve web tarayıcıda (app.perigma.com) Perigma, üç ana bölümden oluşur:

1. Sol Kenar Çubuğu (Sidebar)

Sol tarafta bulunan gezinme menüsü, rolünüze göre erişebileceğiniz tüm bölümleri listeler. Menü öğeleri aşağıdaki ana bölümlere ayrılır:

  • Benim (Öğrenci/Veli): Kişisel işlemleriniz
  • Genel Bakış (Yönetim): Kontrol paneli
  • Kişiler: Öğrenci, veli, personel yönetimi
  • Akademik: Ders ve grup işlemleri
  • Operasyonlar: Yoklama, planlama, ödev ve sınav işlemleri
  • Yemekhane: Yemekhane yönetimi
  • İletişim: Duyuru ve SMS
  • Finans: Sözleşme ve ödeme takibi
  • Kurum: Kurum yapılandırması
  • Hesap: Profil ayarları

Resim 1: Masaüstü arayüzü — sol menü, üst çubuk ve ana içerik alanı

2. Üst Çubuk (Top Bar)

Ekranın üst kısmında bulunan çubukta şunlar yer alır:

ÖğeAçıklama
Kurum AdıAktif kurumunuzun adı görüntülenir
Profil AvatarıProfil fotoğrafınız veya baş harfleriniz; tıklayarak profil menüsüne erişirsiniz

3. Ana İçerik Alanı

Seçtiğiniz sayfanın içeriği burada gösterilir. Her sayfanın üst kısmında genellikle şunlar bulunur:

  • Sayfa başlığı ve açıklaması
  • Eylem butonları (yeni kayıt oluşturma, filtreleme vb.)
  • Liste veya detay görünümü

Web Arayüzü

Perigma'nın web sürümüne app.perigma.com adresinden herhangi bir güncel tarayıcı ile erişebilirsiniz. Web arayüzü, masaüstü uygulamanın aynı deneyimini sunar:

  • Kurulum gerektirmez — tarayıcınızı açıp hemen kullanmaya başlayabilirsiniz
  • Masaüstü arayüzündeki sol kenar çubuğu, üst çubuk ve ana içerik alanı aynı şekilde görüntülenir
  • Tarayıcı penceresini küçülttüğünüzde arayüz otomatik olarak mobil düzene geçer
  • Oturumunuz tarayıcıda güvenli bir şekilde saklanır; sayfayı yenilediğinizde tekrar giriş yapmanız gerekmez
Hızlı Erişim

Tarayıcınızda app.perigma.com adresini yer imlerinize ekleyerek Perigma'ya tek tıkla erişebilirsiniz.


Mobil Arayüzü

Mobil cihazlarda arayüz, küçük ekrana optimize edilmiştir:

Alt Gezinme Çubuğu (Bottom Nav)

Ekranın alt kısmında rolünüze göre 5 ana kısayol gösterilir:

Öğrenci/Veli için:

SimgeSayfa
🏠Ana Sayfa
📝Ödevler
Yoklama
💰Ödemeler
Daha Fazla

Yönetim Rolleri için:

SimgeSayfa
📊Gösterge Paneli
👥Öğrenciler
Yoklama
📝Ödevler
Daha Fazla

Resim 2: Mobil arayüz — alt gezinme çubuğu gösterimi

Daha Fazla Menüsü

Alt çubuktaki "Daha Fazla" butonuna tıkladığınızda, tüm menü seçeneklerine erişebileceğiniz genişletilmiş bir menü açılır. Bu menüde ayrıca uygulamanın versiyon bilgisi de yer alır.

Resim 3: "Daha Fazla" menüsü — tüm erişilebilir bölümlerin listesi


Ortak Arayüz Bileşenleri

Sayfa Başlığı

Her sayfanın üst kısmında sayfa adı, kısa açıklaması ve varsa eylem butonları (örneğin "Yeni Öğrenci Ekle") bulunur.

Resim 4: Sayfa başlığı örneği — başlık, açıklama ve eylem butonları

Listeler ve Tablo Görünümü

Öğrenci, ödev, sınav gibi listeleme sayfalarında veriler tablo formatında gösterilir. Listelerde:

  • Sayfalama kontrolleri ile önceki/sonraki sayfaya geçiş yapabilirsiniz
  • Her sayfada varsayılan olarak 20 kayıt gösterilir

Boş Durum Ekranı

Henüz kayıt bulunmayan sayfalarda, ne yapmanız gerektiğini açıklayan bir bilgi mesajı gösterilir.

Resim 5: Boş durum ekranı — "Henüz kayıt bulunmuyor" mesajı

Yükleniyor Animasyonu

Veriler yüklenirken iskelet yapısında (skeleton) bir yükleniyor animasyonu gösterilir.

Bildirim Mesajları (Toast)

İşlemlerinizin sonucunda ekranın bir köşesinde kısa süreli bilgi mesajları belirir:

TürRenkAçıklama
BilgiMaviGenel bilgilendirme
BaşarılıYeşilİşlem başarıyla tamamlandı
UyarıSarıDikkat edilmesi gereken bir durum
HataKırmızıİşlem sırasında bir hata oluştu

Bazı işlemler (silme onayı, detay görüntüleme gibi) modal pencereler içinde açılır. Modal pencereyi kapatmak için "Kapat" veya "İptal" butonunu kullanabilirsiniz.

Arama

Sol menüdeki veya üst çubuktaki arama alanını kullanarak hızlıca kayıt arayabilirsiniz.

Resim 6: Global arama çubuğu ve arama sonuçları


Hata Durumları

Bir hata oluştuğunda, sayfada hata mesajı ve "Tekrar Dene" butonu gösterilir. Bu butona tıklayarak işlemi tekrarlayabilirsiniz.

Resim 7: Hata ekranı — hata mesajı ve "Tekrar Dene" butonu


Güncelleme Bildirimi

Perigma uygulamasının yeni bir sürümü yayınlandığında, uygulama sizi bilgilendirir:

  • Önerilen güncelleme: İsteğe bağlı olarak güncelleyebilirsiniz
  • Zorunlu güncelleme: Uygulamayı kullanmaya devam etmek için güncellemeniz gerekmektedir
Web sürümü

Web sürümü (app.perigma.com) her zaman en güncel sürümü sunar; ayrıca güncelleme yapmanıza gerek yoktur.

Resim 8: Zorunlu güncelleme bildirimi ekranı