Bluejacketeer

Bluejacketeer Description

Bluejacketeer is a system that helps Hospital Corpsman study for the Navy-wide Advancement Exam.

Our client reached us when he was in troubles with his website, several technical issues and non-responsive design were harming expected behavior and user experience. That's why we started fixing the issues from previous development. The key of the website is to offer to members a strong tool to study and increase their chance of getting promoted, that's only possible if users can easily follow the study program but at that moment the user experience was not good, glitches time to time and this didn't look as professional as our client expected.

Flashcards

We implemented a new flashcards system to provide to members a better approach to remember easily the answers to thousands of advancement questions. This included the flashcards manager, an administrative section in the backend to create a flashcard and associate it to an existing question, that way the user can choose the regular question-answer interface or flashcard to complete a study path.

Responsive design

After release a new stable version of the website, we started working on the new web design, with a modern look and feel and 100% mobile-friendly. We installed Bootstrap framework and performed a complete redo for HTML templates without affect existing features; and for sure we improved the user experience.

Mobile app using Phonegap

Once we released the new website with responsive design, we started planning new great features to improve the way users can learn and take quizzes wherever the were, even offline! So our client send to us a few screenshot to support his idea and how he had been envisioned the app. We took them to integrate the technical requirements, for example how we can take advantages of existing HTML+Javascript module we implemented for website and reuse part of it to develop the mobile application, that is how we choose Phonegap to build it.

The users need to hire a membership to be able to login in the mobile app. This membership can be purchased in the website. We implemented Stripe gateway with single and recurring payments for it.

Phonegap is a mobile application development framework to create hybrid apps.

What is an hybrid app?

It is as a web app, built mainly using HTML5 and JavaScript, wrapped inside a thin native container that provides access to native platform features. Therefore, we can reach all native features of the device, e.g. contact list, GPS, network connection, camera, etc.

For this project, we implemented the logic to detect Internet connection (3G, 4G or wifi) so we can switch online or offline mode. When offline, we implemented an SQLite database to save user progress and the “sync” button to upload progress to the server once we detect Internet connection.

With the mobile app, Bluejacketeer members can study exactly in same way they do on website. Even better, they can use both, synchronize their study path progress and continue learning either on website or mobile app.

Mobile app support on iOS 8.1, iOS 8.2, iOS 9, Android Jelly Bean (4.1–4.3.1), Android KitKat (4.4–4.4.4, 4.4W–4.4W.2).

Technologies

The website was developed by a previous provider, it was a custom PHP framework with just a handful of features. We improved framework security and extended the server API. The server API is key part of the mobile app development, as it needs to handle all requests and serve results for the app. This RESTful API was implemented using Slim framework.
The mobile app was built primarily using AngularJS and Bootstrap which provide built-in components for responsive design that ensure compatibility with a large list of devices. We also use NodeJS and Bower to manage our development packages.

Visit live site here


Tagged under

Tags