Constellation

A
PROJECT REPORT
ON
Costellation Drawer
In partial fulfilment for the requirement the award of the Degree of MCA
(Session-2022-23)
Faculty of Computer Application, IT & Science.
UNDER THE GUIDANCE OF SUBMITTED BY

Dr. Pramod Singh Ankit Singh
(Associate Professor, DCS, AKSU, SATNA) MCA-IVth Sem
(B2192R10700036)
APPROVED BY
Prof. Akhilesh A. Waoo
(Professor and Head)
AKS University, SATNA

Panna Khajuraho Rd, SherGanj, Satna - 485001, Madhya
Pradesh India
https://www.aksuniversity.ac.in
DECLARATION
I hereby declare that the project work on “Constellation Drawer” submitted to the
AKS UNIVERSITY, SATNA (M.P) is a record of original work done by us under the
guidance of Dr. Pramod Singh, (Department of Computer Science Engineering, AKSU) and
this report is submitted in the fulfillment of the requirements for the award of the degree of
Master of Computer Applications.
Signature:
(Ankit Singh)
(B2192R10700036)
Date:
CERTIFICATE
It is certified that the work contained in the project report titled “Constellation
Drawer”, by Ankit Singh has been carried out under my supervision and this work has not
been submitted elsewhere for any other degree.
Prof. Akhilesh A. Waoo

Professor And Head
Faculty Of Computer Application, IT & Science
AKS University, Satna, M.P
Dr. Pramod Singh

Associate Professor
Department of Computer Science and Engineering
AKS University, Satna, M.P
Signature External
ACKNOWLEDGEMENT
A project owes its success from commencement to completion, to the people in

love with creativity at various stages. Let us in this page express my gratitude to all those
who helped us in various stage of this study.
We wish to express our sincere gratitude indebtedness to Dr. Pramod Singh

(Department of Computer Science & Engineering, AKSU) for introducing the present topic
and for his inspiring guidance, constructive criticism and valuable suggestion throughout this
project work.
We are also thankful to our Parents for their true help and inspiration. Last but not least, we
pay our sincere thanks and gratitude to all the staff members and our project partner at AKS
UNIVERSITY, SATNA (M.P) for their support and for making our training valuable and
fruitful.
Date:
Place:
TABLE OF CONTENTS
Chapter Page No.
1. Introduction 01
1.1. Problem Statement
1.2. Objective
1.3. Overview Of Project
1.4. Technologies Used
1.5. Hardware Requirements
1.6. Software Requirement
2. Design And Framework 09
2.1. Software Process Model
2.1.1. Development Approach
2.1.2. Cost, Time And Effort Estimation
2.2. Software Design
2.3. Block Diagram
2.4. Flow Chart
3. Project Description 21
3.1. Project Modules
3.2. Database Design
3.3. Features
4. Testing 26
5. Output Screenshots 28
6. Future Scope 29
7. Conclusion 31
8. Annexure 33
9. Internship Joining And Completion Letter 34
10.Plagiarism Report 37
11.Implementation of code 38
AKS UNIVERSITY DEPARTMENT OF COMPUTER SCIENCE
1. INTRODUCTION
The zodiac constellations are a group of 12 constellations that are located along the
apparent path of the Sun across the sky over the course of a year. These constellations are
traditionally used in Western astrology to determine a person's zodiac sign based on their birth
date.
Each zodiac constellation has a specific name and symbol, and is associated with certain
personality traits, characteristics, and astrological predictions. The 12 zodiac constellations are as
follows:
Aries (The Ram)
Taurus (The Bull)
Gemini (The Twins)
Cancer (The Crab)
Leo (The Lion)
Virgo (The Virgin)
Libra (The Scales)
Scorpius (The Scorpion)
Sagittarius (The Archer)
Capricornus (The Sea-Goat)
Aquarius (The Water-Bearer)
Pisces (The Fishes)
While the zodiac constellations are traditionally associated with astrology and
horoscopes, they are also studied in astronomy. In astronomy, the zodiac constellations are used
to define the ecliptic, which is the path that the Sun appears to follow across the sky as Earth
orbits around it.
ANKIT SINGH(B2192R1070036) 1 CONSTELLATION DRAW

1.1 PROBLEM STATEMENT
This is the problem statement on which this project is based on – Draw Your
Constellation Type Name And Based On That Draw Constellation. Should Be Unique At
Everytime.
Explanation – According to the problem statement we have to create an interactive program

that takes user input, specifically the user's name, and uses it to determine their zodiac sign.
Based on their zodiac sign, the program then displays the corresponding constellation and draws
it on the screen and for each time unique object should be used.
1.2 Objective
Objective of this Project is to create an interactive program that takes user input,
specifically the user's name, and uses it to determine their zodiac sign. Based on their zodiac
sign, the program then displays the corresponding constellation and draws it on the screen.
Zodiac signs are a system of astrology that is based on the positioning of the stars and
planets at the time of a person's birth. There are twelve zodiac signs, each corresponding to a
specific time period in the year. The twelve signs are Aries, Taurus, Gemini, Cancer, Leo, Virgo,
Libra, Scorpio, Sagittarius, Capricorn, Aquarius, and Pisces.
The Constellation Project uses the user's name to determine their zodiac sign using a
simple algorithm. Once the zodiac sign has been determined, the program displays an image of
the corresponding constellation and draws it on the screen using ASCII art.
This project is a fun and interactive way to learn about zodiac signs and constellations. It
can be used as a tool for entertainment or education, and can be customized to include additional
features such as horoscopes or astrological insights.

