Afrinection

Afrinection

An ecosystem for African entrepreneurs, professionals, and job seekers

Our client’s request

 image
Client's location: Africa

Our client asked us to build a networking platform resembling LinkedIn for an African audience. They came to us with a vision, a clear plan for the project, and the logo and colors they wanted to use. Our team’s job was to build a mobile website that would enable entrepreneurs, professionals, job seekers, and investors to interact and establish solid partnerships.

Business Jobseeker Career Community Technology Africa

Relevance

People are looking for meaningful connections with peers, prospective investors, and employers. There’s a growing need for a single platform to unite these actors across countries and regions as well as globally. With our client’s platform, investors, employees and job seekers in Africa can build networks and be exposed to more job opportunities.

Results

Duration:
April 2016 – October 2017
Team:
Backend - 2 Frontend - 1 UI/UX - 1 QA - 1 PM - 1
Designed the UX/UI

Our main task was to create a unique platform focused on connecting entrepreneurs, professionals, employers, and investors across Africa. We needed to encourage users to return to the platform for the job prospects and communication with companies that it offers.

Registered users can follow profiles they’re interested in just like they do on LinkedIn. We developed a convenient chat feature to support one-to-one and group conversations through a widget that allows users to chat from any page on Afrinection.

We developed several concepts for the homepage, and our client chose a simple and clear variant showing the website’s mission statement, the latest news, and new users.
 

Architecture and programming

Afrinection is a monolithic Python/Django plus HTML/JS/CSS project that we built from the ground up. We used the Django Web Framework to meet our client’s business goals.

We didn’t need to provide a lot of dynamic elements on the website pages, so server-side rendering worked perfectly for this project. We used a PostgreSQL database.

Our development team built a WebSocket server using Tornado to enable real-time notifications, and we also used Tornado for the real-time chat.

We used Celery to manage email notifications and repeatable rebuilds of the Elasticsearch search index. Elasticsearch allowed us to implement full-text search across user profiles, the blog, forums, and Advertising Partners page.
 

Developed the frontend

We used the Bootstrap framework to make the website responsive on different devices.

We chose Owl Carousel 2 for the slider since it’s easy to adapt, has many options, and is cross-browser compatible.

We implemented real-time chat with jQuery and applied SockJS to manage the client-server information flow. This complements the WebSocket API yet supports all browsers with different substitutes such as ajax long-polling, json-polling, and so on. We used a simple WYSIWYG editor to transform HTML elements into plain text and added EmojiOne to enable emojis.

All filters on the Network, Advertising Partners, and Jobs pages use jQuery with Ajax. This approach let us send client requests with JavaScript to the server without refreshing the page to update content.

We chose the fast and easy-to-use Croopie plugin to load and crop images. It has many options and methods.

For push notifications, we used the Toast plugin, which is great for showing non-intrusive native notifications.
 

Integrations

We used Stripe for recurring billing and single charges. For all website pages, we embedded and customized a Google Translate widget, which can translate all website content into many languages. We also integrated the Google Maps API to make use of location data.

Release

We’ve had two major releases so far. The first introduced the networking platform. For the second release, we created a feature that lets users add vacancies, lets job seekers look for vacancies and apply to them, and lets employers create job postings and receive feedback from candidates.
 

Implemented features

Since the website’s mission is to build meaningful connections, search is paramount. We placed search in the header to make it available across all pages. Users can search either across the whole website or within categories to find information on the blog, in forums, across the network, or from advertising partners.

Users can communicate through real-time chat that’s conveniently placed on all pages of the site. The chat feature allows users to exchange files, pictures, and documents.

Employers can post vacancies with detailed descriptions and professionals can create profiles to attract employers. Vacancies can be posted for free or can be paid for to appear first in search. In order for vacancies to appear at the top the list again, employers would have to repeat this payment in a month. Registered job seekers can apply to job openings, and share and receive interesting vacancies with their friends via email.

The jobs section has several convenient filter options. Job seekers can view their most recent search history as a list of 10 latest searches, and view the list of jobs they’ve applied to. Employers can create and edit vacancies, and see the payment history for those positions they’ve paid to promote on the website.


Job seekers can get a list of jobs by email and in their accounts that might interest them based on their search histories.

If users want to become advertising partners, they can fill in a form and subscribe to have their ads appear on the website. Monthly payments are automatically charged for advertising until a user cancels their subscription.

Gallery

Gallery
Gallery
Gallery
Gallery
Gallery
Gallery

Technology Stack

Backend

Python
Python
Django
Django
Celery
Celery
Redis
Redis
Tornado
Tornado
PostgreSQL
PostgreSQL
Elasticsearch
Elasticsearch

Frontend

S
SockJS-client
C
Croppie
E
EmojiOne Area
Twitter API
Twitter API
Select2
Select2
T
Toastr
OwlCarousel2.js
OwlCarousel2.js
Bootstrap
Bootstrap
jQuery
jQuery

See more case studies

An automated employment and payment platform

An automated employment and payment platform

A platform that automatically matches applicants to vacancies based on skills

  • Employment
  • Android
  • iOS
  • Spain
Uber for court reporters: making court staff available at the tap of your fingers

Uber for court reporters: making court staff available at the tap of your fingers

A platform that helps lawyers find court translators, videographers, and reporters

  • US
  • Website
  • Court
  • Staff