Selected

2017 – 2018 | Agile Thought | PwC | Audit Collaboration App

As the lead front end developer on my team at consulting company AgileThought, I balanced a team of C# developers rebuilding an existing global application in early Angular 2/Typescript for ‘big four’ accounting firm PwC.

I made multiple contributions to the ‘Connect’ team beyond code as designer, Angular/RxJS evangelist/architect, SCSS/CSS mentor and development team lead.

video
play-sharp-fill

How It Started

C# Devs do front end

I joined the C# team a few months into development, even though there were no designs yet for the new finished product, just the existing Sharepoint application we would eventually replace.

So from a front end UX perspective, I started with a lot of cluttered, awkward human and brand experiences like the triple modal illustrated here.

Also, a team of back end developers who didn’t know better yet.

Interim Design

When we found out that the client would not provide new designs for several months, I was asked to create a design/UI solution to get the app more ready for internal client review.

I made this simple standalone HTML/JS codebase from PwC brand guidelines to show alternatives to modal interactions and begin structuring a branded SASS/CSS library for Connect that could grow to accommodate actual designs without a major rewrite.

[sdm_download id=”5542″ fancy=”0″ button_text=”Download Standalone Code”]

PwC Connect UI layout

Actual Design

[embeddoc url=”https://johnhiemstra.com/wp-content/uploads/2020/11/PwC-Connect-development.pdf” viewer=”google” width=”400px” height=”300px”]

This set of slides starts with screen snaps of Connect with interim design applied, and concludes with snaps of final/actual design scheme implemented in same flexible HTML/SCSS architecture.

[sdm_download id=”5576″ fancy=”0″ button_text=”Download SCSS Code”]

Data Viz UI Components

Before rolling off this project, I led the development of the Connect dashboard and the set of custom reactive data visualization UI components featured in the Connect product video above.

[sdm_download id=”5574″ fancy=”0″ button_text=”Download Component Code”]

[embeddoc url=”https://johnhiemstra.com/wp-content/uploads/2020/11/PwC-Data-Viz-Development.pdf” viewer=”google” width=”400px” height=”300px”]

Author


Avatar