1.3 OVERVIEW OF PROJECT
The Constellation Project is an interactive program that takes user input, specifically the
user's name, and uses it to determine their zodiac sign. Based on their zodiac sign, the program
then displays the corresponding constellation and draws it on the screen.
Zodiac signs are a system of astrology that is based on the positioning of the stars and
planets at the time of a person's birth. There are twelve zodiac signs, each corresponding to a
specific time period in the year. The twelve signs are Aries, Taurus, Gemini, Cancer, Leo, Virgo,
Libra, Scorpio, Sagittarius, Capricorn, Aquarius, and Pisces.
The Constellation Project uses the user's name to determine their zodiac sign using a
simple algorithm. Once the zodiac sign has been determined, the program displays an image of
the corresponding constellation and draws it on the screen using ASCII art.
This project is a fun and interactive way to learn about zodiac signs and constellations. It
can be used as a tool for entertainment or education, and can be customized to include additional
features such as horoscopes or astrological insights.
1.4 TECHNOLOGY USED
1.2.1 Frontend
1. HTML
HTML (Hyper Text Markup Language) is a markup language used to create web pages.
It provides a standard way to structure content on the web, such as text, images, and multimedia,
and allows developers to create interactive and dynamic web pages that can be viewed by anyone
with an internet connection and a web browser.
HTML documents consist of a series of elements, which are represented by tags. Tags are
enclosed in angle brackets (<>) and are used to define the structure and content of a web page.
For example, the <html> tag is used to define the beginning and end of an HTML document,

while the <head> tag is used to define information about the document such as the title and meta
data. The <body> tag is used to define the main content of the document.
HTML also allows developers to add links, forms, tables, and other elements to their web
pages, making it possible to create complex and interactive web applications. Additionally,
HTML can be used in conjunction with other web technologies such as CSS and JavaScript to
create rich and engaging user experiences.
Overall, HTML is an essential tool for web development, providing the foundation for
creating web pages and applications that can be accessed by anyone with an internet connection.
2. CSS
CSS (Cascading Style Sheets) is a styling language used to describe the presentation and
layout of HTML documents. It allows developers to separate the content of a web page from its
presentation, making it easier to create and maintain consistent and visually appealing websites.
CSS works by defining styles for HTML elements, such as font styles, colors,
backgrounds, and layout properties. Styles are defined using selectors, which identify the HTML
elements to which the styles should be applied, and declarations, which define the styles
themselves.
CSS can be used to create responsive designs that adapt to different screen sizes and
devices, as well as to add animations, transitions, and other visual effects to web pages. It also
supports the use of variables, functions, and other programming constructs, making it possible to
create complex and dynamic stylesheets.
CSS is typically used in conjunction with HTML and JavaScript to create rich and
interactive web applications. By separating content from presentation, CSS makes it possible to
change the look and feel of a website without changing its underlying structure or content,
making it easier to maintain and update over time.
Overall, CSS is a powerful tool for web development, providing the means to create
visually appealing and responsive websites that can be accessed by users on a wide range of
devices and platforms.

3. JAVASCRIPT
JavaScript is a high-level, dynamic programming language used to create interactive and

dynamic web pages. It allows developers to add functionality to web pages, such as user
interactions, animations, and form validation, making web applications more engaging and
responsive.
JavaScript is an object-oriented language, meaning it is based on the concept of objects,

which can have properties and methods that can be manipulated by the developer. It is also a
client-side language, meaning it is executed on the user's computer rather than on a server,
allowing for faster and more dynamic web applications.
JavaScript can interact with HTML and CSS to modify the content and presentation of
web pages in real-time. It can be used to handle user events such as clicks and keyboard inputs,
and to make asynchronous requests to web servers to retrieve data or update content without
requiring a page refresh.
JavaScript can also be used on the server-side with the help of Node.js, a JavaScript
runtime built on Chrome's V8 JavaScript engine. This allows developers to create server-side
applications using JavaScript, providing a consistent language for both the front-end and back-
end of web applications.
Overall, JavaScript is a powerful tool for web development, allowing developers to create
dynamic and interactive web applications that can be accessed by anyone with an internet
connection and a web browser.
4. Visual Studio Code
Introduction Of VS Code
Visual Studio Code, also commonly referred to as VS Code,it is a source-code editor

made by Microsoft with the Electron Framework, for Windows, Linux and macOS. Features
include support for debugging, syntax highlighting, intelligent code completion, snippets, code

refactoring, and embedded Git. Users can change the theme, keyboard shortcuts, preferences,
and install extensions that add additional functionality.
In the Stack Overflow 2021 Developer Survey, Visual Studio Code was ranked the most
popular developer environment tool among 82,000 respondents, with 70% reporting that they use
it.
Visual Studio Code was first announced on April 29, 2015, by Microsoft at the 2015
Build conference. A preview build was released shortly thereafter.
On November 18, 2015, the source of Visual Studio Code was released under the MIT
License, and made available on GitHub. Extension support was also announced. On April 14,
2016, Visual Studio Code graduated from the public preview stage and was released to the Web.
Why VS Code?
Visual Studio Code is a source-code editor that can be used with a variety of
programming languages, including C#, Java, JavaScript, Go, Node.js, Python, C++, C, Rust and
Fortran. It is based on the Electron framework, which is used to develop Node.js web
applications that run on the Blink layout engine. Visual Studio Code employs the same editor
component (codenamed "Monaco") used in Azure DevOps (formerly called Visual Studio Online
and Visual Studio Team Services).
Out of the box, Visual Studio Code includes basic support for most common
programming languages. This basic support includes syntax highlighting, bracket matching, code
folding, and configurable snippets. Visual Studio Code also ships with IntelliSense for
JavaScript, TypeScript, JSON, CSS, and HTML, as well as debugging support for Node.js.
Support for additional languages can be provided by freely available extensions on the VS Code
Marketplace.
VS Code provide more handy features to the user then any other code editor that’s why
programmers and developers uses vs code aslo it has smart features like auto suggestion and user
snipit etc.

1.2.2 Backend
1. MySQL Database
Introduction Of MySQL
MySQL is a popular open-source relational database management system (RDBMS) used

for creating and managing databases. It is widely used in web development and provides an easy-
to-use interface for managing large sets of data.
MySQL is a client-server system, meaning that it consists of two components: the server
and the client. The server is responsible for managing the databases and responding to client
requests, while the client provides an interface for users to interact with the databases.
MySQL supports a wide range of features, including support for transactions, ACID
compliance, and advanced security features. It also includes a powerful query language called
SQL (Structured Query Language), which is used to retrieve and manipulate data stored in the
databases.
MySQL can be used in a variety of applications, including web development, e-

