P#142 – Elghansa Info

Elghansa Info - iOS Dashboard Application

Overview

Elghansa Info is a sleek, native iOS and iPadOS application designed to act as a real-time informational dashboard. Built from the ground up to provide users with immediate access to critical system statuses, server metrics, or operational data, the app combines a highly responsive user interface with automated background data synchronization.

The application was designed with a strong focus on user experience (UX) and modern iOS design principles. It features a custom "glassmorphism" aesthetic with deep blue gradient backgrounds, dark translucent data cards, and vibrant accent colors to ensure high readability and a premium feel.

Key Features

  • Dynamic Data Dashboard: The home screen features an adaptive grid layout (LazyVGrid) that dynamically adjusts to different screen sizes, providing a clean, at-a-glance overview of various operational metrics using highly recognizable SF Symbols.
  • Real-Time & Automated Synchronization: The app fetches live data from a remote server. Users can manually trigger a refresh or rely on the automated polling system.
  • Customizable User Preferences: Includes a dedicated Settings module where users can define their preferred auto-refresh intervals (ranging from 1 minute to 1 hour). These preferences are persistently saved using native device storage.
  • Detailed Insights (Drill-down UI): Tapping on any summary card navigates the user to a comprehensive Detail View. This screen provides expanded descriptions and in-depth data, presented within a clean, focused, single-card layout.
  • Modern, Themed UI: Moving away from standard iOS default colors, the app employs a custom visual identity. It utilizes a striking top-to-bottom linear gradient (#4C91C8 to #4683BC) and dark mode-inspired info cards (#14243D) with subtle translucent strokes and drop shadows, ensuring the UI is both beautiful and accessible.
  • iPadOS Optimized: The application is fully optimized for iPad, gracefully handling split-view navigation and larger screen real estate to maximize data visibility without stretching or distorting UI elements.

    Tech Stack & Architecture

    Core Technologies:

    • Language: Swift
    • UI Framework: SwiftUI
    • Target Platforms: iOS 15.6+, iPadOS 15.6+

    Architecture & State Management:

    • Design Pattern: MVVM (Model-View-ViewModel) architecture to cleanly separate the UI layers from the business logic and data fetching mechanisms.
    • State Management: Utilized modern SwiftUI property wrappers including @State@StateObject, and @Environment.
    • Persistent Storage: Leveraged @AppStorage (UserDefaults) for lightweight, reactive storage of user configuration settings.

    UI / UX Components:

    • Layouts: NavigationViewScrollViewLazyVGridZStackVStack, and HStack for complex, adaptive layouts.
    • Styling: Deep customization of UIKit's UINavigationBarAppearance and UISplitViewController to enforce global color themes across standard SwiftUI navigation components, bridging the gap between iOS 15 constraints and modern design needs.
    • Iconography: Extensive use of Apple's SF Symbols with custom rendering modes (.monochrome), dynamic sizing, and layered translucent backgrounds for a polished look.

    Deployment & Distribution:

    • Configured Custom App IDs, App Store Connect records, and Provisioning Profiles.
    • Managed both TestFlight distribution for external beta testing and Ad Hoc (OTA) distribution via custom-signed .ipa files for direct client delivery and internal device testing.

Tech stack: Swift, SwiftUI, MVVM Architecture, iOS / iPadOS 15.6+, @AppStorage (UserDefaults), JSON, SF Symbols, UIKit (Appearance Proxies), TestFlight, Ad Hoc (OTA) Distribution