• Home
  • Portfolio
  • Projects
  • Certificates
  • Contact
  • More
    • Home
    • Portfolio
    • Projects
    • Certificates
    • Contact
  • Home
  • Portfolio
  • Projects
  • Certificates
  • Contact

Discharge Lounge project

Discharge Lounge project

Discharge Lounge project

Discharge Lounge project

Discharge Lounge project

Discharge Lounge project

Discharge Lounge project

Home Page,

I designed a web page for the "Discharge Lounge" in a healthcare environment with a simple design and soft colors, primarily consisting of light beige, white, and soft gray shades.


Main Elements:

  • Header Section:

   - Light beige background with navigation tabs: "Home, Patient Admission, Attendance Confirmation, and Contact Us on the left.

   - King Fahd Medical City logo on the right.

  • Text Content :

   - "Discharge Lounge" title centered in a delicate gray font.

   - A paragraph describing the purpose of the lounge, focusing on comfort and patient support.

  • Lounge Images:

   - Four different angles showing soft beige seating, neutral-colored tables, white walls, and large windows.

   - Indoor plants adding a serene aesthetic touch.


The overall design aims to create a calm and welcoming atmosphere suitable for patient comfort.

View Discharge Lounge Project

Home Page

I designed a web page showcasing the "Benefits of the Discharge Lounge" with a consistent design and calm colors, featuring a light beige background and simple text boxes.

 Main Elements:

  • Title :

   - "Benefits of the Discharge Lounge" centered at the top in an elegant gray font.

  • Design and Colors :

   - Three text boxes displayed side by side, each with rounded edges and a soft beige background, creating a pleasant contrast with the main page background.

   - Each box covers a specific benefit, presented in a calm style, focusing on patient comfort, relaxation, and access to guidance.


The overall design maintains a serene and organized aesthetic, using neutral colors to convey information clearly and comfortably.

Admit Patient Page

The image shows the patient management interface in the hospital, focusing on the "Patient Admission" form within a web-based healthcare management application. The form includes the following main elements:

  • Form Fields :

   - Includes information such as Patient ID, medical record number, first name, last name, national ID number, gender, date of birth, phone number, admission date, discharge date, status, and notes. These fields help organize patient records accurately.

  • Status Dropdown :

   - Allows for selecting the current status of the patient, such as "Pending" or "Discharge On Hold."

  • Action Buttons :

   - Includes : Submit, Update, and Delete buttons, enabling staff to save new patient data, modify existing information, or delete entries easily.


Benefits :

- Effective Data Management : Simplifies the patient admission process by organizing all essential information in a single structured form.

- Improved Accuracy : Reduces errors by providing dedicated fields for each data point.

- Ease of Navigation and Updating : Allows staff to efficiently submit, modify, or delete patient records without switching between multiple screens.

-  Streamlined Communication : Supports quick decision-making and communication within the healthcare team with clear labels and dropdown menus.

-  Enhanced Patient Experience : Quick access to information can expedite patient processing and improve healthcare services.

Confirm Attendance Page

The image shows the "Discharge Lounge Confirmation" page from the healthcare management application, allowing staff to search for patients and update their discharge status.


 Main Elements:

  • Search Bar :

   - A dropdown menu to select search criteria (national ID number or medical record number(MRN)) with an input field, facilitating quick identification of patient records.


  • Patient Information Table :

   - Displays key details such as: Patient ID, medical record number, first name, last name, national ID, gender, date of birth, age, phone number, admission date, discharge date, and status. 

   - Each row corresponds to a patient record, providing necessary information for processing discharges.


  • Status Update Column :

   - Includes a "Discharge" button that allows staff to confirm a patient’s discharge with one click, automatically updating the status to " Discharged from DL " and adding the date and time of arrival.


Benefits :

- Quick Patient Search : The search bar enables staff to quickly locate patient records using the medical record number.

- Comprehensive Information : The table layout presents essential patient information at a glance, aiding quick decision-making.

- Efficient Discharge Process : The "Discharge" button simplifies updating the patient’s status, making the discharge process faster.


Overall, the interface is designed for ease of use and supports efficient patient discharge management.

Contact Page

  • Contact Information :

  1.    - Phone : Displays the contact phone number.
  2.    Email : Provides an email address for direct communication.
  3.    LinkedIn : A link to Aryaf Al-joudi LinkedIn profile for professional networking.


  • Navigation Tabs :

   - Located at the top, with options like : Home, Patient Admission, Attendance Confirmation, Contact Us , allowing users to easily switch between sections of the application.


  •  Footer :

   - Displays the designer's name ("Designed by: Aryaf Al-Joudi") and the year (2024), enhancing creator attribution and providing a timestamp for the design.


This contact page is clear yet essential for facilitating communication between users and the application designer, enhancing overall user support and application reliability.

sql Database

Database after adding a patient to try the program under the name Aryaf Al-joudi and before confirming attendance at the lounge

sql Database

The database after adding a patient for testing the program named  Aryaf Al-joudi , and after confirming attendance at the Discharge Lounge, shows that the status has changed to (Discharged from DL) and the date and time have been automatically recorded after clicking the "Discharged" button.


Copyright © 2024 Aryaf - All Rights Reserved.