Criteria A
The Scenario:
My client is the head teacher of the Model United Nations (MUN) Club at my school. The club is an academic student club to teach students about MUN and helps them prepare for MUN conferences. Currently, 70 high school students participate in the client's MUN club with the numbers growing every year. Each student is placed into one of two categories - junior or senior. The client stated that “if the student has attended more than 4 MUN conferences they are a senior student, otherwise, we place them as a junior student”.
A MUN conference consists of many sub-councils in which students can join as a delegate (a person who debates), or a chair (a person who judges the delegates and moderates the sub-councils). She stated, “A senior student can join a conference as a chair or a delegate while a junior student can only join a MUN conference as a delegate”.
The problem as described by the client is, “Since everything is currently done manually, with a growing student body, it's harder to keep track of the student's assignments and register them for conferences as a delegate or a chair”. This increases errors associated with registering students for conferences. Additionally, since important announcements are shared manually only in class many times students miss these leading to frequent confusion if they are absent.
Furthermore, the current process of tracking students’ assignments and feedback is very
inefficient with a lot of repetition as it's done manually. All of these factors negatively affect the student’s MUN learning and experience. Therefore she stated, “I want a common place where I can track everything in an easy way”.
Rationale of the Proposed Solution:
After consulting with my client, we have decided that a responsive web application would be the best solution. This was proposed over a mobile app for the following reasons:
Since the students use multiple devices such as laptops, tablets, and phones, installing the same app would consume more storage space on each device. Furthermore, apps need to be frequently updated on each device which can be time-consuming and repetitive.
The client also mentioned that students use many different platforms for their devices such as Windows, iOS, MacOS, and Android. Since an app is developed for a particular platform, using it on a different platform might not create a seamless experience for the user as it's not compatible.
Apps are also typically optimized for one screen size and therefore users might not have the best user experience as the app may not adapt properly when using a device with a different size. Therefore a responsive website would be better as it adapts to the screen size of the device giving a better user experience.
The website will provide necessary and relevant tools to upload important announcements, register for conferences and to submit and give feedback on assignments. Since the client’s task is too tedious the website would greatly automate many of the tasks reducing the client’s manual workload.
I have decided to use HTML5 and CSS3 to build the basic framework along with JavaScript to build the front end of the website, for the following reasons:
HTML5 and CSS3 are compatible with most browsers and operating systems and are easy to navigate providing a rich user experience.
CSS3 provides capabilities of Flexbox, Grid layout, and responsive images making it better suitable to build a responsive website to work across a variety of devices.
JavaScript will help to create interactive web pages, update information in real-time and provide a feature-rich website for an engaging user experience.
I will be using Node.js for back-end programming and MySQL for the database
1. Node.js is the most versatile for JavaScript as it allows both server-side and client-side programming and also provides caching and asynchronous features.
MySQL provides the best security features for confidential information storing and sharing and has an impressive 24X7 server uptime.
Success Criteria:
Allow new sign up using email and password and the password needs to be hashed.
The sign-up form should have a drop-down menu, where the user can select relevant details regarding his MUN career and personal information and the system will automatically classify the user as a junior or senior student.
During login, the user should be able to reset his password.
Users should be able to get logged in and then change and edit their personal
The admin can amend which students have junior and senior roles.
The admin should be able to announce information on the website that is viewable to all users.
The user should be able to type questions to the admin in a chat feature.
The admin should be able to create an assignment for users to do and the admin can filter the assignment to either junior students or senior students.
The user should be able to upload a PDF for a particular assignment and click submit which indicates to the admin that the user has completed his assignment.
The admin should be able to search for a student's name and find their document and give feedback for the assignment.
The admin should be able to create, modify and delete a conference and provide details about the conference.
The user should be able to filter conferences based on month, sub-councils, and
If the user is classified as a senior student the user should be able to register for the conference as a chair or delegate. Once the user clicks register drop-down menu should appear where the user can select relevant details.
If the user is classified as a junior student the user should be able to register for the conference as a delegate. Once the user clicks register drop-down menu should appear where the user can select relevant details.
The website should provide data analytics features regarding the conferences to the admin.
The website should have a gallery where users can view pictures and the admin can upload or delete pictures.
Criteria B
1. Application Tree Diagram- Admin (Made using the tool http://draw.io)
2. Application Tree Diagram - User (Made using the tool http://draw.io)
3. Database Design - ER Diagram
ER Diagram was constructed using http://draw.io
4. Database Design - Table Structure
The Database includes the following tables required for the web application
Admin Table - Stores information about admin for the MUN web application.
User Table - Stores information about different users registered in the MUN web application.
Council Table - Stores information about different councils which the MUN hosts
Conference Table - Stores information about all past and upcoming conferences and relevant information pertaining to them
Assignment Table - Stores information about all assignments, admin who manages it and related users associated with the respective assignments.
Resource Table - Stores information about all resources and the admin who manages them.
Analytics Table - Stores information about different reports which can be generated by the web application for analytics purpose.
5. Wireframe Design - Landing Page & Login Pages
All wireframe GUI designs were designed using the tool http://figma.com
6. Wireframe Design - Admin Dashboard & Admin Pages
8. Flowcharts
All flowcharts have been constructed using the tool http://draw.io
a. Login Process
b. Create / View / Update / Delete Process
The process of Create/ View/ Update/ Delete is used in multiple functionalities of User Management, Council Management, Conference Management, Assignment Management, Resource management and Analytics on the Admin role. And more of View / Update for the User role.
c. Create New Conference & Registration Process
d. Create New Assignment & Submit Assignment Process
9. Test Plan
If you need any help in web application Project or assignment help then you can contact us at: