We were recently hired to build a custom WordPress website that would allow our client to upload XAPI/ SCORM compliant courses and sell them online alongside a fully functioning user dashboard and messaging system.
Our client had contacted several different agencies and was told the minimum turn around on such a project could take up to 6 months. We proposed that we could get it done in 4 – 5 weeks, and I’m happy to say, we achieved this.
The first step was to engage with our new client and discover precisely what it is that they wanted. After a kick-off call of bouncing ideas back and forth, we set to work on mapping out the new website. We knew it was going to be a lot of work and a lot of coffees, but who doesn’t love a challenge?
We decided to prioritise the core functionality and features for Phase 1 and work out what we had to build in time for the launch date.
There were 3 core areas that we had to focus on :
Once we had worked out what we needed to prioritise, the team started building the skeleton of the website.
We went with a simplistic UI and created each individual page that was required for the main website. This included the Homepage, About Us, Course Directory, Help and a few course landing pages.
For this website, we needed to build a login system that would enable the user to create an account and log in to view their training material. We opted to get Learnpress plugin which is a free LMS system that allows WordPress admins to create their own courses. We couldn’t use Learnpress straight out of the box, so we had to begin customising it. We had to get a few third-party plugins that cost around £200 in total to allow our client to import XAPI / Scorm courses. Although we had used third-party plugins, some customisations were still needed.
Learnpress has it’s own login and registration system which we used, however, we had to create some custom functionality. Our client wanted a one-time passcode for both email and mobile, which we built and integrated the Twilio SMS API and Sendgrid.
Additionally, our client wanted the flow of registration to be more than just your common name, password and email address, so we built a wizard that asks users questions that can later be used to promote specific courses based on their answers.
The whole registration process and buying a course part of the website was to take no longer than 3 minutes for the user to complete. We managed to make this possible in under 2 minutes.
We joint learnpress to work with Woocommerce & Stripe1 of 7
We built course cards that showed the course image, price & excerpt. Along with a button that changes from BUY NOW to LAUNCH COURSE if the user has purchased the course2 of 7
Fully customised User platform, With a registration wizard that learns more about the customer so that courses can later be reccomended3 of 7
Integrated Stripe payment gateway to handle all the payments.4 of 7
Search based on tags, categories & course titles.5 of 7
Sticky navigation bar6 of 7
GDPR Privacy and cookies notice popup7 of 7
Course directory page. Click on the flashing dot for more information
Once the user system and learn press was integrated and customised, we needed to integrate a payment gateway. We decided to incorporate WooCommerce as it’s easy to install and quick to get it working, plus would be beneficial for our client to manage orders and view payments.
We then added the Stripe payment gateway, and did all of the customisations that were needed for WooCommerce, such as separating courses from being products, adding terms & conditions to the checkout page and customising buttons to say ENROLL IN COURSE rather than the standard ‘ADD TO CART’ or ‘BUY NOW’.
By this point, we were on week 4, we had just touched the deadline, but testing was still needed to be done. We created a staging environment and production environment and began testing everything. After a full week of testing and about 300 test registrations and 100 purchases, we were happy to say the site was complete and our work was done.
This was quite an achievement for BOLD, and we’re happy to say our client was pleased with the website and application.
Founder of BOLD Creative Agency
If you’re interested in working with us. Fill out your details below and one of team members will contact you.