Programme : Computer Engineering Academic Year:2024-25
Program Code: CO4K Semester : IV
Course: UI/UX Designing Course Code : (314005)
MICROPROJET REPORT ON
Title of Micro-Project : Airline Reservation System
Submitted by the group of_5_Students
Group no: 19
Sr. Roll Enrollment Seat
Name of Student
No No No No
1 109 Sonar Sahil Mahendra 23610960287 405641
2 111 Sonawane Shantanu Gokul 23610960289 405643
3 113 Pardeshi Sujal Nitin 23610960291 405645
4 114 Thakare Amit Ravindra 23610960292 405646
5 119 Upasani Durgesh Pradip 23610960297 405651
Under the Guidance of
Mr . Ankit Agrawal
in
Three Years Diploma Programme in Engineering and Technology of Maharashtra
State Board of Technical Education, Mumbai (Autonomous) ISO 9001: 2008
(ISO/IEC-27001:2013)
at
Shri Shivaji Vidya Prasarak Sanstha’Bapusaheb Shivajirao Deore
Polytechnic PatilVidyanagari, Deopur, Dhule- 424005
Department of Computer Engineering 1
MAHARASHTRA STATE BOARD OF
TECHNICAL EDUCATION, MUMBAI
Certificate
This is to certify that,
Sr. Roll Enrollment Seat
Name of Student
No No No No
1 109 Sonar Sahil Mahendra 23610960287 405641
2 111 Sonawane Shantanu Gokul 23610960289 405643
3 113 Pardeshi Sujal Nitin 23610960291 405645
4 114 Thakare Amit Ravindra 23610960292 405646
5 119 Upasani Durgesh Pradip 23610960297 405651
Students of Fourth Semester, Diploma Programme in Engineering &
Technology at 0059-Shri Shivaji Vidya Prasarak Sanstha’s Bapusaheb
Shivajirao Deore Polytechnic-Dhule, has completed the Micro Project
satisfactorily in Subject Education) in the academic year 2024-2025 as
prescribed in the MSBTE curriculum of K Scheme.
Place : Dhule
Date : / / 2025
Project Guide Head of the Department
Principal
Department of Computer Engineering 2
Seal of
Institute
Introduction
What is Figma
Figma is a cloud-based design tool used for UI/UX design, prototyping, and
collaboration. Think of it like a super-powered digital whiteboard where teams can design
apps, websites, and more together in real-time. It's popular because it runs in the browser, so
no installs are needed, and it works great for teams.
Features of Figma:
Web-based & cross-platform (works on any device with a browser)
Real-time team collaboration
Developer handoff with code inspection
Reusable components and design systems
What is Components
In Figma, Components are reusable design elements that help maintain consistency
across a project. They work like templates—you create a main component and then use
instances of it throughout your design.
What is a Plugin
A plugin in Figma is an add-on tool that extends Figma’s functionality. Plugins help
automate tasks, improve design workflow, and add extra features that Figma doesn’t
have by default.
What is Prototype
A prototype in Figma is an interactive version of your design that simulates how a
real app or website would work — without writing any code.
What is a Variant
A Variant in Figma is a way to group multiple versions of a Component (like
buttons, toggles, or cards) into one organized element. It helps you manage different
states, sizes, or types of a component without cluttering your file.
Department of Computer Engineering 3
The Components Which is Use In Project
Buttons
Primary Buttons: "Register", "Login", "Search Flights", "Continue", "Payment"
Rounded with gradient/shadow to make them stand out.
Color: Light blue with white text.
input Fields
Text Inputs: "Username or Email", "Password", "From", "To", "Date",
"Passengers", "Class"
Icons Inside Input Fields: User, eye (password toggle), calendar, flight exchange
icon.
Navigation Components
Bottom Navigation Bar: "Home", "Booking", "Inbox", "Profile"
Icons: Simple monochrome icons with labels.
Back Buttons: Circular back buttons in blue
Cards & Lists
Flight Ticket Cards: Air India, Indigo, Emirates – Shows time, duration, price,
and logo.
E-Ticket: QR Code, flight details, gate, terminal, passenger info.
Booking Summary Card: Shows trip details, departure, return, passengers, and
class.
Department of Computer Engineering 4
Interactive Elements
Tabs: "One-way", "Round", "Multi-city" (Toggle buttons).
Sliders/Carousels: For destination images (Dubai).
Toggle for Flight Sorting: Sort flights based on time/price.
Conclusion
The Airline booking application project was successfully designed using Figma,
demonstrating a complete and user-friendly UI/UX flow — from login to booking
confirmation. The project followed a user-centered approach, ensuring that each screen was
intuitive, visually consistent, and optimized for mobile devices. Key features like
component-based design, variants, and interactive prototyping helped streamline the
design process and simulate a real-world app experience.
Through this project, I gained practical experience in UI design, component creation,
responsive layout planning, and prototyping in Figma. This microproject not only enhanced
my technical design skills but also deepened my understanding of the design thinking
process. The final prototype reflects a professional and functional airline booking system
that prioritizes user experience and modern design standards.
Department of Computer Engineering 5
Reference
[Link]
[Link]
[Link]
[Link]
[Link]
[Link]
Department of Computer Engineering 6
Evaluation Sheet for the Micro-Project
Academic year: 2024-25 Name of Faculty: Mr. Ankit Agrawal
Sem: IV Program Name and Code: CO4K
Course Code : 314005 Course Name: UI/UX Designing
Title of the Project: Airline Reservation System
CO’s address by Microproject
CO1. Explain design thinking concept.
CO3. Select appropriate visual design for given problem.
CO4. Create interactions using design tool.
PO’s address By Microproject
[Link] and Discipline specific knowledge.
[Link]/Development of solutions.
[Link] tools, experimentation & testing.
[Link] practices for society, sustainability & environment.
[Link] management & Life-Long learning.
Marks :
(A)Marks of (B)Marks of (C)Total
Name of Students
Groupwork Groupwork Marks(A+B)=10
Department of Computer Engineering 7
Sonar Sahil Mahendra
Sonawane Shantanu
Gokul
Pardeshi Sujal Nitin
Thakare Amit Ravindra
Upasani Durgesh Pradip
Mr. Ankit Agrawal
Lecturer in department of Computer Engineering
S.S.V.P.S’s B.S. Deore, Polytechnic, Dhule (0059)
Department of Computer Engineering 8
