https://res.cloudinary.com/dcfvq2u77/image/upload/v1731472120/logo_5dd26f7866_27127feeb3.jpg

Emerald

20+

Trainings

12%

Increased site traffic

20%

Improved click-through rate

provides prospective students with information about academic programs, admissions & application processes.

https://res.cloudinary.com/dcfvq2u77/image/upload/v1731472006/Screenshot_2024_11_13_070415_front_f2c23b9a41.png

Project Overview

I designed and developed a website for Emerald International College to serve as an effective online platform for prospective students and to streamline the college’s admissions process. Given a tight deadline and a comprehensive list of requirements, I completed the website independently from scratch, creating an engaging, user-friendly platform that now serves thousands of potential applicants worldwide.

Key Responsibilities

I was responsible for the full project lifecycle, from gathering requirements to deployment. My tasks included:


  • Frontend Development: Built a responsive, visually appealing frontend using SvelteKit and Tailwind CSS to ensure fast performance and a consistent design across devices.
  • Backend and Content Management: Implemented a backend using Strapi, allowing Emerald’s team to manage their content effectively through a CMS.
  • Design and Prototyping: Used Figma to design intuitive layouts and mockups, keeping user experience and ease of navigation at the forefront.

Emerald Design Overview

Core Features

Based on the provided requirements document, I developed the following key sections for the website:


  • Home Page: Includes a welcome message, key program highlights (e.g., master’s, vocational, and short-term training), quick links, news, and contact information.
  • Programs Page: Offers details on various programs, including course structures, modules, admission requirements, and application processes for master’s, vocational, and short-term training programs.
  • Student Recruitment for International Universities: Lists partner universities, programs offered, and student support services, such as visa assistance and accommodation information.
  • About Us: Highlights the college’s history, mission, leadership team, affiliations, and campus facilities.
  • Admissions Page: Features an online application form, admission process details, key dates, criteria, and a FAQ section to assist applicants.
  • Contact Us Page: Provides a contact form, email addresses, department phone numbers, physical address, map, and social media links.

Technical Features

In addition to content creation, I focused on implementing essential technical features to optimize the website’s usability and accessibility:


  • SEO Optimization: Implemented meta tags, descriptions, and keyword optimization for all pages to enhance search engine visibility and attract prospective students.
  • User-Friendly Interface: Designed an intuitive navigation structure, responsive layouts for mobile and desktop, fast load times, and accessibility features like alt text for images and keyboard navigation.
  • CMS Integration: Integrated a Strapi-based CMS to make content updates straightforward for non-technical users and to manage user roles and permissions for content editing.

Emerald Landing Webpage

Emerald Landing Webpage

Challenges & Solutions

  • Tight Timeline: Working within a tight deadline required efficient prioritization and time management. I focused on key functionalities first, ensuring the core elements were ready on schedule.
  • SEO and Application Forms Best Practices: Through research, I optimized the application forms for usability and SEO, ensuring higher visibility and a smoother user experience for applicants.
  • Performance Optimization: I implemented techniques such as code splitting, image optimization, and caching to improve the website's load times and overall performance.

Results and Impact

The website is now live and serves as a primary gateway for thousands of prospective students exploring Emerald International College. The platform has successfully streamlined the admissions process, providing an organized, reliable source of information and applications for students globally.

Learning Outcomes

This project was a significant learning experience in several areas:


  • SEO Best Practices: Gained hands-on experience in applying SEO techniques to increase the website's visibility and attract more users.
  • Application Form Optimization: Learned how to design application forms to improve usability, reduce drop-offs, and make the application process easier for users.
  • Website Performance Optimization: Enhanced my knowledge of performance optimization strategies to ensure the website operates efficiently, even under heavy traffic.