commerce, content management systems, and more. It is also used in conjunction with other web
technologies such as PHP and Apache to create powerful and scalable web applications.
Overall, MySQL is a reliable, scalable, and flexible database management system that is widely
used in web development and other applications that require efficient and secure management of
large sets of data.
2. PHP
PHP (Hypertext Preprocessor) is a popular server-side scripting language used to create

dynamic web pages and web applications. It is widely used in web development and provides a
range of features and functionality for creating powerful and interactive websites.
PHP works by embedding code within HTML pages, allowing developers to create
dynamic content that can be customized based on user input and other variables. PHP scripts are

executed on the server-side, meaning that the output is generated before being sent to the client's
web browser. This allows for efficient and scalable web applications that can handle large
amounts of traffic.
PHP supports a wide range of features, including support for databases such as MySQL,
file manipulation, string manipulation, and more. It also includes a wide range of built-in
functions and libraries that can be used to streamline development and simplify common tasks.
PHP is often used in conjunction with other web technologies such as Apache and
MySQL to create powerful and scalable web applications. It is also used in a wide range of
applications, including content management systems, e-commerce platforms, and more.
Overall, PHP is a powerful and flexible server-side scripting language that is widely used
in web development and other applications that require efficient and dynamic content generation.
1.5 HARDWARE REQUIREMENTS
 Intel Core i3 Or Above.

 2 GB Ram
 512 KB Cache Memory
 10 GB (Free Space) HDD
 Keyboard
 Mouse
1.6 SOFTWARE REQUIREMENTS
 Windows XP And Above

 Web Browser
 Xampp

2. DESIGN AND FRAMEWORK
2.1 SOFTWARE PROCESS MODEL

A software process model is a framework that provides guidelines and structure for the
development of software applications. It defines a set of activities, tasks, and deliverables that
need to be performed during the software development lifecycle. Different software process
models exist, each with its own set of characteristics and advantages. Here are some commonly
used software process models:
Waterfall Model:
The Waterfall model follows a sequential, linear approach to software development.
It consists of distinct phases, including requirements gathering, design, implementation, testing,
deployment, and maintenance.
Each phase is completed before moving on to the next, and there is minimal overlapping or
iteration.
It is suitable for projects with well-defined requirements and stable scope.
Advantages: Clear documentation, easy to understand and manage, well-suited for small projects
with stable requirements.
Agile Model:
Agile is an iterative and incremental approach to software development.
It emphasizes collaboration, flexibility, and delivering working software in short iterations called
sprints.
Agile methods, such as Scrum or Kanban, involve self-organizing teams, frequent
customer feedback, and adaptive planning.
Requirements and solutions evolve through collaboration and continuous improvement.
Advantages: Flexibility, adaptability to changing requirements, customer involvement, rapid

delivery, early value realization.
Spiral Model:
The Spiral model combines elements of the Waterfall model and iterative development.

It involves iterative cycles of risk analysis, requirements gathering, design,

implementation, and evaluation.
Each iteration builds upon the previous ones, allowing for progressive refinement and risk
mitigation.
The Spiral model is suitable for large and complex projects with high-risk factors.
Advantages: Risk-driven approach, early identification and mitigation of risks, flexible and
iterative development.
Iterative Model:
The Iterative model focuses on repeating cycles of development, where each cycle
produces a working increment of the software.
Requirements, design, implementation, and testing are refined and enhanced in subsequent
iterations.
Each iteration incorporates feedback from previous iterations, allowing for continuous
improvement.It is suitable for projects where requirements are not fully defined or may evolve
over time.
Advantages: Incremental delivery of working software, ability to adapt to changing

requirements, early feedback incorporation.
V-Model:
The V-Model is a variation of the Waterfall model that emphasizes the relationship
between testing and development.
It involves corresponding verification and validation activities for each phase of the development
process.
Requirements gathering and design are followed by unit testing, integration testing,
system testing, and user acceptance testing.
It ensures that each development phase has a corresponding testing phase to validate the
output.
Advantages: Strong emphasis on testing, clear mapping of testing activities, early defect
detection.

RAD Model (Rapid Application Development):

The RAD model emphasizes rapid prototyping, user involvement, and iterative
development.It involves developing a quick prototype based on user requirements, followed by
iterative refinements.
RAD aims to accelerate the software development process by focusing on quick feedback
and frequent user involvement.It is suitable for projects with time constraints and user-centric
development needs.
Advantages: Quick development and prototyping, increased user involvement, faster time-to-
market.
Incremental Model:
The Incremental model divides the software development process into smaller,
manageable increments or modules.Each increment follows a mini Waterfall or iterative process,
including requirements, design, implementation, and testing.
Increments are delivered in a sequential manner, gradually adding new features and
functionality.It allows for incremental delivery, feedback incorporation, and phased
development.
Advantages: Early delivery of working modules, flexibility in prioritizing features, reduced risk
of overall project failure.
each software process model has its own strengths and weaknesses, and the choice of
model depends on factors such as project requirements, team size, customer involvement, and
time constraints. Organizations often adapt or combine different models to suit their specific
needs, creating hybrid approaches that combine the best elements of multiple models.
2.1.1 DEVELOPMENT APPROACH

For the "Constellation Drawer" project, Agile software development methodology can be
a suitable approach due to its iterative and flexible nature. Agile focuses on delivering working
software in small increments and encourages collaboration, adaptability, and continuous
improvement.

Agile Methodology
Fig. no. 1
Here's how Agile can be applied to the project:

Project Initiation:
 Define the project goals, scope, and initial requirements.
 Form an Agile development team comprising developers, designers, and testers.
 Identify the product owner who will provide the vision and priorities for the project.
Product Backlog:
 Create a product backlog, which is a prioritized list of features, functionalities, and user
stories for the project.
 Collaborate with the product owner to refine and prioritize the backlog items based on
user value and project objectives.
 Break down the backlog items into smaller, manageable tasks.
Sprint Planning:

 Conduct sprint planning meetings with the development team.

 Select a set of backlog items to be implemented in the upcoming sprint.
 Define the goals, tasks, and estimated effort for the selected backlog items.
 Collaboratively determine the deliverables and establish a sprint backlog.
