H&R Block: Financial Services Digital Transformation with MyBlock

At the beginning of 2020, the app development team at H&R Block was well on the way to providing their clients with an assisted, digital tax prep experience. 

The 65-year-old institution which began as an in-person tax preparation service has grown to offer do-it-yourself tax prep, a suite of financial products that help customers manage their money year-round, and a range of services to help small businesses grow and thrive. 

H&R Block realized customer preferences have changed over time from in-person retail experiences to cross-channel options, and they worked diligently to keep up with the demand. Then, the pandemic hit right in the middle of tax season.

“We as an organization had to accelerate our goals for digital transformation,” says Kristina Wilson, IT Manager, Retail & Client Applications at H&R Block.

Wilson and her team had to quickly figure out streamlined ways for their roughly 80,000 tax professionals to process returns outside of the office, interact with their clients securely, and make sure they could continue to provide the world-class services their clients have come to expect.

“Now more than ever it’s important that we’re able to serve our clients however they want to be served, wherever they want to be served, with a year-round support model,” Wilson explains.

We as an organization had to accelerate our goals for digital transformation.

Kristina Wilson, IT Manager, Retail & Client Applications at H&R Block

Financial Digital Transformation Challenge

MyBlock: Starting from Multiple Code Bases

Part of H&R Block’s digital transformation required Wilson and her team to assess the current web and mobile strategy. They took a closer look at their customer-facing online portal, MyBlock.

MyBlock—H&R Blocks’ private, online portal is designed to help clients access and share tax documents, check e-file return status, manage money, and even perform a credit score check. Initially, the developers created individual MyBlock applications for Android, iOS, and the web using three separate code bases. This made maintaining the app extremely inefficient.

"We are very interested in speed to market and efficiency. Managing a web app and two separate mobile apps was no longer efficient for us and that's why we wanted to streamline our development and build cycles. That's why we began our journey with Ionic," recalls Wilson.

MyBlock began as a monolithic onprem application, which made updating the software difficult. This lack of flexibility decreased the speed-to-market and didn’t provide clients with the changes they needed immediately.

With this information, Wilson and her team of developers decided to build the application from the ground up.

Financial Digital Transformation Solution

The MyBlock Rebuild

Wilson and her team began working with Ionic through a proof of technology in May 2020. They already researched using micro app architecture in MyBlock, and wanted to be sure that Ionic would be the right partner. They quickly realized the technology would work. 

By September 2020, they started work on their mobile application using Ionic products Capacitor and Stencil. Just a few short months later, they released their first new Progressive Web App and mobile builds through Ionic.

Micro App Architecture 

MyBlock has been rebuilt as a Cloud Native application leveraging a micro app architecture with Angular, which lends itself well to the Ionic platform integration. 

“One of the principles we focused on was increasing our speed and agility,” says Nick Trower, Solutions Architect for H&R Block Client Applications.

Using micro apps like Secure Messaging—which manages client communication with an H&R Block tax pro directly in the app—allows for build flexibility and avoids duplicating efforts. One team could build and host the app in their environment and another team could take that capability, encapsulate it in their Ionic code base, and deploy it.

“Let’s say you want to have a full omnichannel experience and adopt devops. We’re able to break up those responsibilities by team. Then, that team is responsible for a specific business domain and logic within the micro app,” explains Trower.

Micro apps rely on custom HTML elements developed in Angular. Ionic fit nicely within this framework, making for a frictionless and uncomplicated experience.

“We were already developing micro apps. We didn’t want to maintain separate pipelines for native mobile apps and web apps. We wanted that cross-platform experience so we looked at Ionic,” says Trower.

We were already developing micro apps. We didn’t want to maintain separate pipelines for native mobile apps and web apps. We wanted that cross-platform experience so we looked at Ionic.

Nick Trower, Solutions Architect for H&R Block Client Applications

H&R Block Digital Transformation Results

Multiple Platforms, One Codebase

The MyBlock development team uses Capacitor—a cross-platform native bridge for connecting web content to native iOS and Android devices—to run modern, cross platform apps to make developer access to common functionality on each platform consistent and easy. They are taking advantage of the push notifications, camera, and in-app browser features for the digital transformation of their financial services.

“We do have some native third-party plug-ins we’ve customized, but with Capacitor, we’re able to use our existing code structure, port everything over, and take advantage of that.” says Trower.

The development team also leans on Stencil—a Web Component compiler for building reusable frontend components that work with any JS framework—to ensure the look and feel matches seamlessly between the mobile and web application environments. By integrating the H&R Block design system, developers can easily provide the best cross-platform experience for their customers using a single codebase.

“It’s just like LEGO bricks. You can orchestrate these components and build a scalable, extendable, maintainable, and reliable solution within a centralized location,” says Trower.

With a single codebase offering one experience across multiple applications, H&R Block's digital transformation has reached its goals of increasing speed-to-market and developing an application customers enjoy using.

“The MyBlock application has a whole new brand to it. It looks pretty cool!” says Trower.

Learn more about H&R Block’s MyBlock application on LinkedIn, Twitter, Facebook, and YouTube.