Selected
Since joining the original 5 person company Conteneo in 2018, I have functioned as fully remote UX Lead and Front End Architect of the real-time agile collaboration platform formerly known as Weave.
Since our acquisition by Scaled Agile, Inc in 2019, my UX work has also included gemba with internal/external stakeholders and clients.
As a code architect, I led the rewrite of our ecclectic and outdated front end into a sustainableAngular 8/9/Typescript/NgRx codebase leveraging the Nrwl/Nx monorepo patterns to more rapidly develop & release more consistent work.
How it Started – Workspaces
The front end I inherited was a mashup of past contractors’ code & design patterns, branded but sort of vague in terms of voice & personality.
My first 6 months were spent in our Workspaces management app, refactoring monolithic AngularJS files into components & services, while at the same time, building out new account & team management features to maximize revenue.
We also worked out a massive SCSS/CSS refactor during this period, removing redundancy and creating a central library of variables, mixins and styling patterns to guide future development.
How It Started – Idea Engine
Weave was a platform designed to bring people together online in real-time collaborative events, and allow for remote & async collaboration, too.
Most events (still) use Idea Engine, a simple but powerful whiteboarding app. My second major initiative was to drag the AngularJS app shown in first screen snap in this deck into the present.
The rest of this deck shows iteration of “next gen” product designs into actual product, starting with low-fi Sketch layouts created in a design workshop with core group of power users.
[embeddoc url=”https://johnhiemstra.com/wp-content/uploads/2020/11/Weave-Idea-Engine.pdf” width=”400px” height=”280px” viewer=”google”]
How Its Going – Workspaces
In the last 12 months, we have completely rewritten the Workspaces app in Angular 8/9/Typescript/NgRx, rebuilt our monolith into a Nx monorepo, and rebranded the entire platform in alignment with Scaled Agile, Inc.
This download contains stripped down vertical slice of primary route/feature in current production code. I led collaboration on establishing new patterns using this feature as primary ‘correct’ working example for our Nx architecture, Redux/NgRx state management, reactive components, and established HTML/CSS patterns.
[sdm_download id=”5723″ fancy=”0″ button_text=”Download Feature Code”]
How Its Going – Idea Engine
While Idea Engine remains an AngularJs app, we have greatly improved performance by refactoring monolithic files into modern component patterns, implementing handrolled Typescript-like code patterns and introducing RxJs subjects and observables to replace older promise patterns.
In addition to branding updates and a new name – Safe® Collaborate – we’ve also been adding new features requested by new Scaled Agile stakeholders.
This download is a complete Angular 7/8 repo I made for personal design use to get us from the wireframes above to the snaps on the right.
[sdm_download id=”5719″ fancy=”0″ button_text=”Download Prototype Repo”]
[embeddoc url=”https://johnhiemstra.com/wp-content/uploads/2020/11/SAFe®-Collaborate-Idea-Engine.pdf” width=”400px” height=”280px” viewer=”google”]
New Feature Design: Virtual Classroom
Scaled Agile was essentially an in-person training company before COVID-19, and Collaborate only lightly used in teaching.
Since March 2020, we have re-tooled our apps to support dedicated remote learning in what we now call the Virtual Classroom (VC).
This design deck illustrates display of both VC templates and events in Collaborate Workspaces, as created through our new, rapidly expanding instructional design publishing features.
New Feature Design: Dot Voting
Feature long in demand and clearly defined over time in our backlog finally gets it turn in Q4 2020.
This deck is the most elaborate Sketch only design document I’ve created for this team, and is product of 5 (so far) iterations of feedback and refinement with team and internal stakeholder since my initial draft.
