Case Study "OptoBrain"

This real project illustrates Use-Lab's methodology of interface development.

The "OptoBrain" project was initialized by the Swiss company Luciole Medical AG (former. start-up NeMo Devices) and supported by the Eureka initiative . The project's objective was the development of a system to measure cerebral vital signs as the oxygen saturation in brain tissue, the cerebral blood volume and the blood flow. These parameters play a crucial role with regard to the examination and treatment of patients suffering from craniocerebral injury.

The OptoBrain-system is composed of several Hardware-components as well as sensors which are necessary to measure and process the measured data. The analysis and presentation of the data is made on a standard PC appropriate for medical application with a Use-Lab-designed user interface.

You can find a video presentation on Youtube.

Requirement Analysis

At the beginning of the project, it was challenging to formulate the requirements regarding a resolution which is as flexible as possible. According to specifications the software should be applicable for real-time monitoring as well as for retrospective analysis. The user interface had to adapt to several screens. It should be operated as well with mice at laptops as with touchpads at patients' monitors.

Software which was developed in one of the former stages of the project served as starting point since it included already parts of the anticipated functions. However, this software was only designed for mouse control. After an internal analysis it was decided that the user interface had to be fundamentally revised and redesigned.

Prior to the first design phase a broad analysis of the operational area and an exchange with potential users had to be performed. Use-Lab's design team visited an intensive care unit to interview specialized personnel and to collect first hints for subsequent drafts. The objective of those visits was to gain information about the environment and the work flow regarding the treatment of craniocerebral injury as well as to find out the strengths and weaknesses of currently used systems. Subsequent to this field analysis first ideas, notes and sketches had been developed which had influence on the subsequent draft.

Information Architecture

During the first step of the first design phase the structure of the present user interface was revealed. The information architecture for the new system was gradually created by complementing and arranging new functions step by step. Some of the newly integrated functions were an internal storage system for patient management and the simultaneous possibility to present and label measured data of several brain areas.

Thus the first design concept was produced, primarily in form of a more or less chaotic word collection which was complemented and regrouped in the course of the time by brainstorming activities and expert interviews. Little by little a mind-map which sketched the later structure extensively was created.

Design Concept

The fact that the project was based on a previous version of the software made it easier to get an overview of the required functions. On the other hand this fact represented the challenge to disengage from well-known structures to enable a renewal. Since the new development was the primary objective the Use-Lab design team decided to revise the layout completely. Such a renewal provides always the opportunity to approach a completely uncommitted product development, whereas a further development of an existing product is often connected with difficulties because the later releases and updates of the user interface also require customer care. In addition to the storage formats a backwards-compatibility plays a crucial role to fulfill the expectations of existing customers. Every serious change of layout or operating logic constitutes the risk of unacceptance among the established users.

Although the above-named difficulties make a new development seem easier, there is a high degree of responsibility in the developers' hands. The new product does not only need high user acceptance, but also a design which allows future extensions and modifications.

In the course of the new development several layouts had been worked out and subsequently checked for their user-friendliness and conformity of requirements in fundamental scenarios. One layout idea was for instance the vertical orientation ("portrait-orientation") of the screen layout. Although this orientation seemed fresh and innovative at least for medical technology, this idea had been refused since it would have caused incompatibility regarding the use of laptops or desktop PC's.

Formative Usability Evaluation I

The first formative evaluation of the usability was performed with representatives of the later user group. In the course of a focus group discussion potential end users were brought together around one table. After sketched drafts were presented and explained to the members of the focus group, they were asked open questions to get first impressions. This user survey delivered several findings with regard to user expectations.

One finding was, for instance, that the medical technology cannot elude the influence of the consumer goods industry. Characterized by the operating logic of smartphones and tablets today’s users usually search for a "home"- and "back"-icon and presume gesture control using a touch screen. That is just one example of acquired findings that subsequently had some influence on the development. In addition to gleaning first impressions regarding the different design concepts, additional questions were also posed to the focus group to identify favored layout ideas.

Adaptation of Design Concept

Prior to the elaboration of a concrete layout design the results of the focus group were analyzed and discussed within the internal developers' circle. Many versions designed in parallel were rejected in favor of a target-oriented advancement. From a designer's perspective this phase equals a "mass extinction of ideas", but from a project manager's perspective this is a goal-oriented process and therefore an enormous step forward. Sketches and interaction procedures were revised and adapted to the findings gained.