Sprint Execution:
 Begin the sprint and work on the tasks defined in the sprint backlog.
 Regularly hold short daily stand-up meetings to discuss progress, challenges, and
coordination within the team.
 Developers implement the features, designers create the visual elements, and testers
perform continuous testing.
 Emphasize collaboration, communication, and adaptability to address changes and
challenges as they arise during development.
Sprint Review:
 Conduct a sprint review at the end of each sprint to showcase the completed work to the
product owner and stakeholders.
 Receive feedback and suggestions for improvement.
 Review the sprint goals and evaluate the success criteria.
Sprint Retrospective:
 Hold a retrospective meeting after each sprint to reflect on the team's performance and
process.
 Identify areas of improvement, discuss lessons learned, and determine action items for
the next sprint.
 Continuously adapt and refine the development process based on the retrospective
outcomes.
Repeat:
 Repeat the sprint cycle, moving to the next set of backlog items and starting a new sprint.
 Prioritize and refine the backlog continuously based on evolving requirements, user
feedback, and changing project needs.

Agile's iterative approach allows the "Constellation Drawer" project to deliver value
incrementally and respond to user feedback throughout the development process. It promotes
collaboration, transparency, and adaptability, enabling the project to evolve based on changing
user preferences and requirements. The short development cycles and continuous feedback loop
help ensure the project's alignment with user expectations and maximize its value.
2.1.2 COST, TIME AND EFFORT ESTIMATION
Calculating the cost, time, and effort required for a project like the "Constellation
Drawer" involves estimating and considering various factors. Here are some key steps and
factors to consider in the estimation process:
Requirements Analysis:
Thoroughly analyze the project requirements, including features, functionalities, and
design specifications. Identify any dependencies or constraints that may affect the project
timeline and effort estimation.
Work Breakdown Structure (WBS):

Create a Work Breakdown Structure to break down the project into smaller tasks and
activities. Define the tasks, estimate the effort required for each task, and allocate resources
accordingly.
Estimation Techniques:
Use estimation techniques such as expert judgment, historical data analysis, and
analogous estimation to estimate effort, time, and cost.
Consider factors such as the complexity of the project, the experience and skill level of the team,
and any potential risks or uncertainties.
Resource Allocation:
Determine the number of team members required for the project and their roles and
responsibilities.Consider factors such as development, design, testing, project management, and
documentation.

Task Dependencies and Sequencing:

 Identify any task dependencies and their impact on the project schedule.
 Define the sequence and order of tasks, considering any dependencies or prerequisites.
Risk Assessment:
 Identify potential risks and uncertainties that could impact the project timeline and effort
estimation.
 Assess the probability and impact of each risk and factor them into the estimation process.
Project Management Tools:

 Utilize project management tools and software to assist in estimating the project effort, time,
and cost.
 These tools can help with resource allocation, scheduling, and tracking progress.
Contingency Planning:
 Include a contingency buffer in the estimation to account for unforeseen risks, delays, or
changes in requirements.
 This buffer helps mitigate risks and provides flexibility in case of unexpected events.
Documentation and Communication:

 Document the estimation process, assumptions, and any constraints considered during the
estimation.
 Communicate the estimated effort, time, and cost to stakeholders, ensuring alignment and
expectations.
Monitoring and Tracking:

 Continuously monitor and track the project progress against the estimated effort, time, and
cost.
 Make adjustments as needed, considering any changes in requirements, resources, or risks.
 It's important to note that estimating effort, time, and cost is not an exact science and
involves a degree of uncertainty. Regular monitoring, communication, and adaptation are
necessary throughout the project to ensure accurate tracking and adjustments.

2.1.3 Gantt Chart
A Gantt chart is a visual project management tool used to schedule, track, and manage
tasks and activities within a project. It provides a graphical representation of project timelines,
task dependencies, and progress. The chart consists of horizontal bars that represent individual
tasks or activities, plotted against a timeline.
Here are the key elements and characteristics of a Gantt chart:

Task/Activity: Each task or activity in the project is represented by a horizontal bar on the chart.
It is labeled with the task name or description.
Timeline: The horizontal axis represents the project timeline, typically shown in days, weeks, or
months. It provides a clear view of the start and end dates of the project and individual tasks.
Bars and Duration: The length of the bars on the chart represents the duration of each task. The
starting point of the bar indicates the task's start date, and the endpoint represents the task's end
date.
Dependencies: Dependencies between tasks are represented by linking the bars on the chart. For
example, if Task B cannot start until Task A is completed, a dependency arrow or link is drawn
between the two bars.
Milestones: Milestones are significant events or achievements within the project. They are
represented by diamond-shaped markers on the chart. Milestones help track progress and mark
key project deliverables.
Progress Tracking: Gantt charts can be updated to reflect the actual progress of tasks. This is
done by shading or filling in the completed portion of the task bar. It allows project managers to
visually track the completion status of tasks.
Resource Allocation: Gantt charts can include information about resource allocation, indicating
which team members or resources are assigned to each task. This helps manage resource
availability and workload.
Critical Path: The critical path in a Gantt chart represents the sequence of tasks that determines

the project's overall duration. It identifies the tasks that, if delayed, would impact the project's
timeline.
This is an simplified Gantt chart for the "Constellation Drawer" project with an 60-days
timeline:
Task | Duration (Days) | Start Date | End Date

-----------------------------------------------------------------------------------------
Project Initiation | 2 | Day 1 | Day 2
Requirements Gathering | 3 | Day 3 | Day 5
Design and Wireframing | 5 | Day 6 | Day 10
Frontend Development | 10 | Day 11 | Day 20
Backend Development | 10 | Day 11 | Day 20
Zodiac Finding Module | 5 | Day 21 | Day 25
Constellation Mapping Module | 5 | Day 26 | Day 30
Interactive Display | 7 | Day 31 | Day 37
Testing and Bug Fixes | 7 | Day 38 | Day 44
Refinements | 4 | Day 45 | Day 48
Documentation | 3 | Day 49 | Day 51
Final Review | 2 | Day 52 | Day 53
Deployment | 3 | Day 54 | Day 56
User Acceptance Test | 2 | Day 57 | Day 58
Project Closure | 2 | Day 59 | Day 60

