Dx Transformations with

Full Stack Teams

Transformation Trifecta

Web Product Delivery

+

Customer Focused

Better Delivery

Digital Destination

+

Digital Transformations

Transformation Trifecta

Web Product Delivery

+

Product Discovery

Web Dev & CI/CD

Web Services API

+

Digital Transformations

Understanding the Customer

Goals

For timely, product delivery

• Client-Focused Culture
• Increased Delivery Velocity
• Digital-Talent Destination
• Delivery Status Visibility

Delivery Transformations

Training + Nx Tools

Standard + Practices

Improved Deliveries

Critical Changes 

To achieve our goals,

• Culture
• Process
• Engineering
• Success Metrics

are needed!

Changes can be grouped in 4 categories:

Developer

Testing

Developer

Deployments

MonoRepo

Use

Guideline Documents

Improved PRs

Workshops

Code Collaboration

GitFlow + PR + Feature Flags

Improved Reuse

CI/CD Pipelines

Reduced Costs

Reduced Regressions

Digital Destinations

Increased Velocities

Improved Deliveries

GitFlow

Culture Changes 

• Client-Validated Features
• Meaningful Deliverables
• Team Collaboration
• Eliminate Territorialism 

Culture Changes 

• Invert fear-based, default responses
  • From "We cannot do that..."
  • To "Let's see how we can we can do that"
• Ownership instead of Apathy

• Career Path
• Work Recognition 

Training

• Product Discovery Training
• Leadership (SEL) Training 
• Engineering Training

Culture Changes 

Digital-Talent Destination

• Engineering Training
• Meaningful Deliverables
• Current Tech Stack + Tools
• Team Collaboration
• Enterprise Access to Source Code
• Open Source Leadership
• Recognition
• Disruptive Contributions
• Reduced Meetings
• Quality Meetings  (eg. meeting requirements)

Process Changes

• Product Feature Teams
• Reduce Cross-Commits
• Team-Member Accountability

PO

SEL

FE

BE

QA

UX

Who

Self-managed

Autonomous

Recognition

Qualified Membership

Results-Driven

Full-Stack Product Teams

Team 1

Team 2

Team 3

Team 4

Product

FE

BE

QA

Design

PO

Web Product Team

SEL

UX

QE

FE

BE

Team Interactions

"Troika" Discovery

UX

SEL

Web Product Team

PO

The product owner is responsible for viability.

The user experience designer is responsible for usability.

​The software engineering lead is responsible for feasibility.

Responsibilities

Required Skills

A Full-Stack Team

PO   SEL   FE   QE    UX    BE

Web Product Team

+

Growth Path

Product Owner (PO)

Responsibility

Skills

Consequences

... if absent or invalid skills and focus

• StakeHolder Liaison
• Customer Success
• Delivery to Market
• Product Validation
• Backlog Prep + Maintenance

• Listen to Customer
• Watch Market + Competitors
• Requirements Analysis
• Identify Product Features
• Communication + Planning

• Wrong MVP(s)
• Wrong Product/Features
• Loss of Customers

Shared Partnership with SEL, Customer Focus

Technical Lead (SEL)

Responsibility

Skills

• Partner w/ Product Owner
• Partner w/ UX
• Product Implementation
• Product CI/CD
• Guide/Mentor Developers

• Technology & CI/CD
• Business & SEL Collaboration
• Developer Leadership
• Sprint Guidance
• Architecture

• Delivery Failures
• Quality Failures
• Technical Debt
• Incomplete Features
• Team Turnover

Consequences

... if absent or invalid skills and focus

Skills

Shared Partnership with PO, Technical Focus

User Experience Designer  (UX)

Responsibility

Skills

• Requirements of Features
• Workflow Design
• Feature UI Designs
• Product Component Design
• Understanding of ADEL

• Design Competence
• Usability Expertise
• HTML/CSS Comfort *
• Developer Communication
• Developer-UI Pairing

• Inconsistent UI
• Flawed workflows
• Customer Frustrations
• Product Abandonment

Consequences

... if absent or invalid skills and focus

Skills

Quality Engineer (QE)

Responsibility

Skills