Detailed Design

During the next design steps the drafts progressively took real shape. Even though professional graphical programs had been used right from the beginning up to then the representations were merely freehand sketches. These freehand sketches give the designer the opportunity to work less precisely in the beginning, at that point it's not really about a crooked line here or an oblong circle there, This is the preferred practice for playing through several versions. It also allows discussions to stay focused on the essentials while drafts are still being evaluated. Individual participants are also more willing to grab a pen and complete a picture with their own ideas if that picture is a freehand sketch rather than a seemingly complete pixel-picture. This approach also supports the designer regarding his freedom to design. Even more importantly, the designer is prevented from an early perfectionism that could make them desire a "beautiful" design from the very beginning.

At the beginning of the detailed design the main specific aim is the determination of the final product's appearance. Therefore several design approaches were played through and compared with each other using the example of a screen layout. Individual taste and actual design trends play a crucial role for this decision since the sensation of aesthetics usually underlies external influences. Fortunately it was possible to join current design trends with functional needs in the OptoBrain project. The currently popular "Flat Design," which is focused on a minimalist use of simple elements, typography and flat colors , was practically predestined for an interface with a variable screen resolution.

Thus great attention was paid to maintaining a reduced design with simple elements during the development of the interface design. Surfaces, lines, colors and color gradients were removed repetitively until only a minimalistic but expressive design remained. This style guide was adopted for all elements on the screen to ensure a homogeneous screen design.

Interactive Simulation

Like in the development of hardware products a prototype has to be created at a certain point during the software development process. Interactive software simulations are proven tools for the testing of the functionality of the user interface and for an easier simulation of workflows. At this point it is possible to "play" with the software simulation and to find hidden shortcomings. Even stringing together several screens in Microsoft PowerPoint™, which is possible at a very early stage of development without any programming skills, can lead to new findings. With an interactive simulation it is possible to analyze the interactions of multiple screens and workflows instead of analyzing individual screens. This is a very effective way to find shortcomings like a missing button to close a menu.

An even higher detailed software simulation can be created with Adobe Flash™. It allows the system's reactions to mouse clicks, mouse movementss and gestures to be simulated realistically.

Whether a lower detailed stringing together of several screens in Microsoft PowerPoint or a higher detailed Adobe Flash simulation is used is mostly dependent on cost-benefit considerations. Since the OptoBrain software contained only little animated content, Adobe Flash simulations were not created in most cases. Only a few of the more complex scenarios were programmed in Adobe Flash™ to be used for the second formative usability evaluation. The majority of the software interaction was simulated in Microsoft PowerPoint.

Formative Usability Evaluation II

The second formative usability study was intended to improve the detailed design prior to the usability validation and the implementation. This point in the development process is kind of like the point in a wedding ceremony when the pastor says "speak now, or forever hold you peace!" Indeed, this is often the last chance developers have for design optimization without jeopardizing the schedule or the project budget.

Methodically this is the perfect time to conduct usability tests with the product's intended users. In individual interviews the moderator asks the participants to conduct multiple tasks, each of which corresponds to a use scenario, with the software simulation. Difficulties observed during task completion may signify that the user interface design can be improved. The root causes of the Difficulties are discussed and analyzed together with the test participants after completion of the task to derive improvement potential.

For the OptoBrain project three individual usability tests with neurosurgeons were conducted and the participants were asked to perform realistic tasks with the software simulation. The second formative usability study focused primarily on the complex and critical workflow of assigning the sensors on the patient's head to the respective positions in the software. Although the study showed clear results, these did not add much new input regarding the improvement of the user interface design. Nevertheless, they led to major changes in the user control and user guidance of the software.


A detailed specification of the layout and a repository of all icons and screen elements have to be created prior to the implementation of the final design. Because the user interface to be developed in HTML, a grid was arranged on the screen to determine the exact size and position of each element. The elements were also given numerical names and the elements' attributes like color, text size and content were recorded in a design file.


In addition to the design of the user interface, the Use-Lab design team also developedthe marketing concept for the OptoBrain system. It contained the OptoBrain website including presentations of the product, the design of an exhibition stand, illustrations and 3D renderings for printed magazines, the packaging design and the authoring of user manuals.