Sector(s)

Team Members

ckrina, rvilar, ctarres, nachosalvador, dimaro, ipitbiz

Visit the site

Visit the site

Organizations Involved

Community contributions

We have contributed several patches to different contrib modules, such as webform, redirect or migrate related modules.

The EBMT, European Society for Blood and Marrow Transplantation, is a collaborative peer network of professionals working, in centres and as individuals, in the field of clinical bone marrow transplantation and cellular therapy. Together, they make up the membership of the organization. Members contribute to and benefit from the collective knowledge that the EBMT has accrued, with the ultimate goal of saving the lives of patients with blood cancers and other life-threatening diseases. 

The EBMT created a digital strategy committee and decided that one of the key points were to renew their website (the old website was launched at the end of 2011, and was developed in SharePoint). First of all, they decide to invest some effort in their brand redesign and after that, they focus on website analysis and development.

About the project

Client’s goals

The main goals of the new site were to:

  • Make it more user-centered and strengthen the member communities.
  • Upgrade it to a responsive website design.
  • Strengthen the brand with an enhanced look and feel.
  • Provide content editors an efficient and easy content management system.
  • Generate online payments for membership, events and courses, and increase revenues.

Prototyping and wireframing

First of all, we helped them defining what were the needs in the organization’s web level, based on their previous website with big problems detected and thanks to the benchmark we did. 

Once done, a series of interviews were made to different stakeholders throughout Europe to know the needs they had and also to take them into consideration. All in order to define what is the object of the web for their users and identify current problems to solve in the new website. Some of them were:

  • Hard to find documents and study on their current structure.
  • Impossible for a new user to find information and process to become a member.
  • Impossible to use the website in other platforms than desktop browsers.
  • Fixed structure which made impossible to add new pages/information from other groups.

In addition to that, a focus group was also defined to work on the new content structure using card sorting and also to test the prototypes defined to be sure all is correctly adapted to different group. At the design and discovery phase, we delivered all the sections of the web designed using a component-based design system.

Component based website

Instead of working with the old point of view of focus on final designs in PSD, we work in a component design way: we designed all the components that the page need to create their content. For example, a landing page can be created with a strip of HTML text, then an image gallery and then another piece of content. We created design for theses pieces and we grouped all of them in a components style guide. All of these components were extracted from the wireframes developed in the previous phase.

Content structure

One of the main problems in EBMT was the organization of a big bunch of documents, studies and information on the website. Joining forces with a focus group created for this purpose, we used card sorting technique to organize all the content and data in a set of categories related to the organization structure and culture. It helped us a lot in our analysis and discovery phase and brings an updated hierarchical information architecture to the organisation to solve their current needs and for the future.

Migration

Most of the available data from the legacy system had to be migrated into the new site. There were a lot of information to migrate and form different sources, so we created a middle structure between legacy and new sites to grant editors the possibility to review, create or update information before migration was performed.

We used Migrate API to create the scripts to move information from the middle structure, transform the data and save to the new Drupal website.

Awards

This project win a 2019 Spanish Splash Award in Design/UX category.

Why Drupal was chosen

It was very relevant for EBMT that the CMS chosen for their new website had to be open source. They didn’t want to invest money maintaining licenses and they want a highly maintained platform, very flexible and with a large number of companies available to help them in the future.

Also, they chose Drupal because:

  • It is a very secure CMS.
  • Editor experience is very important for this project.
  • Drupal has a lot of power managing a big amount of content and EBMT had problems in the past with this.
  • There are other organizations similar to EBMT using Drupal.
  • Drupal is a very scalable CMS with enough power to help them developing their IT future plan.
  • This is a very flexible CMS.
  • Third party integration is very important for EBMT and Drupal has a lot of power solving these problems.

Technical Specifications

Drupal version:

Why these modules/theme/distribution were chosen

In order to create our desired component based editor experience, we have used actively "Paragraphs" and "Views Reference Field" modules.

We have created several components using paragraphs, adding special behaviour based in some field values or view modes.

To give the power to the editor to create cross lists using any content from the website, we have created a special component named "preview list" were an editor can chose which information want to show, which display to use and if they want to filter results usign some filters. Then, an editor can add to any page, for example, a list of last documents from some specific area or group.

Webform module was used to create membership forms. We have created a special handler to once the form is submitted, some of their data is sent to the corporate CRM and marketing tool.