• Acceptance Testing
• Workflow Testing (e2e)
• UI Regression Testing
• Performance Testing
• Deployment Gatekeeper

• Broken Product
• Corrupted Data
• Customer Abandonment
• Upper Environment Pollution

• e2e Expertise
• CI/CD Competence
• Feature Testing
• Bug Discovery
• Full-Span Communication 

Consequences

... if absent or invalid skills and focus

Skills

w/ BE, FE, Product

... includes Quality Control and Quality Assurance

Front-End Developer  (FE)

Responsibility

Skills

• Product Features 
• Product Tests (Unit + Integration)
• Sprint work and PRs
• Coordinate w/ UX Designer
• Coordinate w/ BE Developer

• Web Technology Competence
• Development Competence
• Teamwork

• Unstable Features
• Unusable Code
• Product Delays
• Product Failures

Consequences

... if absent or invalid skills and focus

Skills

Back-End Developer (BE) 

Responsibility

Skills

• Data + Payload Modeling
• Data Schema, Caching & Security
• Data Services + API Expertise
• API Documentation
• API Analytics

• Microservices Expertise
• API Expertise
  • API Design
  • API Documentation
• Communication with FE Developers

• Corrupted or Lost Data
• Stolen Data
• Slow Product
• Unstable Product

Consequences

... if absent or invalid skills and focus

Skills

Engineer !== Analyst!

Back-End Developer (BE) 

A BE developer represents that BE Infrastructure...

A great BE developer is accountable to the Web Team.

1. Accountability is the sense of ownership for an outcome.
2. Accountability is something you hold a person to only after a task is done or not done!
3. Being accountable not only means being responsible for something but also ultimately being answerable for your actions.
4. Responsibility can be before and/or after a task.
5. Responsibility can be shared while accountability cannot be shared !

Enable Agile

• Real Discovery
• True Agile Processes
• Client-Focused

Product

Design

Engineering

... process changes

Require Team Self-Administration

• Product Features
• Team Membership
• Delivery Schedule
• CI/CD Pipeline
• Repositories

Impacts on Engineering

• Time-Box for Technology Approval
• Technology based on Engineering Consensus
• Admin Rights for Developer Machines
• Open-Source Policies and Community Collaboration

Engineering Goals 

• Improved Velocity + Reduced Regression
• Improved Collaboration + Code Organization
• Improved Deployment Pipelines
• In-house Training

Engineering Changes 

• GitFlow + PR Improvements
• Better Code Collaboration and Sharing
• Discoverable, Documented Server API(s)
• Developer Testing with Server API
• Eliminate Parallel Workstreams
• Improved CI/CD Pipeline (AWS)

TLG Team

^ primary focus for

Enterprise Documentation: Data API

Swagger

Docs

Documentation

Editor + Explorer

Interactive API Playground

Usage Definitions

API Metrics

Analytics + Community

Delivery Transformations

Success Metrics 

Recognition

Excellence

Engineering Training

Guideline Documents

• Coding Standards
• Git Conventions + Workflow
• React Standards
• Architecture Practices
• Core Components
• ADEL

Workshops

• GitFlow
• es6
• Typescript
• RxJS
• State Management
• Unit Testing
• UX Testing (e2e)

Engineering Workshops

• 3-4 hours each
• Slides + Hands-on Coding Labs
• Existing Workshops need React Labs

RxJS Workshop Slides 

In-progress

Mono-Repo Tools

In-progress

• Multiple Apps + Libraries

• Library Usage

  • Protected access

  • Shared usage

  • Publish library to NPM

• Build/Deploy Apps Independently

• Lint + IDE Errors for Code Usage

• App-Dedicated CI/CD Pipelines

• Unit Test Affected Libs/Apps only

• Faster UX Testing + UI Snapshot Regression Testing

'Improved' Deliveries

What quantifiers should be used to determine 'improved' ?

What is a successful delivery ?

What factors affect successful contributions ?

How do we get better customer feedback ?

Success Metrics

What metrics can be used to evaluate success ?

• Technical considerations?
  • Use of standards + best practices
  • ...
• Product considerations?
• Process considerations?
• Leadership factors?
• Individual factors ?
• Cross-team factors?