- Gain cost savings by centralizing a larger body of work with fewer agency partners
- Migrate website from Umbraco to Drupal 8
- Create a flexible architecture to support marketing technology initiatives
- Improve workflow for content editors
Performance Gains: Thanks to core features of Drupal 8 and PHP 7, along with architectural choices in the setup of the site, Verifone realized a 32 percent overall improvement in page load times from the previous site. On mobile and tablet devices, the page load times improved by 37 percent. These gains were realized despite the new site’s designs calling for much larger and richer imagery on each page.
Delivering a Highly Flexible Component-Based Theme with Drupal 8: Mediacurrent applied the component-based theming approach our team has refined over the last two years. With this approach, Mediacurrent’s front end developers got a jumpstart on theming the new website and components before backend development began. Thanks to Twig, Drupal 8’s templating system, front-end developers are able to build components independently of Drupal, and later integrate those components by leveraging the Twig templates we already created and without having to rewrite the component markup or styles. This is not a luxury we could take advantage of with previous versions of Drupal.
The new site architecture was styled with a focus on flexibility. The build is completely component-based and uses Drupal’s paragraphs module for all of the build output. With this approach, Verifone content editors have the capability to make dynamic and customizable pages.
Among the advantages of component-based theming are:
- Clean and semantic markup. Good markup is critical for many reasons including better presentation of content, more natural content layout, higher search engine ranking and a more accessible website.
- Reusable components. Each component is on its own, independent of anything else around it. This means we can make use of a single component in multiple pages or sections of the site without having to rebuild the component for every instance. It’s typical of many sites to use patterns in design or content layout, and components lend themselves nicely to this approach.
Syncing up with a Living Styleguide: Mediacurrent’s approach to building websites with components provides clients a front row seat to the development process. Through a living styleguide, Verifone was able to take a sneak peek at how the project was progressing by reviewing and conducting QA of components directly in the styleguide. Components are showcased fully styled and functional to allow clients to fully interact with them.
Managing a globally distributed team: Between Verifone and Mediacurrent, the team working on the project spanned half the globe from the east coast of the United States to Singapore (12 time zones), which presented potential communication and productivity challenges.
Cognizance of the time zone challenge led team members to plan accordingly so that information and communications were exchanged to the appropriate party at the start of each day. This allowed each team to have the information needed at the start, not at the end of their respective workday. Non-traditional work schedules were utilized to provide for video-conferencing of status updates, demonstrations, and reviews. The teams also leveraged standard Mediacurrent communications tools to manage the project and communicate with one another.
With this project, Mediacurrent passed the 30,000-hour mark in building Drupal 8 solutions for our clients. Combining Drupal 8-based Symfony training and Acquia Site Builder certifications with demonstrated real world experience, Mediacurrent had the capability and knowledge base to lead Verifone’s Drupal 8 build in a condensed time frame.
- Paragraphs - Paragraphs were leveraged to provide flexibility and address the complexibility of data modeling. We narrowed our focus to how we could get the client to enter their data. We weighed field groups and writing custom models as options but ultimately determined that paragraphs were the only option that addressed this out of the box.
- Component Libraries - Used to reference twig files that are outside of the /templates directory, this module provided a framework for our component-based theming approach.
- Media Entity Browser- A group of several different modules to optimize the media experience in Drupal 8.
- Focal Point - In combination with the media entity browser, this allows editors to select the focus of an image and automatically crop around that point. This ensures editors can upload one image and have it look correct across all areas and aspect ratios.
Several patches and testing instructions were contributed to the community as a result of this project.
Mediacurrent contributed to Twig Pre-render, a twig extension that allows you to pre-render and preprocess Drupal render arrays so you can get at all the contextual variables inside. We will also contribute two patches that were created to make content moderation work with panels.
Realizing a united vision across a globally distributed project team and stakeholders, Verfione.com is a successful addition to Drupal 8’s portfolio. Looking to the future, Verifone is poised to scale and evolve their digital presence. Some of the advancements on the horizon may include new website functionality, Learning Management system improvements, and the development of microsites and landing pages, and mobile applications.