Transforming Wave’s Mobile Development and Experience
Until recently, Wave customers had three mobile apps they needed to use to get functionality similar to our website. Separate apps kept capabilities for banking, invoicing and receipts simple to develop but siloed.
We started with a single mobile app and then, over time, ended up with multiple apps due to acquisitions and to cater to a growing customer base with varied needs. When a company starts scaling and bringing new products to market, it is reasonable to have separate apps. It enables quick experiments and helps innovate products faster.
Over time, though, the separation of these features put roadblocks in the way of Wave’s customers and developers. Users had to juggle multiple apps to accomplish their goals, and developers struggled with managing ownership of their domain while also providing a consistent user experience across web and mobile.
User research and other collected data helped us understand that creating a true all-in-one financial management app for users would provide a better customer experience while also making it easier for teams to manage and develop the app moving forward.
This inspired a major initiative at Wave: creating a single new app for our best-fit customers to get Wave functionality in one place on the mobile. The roadmap that we followed kept the teams aligned and also made it easier to adapt to Wave’s business needs as we progressed.
Let’s take a closer look at that roadmap.
1. Setting Goals
Our first step was to align with the leaders of each development team on the purpose, timeline and priority of the mobile development project.
As part of this alignment, we discussed our overarching goal: to go to market with the app within one year. Setting this goal with buy-in from the teams meant that they could prioritize the initiative and determine milestones and incremental deadlines accordingly.
We also wanted to simplify the mobile app by integrating mobile development into the responsibilities of the full-stack, domain-focused development teams. Working with all teams to shift in this direction meant that we could set the foundation for easier and more streamlined mobile and web development at Wave.
2. Defining the Technical Strategy
While product strategy focuses on the business goals, user needs and timeline, the technical strategy includes deciding the tools and technology that are needed and how that technology will work together.
One of the primary technical decisions for Wave’s new mobile app was whether to build native or use a cross-platform framework. When comparing existing frameworks, we had many options to choose from. Ultimately, we chose the open-source React Native platform, which won out for Wave in three categories: cross-platform support, ease of release management and alignment with our team’s skill set.
The React Native framework is mobile platform agnostic, meaning it would allow us to maintain a consistent experience across iOS and Android platforms by using one common technology. Its core set of native components also maps directly to the platform’s native UI building blocks, which means the simplicity doesn’t compromise the user experience.
With React Native, some changes can be delivered over the air (OTA) which means users don’t have to download updates from their mobile store to get every new feature or bug fix. This also simplifies the process of releasing for developers.
Our full-stack development teams were already using React to build our web front-end experience, so building our mobile app with React Native made sense for reusability. This would also make it easier for the same teams to manage both the web and mobile user experiences. There’s a large community of React Native developers, which means the technology is steadily improving and hiring experienced and talented developers is easier.
Ultimately, the time spent thoroughly defining our strategy led to smoother sailing during actual development later.
3. Validating the Technical Strategy
Validation is a critical step that goes beyond the theory of your strategy to make sure development work moves ahead as planned and to avoid unexpected discoveries and delays.
We broke down Wave’s validation process into several steps. First, we created working examples of some of the app functionality, which developers could use as references while onboarding.
Next, we tested the performance of various tools and technologies to help us define a standard app architecture. We had been primarily using REST APIs but had started working with GraphQL on the web; this seemed like the right time to validate GraphQL as the solution to our cross-platform objectives.
We built specific examples to compare performance between GraphQL and REST for speed of development and for user response times. We settled on GraphQL for better client-side performance and developer experience. This testing also surfaced some gaps with our GraphQL implementation, which was beneficial to address at the start.
Some of the outcomes of this step included setting up code repository structures, guidelines on some common tooling and functionality like feature flags, state management, end-to-end test tool, test environments and devices, basic React Native components to get the developers started, onboarding guides, workshops and design walkthroughs.
Although this process took some time, incorporating these steps early in our planning meant that we had fewer technical difficulties down the road.
4. Setting Up the Internal Structure for Success
We knew the “why” and the “what” of this new app and with the technical strategy defined, we now needed to establish the team strategy to fully define the “how”.
In the past, Wave had mixed successes with cross-team projects because of the diversity of domains and skill sets involved. We ultimately decided it was best for our existing mobile team to function as a central mobile platform team. This team would be responsible for building the shared functionality of the app, owning the native modules and providing tools and knowledge to the functional teams. In turn, the functional teams, such as the banking and invoicing teams, would own feature development and maintenance for their part of the app.
This model helped explicitly define ownership moving forward while also reducing operational friction between the functional teams and the mobile platform team.
With a defined team structure, we then selected an engineering leader to own the cross-team engineering work, a product manager to own the product effort, and a design leader to head the design front. These individuals were tasked to collaborate and lead this initiative with a common purpose across multiple teams to ensure it would be cohesive and well-planned.
5. Building the App
Before starting to build the app, we further refined the scope and milestones. We planned for Alpha (internal) and Beta (external) testing and worked backwards for feasibility. Although we were working to go to market within a year, the timeline included slack for any unexpected pivots. This helped get the buy-in needed across teams to embark on this ambitious goal. At this stage, a validated technology strategy, defined goals and expected timelines gave each team the ability to adopt an approach that worked best for them.
Since the functional teams and the mobile platform team knew what needed to be achieved and had the required tools and support, they were able to take ownership of the day-to-day decisions to keep the work on track.
While most of the bigger technical and strategic decisions were validated and made before implementation, as expected, the teams encountered technical challenges along the way. However, the big-picture goals we established early on helped the teams to prioritize and solve challenges efficiently.
What’s Next
Releasing an Alpha after 10 months, a Beta after 11 months and a full launch in 12 months is a solid accomplishment; transforming our organization and our mobile development process in that time is amazing.
Everyone at Wave is excited about bringing this app to our users and seeing all of the planning and work that has gone into the initiative pay off.
While we have launched the new app, this is just the beginning of our new mobile journey. The teams aim to keep iterating and improving our app to make financial management easier and more automated for the small business owners we serve passionately.
