Maersk Line

• Instruct users on using the new "Do Business" e-commerce website
• Animated tutorials simulating various e-commerce procedures
• More than 60 minutes of detailed & rich animations
• Catered to a multilingual audience: tutorials are available in English, Spanish, Chinese: Mandarin & Cantonese (with the ability to switch between Traditional & Simplified Chinese scripts), French, Portuguese, Korean & Japanase
• Carry extra features such as corporate videos, 3d virtual tours & screensavers.
• Deliver on a strict timeline for the release of new Ecommerce website.

Maersk Line’s online ebusiness services, known as “Do Business”, provides a seamless workflow for customers to securely reuse, search, save & overview shipping information. Maersk Line approached Demonz Media to create a new elearning solution for their expanded “Do Business” services. The primary objectives were:

• To create tutorials for the main areas of the “Do Business” services (Control Centre, Tracking, Schedules, Rates, Booking, Documentation, Reports & My Profile) and to create an introductory tutorial for the Maersk Line website (known as Website Tour).
• The ability to access the elearning tutorials in multiple languages with the ability to switch between text and voiceover languages independently (e.g. Cantonese with simplified Chinese text). 
• The ability to easily add various text & voiceover languages easily in the future.
• The ability to deploy the elearning tutorials in multiple formats and platforms (e.g. online & offline, CD/DVD format, Windows/Mac/Linux) and independently of each other.
• To create a professional look and feel & to ensure that the user interface is inline with the newly created branding guidelines for Maersk Line.

Demonz innovated by creating a smart rendering engine (model-view-controller system) that dynamically loads different resources such as font data, text, audio & images as needed when languages are changed. The rendering engine is smart enough to perform the complex calculations required to layout the text on user interface elements based on various factors such as the language used, number of characters in the text, the size of the text and the anti-aliasing level.

Although Maersk Line had very strict branding guidelines including the very strict use of a set number of colours and fonts, Demonz was able to create a very strong, modern and aesthetic user interface by utilising gradients, soft shadows, floor reflections and simple highlights. Interactivity and continuity was added via colour changes, simple fades, blends and blurs to give a very professional finishing touch. The dynamic nature of the system allows it to be deployed in all the required platforms and formats.

The system allows the delivery resources of varying quality such as the ability to choose the audio quality on the online system. The system can also deliver single tutorials without loading all the components, making it ideal for online deployment for users with slow internet access. The rendering engine detects the CPU speed and cuts down on animations on slow machines and provides special effects on high end machines, thus addressing the key requirements of all three target markets.

With a 94.4% market penetration in emerging markets such as India and China and a 98.5% market penetration in mature markets such as the US, Europe & Japan, Adobe Flash platform was our well researched choice of development platform giving us the ability to target any browser for online deployment. Flash’s ability to create PC and Mac projectors allows us to deploy the project as an offline standalone system that can be installed locally or distributed via CDs or DVDs.

One of the most exciting and innovative features of this system is that it’s adaptable to the deployment environment and that it can be used by anyone from a customer to a marketing manager for their specific task.One of the great limitations of Flash is the inability to display fonts that are not in the user’s system. However, the system is smart enough to dynamically load an optimised version of the language font to the user’s system, eliminating the need for users to have special fonts or language packs installed to view the tutorials. This also takes a big weight off administrators who would otherwise have to worry about configuring and installing language packs on each machine. Another innovative feature is the flexibility to change the voiceover language and text language independently of each other, making it ideal for situations such as listening to the tutorials in Cantonese or Mandarin while reading the text in traditional Chinese or simplified Chinese.

As the system is operating system & browser independent, users do not need to have special fonts or language packs installed on their machines to use the tutorials and administrators do not have to worry about installing extra software and reconfiguring machines. The painless deployment and the adaptability of the system is one if its strongest features.The extremely accessible and easy to navigate user interface adheres to all general accessibility guidelines such as having differentiated links with mouse over and mouse out states, large clickable areas and large text sizes so that the system can even be used by vision impaired users.

As the main feature of the system is the tutorials, a large portion of the screen real estate (over 90%) is used for playing the tutorials. The interactive tutorials use a combination of zooming & highlighting with well placed speech (text) bubbles and voiceover to explain the ebusiness services to users. The system also provides user interface controls for playing, pausing, stopping and jumping between sections within tutorials. Voice language, text language, volume & music control menus are a mouse click away for easy access. Another highly useful feature is the ability to access or activate different sections and controls via keyboard shortcuts making it an ideal tool for disabled and power users.

The solution diagram below presents our phased approach to completing the project.