21TORR Mobile Logo

How we made Blum Media Collect

A smart business solution by 21TORR MOBILE

The beginnings

Early in 2013 we were approached by Julius Blum GmbH to help them create an iPad application to be used by their sales staff. Immediately, the brief appealed to us. We quickly realized that the app they asked us to create could serve as an important every-day tool for their sales staff around the world. If done right, it would substantially facilitate the work of Blum’s sales staff. They would have all the documents they need available all the time. Content would be always up-to-date. Information could be presented in new ways.

At the time Blum contacted us, the company was already well experienced in providing iPads to their employees at a larger scale. However, the one piece that was missing was a custom-made app specifically tailored to the needs and habits of their sales staff. Up until then a suite of off-the-shelf apps — more or less integrated into the Blum infrastructure — was used to provide content to the users on their iPads.

Following the initial brief we met regularly to help us carve out a deep understanding of all the aspects of the solution. We discussed questions in epic detail on all levels. Several times, conceptually and technically. While these personal meetings and workshops helped us get a more and more precise picture of what we were about to create they also served another purpose: They built up personal chemistry. Long before we actually started designing the first mockups of the user interface and writing the first lines of code, we already knew and understood each other very well.

Deep system integration

Technically, one of the key challenges of Media Collect was to have huge numbers of marketing and technical documents up-to-date on the sales staff’s devices. In addition, content is individual to each user. So each user of Media Collect would have his very own set of documents available on his device. Given the fact that sales staff is constantly on the go, all content must be available offline, permanently stored on the device. Also, documents change on a daily basis, so there must be a mechanism to update all offline-content very efficiently.

We quickly realized that we would need to build a system very deeply integrated into Blum’s infrastructure to meet all these requirements. We found that Blum already had a very mature system infrastructure to manage all their content that we could build upon to achieve our goals.

So in theory, everything we would need “content-wise“ was already there in a managed fashion. However, there was some bad news, too. The systems we would need to integrate into were based on a variety of different technologies. More so, they were by no means designed to connect with “lightweight app clients“ in a flexible and robust way.

Without Middleware

So, after a deep analysis of what was already there we decided to go for a “client-middleware approach“. By implementing a middleware system between the client and “Blum’s source systems“ instead of talking to these systems directly we gained some key advantages for the overall solution: The client (read: the app) itself could focus more on presentation, not heavy data logic. It would talk to just one system, not many. When there are changes in the source systems, there is no need to update the client because we can make all required changes in the middleware system while maintaining a continuous interface towards the client. Communication between the client and the middleware is super-lightweight and mobile friendly in terms of bandwidth-use. The middleware also allows us to perform some essential app-specific tasks that weren’t even present in the source systems.

Without middleware

With Middleware

Choosing this approach from the start turned out to be priceless in the course of the initial development of Media Collect. It offered us the flexibility and robustness required for a solution as complex as this. And even today as we constantly improve upon and add new features to the solution we still benefit from our initial decision to go for this architecture.

With middleware

From a file tree to a delightful app experience

The huge number of documents a user has at his disposal of course not only presented a technical challenge, but also one in terms of user experience. As we developed the user interface and app experience of Media Collect it came down to questions like this: How should an interface work where the user is able to efficiently find 20 out of thousands of documents, images and videos? How can we ensure that the user is able to find and view the three relevant pages in a PDF-document consisting of 250 pages?

At the core we were dealing with huge amounts of documents and information that must be browsed and viewed in a very efficient and intuitive way. When we looked at the existing off-the-shelf solutions that were used by sales staff so far, it became clear that in this respect they were far less than great. Basically, they were organized “very technically“ in a hierarchical file system structure that provided an awful experience to the user.

It took us many iterations and prototypes until we reached a state that felt right. Sketching and prototyping continuously before we actually started building the real thing allowed us to find the right direction without becoming distracted by specific implementation details. Also, the prototypes allowed us to discuss our approaches with the client very often and incorporate their feedback immediately to progress.

“Perfecting Motion” is the vision Blum has for its products, and so, animation naturally played a key role when we designed the user experience of Media Collect. We strongly believe that animation adds important context to a user interface. Therefore we meticulously fine-tuned each and every transition and animation of Media Collect’s user interface.

(Not) Available on the App Store.

Distribution is an important aspect of app creation. As Media Collect should be deployed to iOS devices it was essential to utilize the platform’s distribution possibilities effectively. Initially Media Collect was used exclusively by Blum staff. This meant that we did not have to distribute the app using the public App Store but could leverage Apple’s Enterprise Program to deploy the final product to the sales staff’s iPads.

Not available on the App Store

This process is called “InHouse distribution“ and is one we were already quite experienced with from past projects. InHouse distribution allows us to deploy und update apps very quickly and without any regulation from Apple to devices of Blum-employed staff. We can also implement mechanisms that allow an app to update itself completely automatically whenever there is a new version. This is not possible on the regular App Store.

We usually provide two or three new releases of Media Collect a year. Our goal is that after a new release ships all active users (around 600 today) run the latest version very soon. By providing Over-The-Air update mechanisms in the app itself and by utilizing Blum’s Mobile Device Management infrastructure to actively push out new releases to the devices directly we see extremely high update rates in a very short period after the release.

However, over time the need evolved to distribute the app to users that are — strictly speaking — not Blum employees. After quite a lengthy discussion with Apple whether or not these users are allowed to have access to InHouse builds of Media Collect it became clear that we needed an additional way of distributing Media Collect to users outside the Blum organization.

In early 2015 we started distributing Media Collect on the public App Store, too. While it was technically not a major problem to distribute one app in multiple ways on the iOS platform, it still meant that for users running the App Store version we had to sacrifice the elegant ways of updating to a new version.