University Web Application Design & Development – Bhaikaka University – Case Study

Posted by

Bhaikaka University is a leading educational institution for medical students in Gujarat. Located in Gokalnagar, Karamsad, the institution has 1,300 students enrolled in 57 streams with 250 teaching staff and more than 1,000 non-teaching staff.

Bhaikaka University was established in 1972 as Charutar Arogya Mandal and was conferred the status of a private university in 2019 when it was renamed Bhaikaka University.

The Website – How It All Began

The name change from Charutar Arogya Mandal to Bhaikaka University and the recognition as a private university changed everything for the educational institution. The university had to create a new recognition and brand from scratch while keeping its past and history intact. As an institution that had served thousands of students since 1972, the history of the educational institution ran deep. The name change and the new recognition should not allow its past to be forgotten.

With a new name, a new domain name registration followed. The domain name was registered on October 31st, 2019. The website was to be created in 2020. Due to COVID-19, the website design and development were delayed until June 2020. However, the process had begun in the first week of January 2020. The website had to present Bhaikaka University as a new brand, in a new light. Bhaikaka University was now a recognized private university for medical students, recognized by the Government of India and the Government of Gujarat.

Requirements

Bhaikaka University required a web application with a wide range of features. The website had to be operated in-house without the help of a developer. The provision to add content to the website, modify content, and add news articles, events, and vacancies should be integrated into the website. The website should be technically optimized for SEO and fast loading. Also, the website had to be accessible on all devices easily. Below is the list of requirements put forward by the university:

  1. Responsive Website: The website had to be mobile-friendly, fast loading, and accessible on mobile devices even with slow networks. All pages of the website should be easily accessible on smaller devices without accessibility issues. Fonts should be easily visible, and images should be optimized to load fast.
  2. Content Management: All parts of the website, unless explicitly specified, should be accessible and modifiable from a content management system that can be administered by an in-house IT team. The website should have provisions to add pages, change menu items, add images, and create various forms of information without the need for a web designer or developer.
  3. SEO Optimization: The entire website should be optimized for technical SEO. Alt tags on images, custom title tags, meta descriptions, and schema markups should be available on all pages. Page speed optimization is mandatory, and each page should load within 3 seconds.
  4. Design and Scalability: The design itself should reflect the university’s history and have a professional look but be easily navigable. The website should be scalable to accommodate as many pages as required in the future. The website is intended to grow as the university grows. Provision to add additional modules to the web application should be provided in case it is required in the future.

The Website – Design and Development

Considering the requirements, Megh Technologies proposed to create a custom web application for Bhaikaka University. The website was to be created on the .NET platform with SQL Server as the backend. The website would be hosted on an Azure server and use the capabilities of Azure when required. The basic design of the website was to be created in line with the requirements, keeping the brand in mind. The colors were already decided, and the logo was created previously by the organization.

Megh Technologies started off with a website structure that could be scaled up gradually. The initial structure had 35 pages, which were crucial and would be built upon. After the structure of the website was approved and explained, we created a complete wireframe for each page of the website. The wireframe was detailed and had placeholders for content and images. The content was not in place yet and would require the content creation team to create it, but the design had to be ready in the meantime while the content was being created. We did not want to lose time waiting for the content creation to be completed. We ensured that the website could be adjusted according to the content.

Once the wireframe was approved, we started with the UI/UX design and development. The UI/UX was developed using Photoshop and Figma. A demo was presented to the stakeholders once the UI was completed. The prototype was an exact replica model of the website with test content in place. The images were used from the existing albums of Bhaikaka University, and the text content would be accessible from the backend admin area once the content management was in place. The prototype was well accepted, and the stakeholders were pleased with the results. The final stage was to create the website and code it.

Coding and Development

The coding phase began once the prototype was approved. The UI was recreated in HTML and then converted to ASP.NET. The initial design did not have a backend but had test data as placeholders. All 35 pages were coded in ASP.NET to match that of the prototype. Once the frontend team was satisfied and all the UI/UX components were tested, the backend team started with the coding of the database and optimized it to match the website’s needs. The final phase was to integrate the backend with the frontend and test the entire website. The team coded the backend and integrated the frontend to the website during this stage.

The final part of the website was to create the admin area with the actual CMS to manage the content of the website. The entire admin area was the responsibility of the backend team, as the front end of the admin area was a fixed template that was tested on several servers, including Megh Technologies, for ease of use and scalability. The team incorporated the entire CMS, which could manage all parts of the content area of the website.

The Results

The website created in 2020 is still working seamlessly with over 1,000 pages. All areas of the website have been managed regularly, with various sections added over time. The website is scalable and can easily integrate new modules over time. Today, there are student sections on the website, areas for job applications, and several other modules that were integrated as the need arose. The website is search optimized, garnering over 2,000 visitors every single day.