Lattice Mobile Application Development Case Study

How we got the opportunity to exceed expectations

Lattice is a people management platform based in San Francisco. Helping hundreds of companies improve their employee performance. They do this with an integrated solution of continuous performance management. With products like Goal setting, One on ones, Praise, Reviews and so on.

When Lattice approached G2i, they wanted to create their mobile application. A simple, yet engaging cross-platform solution focused on their One on One solution. Which would ease the interaction between managers and their direct reports. Lattice's production Web application was made with React, backed by a GraphQL and Relay. The big guns! So they looked for someone with the expertise to follow along this path using React Native to achieve their needs.

This is a short story on how we wielded React Native, along with Lattice's tech stack. Which, to everyone's surprise, we did in record time. Thanks to the incredible synergy between the teams and the stacks.

Project goals and planning

For Lattice, the most important goal of this project was to achieve a design adherence. While having component reusability. To our advantage, we had a great head start. Lattice had a clear idea on what they wanted their mobile application to do and look like.

Initial design mockups by Lattice.

This was a good sign. After reviewing their mockups, we provided accurate expectations on what we needed to build. Which components we needed to create and how they were going to reuse them. Our development effort estimation involved around 27 unique components and 20 unique views. Spread between 5 two-week sprints.

Two teams working as one

Each day G2i developers where engaged with Lattice. Sharing the same internal development workflow. Including technical tools like Flow, Circle CI. Along with communication tools like Jira, Slack and Google Hangouts (for daily standup meetings).

After a few weeks, it was evident that the two teams were working along seamlessly. The initial components got developed in a breeze. Giving us the confidence that we where going to finish faster than what we expected.

Typical semi-daily PR submission

Thanks to the incredible synergy between the team and the chosen stack, what initially was planned to take 5 sprints, got shorten by almost a third. Which allowed G2i to go ahead and provide extra value.

Enjoying the time to add extra value

By the end of the third sprint. G2i had completed most of what was scoped out for the project. While waiting for issues to come out of QA, we decided to use the spare time and put it to use providing more value.

UI loading enhancements with Shimmer Placeholders
‍

Implementation of tomzaku/react-native-shimmer-placeholder

When we see a design mockup, we often forget about those loading transitions. While developing, we tend to use loader spinners but frankly those are hideous.

Shimmer placeholders solve the problem of blunt layout transitions while loading, causing a smoother look and feel. We anticipated for the feel of the users journey as the content is to be displayed.

Gray Box End-to-End Testing and Automation

Lattice had put a lot of effort into insuring quality standards by using automated testing along with CI. Having an entire product out of the CI loop felt like a liability.With Detox, we made sure to do E2E testing that could be incorporated into their CI loop, allowing their new product to still be considered on CI.

E2E Testing implementation using wix/detox

Despite the application not being mature by the time this case study was written, the team could manage to work around its shortcomings. Covering most of the UI testing in an automated fashion.

Final Results

By the end of this 10 week project, G2i had put a total of 880 hours of work. Achieving maximum design adherence, and proactivity regarding enhancements and overall customer satisfaction.

The two most appreciated aspects of G2i's work were:

• Speed & expertise

• Going above and beyond the client specs and designs to make the product better.

As a side note, we even had the joy of contributing back to open source. Submitting PRs to enhance or fix any shortcoming we saw in the modules we were implementing.