2.2 SOFTWARE DESIGN
The software design of the "Constellation Drawer" project will likely involve several
components, including the user interface, the name-to-zodiac sign mapping algorithm, and the
constellation generation algorithm.
The user interface will be the visible part of the website that users interact with. It will
likely include a text input field for users to enter their name and a button to trigger the generation
of the constellation. The interface may also include a display area to show the generated
constellation.
The name-to-zodiac sign mapping algorithm will take the user's name as input and output
the corresponding zodiac sign. This algorithm may use a lookup table or a more complex
method, such as analyzing the numerology or astrology of the name.
The constellation generation algorithm will take the zodiac sign as input and output
a unique constellation that represents that sign. This algorithm use pre-defined templates for each
zodiac sign to generate a unique pattern of stars or other celestial objects.
In addition to these main components, the software design also include various
supporting components, such as database management, error handling, and security measures to
protect user data.

2.3 BLOCK DIAGRAM

 User Input : First of all we will take user input.
 Finding Zodiac : After that will find the zodiac name based on the user’s input.
 Draw Constellation : after getting zodiac name based on that zodiac name constellation
will draw.
Block diagram
Fig. no. 2

2.4 FLOW CHART

This is the flowchart of constellation draw project.
 First of all it will take user input which is name of the user.
 After that we use an algorithm to find the zodiac based on that name.
 After getting zodiac name we will map that zodiac with the predefine function that draws
the constellation based on zodiac.
 And at last username and the zodiac name will automatically store in the database.
Data Flow Diagram
Fig. no. 3

3. Project Description
3.1 Project Modules

 Frontend
 Validation
 Zodiac
 Constellation Mapping
 Database
1. Frontend Module
The frontend module of the "Constellation Drawer" project will be responsible for the
user interface and user experience of the website. It will include the layout, design, and
functionality that users will see and interact with.
Here are some content components that could be included in the frontend module:
Landing page: The landing page should be visually appealing and provide a clear and concise
explanation of what the website does. It should include the name input field and a button to
generate the constellation.
Name input field: The name input field should be prominently displayed on the landing page. It
should allow users to enter their name and submit it to the website.
Error handling: The frontend module should include error handling to provide feedback to
users if they enter invalid input or encounter other errors. This could include displaying error
messages or providing suggestions for how to correct the input.
Constellation display: Once the user inputs their name and triggers the constellation generation,
the frontend module should display the generated constellation. This could be done using a
canvas element or other graphical display.
Responsive design: The frontend module should be designed to be responsive to different screen
sizes and devices. This will ensure that the website looks good and functions properly on
desktops, laptops, tablets, and smartphones.

Visual elements: The frontend module should include visually appealing elements, such as
graphics, animations, or transitions, to enhance the user experience.
Overall, the frontend module should aim to provide a simple, intuitive, and engaging user
experience for generating and sharing unique constellations based on the user's name.
2. Validation Module
Input validation is an important part of any web application, including the "Constellation
Drawer" project. It ensures that the input provided by the user is in the correct format and
prevents potential errors or security issues.
Here is an example of content that included for validating the user's input to ensure it
only contains alphabet characters:
Error message: If the user enters any non-alphabetic characters in the input field, the frontend
module should display an error message. The message should explain that the input should only
contain alphabetic characters and provide a suggestion to correct the input.
Regular expression: The frontend module can use regular expressions to validate the input and
ensure it only contains alphabet characters. A regular expression pattern that matches only
alphabet characters can be used to compare the user's input. For example, the following pattern
can be used.
By implementing these measures, the "Constellation Drawer" project can ensure that the
user's input is validated and prevent any potential errors or security issues caused by invalid
input.
3. Zodiac Module
The "Constellation Drawer" project is designed to map the user's zodiac based on their
name only (rather than their birthdate), then the zodiac finding module would need to use a
different approach. Here is an example of content that could be included in this module:

Name-to-zodiac mapping: The module will include a mapping of names to zodiac signs, a
simple mapping is used where the first letter of the user's name corresponds to a specific zodiac
sign.
Validation: The module will validate the user's input to ensure it only contains alphabetic
characters (as discussed in a previous question). It may also check for common variations of
names to ensure that the correct zodiac sign is assigned.
Error handling: The module will include error handling to provide feedback to users if their
input is invalid or cannot be mapped to a zodiac sign. This could include displaying an error
message or suggesting a correction to the input.
Zodiac sign display: Once the zodiac sign is determined, the module will display the
corresponding constellation on the frontend of the website. This could be done using a canvas
element or other graphical display.
By using a name-to-zodiac mapping, the "Constellation Drawer" project can provide a

unique and engaging experience for users to explore their zodiac sign and associated
constellation based on their name.
4. Constellation Mapping
The constellation mapping module is an important part of the "Constellation Drawer"

project. It will take the user's zodiac sign (determined by the zodiac finding module) and map it
to the corresponding constellation. Here is an example of content that could be included in this
module:
Constellation Object: The module will include a list of the twelve zodiac constellations, along
with their corresponding zodiac signs. This list will be used to match the user's zodiac sign with
the corresponding constellation.
Image and information display: The module will display an image of the constellation
associated with the user's zodiac sign. This could be done using a canvas element or other
graphical display. In addition, the module could also display information about the constellation,
such as its history and significance in astrology.

Animation: The module could include animation or interactive features to enhance the user
experience. For example, the constellation could be animated to show the movement of stars and
planets over time.
By using a constellation mapping module, the "Constellation Drawer" project can provide
users with a visual representation of their zodiac sign and associated constellation. This can be a
fun and engaging way for users to learn more about astrology and their place in the universe.
3.2 Database Design
MySQL Database
Screenshot no. 1

