EventHub – Smart Event Management System
BSc IT Thesis | ITM Dehradun | 2023–2026
IMAGE IMPLEMENTATION GUIDE
22 14 36
Listed Figures Missing New Recommended Images Total Images Needed
(Must Add — Priority 1) (Add for Completeness) Across All Chapters
Prepared by: Vivek Dharmwan | Enrollment: G23224521074
Supervised by: Dr. Divya Dhyani, HOD-IT, ITM Dehradun
How to Use This Guide
This document lists every image that needs to be added to your EventHub thesis. It is divided into two
groups:
1. GROUP 1 (Red) — 22 figures already listed in your 'List of Figures' table but the actual images
are missing from the document. These are highest priority — examiners will notice these gaps
immediately.
2. GROUP 2 (Yellow) — 14 additional images not yet listed in your document but strongly
recommended to strengthen your thesis quality.
TIP: Start with Chapter 5 diagrams (architecture, DFDs, ER diagram) and Chapter 8 screenshots first
— these are the most visually important sections for your examiners.
GROUP 1 — Listed Figures with Missing Images
These 22 figures are already referenced by number in your thesis text. You MUST insert the actual
images at these locations.
Preview Section (After Chapter 2, ~Pages 36–37)
Located in the 'PREVIEW: SYSTEM INTERFACE SCREENSHOTS' section between Chapter 2 and
Chapter 3. These 6 screenshots give examiners their first visual impression of your system.
Figure Caption Pag What to Create / Show
No. e
Fig. EventHub ~36 Screenshot of the landing page: blue-purple gradient hero section,
P.1 Home Page navbar with search + dark mode toggle, 'Browse Events' and 'Get
Started' buttons, and event cards below
Fig. Login Page ~36 Screenshot of the login form card showing email field, password field
P.2 with the eye icon (visibility toggle), and the Login button
Fig. Registration ~36 Screenshot of the account creation form showing the username,
P.3 Page email, password fields, and the role dropdown (Participant /
Organiser)
Fig. Events ~36 Screenshot of the events discovery page with the search bar at top,
P.4 Listing Page category filter tabs (All / Workshop / Seminar / Technical Fest /
Cultural / Conference / Sports), and event cards
Fig. Create New ~37 Screenshot of the organiser's Create Event form showing all fields
P.5 Event Form including Google Maps URL field and the Indian Rupee (Rs.) pricing
input
Fig. Organiser ~37 Screenshot of the dashboard with the four coloured summary stat
P.6 Dashboard cards: Total Events, Active Events, Total Registrations, Total
Revenue
Chapter 5 — System Design (Pages 67–87)
This is the most diagram-heavy chapter. All 11 UML/DFD diagrams listed below are missing. These are
the most critical for demonstrating your system design skills.
Figure Caption Pag What to Create / Show
No. e
Fig. Three-Tier 67 A layered block diagram: Tier 1 (Presentation — Browser,
5.1 Architecture HTML/CSS/JS, Bootstrap 5, jsQR), Tier 2 (Application Logic —
Diagram Flask Blueprints, SQLAlchemy ORM, OpenCV), Tier 3 (Data —
Figure Caption Pag What to Create / Show
No. e
SQLite DB + File Storage for QR PNGs and face photos). Add
HTTP request/response arrows between tiers
Fig. Level 0 DFD — 70 Single process bubble 'EventHub System' in centre. Two external
5.2 Context entities: 'Participant (Student)' on left and 'Organiser (Faculty)' on
Diagram right. Arrows: Participant sends registration/login/feedback data;
System returns QR code/event list/confirmation. Organiser sends
scan results/event creation; System returns dashboard/reports
Fig. Level 1 DFD — 72 Break system into 5 process bubbles: 1.0 Authentication, 2.0
5.3 Process Event Management, 3.0 Registration and QR, 4.0 Attendance
Decomposition Management, 5.0 Face Recognition. Show 6 data stores: D1
User, D2 Event, D3 Registration, D4 QRCode, D5 Attendance, D6
FaceEmbedding. Connect with labeled data flow arrows
Fig. Level 2 DFD — 74 Expand Process 3.0 into sub-processes: 3.1 Validate User → 3.2
5.4 Registration & Check Capacity → 3.3 Check Duplicate → 3.4 Create Registration
QR Subsystem → 3.5 Generate QR Image → 3.6 Save QR Record → 3.7 Return
Confirmation. Show reads/writes to D2 (Event), D3 (Registration),
D4 (QRCode) data stores
Fig. Entity- 76 Draw 7 entity boxes: User, Event, EventRegistration, QRCode,
5.5 Relationship Attendance, EventFeedback, FaceEmbedding. Relationships:
(ER) Diagram User 1:M Event (organises), User 1:M EventRegistration, Event
1:M EventRegistration, EventRegistration 1:1 QRCode,
EventRegistration 1:1 Attendance, User 1:1 FaceEmbedding.
Include primary keys and key attributes in each entity box
Fig. Use Case 79 Actor: Participant. Use cases inside system boundary: Register
5.6 Diagram — Account, Login, Browse Events, Search/Filter Events, Register for
Participant Event, Download QR Code, Upload Face Photo, Submit
Module Feedback, View My Registrations. Draw extends/includes where
applicable
Fig. Use Case 80 Actor: Organiser (inherits Login from Participant). Use cases:
5.7 Diagram — Create Event, Edit/Delete Event, View Registrations, Open QR
Organiser Scanner, Scan QR Code, Verify Face, View Attendance Records,
Module View Feedback Report, View Dashboard Statistics
Fig. Sequence 83 Swimlanes: Browser | Flask Auth Route | Flask-Login |
5.8 Diagram — SQLAlchemy | SQLite DB. Sequence: POST /auth/login → query
User Login User by email → compare PBKDF2 hash → login_user() sets
Flow session → redirect to home with session cookie. Show return
messages on each step
Fig. Sequence 84 Swimlanes: Browser | Registration Route | SQLAlchemy | QR
5.9 Diagram — QR Generator | File System. Sequence: POST /register → flush() to
Code get [Link] → generate_qr_code([Link]) → save PNG to
Generation static/qrcodes/ → create QRCode model record → commit() →
return confirmation page with QR download link
Fig. Activity 86 Flowchart: Start → [User logged in? No → redirect to login] →
5.10 Diagram — [Event exists?] → [Event full? Yes → show error] → [Already
Event registered? Yes → show duplicate message] → Create
Registration Registration record → Generate QR PNG → Show Confirmation
Figure Caption Pag What to Create / Show
No. e
Flow page with download link → End
Fig. Activity 87 Flowchart: Start → Capture live camera image → Detect face with
5.11 Diagram — OpenCV Haar cascade → [Face found? No → show error, ask for
Face better photo] → Extract face region → Convert to grayscale +
Verification histogram equalise → Resize 128x128 → Flatten + L2-normalise
Flow → Retrieve stored FaceEmbedding from DB → Compute cosine
similarity → [Similarity >= 0.75? Yes → Verified / No → Not
Verified] → Return JSON result → End
Chapter 6 — System Implementation (Pages 100–125)
Four implementation diagrams are listed but missing. These show how your code is structured and how
key algorithms work.
Figure Caption Pag What to Create / Show
No. e
Fig. Project 100 A tree diagram of the folder layout: EventHub/ → [Link],
6.1 Directory [Link], [Link], blueprints/ (auth/, events/,
Structure registration/, attendance/, face/, feedback/ — each with
[Link]), [Link], utils/ (qr_generator.py, face_utils.py),
templates/, static/ (css/, js/, qrcodes/, uploads/faces/). Can be a
styled VS Code Explorer screenshot or a drawn tree
Fig. Flask 103 Flowchart: create_app() called → Config loaded from .env →
6.2 Application SQLAlchemy db.init_app(app) → Flask-Login LoginManager init
Initialization → Register 6 Blueprints with URL prefixes (auth_bp, events_bp,
Flow reg_bp, attendance_bp, face_bp, feedback_bp) → db.create_all()
creates tables → App instance returned → Ready to serve
requests
Fig. QR Code 119 Flowchart: Input: registration_id (int) → Build qr_data =
6.3 Generation 'EVENTHUB-REG-{id}' → Instantiate QRCode(version=1,
Algorithm error_correction=L, box_size=10, border=4) →
Flowchart qr.add_data(qr_data) → [Link](fit=True) →
qr.make_image(fill=black, back=white) → Save PNG to
static/qrcodes/qr_{id}.png → Return dict {qr_data, qr_image_path}
Fig. Face 125 Two-part: ENROLLMENT — Upload JPEG/PNG → [Link]()
6.4 Recognition → cvtColor(GRAY) → equalizeHist() → detectMultiScale (Haar
Pipeline cascade, minSize 50x50) → Select largest face by area → crop
Flowchart face region → resize(128,128) → flatten to 16384-dim vector →
L2-normalise → JSON-serialise → store in FaceEmbedding table.
VERIFICATION — Decode base64 camera image → same
OpenCV pipeline → retrieve stored embedding →
cosine_similarity() dot product → compare threshold 0.75 →
return {verified: bool, similarity: float}
Chapter 8 — Results and Discussion (Pages 167–175)
Six application screenshots are listed but missing. These are the most impactful pages for your
examiner — they visually prove your system works.
Figure Caption Pag What to Create / Show
No. e
Fig. Home Page — 167 Full-width screenshot of the running application home page. Must
8.1 EventHub show: blue-purple gradient hero section, navbar with EventHub
Landing Screen logo, search bar, dark mode toggle and Login/Register buttons,
'Browse Events' and 'Get Started' call-to-action buttons, and the
event cards grid below the hero
Fig. Login Page — 169 Screenshot of the login form card layout. Must show: 'Login to
8.2 User EventHub' heading, email/username field, password field with the
Authentication eye-icon visibility toggle button, 'Remember Me' checkbox, Login
Screen button, and a link to the registration page
Fig. Registration 170 Screenshot of the account creation form. Must show: all input
8.3 Page — Create fields (username, full name, email, password, confirm password),
an Account the Role dropdown with 'Participant' and 'Organiser' options
Form visible, and the Register button
Fig. Events Listing 172 Screenshot of the events discovery page. Must show: the search
8.4 Page — input bar at the top, category filter tabs or buttons (All /
Discover Workshop / Seminar / Technical Fest / Cultural / Conference /
Events Sports), and at least 3 event cards displaying event name,
category badge, date, venue, capacity, and registration button
Fig. Create New 173 Screenshot of the organiser's Create Event form. Must show:
8.5 Event Form — Event Title, Description, Category dropdown, Date/Time fields,
Organiser Venue, Capacity, Google Maps URL field, Entry Fee field with Rs.
Interface symbol, and the Submit/Create Event button
Fig. Organiser 175 Screenshot of the organiser dashboard. Must show: the four
8.6 Dashboard — coloured summary stat cards at the top (Total Events in blue,
Analytics Active Events in green, Total Registrations in orange, Total
Overview Revenue in purple), followed by the events management table
with columns for event name, registrations, status, and action
buttons
GROUP 2 — New Recommended Images (Not Yet Listed)
These 14 images are not in your current List of Figures but are strongly recommended to add. They
will significantly strengthen your thesis and improve your examiner's understanding.
Chapter 1 — Introduction (~Pages 3–4)
Suggested Topic Recommen What to Create / Show
Figure ded Page
Fig. 1.1 Traditional ~4 A two-column side-by-side comparison diagram. LEFT
vs EventHub COLUMN (Manual/Paper): Paper form → Printed list →
Process Manual name check → Sign-in sheet → Paper
Comparison feedback collection → Manual compilation. RIGHT
Diagram COLUMN (EventHub/Digital): Web registration form →
DB stored automatically → QR code scan → Auto
attendance logged → Digital feedback → Instant
analytics. Use red/orange for left side and blue/green
for right side. Directly visualises the core problem your
thesis solves
Chapter 2 — Literature Review (~Pages 25–31)
Suggested Topic Recommen What to Create / Show
Figure ded Page
Fig. 2.1 QR Code ~26 A labelled diagram of a QR code showing its five
Anatomy structural components with arrows pointing to each: (1)
Diagram Finder Patterns — the three identical square patterns in
the three corners, (2) Alignment Pattern — the smaller
square ensuring accurate decoding when distorted, (3)
Timing Patterns — alternating dark/light strip between
finder patterns, (4) Data Modules — the main grid of
dark/light squares encoding the data, (5) Quiet Zone —
the mandatory blank border around the entire code.
Your Section 2.5.1 explains all these in detail — a
diagram makes it instantly clear
Fig. 2.2 Face ~30 A horizontal timeline from left (1966) to right (2019+)
Recognition showing key milestones: Bledsoe (1966) — manual
Evolution landmark geometry; Eigenfaces/PCA (1991) —
Timeline appearance-based approach; Fisher Faces (1997);
LBPH (2006) — illumination-robust; Viola-Jones
Detector (2001); DeepFace CNN (2014) — 97.35%
LFW accuracy; FaceNet + triplet loss (2015) — 99.63%
LFW; ArcFace (2019) — 99.83% LFW. Mark
EventHub's approach on the timeline (OpenCV Haar +
cosine similarity, ~85-90% accuracy). Your Sections
Suggested Topic Recommen What to Create / Show
Figure ded Page
2.6.1 and 2.6.2 cover this history — a timeline makes it
scannable
Chapter 3 — System Analysis (~Page 50)
Suggested Topic Recommen What to Create / Show
Figure ded Page
Fig. 3.1 Agile Sprint ~50 A horizontal Gantt/timeline chart showing the full 22-
Gantt Chart week development schedule. Bars for each phase:
Requirements and Analysis (Weeks 1–2), System
Design (Weeks 3–5), Sprint 1 Auth and Event CRUD
(Weeks 6–7), Sprint 2 Registration and QR (Weeks 8–
9), Sprint 3 Attendance and Scanner (Weeks 10–12),
Sprint 4 Face Recognition (Weeks 13–15), Sprint 5
Feedback and UI Polish (Weeks 16–17), Testing and
Bug Fixing (Weeks 18–20), Documentation and Thesis
(Weeks 21–22). Your Table 3.4 already has this data
— a Gantt chart is far more impactful visually
Chapter 6 — Implementation (Additional Screenshots, ~Pages 121–132)
Suggested Topic Recommen What to Create / Show
Figure ded Page
Fig. 6.5 QR Scanner ~121 Screenshot of the organiser's live QR scanning page.
Interface Must show: the live camera video feed displayed in the
Screenshot browser, the scanning status indicator, the CSRF token
field (hidden), and the result display area below the
camera where check-in success/failure messages
appear. This is one of the most innovative features of
your system — it deserves a screenshot
Fig. 6.6 Sample ~119 An actual QR code image generated by your system
Generated (e.g., encoding 'EVENTHUB-REG-7') displayed as a
QR Code 200x200px image. Add a caption below explaining:
Output 'Sample QR code encoding the string EVENTHUB-
REG-7, generated by the Python qrcode library at
version=1, error_correction=L, box_size=10, border=4'.
Very simple to add and makes the QR generation
section concrete
Fig. 6.7 Face Upload ~124 Screenshot of the participant's face photo
Interface upload/enrollment page. Must show: the file input
Screenshot button for JPEG/PNG selection, a preview of the
uploaded photo, file size and format validation
messages, and the 'Upload and Enroll' button. Also
ideally show what happens after successful upload
Suggested Topic Recommen What to Create / Show
Figure ded Page
(face detected confirmation message)
Chapter 7 — System Testing (~Pages 158–165)
Suggested Topic Recommen What to Create / Show
Figure ded Page
Fig. 7.1 Test Results ~158 A grouped bar chart showing test pass/fail counts per
Summary module. X-axis: Authentication (10 cases), Event
Bar Chart Management (8), Registration and QR (8), Attendance
(6), Face Recognition (5), Feedback (5). Y-axis:
Number of test cases. Two bars per group: Passed
(green) and Failed (red/orange). Add a reference line
or annotation showing the 97.6% overall pass rate.
Your Tables 7.5 through 7.10 contain all the data
needed
Fig. 7.2 Performance ~159 A horizontal bar chart showing response times for each
Testing operation type. Operations: User Login (0.3s), Event
Response List Load (0.4s), Event Registration (0.6s), QR Code
Time Chart Generation (0.8s), QR Scan and Validation (0.5s),
Face Photo Enrollment (1.8s), Face Verification (2.1s).
Add a vertical dashed red line at the 3-second
threshold. Color bars green if under 1s, yellow if 1–2s,
orange if 2–3s. Data is from your Table 7.11
Fig. 7.3 UAT ~164 A horizontal bar chart showing UAT satisfaction scores
Satisfaction per feature area based on the 10 participants. Feature
Ratings areas: Overall UI Design, Event Registration Process,
Chart QR Code Download, QR Scanning Ease, Face
Verification, Feedback Submission, Dashboard
Analytics, Dark Mode, Mobile Responsiveness, Overall
Satisfaction. Show scores out of 5.0. Highlight the
overall average of 4.66/5.0. Data is from your Table
7.13
Chapter 8 — Results (Additional Screenshots, ~Pages 175–180)
Suggested Topic Recommen What to Create / Show
Figure ded Page
Fig. 8.7 QR Code ~175 Screenshot of the page shown to a participant
Confirmation immediately after successful event registration. Must
/ Download show: the event name, the participant's registration ID,
Page the generated QR code image displayed on screen,
and the 'Download QR Code' button. This page is the
direct output of your QR generation module and closes
the loop visually for the reader
Suggested Topic Recommen What to Create / Show
Figure ded Page
Fig. 8.8 Dark Mode ~177 Screenshot of any page (preferably the Events Listing
Interface page or Organiser Dashboard) with dark mode
Screenshot enabled. The dark background (--bg-color variable)
should be clearly visible. This is a distinct selling point
of your system mentioned multiple times in the thesis
— a visual screenshot proves it works and looks
professional
Fig. 8.9 Mobile ~178 A screenshot of EventHub displayed on a narrow
Responsive mobile screen (320px–480px viewport width). Show
View either the home page or the events listing page. The
Screenshot navbar should have collapsed to a hamburger menu,
and cards should be stacked vertically in a single
column. This directly demonstrates the Bootstrap 5
responsive design you describe in Sections 1.1 and 4.4
Fig. 8.10 Feedback ~180 Screenshot of the attendance-verified feedback
Submission submission form. Must show: the event name at the
Form top, the 1–5 star rating input (or radio buttons), the
Screenshot optional text comment textarea with character limit
indicator, and the Submit Feedback button. Ideally also
show a note or badge confirming the user's attendance
was verified before the form was shown
Complete Summary — All 36 Images
Use this as a checklist. Tick off each image as you add it to your thesis document.
# Figure Chapter / Section Image Type Priority
1 Fig. P.1 Preview — Home Page Application MUST ADD
Screenshot Screenshot
2 Fig. P.2 Preview — Login Page Application MUST ADD
Screenshot Screenshot
3 Fig. P.3 Preview — Registration Application MUST ADD
Page Screenshot Screenshot
4 Fig. P.4 Preview — Events Application MUST ADD
Listing Page Screenshot
5 Fig. P.5 Preview — Create Event Application MUST ADD
Form Screenshot
6 Fig. P.6 Preview — Organiser Application MUST ADD
Dashboard Screenshot
7 Fig. 5.1 Ch.5 — Three-Tier Architecture MUST ADD
Architecture Diagram
8 Fig. 5.2 Ch.5 — Level 0 DFD DFD Diagram MUST ADD
Context Diagram
9 Fig. 5.3 Ch.5 — Level 1 DFD DFD Diagram MUST ADD
Decomposition
1 Fig. 5.4 Ch.5 — Level 2 DFD DFD Diagram MUST ADD
0 Registration/QR
1 Fig. 5.5 Ch.5 — ER Diagram Database Diagram MUST ADD
1
1 Fig. 5.6 Ch.5 — Use Case UML Diagram MUST ADD
2 Participant
1 Fig. 5.7 Ch.5 — Use Case UML Diagram MUST ADD
3 Organiser
1 Fig. 5.8 Ch.5 — Sequence UML Diagram MUST ADD
4 Diagram Login
1 Fig. 5.9 Ch.5 — Sequence UML Diagram MUST ADD
5 Diagram QR Generation
1 Fig. 5.10 Ch.5 — Activity Diagram UML Diagram MUST ADD
6 Registration
1 Fig. 5.11 Ch.5 — Activity Diagram UML Diagram MUST ADD
7 Face Verify
# Figure Chapter / Section Image Type Priority
1 Fig. 6.1 Ch.6 — Project Directory Diagram / MUST ADD
8 Structure Screenshot
1 Fig. 6.2 Ch.6 — Flask Flowchart MUST ADD
9 Initialization Flowchart
2 Fig. 6.3 Ch.6 — QR Generation Flowchart MUST ADD
0 Algorithm Flowchart
2 Fig. 6.4 Ch.6 — Face Flowchart MUST ADD
1 Recognition Pipeline
2 Fig. 8.1 Ch.8 — Home Page Application MUST ADD
2 Screenshot Screenshot
2 Fig. 8.2 Ch.8 — Login Page Application MUST ADD
3 Screenshot Screenshot
2 Fig. 8.3 Ch.8 — Registration Application MUST ADD
4 Page Screenshot Screenshot
2 Fig. 8.4 Ch.8 — Events Listing Application MUST ADD
5 Page Screenshot
2 Fig. 8.5 Ch.8 — Create Event Application MUST ADD
6 Form Screenshot
2 Fig. 8.6 Ch.8 — Organiser Application MUST ADD
7 Dashboard Screenshot
2 Fig. 1.1 Ch.1 — Traditional vs Process Diagram RECOMMEN
8 (NEW) Digital Comparison DED
2 Fig. 2.1 Ch.2 — QR Code Technical Diagram RECOMMEN
9 (NEW) Anatomy Diagram DED
3 Fig. 2.2 Ch.2 — Face Timeline Diagram RECOMMEN
0 (NEW) Recognition Timeline DED
3 Fig. 3.1 Ch.3 — Agile Sprint Gantt Chart RECOMMEN
1 (NEW) Gantt Chart DED
3 Fig. 6.5 Ch.6 — QR Scanner Application RECOMMEN
2 (NEW) Interface Screenshot DED
3 Fig. 6.6 Ch.6 — Sample QR Generated Image RECOMMEN
3 (NEW) Code Output DED
3 Fig. 6.7 Ch.6 — Face Upload Application RECOMMEN
4 (NEW) Interface Screenshot DED
3 Fig. 7.1 Ch.7 — Test Results Bar Chart / Graph RECOMMEN
5 (NEW) Chart DED
3 Fig. 7.2 Ch.7 — Performance Chart / Graph RECOMMEN
6 (NEW) Response Times Chart DED
3 Fig. 7.3 Ch.7 — UAT Satisfaction Chart / Graph RECOMMEN
7 (NEW) Ratings Chart DED
# Figure Chapter / Section Image Type Priority
3 Fig. 8.7 Ch.8 — QR Confirmation Application RECOMMEN
8 (NEW) / Download Page Screenshot DED
3 Fig. 8.8 Ch.8 — Dark Mode Application RECOMMEN
9 (NEW) Screenshot Screenshot DED
4 Fig. 8.9 Ch.8 — Mobile Application RECOMMEN
0 (NEW) Responsive View Screenshot DED
4 Fig. 8.10 Ch.8 — Feedback Application RECOMMEN
1 (NEW) Submission Form Screenshot DED
Document generated for: EventHub – Smart Event Management System with QR Code & Face
Verification | Vivek Dharmwan, G23224521074 | BSc IT 2023–2026 | ITM Dehradun