Eckes-Granini Sales Book

An online and offline sales book web application

date: From 2007

tags: HTML5, Ruby, Rails, EmberJS, localStorage, FileSystem

Visit their website The problem

Eckes-Granini came to us in 2008 while looking for a numeric sales book that was not tied to a specific platform, and which could easily be managed and updated when needed.

This sales book was to be used by their salesman, and therefore needed to be as intuitive as it could be. Aside from that, the very nature of their job made it clear they needed a solution that would work offline, since you can never be sure about having a network connectivity when traveling.

The solution

Considering their needs, we decided to build a web application. When we first started working on it, the web was not in the same shape as it is today, and the technologies that came with HTML5 were not nearly as available as they are nowadays.

This is why the first versions were powered by Google Gears, which was back then the only reliable way to enable offline synchronisation.

The application improved and matured as the web did, switching to standardized technologies such as the HTML5 Cache manifest as soon as they were available and stable enough.

In late 2013, the application was reworked from the ground-up, using new technologies (such as Ember.js and the HTML5 FileSystem APIs) and a cleaner interface (check our blog post for technical hindsights about the whole operation).

This allows the application to be very fast to use and very reactive to what the user is doing, wether it is exploring the documents available via the file explorer or managing the users and documents in the administration.

The file explorer works in the same way the file explorer on your computer does, though we sticked to a column-based interface for simplicity's sake.

On the top-right of the interface is the synchronisation status bar, where information about the current state of the application is displayed : how many files in total, how many are cached, and what is currently happening.

We kept the salesman interface pretty straightforward. There was no need to burden them with account edition page and other stuff: they come to the application, they log in, they see their files and which ones are available offline.

The backend is quite standard. It allows the administrator to manage users and documents. The document manipulation interface is split in two panes: the left pane lists the folder hierarchy, while the right pane show everything related to the selected folder: subfolders, documents, and creation/deletion/reorganization.

In early 2014, the application was being used by more than 100 persons, and gave access to 500 documents, adding up to about 1 Gb of data to store in your browser. Those documents can be of any kind, from a light PDF file to a lenghty video.

Novelys also takes care of hosting the application on its platform. The documents are hosted on Amazon Simple Storage Service for greater performances.