3.3 Features
The "Constellation Drawer" project can have several features to enhance the user
experience and provide an engaging astrology-themed website. Here are some potential features
for the project:
1. Name-to-Zodiac Mapping: The project will take the user's name as input and determine
their zodiac sign based on a mapping algorithm. This feature allows users to discover their
zodiac sign based on their name alone.
2. Zodiac Constellation Generation: The project will generate a unique constellation based
on the user's zodiac sign. Each zodiac sign has its own constellation pattern, and the
project will display the corresponding constellation for the user's sign.
3. Randomized Constellation Objects: Each time a constellation is generated, the project

can include the option to use different objects such as stars, planets, or galaxies to create
the constellation pattern. This feature adds variety and visual interest to the generated
constellations.
4. Interactive Constellation Display: The project can provide an interactive display of the
generated constellation, allowing users to explore and interact with the constellation
pattern. Users may zoom in, rotate, or click on specific stars or objects to view additional
information about them.
5. Download Button : User can download their Constellation After its getting drawn in the
display.
6. Interactive Webpage : Design of the website is user friendly and interactive.

4 TESTING
Testing plays a crucial role in ensuring the quality and functionality of the "Constellation
Drawer" project. Here are some test cases that can be considered for different aspects of the
project:
Name Validation Testing:

 Test Case 1: Verify that the input field accepts only alphabetic characters.
 Test Case 2: Verify that the input field does not accept numbers or special characters.
 Test Case 3: Verify that an error message is displayed if the name field is left blank.
Zodiac Finding Module Testing:

 Test Case 1: Provide different names and verify that the module correctly maps them to
the respective zodiac signs.
 Test Case 2: Verify that the module handles variations in name input (capitalization,
spacing, etc.) and still produces accurate results.
 Test Case 3: Provide invalid or unexpected names and verify that the module provides
appropriate error handling.
Constellation Mapping Module Testing:

 Test Case 1: Select each zodiac sign and verify that the module displays the correct
constellation associated with that sign.
 Test Case 2: Verify that the constellations are visually accurate and recognizable
representations of the zodiac signs.
 Test Case 3: Test the module with different screen sizes and resolutions to ensure that
the constellations are displayed correctly.
Interactive Constellation Display Testing:

 Test Case 1: Test the zoom functionality and verify that users can zoom in and out of the
constellation without any loss of quality or distortion.
 Test Case 2: Test the rotation functionality and verify that users can rotate the
constellation smoothly and accurately.

 Test Case 3: Test the clickable stars or objects and verify that users can interact with
them to view additional information or perform specific actions.
Social Media Sharing Testing:

 Test Case 1: Verify that the social media sharing buttons are functional and allow users
to share their generated constellations on platforms like Facebook, Twitter, or Instagram.
 Test Case 2: Test the shared links on different devices and verify that they lead to the
correct shared content.
Compatibility and Responsive Design Testing:

 Test Case 1: Test the project on different browsers (Chrome, Firefox, Safari, etc.) and
verify that it functions correctly without any layout or functionality issues.
 Test Case 2: Test the project on different devices (desktop, laptop, tablet, mobile) with
varying screen sizes and resolutions to ensure proper responsiveness and adaptability.
Performance Testing:
 Test Case 1: Test the project's loading time and verify that it loads within an acceptable
timeframe.
 Test Case 2: Test the project's performance with a large number of concurrent users and
verify that it remains stable and responsive.
These test cases provide a starting point for testing the "Constellation Drawer" project.
It's important to conduct both functional and non-functional testing to ensure the project meets
user expectations, functions correctly across different scenarios, and delivers a seamless and
engaging experience.

5 OUTPUT SCREENSHOT
5.1 Frontend-Design
User Interface
Screenshot no. 2
5.2 Constellation Page

Screenshot no. 3
6 FUTURE SCOPE
The "Constellation Drawer" project has great potential for future expansion and
enhancement. Here are some possible areas of future scope for the project:
 Additional Constellation Styles: Currently, the project generates constellations using

various objects such as stars, planets, or galaxies. In the future, you could consider adding
more constellation styles, such as connecting lines, geometric patterns, or artistic
interpretations, to offer users a wider range of visual experiences.
 Constellation Customization: Allow users to customize their generated constellations

by providing options to adjust the density, size, color, or arrangement of stars and objects.
This feature would give users more control and personalization over their constellations.
 Extended Astrological Information: Expand the project's astrology section by

providing detailed information about each zodiac sign, including compatibility with other
signs, career suggestions, and personality insights. This would enrich users' understanding of
astrology and provide a more comprehensive experience.
 Astrological Predictions and Insights: Incorporate predictive features by offering

daily, weekly, or monthly horoscopes based on the user's zodiac sign. Provide astrological
insights, advice, and suggestions tailored to each individual's zodiac characteristics.
 User Accounts and Profiles: Implement a user account system that allows users to
create profiles, save their generated constellations, and track their horoscope history. This
feature would enhance user engagement and enable personalized experiences.
 Social Community and User Interaction: Create a social community within the
project where users can connect with each other, share their constellations, and engage in
discussions about astrology and zodiac signs. This would foster a sense of community and
encourage user participation.

 Mobile Application: Develop a mobile application version of the project, making it

easily accessible on smartphones and tablets. This would provide a more convenient and on-
the-go experience for users.
 Multi-Language Support: Expand the project's reach by adding support for multiple
languages, allowing users from different regions to access the website and its content in their
preferred language.

7 CONCLUSION
In conclusion, the "Constellation Drawer" project is a creative and engaging website that
allows users to explore astrology and their zodiac signs through a personalized and interactive
experience. By inputting their name, users can discover their zodiac sign and witness the
generation of a unique constellation associated with that sign.
Through the project's features, users can not only visualize their zodiac constellation but
also learn more about astrology, including the traits and characteristics associated with their sign.
The inclusion of randomized constellation objects adds variety and visual appeal to the generated
constellations.
By combining technology, astrology, and interactivity, the "Constellation Drawer"

project provides an enjoyable way for users to connect with the celestial realm and gain insights
into their zodiac signs. Whether for entertainment, self-discovery, or educational purposes, this
project offers a unique and captivating experience for users to explore the wonders of the
cosmos.

