Sector(s)
Team Members
Visit the site
Visit the siteOrganizations Involved
Community contributions
- Issues created as part of Project
- Module on Personalized User Recommendations integrating GA360 with Drupal
- Pune Camp Session on Agile Development on Drupal Project - using DIageo as a key case study
DIAGEO is a British multinational company, with its headquarters in London, England and offices on six continents. Given that the alcohol category has challenges in direct communication in India, our task was to help Diageo relaunch their portal which is a surrogate platform used for communicating their brand positions. The primary gateway for this is their portal SocialGOAT.in. The key mandate was to assist DIAGEO as Technology partner and Support in building the MVP (Minimum Viable Product) in Drupal 8.
Business Objectives: Consumer Connect, Brand relaunch/ refresh, Revenue Generation
Product Objectives:
- UI/UX Best Practices, New brand positioning & Device Agnostic platform
- Editorial Features to facilitate ease of Publishing
- Search Engine Optimized
- Personalized content
- High Performance
- Scalable
- PII & PIA Compliance
- Accessibility Compliance.
Unique Features:
- Recommendations
- Web Browser Notifications
- Age Gate Integration
In this case study we present
- Why Drupal?
- The Project Requirements
- The Approach
- Outcomes
About the project
Project Requirements
- Recommended and participated in discussions with different stakeholders in the portal ecosystem, the content team, the design team, the social team for alignment with technology
- Review of UI/UX: Recommended best practices
- SEO/ SEM (advisory role)
- Development support: Development, Migration & Hosting support for CMS
- Ongoing Maintenance: Application Maintenance, SEO and Infra optimizations
Implementation approach
- Project Management
- Project Management methodology implemented was a Hybrid Approach. The project had overall timelines and within these timelines an Agile methodology was followed.
- During the initial stages, monthly in-person meetings were organized. Apart from that there were weekly review calls.
- Confluence was used for maintaining the requirement specifications, meeting minutes and action items
- JIRA was used for Sprint management.
- Review of UI/UX - Key areas of assistance in UI/UX include:
- We did a persona analysis of the user base and arrived at the user journeys. This was mapped out to the information architecture and sitemap and wireframes. This was then progressed into the graphic designs.
- Review of user designs for technical compatibility
- UX best practices including inputs on best practices for responsive designs, color combinations for usability.
- Some specific suggestions were provided to assist in better utilization of website real estate, utilizing negative spaces with fluid components such as Ads and subscriptions.
- SEO/SEM
- Site HTML structure evaluated and optimized for SEO
- Site was optimized for voice search
- Specific Schemas were targeted for specific result positioning on Google, e.g. Recipe schema
- Meta Description & Meta Keywords for each content created
- Customized schema generation for each content type
- Best practices for URL Indexing & Redirections
- Identifying key tools to measure SEO impact
- AMP pages & optimization
- Suggesting keywords for articles.
- Technical Features - This section details the technical creativity during development.
- Platform was built on Drupal Acquia Lightning Drupal Distribution for Enterprise Authoring. This helped us speed up the implementation of application by using out of the box features like Media, Workflow, etc.
- Other Editorial tools include: Custom Ad Banners with Editorial Control, Provision for editors to create Special Brand Category Pages with zero support from Development team, Manage Newsletter subscriptions & Interface for creation of Newsletters
- Integration with Central Customer database through API calls, MFA was done using custom modules.
- Caching Strategy -
- Cookie based caching in Cloudfront to support personalized user content
- Anonymous user Integration with S3 for assets
- Authenticated user - Drupal 8 tag based caching was leveraged
- AMP enabled
- Built on Enterprise cloud (AWS), Scalable Architecture was designed for seasonal peak traffic optimizing infrastructure resource utilization
- Migration - Unimity has migrated 1000+ content items from existing site to Social GOAT. The process required mapping the existing data fields to new data fields. Utmost caution should be taken to migrate images & videos along with tags (Keywords) and SEO related fields like Alt Images, Meta Descriptions.
- Social Features - FB Commenting & Social Share
- Security compliance/PIA/PII Compliance - In order to take care of PIA / PII Compliance, integration with the central customer datastore was implemented and all the data transition between the systems was through authenticated service calls over HTTPS
- Unique Features
- Personalization - Content personalization using user behaviours and history is under implementation.
- Web Browser Notifications - Web browser notification enables the user to subscribe the notifications on Social GOAT site. When the user subscribes, a notification will pop up on User’s device whenever a new content is created. The User also has option to choose to get notifications for only when content is published in selected category like Fashion, Movies or Cricket etc.
- Age Gate Integration - Pertaining to legal stipulations in India there was an Age Gate integration required for the Website. However, at the same time PII / PIA compliance had to be maintained. To satisfy both these conditions, Unimity has integrated Age Gate into the application where the form will be fetched from client’s infra and displayed in the front end where the user enters the DoB. This personal information will be sent & stored client’s central database.
Overview of results/Outcomes
- Unimity was able to coordinate with an ecosystem of technology vendors across countries and launch the website on time
- Provided critical inputs to the agency towards creating a contemporary UI/ UX design
- Leverage Drupal 8’s Editorial Capabilities
- Page Speed optimized to load in less than 2s
- Project execution Speed - Migration from Drupal 7 to Drupal 8 in 5 months
Testimonial from the client
Unimity Solutions was on-boarded as Technology Partner for the redesign and launch of SocialGOAT.in - our Consumer Engagement Website and have been closely working with our Technology and Marketing teams. They are a very technically-competent team as regards to Drupal knowledge. What is more commendable is their comprehension of overall business requirements and translating them to future ready technology deliverables. On multiple occasions during the project, the team went out of their way to ensure that all committed timelines were met. I have absolutely no hesitation in recommending Unimity for large-scale Drupal projects.
Khushboo Benani
Head – Influencer Marketing and Brand Advocacy
DIAGEO India
Why Drupal was chosen
DIAGEO's earlier platform Live in Style was in Drupal 7 & they wanted to migrate it to Drupal 8 for it’s enterprise-ready capabilities.
- Device agnostic UI
- Editor features
- Search engine optimization
- Content Recommendations
- Performance optimizations
- Scalable & Cloud Support
- Security Compliance
- Accessibility Compliance
Device agnostic UI
Drupal’s support for responsive UI was leveraged - responsive images, lazy loader, support for javascript & media query capabilities.
Editorial Features
- Drupal Acquia Lightning helped speed up the implementation of application by using out of the box features like Media, Workflow, etc.
- Page Layout Management for creating Campaigns - One of the Drupal 8’s sophisticated features is Page Layout Management. Unimity has leveraged this feature to build a platform for Diageo which allows content management to create Campaigns on the fly. Page Layout Management has provided permutations & combinations of various UI components such as Carousel, Text, Images, Social Media Embeds, Videos etc to be placed. The feature provides various templates where the content management team can customize the color, font, style and format.
- Content Promotions - Using Drupal’s entity queue editors were given permission to promote content based on their choice.
Search engine optimization
Support for friendly URLs, meta tags, custom schema, Performance optimization support.
Content Recommendations
- One of the features we have built for Social GOAT is Content Recommendations for individual users.
- GA360 has been leveraged to build this functionality. Basing on the content browsing of a User the GA360 will filter two attributes of the top 50 content and will suggest 4 recommended content.
- This content will be displayed as a block in the website.
Performance Optimizations
- Use of JSS,CSS aggregator & Advanced aggregator module to optimize Page speed
- Caching Strategy -
- Cookie based caching in Cloudfront to support personalized user content
- Anonymous user Integration with S3 for assets
- Authenticated user - Drupal 8 tag based caching was leveraged
- Image Capabilities - Enabling Drupal’s core and contrib modules enhanced image capabilities were designed for Social GOAT. The features include image cropping, responsive images and image lazy loading. Responsive image & Lazy load contributed towards faster page load and increased performance. Whereas image cropping brought consistency to the content across the site.
- AMP Pages - Drupal’s contrib AMP module was used to build AMP pages for Social GOAT with brilliant look & feel without compromising the usability or content presentation.
Scalable architecture
Architecture deployable in Amazon cloud and integrations to components like REDIS/Memcache, RDS & Amazon S3
Security Compliance
OWASP compliance was met. We were able to build connector modules that integrated with their Personal Identity management system and age gate tools.
Accessibility Compliance
Drupal’s support for Accessibility was extended to meet Diageo needs.
Technical Specifications
Drupal version:
Key modules/theme/distribution used:
- A whole list of contrib modules were used to assist faster delivery of project.
The modules aided in providing:- Enhancing UI
- Improve performance
- Enhanced editorial features
- Enterprise Drupal Distribution Acquia Lightning helped speed up the implementation of application by using out of the box features like Media and Workflow
- A Component based Theme was implemented.
Using component based theme enabled significant reuse of components which helped in optimization of code. To achieve this component based design we have leveraged Emulsify with pattern labs contrib theme.