African Regions is an educational resource for researching and teaching the African continent’s complex history in broad, regional terms.

In my role as Senior Web Designer, I:

• Met with the project director to collect project requirements and feedback
• Designed a website that features two fullscreen interactive maps
• Used Leaftlet.JS and GEOJSON objects to create multi-layered interactive maps
• Developed a responsive website using Bootstrap, HTML5, JavaScript, CSS, and PHP
• Maintained a MYSQL database used to manage the content on the website

To create the clickable african regions on the interactive Leaflet.js map, I used GeoJSON Feature Collection objects, combining different svg polygons to form the regions as specified by the research project.

When clicked, each region shows a popup with a "Read More" link that when clicked opens a scrollable overlay container. Content on the site is pulled from a MySQL database.