8 ANNEXURE
Slide no.1 Slide no.2
Handout no.1

ANNEXURE
Handout no.2

9 INTERNSHIP JOINING AND COMPLETION LETTER
Internship joining letter


Internship Completion letter

10 PLAGIARISM REPORT

Plagiarism Report
11 IMPLEMENTATION OF CODE
HTML Code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../CSS/index.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/

all.min.css">
<script src="../JS/index.js"></script>
<title>Constellation</title>
</head>
<body>
<div class="holder">
<div id ="header" class="header">
<video autoplay loop muted class="back-video">
<source src="../Resources/final-back-video.mp4" type="video/mp4">
</video>
<nav>
<a href="#"><img src="../Resources/logo.png" alt="BRAINATHON_LOGO" class="logo"></a>
<ul>
<li><a href="#header">HOME</a></li>
<li><a href="#box">SERVICES</a></li>
<li><a href="#footer">CONTACT</a></li>

</ul>
</nav>
<div class="content">
<h2>By giving your name get</h2>
<h1>Constellation</h1>
</div>
<div class="main-box">
<div id="box" class="box">
<form>
<div class="inputBox">
<label>Enter your name only (Hindu name only):</label>
<input type="text" class="input-box" name="username" autocomplete="off" id="name"

required/>
</div>
<div class="btn">
<a href="#show-diagram" onclick="validation()">Get Constellation</a>
</div>
</form>
</div>
</div>
</div>
<div id="show-diagram">
<div id="card">
<div class="s-d-l">
<canvas id="myCanvas" width="600" height="550"></canvas>
<button id="downloadButton">Download Image</button>
</div>
<div class="s-d-r">

<img src="#" alt="Constellation Image" id="card-img">
<p id="card-para">Constellation Name</p>
</div>
</div>
</div>
<footer class="footer" id="footer">
<div class="thankyou">
<p>Thankyou for Visiting the Constellation Project.</p><p> Project done by Team 07</p>
</div>
</footer>
</div>
</body>
</html>
JAVASCRIPT Code
1. Zodiac Finding Module
function check(){
let elem = document.getElementById('show-diagram');
let img = document.getElementById('card-img');
let para = document.getElementById('card-para');
elem.style.display="block";
let value = ""
let name = document.getElementById('name').value.toLowerCase();
let sub_str = name.slice(0,3);

for(let i in prediction1){
if(i == sub_str){
value = prediction1[i];
constellation = value;
img.src = '../Resources/'+value+'.jpg';
para.innerHTML =''+value+'';
break;
}
}
if(value == ""){
sub_str = sub_str.slice(0,2);
if(i == sub_str){
break;
}
}
}
if(value == ""){
sub_str = sub_str.slice(0,1);
if(sub_str == 'x'){

alert("Oops! For The Character X There Is No Zodiac.")
return
}
if(i == sub_str){
break;
}
}
}
let length_of_storage = localStorage.length;
if(length_of_storage != 0){
let last_value = localStorage.key(length_of_storage-1);
if(value == last_value){
counter = counter + 1;
console.log("this is counters val in the if where val == last");
console.log(counter);
}
else{
localStorage.clear();
localStorage.setItem(value,value);
}

}
else{
localStorage.setItem(value,value);
}
for(let i in mappingConstellation){
if(i == value){
mappingConstellation[i]()
break;
}
}
if(value == ""){
console.log("please fill hindu names");
elem.innerHTML("please fill hindu names");
}
store_name(name,value)
}
Explanation of this zodiac finding module

The "Zodiac Finding" module is a component of the larger "Constellation Drawer"
project that aims to determine the zodiac sign associated with a user's input name. The zodiac
signs are based on astrological concepts and are typically associated with specific periods of the
year.
Here is an explanation of the "Zodiac Finding" module's functionality:

Input: The module receives user input, specifically a name, which is used to determine the
corresponding zodiac sign.

Processing: The user's input name is typically converted to lowercase to ensure consistent
comparisons.
The module extracts a portion of the name, usually the first few characters, to make comparisons
with predefined zodiac sign values.
Matching Algorithm: The module employs a matching algorithm to compare the extracted
portion of the name with predefined values associated with each zodiac sign.
The algorithm typically involves iterating over a list or mapping of zodiac sign names and their
corresponding values.
If a match is found between the extracted portion of the name and a predefined value, the
corresponding zodiac sign is determined.
Output: Once the zodiac sign is identified, it is returned as the output of the "Zodiac Finding"
module.
The identified zodiac sign can be used for further processing or displayed to the user.
2. Constellation Mapping Module
const mappingConstellation = {
aries: function() {
const canvas = document.getElementById('myCanvas');
const ctx = canvas.getContext('2d');
ctx.clearRect(0, 0, canvas.width, canvas.height);

// Define a function to draw the next point and line in the generation
const pointsAries = [
{ x: 80, y: 120 },
{ x: 200, y: 150 },
{ x: 250, y: 180 },
{ x: 260, y: 210 },
];
const speedAries = 450; // Change this to adjust the speed of the animation
let item8 = 0;
const drawAries = setInterval(() => {
ctx.beginPath();
ctx.moveTo(pointsAries[item8].x, pointsAries[item8].y);
ctx.lineTo(pointsAries[item8 + 1].x, pointsAries[item8 + 1].y);

ctx.strokeStyle = "white"
ctx.stroke();
item8++;
if (item8 >= pointsAries.length - 1) {
clearInterval(drawAries);
const downloadButton = document.querySelector("#downloadButton");
downloadButton.addEventListener("click", downloadImage);
function downloadImage() {
const canvas = document.querySelector("#myCanvas");
const link = document.createElement("a");
link.download = "image.png";
link.href = canvas
.toDataURL("image/png")
.replace("image/png", "image/octet-stream");
link.click();
}
}
i = 0;
}, speedAries);
if(counter == 0){
// Draw circles at the points
for (let i = 0; i < pointsAries.length; i++) {
ctx.beginPath();
ctx.arc(pointsAries[i].x, pointsAries[i].y, 5, 0, 2 * Math.PI);
ctx.fillStyle = "yellow"
ctx.fill();
}
}
else if(counter == 1){
// draw cross

console.log("entering in else if loop")
console.log(counter)
console.log("this is counter value of else")
// console.log("reset done")
console.log(counter)
ctx.beginPath();

ctx.moveTo(pointsAries[i].x - 5, pointsAries[i].y - 5);

ctx.lineTo(pointsAries[i].x + 5, pointsAries[i].y + 5);
ctx.strokeStyle = "yellow"; // set the stroke style to white
ctx.stroke();
ctx.beginPath();
ctx.moveTo(pointsAries[i].x - 5, pointsAries[i].y + 5);
ctx.lineTo(pointsAries[i].x + 5, pointsAries[i].y - 5);
ctx.strokeStyle = "yellow"; // set the stroke style to white
ctx.stroke();
}
}
else{
// draw square
counter = -1;
console.log("zero done")
ctx.beginPath();
ctx.fillStyle = 'yellow'; // Set the fill style to red
ctx.fillRect(pointsAries[i].x - 5, pointsAries[i].y - 5, 10, 10); // Draw a square instead of a
circle
}
}

},
}
This is the example of constellation mapping module of this project for one zodiac.
Explanation of constellation module

