UNICEF hilft Kindern

UNICEF Relaunch

fast - agile - efficient

unicef responsive design



Go Live

October 2018

The Comity for UNICEF Switzerland and Liechtenstein was founded in 1959 as an association and is one of numerous national UNICEF comities. UNICEF is a development policy body of the UN and is financed exclusively by voluntary contributions from governments and private donations. The main task of national comities, as independent NGOs, is to raise funds for international programs and to provide information on the situation of children around the world.

To be able to carry out this task in the best possible way, UNICEF Switzerland and Liechtenstein are fundamentally reorienting themselves towards digital transformation. They want to create the basis for agile working methods and are therefore planning to replace numerous core systems with modern technologies.

The relaunch of the website is the first milestone on this path. The lifetime of the existing website is coming to an end (support for Drupal 7 ends in November 2021) and the technology has evolved significantly since the last relaunch in 2013.

The website visitors should be able to find the content they are interested in quickly and intuitively. The look will be modernized and a mobile-first approach is a must for the numerous smartphone users. In addition, the organically grown content architecture will be reduced and structured consistently.

For editors, the website should be easier and more intuitive to use, while at the same time allow more flexibility and independence in content design. By using more flexible content elements, the number of previously rigid content types should be greatly reduced and user-friendliness optimised.

In order to simplify the future replacement of existing systems (e.g. ERP, CRM), the website will be decoupled from third-party systems. However, they will still be seamlessly integrated without creating direct dependencies. This way, the third-party systems will not restrict the agility of the web processes in the future and independent adjustments can be made with no direct impact on other systems.

By taking these points into account and using the modern Drupal 8 platform, the website is set up for a long lifetime.

To reduce the large number of requirements for the relaunch of the website and the integrated systems, the replacement of the existing UNICEF setup was split into several sub-steps. In the first step, all content pages were migrated to Drupal 8 and complex, deeply integrated processes were maintained on the existing Drupal 7 website.

This agile approach has proven its worth: with a minimal budget, the new website was published after only 4 months.

Editors can work with the new powerful tools for content creation and gain experience in working with Drupal 8. The requirements for further development can be determined more precisely based on this and typically more cost-effective solutions can be found.

By adopting the design concept of an existing UNICEF website, complexity could be heavily reduced in the project -  e.g. in decision-making processes. Its modern and tidy look was convincing, after the newly developed design was optimized through several iterations based on user tests.

This design introduces a colour simplification as well as a stronger visual language. The new, fold-out menu offers the website visitor an overview of the website as a whole and direct deep links. The front page has also been greatly simplified and is now convincing, with a clear focus on the topic of emergency aid.

Primer is - after more than 6'000 hours of development - the optimal basis for this project. The CMS facilitates editors' work, because it already provides an "out-of-the-box" variety of tools for easy and efficient content creation. The design framework consistently implements Mobile-First and the presentation is optimized for all devices.

Many elements of the new UNICEF design are already available in the toolbox and only required a look adaptation.

In addition, the number of required content types was reduced from over 20 to five and the creative freedom was greatly increased with the help of paragraphs (modular system). This gives UNICEF the opportunity to work agile in the future -  to experiment with content and page structure, to gain experience and to optimize the content iteratively accordingly. For example, the donation widget was introduced as a content component that can be added by editors on any page to integrate a donation process. This allows the editors to create different landing pages (A/B testing) for a donation campaign, as well as to place donation teasers on specific topics in the corresponding news articles.

The new website no longer depends on third party systems. Forms can now be created directly on the website and the data can - if desired - be sent to third-party systems. This offers UNICEF Switzerland and Liechtenstein the opportunity to carry out their website relaunch quickly - independent of lengthy decision-making processes regarding ERP and CRM replacement. Instead, they can now already work with the new website and evaluate their CRM/ERP needs and redefine requirements.

This approach keeps many possibilities open for them and offers an optimal entry point into an agile future. The website is being continuously developed and work is already underway to replace the donation widget, taking over all processes and connecting to a new CRM/ERP system.

The biggest challenge of the relaunch is to establish an agile working method. This requires an organizational transformation, a shift in thinking and working methods, during the project and beyond in the follow-up phase.

The new website tools are an important prerequisite for agility. Much more important, however, is that all participants question the existing way of working, contribute new ideas and develop themselves iteratively with the project. The endorsement of this process is essential for success.

To support the authors and editors in this, it was important to enable a clearly structured working method that reduces technical complexity. To this end, it was decided that all content work would now be done on Drupal 8 and that the Drupal 7 site would be used thought links, mainly only to handle donations, event registrations and shop orders. An exception is the P2P platform Cycling For Children (gib-alles.ch), which will be left completely on Drupal 7 for the time being.

This separation also became a technical challenge. The old Drupal 7 website was moved to a subdomain action.unicef.ch and step by step rules for redirections and indexing were defined. Users should perceive the separation minimally and the reputation of the search engines (SEO) should be maintained.

The remaining elements and processes can now be reprioritised on the basis of experience and gradually replaced in specific follow-up projects.

Using Primer should greatly improve content creation for UNICEF. In the project, the productivity of the tools was therefore analysed and the functionality and usability of Primer / Paragraphs was in this respect significantly improved.

After an initial content migration by copy-paste, content was then gradually unraveled, tagged and enriched with new elements. This process was perceived as tedious.

Before the project, MD Systems had already been able to optimize paragraphs significantly with the new "Add" dialog and the operations "Duplicate" and "Add above". The idea then arose that you could use a special operation to transform single paragraphs into other types to better support the evolution of the content. This would make text copy-paste of several fields, searching for images in the media browser again or deleting the old paragraph separately unnecessary.

After a first prototypical development of the idea, usability was improved in several iterations based on user feedback to an optimized "Convert" dialog.

The feature was iteratively published for paragraphs open source and integrated into Primer for all paragraph types.

The improvements led to a significant increase in productivity.

Primer has proven to be an optimal basis for unicef.ch. Thanks to the wide range of standard functions, it is possible to focus on specific requirements for the project. Due to the high level of standardisation, the platform remains efficiently maintainable despite individualisation, thus significantly optimising the total cost of ownership.

Erfahren Sie mehr wie das Projekt weiterentwickelt wurde