🎓 Senior 2027 Poster Generator – FCAI CU

A browser-based poster generator built for students of the Faculty of Computers and Artificial Intelligence, Cairo University (FCAI CU).

This project allows students to create personalized Senior 2027 graduation posters by uploading a portrait photo, entering their name, selecting their department, and generating a ready-to-download poster instantly.

---

📖 Usage Guide

Follow these steps to create your Senior 2027 poster:

1. Launch the Application

Open the poster generator in your browser.

You will see:

• Template selection panel
• Photo upload area
• Name input field
• Department selector
• Live preview canvas

---

2. Choose a Template

Select your preferred poster design from the available templates:

• Dark Neon
• Navy & Gold
• Pastel

Each template has a different visual style.

---

3. Prepare Your Photo

Choose a clear portrait photo where:

✅ Face is centered
✅ Lighting is good
✅ Background is simple (preferred)
✅ Image quality is high

Recommended:

• Square or portrait image
• High resolution image

---

4. Optional: Create a Graduation Photo

If your image does not include graduation attire:

1. Upload your photo to :contentReference[oaicite:0]{index=0}
2. Use the built-in graduation prompt helper
3. Generate a graduation portrait
4. Download and use the edited image

Recommended attire:

• Graduation robe
• Graduation cap
• White background

---

5. Upload Your Photo

Click the Photo Upload area.

Supported formats:

• JPG
• PNG
• WEBP

After upload:

• Thumbnail preview appears
• Image becomes ready for poster generation

---

6. Enter Your Name

Type your full name.

Example:

Mohammed Salah

Your name will automatically appear on the poster.

---

7. Select Department

Choose your department from the dropdown list:

• Artificial Intelligence
• Computer Science
• Information Systems
• Information Technology
• Decision Support

The selected department will be displayed on the poster.

---

8. Generate Poster

Click:

✨ Generate Poster

The application will:

• Load selected template
• Crop and position your image
• Render your name
• Render your department
• Update live preview

---

9. Preview Result

Check the generated poster inside the preview area.

Verify:

• Photo position
• Name spelling
• Department selection
• Overall appearance

---

10. Optional: Download Poster

Click:

⬇ Download PNG

The poster will be downloaded as a high-quality PNG image.

You can use it for:

• Social media posts
• Graduation announcements
• Printing
• Senior event promotions

---

11. Send The Poster

Click:

Submit Poster

The poster will be uploaded to the drive so we can use it in the parties

⚠ Best Practices

For best poster quality:

• Use HD images
• Avoid blurry photos
• Use short readable names if possible
• Prefer white or simple backgrounds
• Check spelling before download

---

❓ Troubleshooting

Image not loading?

Check:

• File format
• File size
• Browser compatibility

Poster looks blurry?

Use higher resolution image.

Download button disabled?

Generate the poster first.

---

✨ Features

• Multiple poster templates
• Upload portrait photo
• Automatic circular photo cropping
• Add student name
• Select department
• Live poster preview
• Download poster as PNG
• Graduation photo helper prompt (for ChatGPT image editing)
• Fully client-side (no server required)

---

🛠 Technologies Used

• HTML5
• CSS3
• JavaScript
• Canvas API