The "Constellation Mapping" module is responsible for mapping the zodiac signs to their
respective constellations in the "Constellation Drawer" project. Each zodiac sign is traditionally
associated with a specific constellation, which represents a group of stars forming a recognizable
pattern or shape in the night sky.
Here is an explanation of the functionality of the "Constellation Mapping" module:

Input: The module receives the zodiac sign as input. This can be the result of the "Zodiac
Finding" module or any other means of determining the zodiac sign.

Mapping: The module contains a mapping or association between each zodiac sign and its
corresponding constellation.
This mapping can be implemented using a data structure such as an object or a dictionary, where
each zodiac sign is a key, and the associated constellation is the corresponding value.
Alternatively, the mapping can be achieved through conditional statements or switch-case
statements, where each zodiac sign is checked against predefined cases, and the corresponding
constellation is determined.
Output: Once the zodiac sign is matched with its corresponding constellation, the module
returns or provides the identified constellation.
The constellation information can be used to display an image or visual representation of the
constellation associated with the zodiac sign.
The module may also provide additional information or details about the constellation, such as
its name, notable stars, or characteristics.

Constellation

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Constellation

Uploaded by

Copyright:

Available Formats

A

Faculty of Computer Application, IT & Science.

UNDER THE GUIDANCE OF SUBMITTED BY

AKS University, SATNA

Prof. Akhilesh A. Waoo

Dr. Pramod Singh

A project owes its success from commencement to completion, to the people in

We wish to express our sincere gratitude indebtedness to Dr. Pramod Singh

ANKIT SINGH(B2192R1070036) 1 CONSTELLATION DRAW

1.1 PROBLEM STATEMENT

Explanation – According to the problem statement we have to create an interactive program

ANKIT SINGH(B2192R10700036) 2 CONSTELLATION DRAW

1.3 OVERVIEW OF PROJECT

1.4 TECHNOLOGY USED

ANKIT SINGH(B2192R10700036) 3 CONSTELLATION DRAW

ANKIT SINGH(B2192R10700036) 4 CONSTELLATION DRAW

JavaScript is a high-level, dynamic programming language used to create interactive and

JavaScript is an object-oriented language, meaning it is based on the concept of objects,

4. Visual Studio Code

Visual Studio Code, also commonly referred to as VS Code,it is a source-code editor

ANKIT SINGH(B2192R10700036) 5 CONSTELLATION DRAW

ANKIT SINGH(B2192R10700036) 6 CONSTELLATION DRAW

MySQL is a popular open-source relational database management system (RDBMS) used

MySQL can be used in a variety of applications, including web development, e-

PHP (Hypertext Preprocessor) is a popular server-side scripting language used to create

ANKIT SINGH(B2192R10700036) 7 CONSTELLATION DRAW

1.5 HARDWARE REQUIREMENTS

 Intel Core i3 Or Above.

1.6 SOFTWARE REQUIREMENTS

 Windows XP And Above

ANKIT SINGH(B2192R10700036) 8 CONSTELLATION DRAW

2. DESIGN AND FRAMEWORK

2.1 SOFTWARE PROCESS MODEL

Advantages: Flexibility, adaptability to changing requirements, customer involvement, rapid

ANKIT SINGH(B2192R10700036) 9 CONSTELLATION DRAW

It involves iterative cycles of risk analysis, requirements gathering, design,

Advantages: Incremental delivery of working software, ability to adapt to changing

ANKIT SINGH(B2192R10700036) 10 CONSTELLATION DRAW

RAD Model (Rapid Application Development):

2.1.1 DEVELOPMENT APPROACH

ANKIT SINGH(B2192R10700036) 11 CONSTELLATION DRAW

Here's how Agile can be applied to the project:

ANKIT SINGH(B2192R10700036) 12 CONSTELLATION DRAW

 Conduct sprint planning meetings with the development team.

ANKIT SINGH(B2192R10700036) 13 CONSTELLATION DRAW

2.1.2 COST, TIME AND EFFORT ESTIMATION

Work Breakdown Structure (WBS):

ANKIT SINGH(B2192R10700036) 14 CONSTELLATION DRAW

Task Dependencies and Sequencing:

Project Management Tools:

Documentation and Communication:

Monitoring and Tracking:

ANKIT SINGH(B2192R10700036) 15 CONSTELLATION DRAW

2.1.3 Gantt Chart

Here are the key elements and characteristics of a Gantt chart:

ANKIT SINGH(B2192R10700036) 16 CONSTELLATION DRAW

Task | Duration (Days) | Start Date | End Date

ANKIT SINGH(B2192R10700036) 17 CONSTELLATION DRAW

2.2 SOFTWARE DESIGN

ANKIT SINGH(B2192R10700036) 18 CONSTELLATION DRAW

2.3 BLOCK DIAGRAM

ANKIT SINGH(B2192R10700036) 19 CONSTELLATION DRAW

2.4 FLOW CHART

Data Flow Diagram