Happy With AR and Digital Transformation

I got a simple AR thingy working (the old skool way) over my summer vacation. Here are the parts you need:

This all happened because for no good reason I wanted to make an AR-y version of this video from the CX Report 2020.

Meanwhile I was sad to hear that Jeanne Ross retired but certainly happy for her!

Instead of trying to fix and optimize all its processes, a company should identify its most important data — as examples, Ross cited package data at UPS, customer data at USAA, and supply chain data at Lego.

—post on the work of Jeanne Ross

Sign up for the Resilience Tech Briefing with no more than 2021 characters, zero images, and all in plain-text.

By clicking submit, you agree to share your email address with the site owner and Mailchimp to receive marketing, updates, and other emails from the site owner. Use the unsubscribe link in those emails to opt out at any time.

Processing…
Success! You're on the list.

The subcomponents of the digital transformation model (and their reconstitution) is here:

function setup() {
  createCanvas(500, 500);
}

/* 
 * Unoptimized code to represent the five components 
 * of digital transformation as shared by folks at Sloan
 * and represented visually in my YouTube video:
 * https://youtu.be/v_0Wv3PuDWo
 */

const s2 = 1.41421356237;

function strmulti(str,x,y,lead) {
  let ss = split(str,"\n");
  var ypos = y + lead - (lead * ss.length)/2;
  var w;
  textSize(lead);
  
  ss.forEach(function (s) {
    w = textWidth(s);
    text(s,x-w/2,ypos);
    ypos += lead;
  });
}

function shape1(x,y,dim) {
  push();
  fill(0,255,0,128);
  translate(x,y);
  scale(1,-1);
  beginShape();
  vertex(0,0);
  vertex(dim,0);
  vertex(dim,dim);
  vertex(0,dim);
  vertex(0,0);
  endShape();
  fill(255);
  translate(dim/2,dim/2);
  scale(1,-1);
  strmulti("SHARED\nCUSTOMER\nINSIGHTS",0,0,dim/7);
  pop();
}

function shape2(x,y,dim) {
  push();
  translate(x,y);
  scale(1,-1);
  fill(255,0,0,128);
  beginShape();
  vertex(0,0);
  vertex(dim*s2,0);
  vertex(dim*s2,dim*s2);
  vertex(dim*s2/2,dim*s2+dim/s2);
  vertex(0,dim*s2);
  vertex(0,0);
  endShape();
  fill(255);
  translate(dim*s2/2,dim*s2/2);
  scale(1,-1);
  textSize(Math.round(dim/6));
  strmulti("ACCOUNTABILITY\nFRAMEWORK",0,0,dim/7);
  pop();
}

function shape3(x,y,dim) {
  push();
  translate(x,y);
  scale(1,-1);
  fill(255,128,0,128);
  beginShape();
  vertex(0,0);
  vertex(dim*2,0);
  vertex(dim,dim);
  vertex(0,0);
  endShape();
  fill(255);
  translate(dim,dim/s2/2);
  scale(1,-1);
  textSize(Math.round(dim/6));
  strmulti("EXTERNAL\nDEVELOPMENT\nPLATFORM",0,0,dim/7);
  pop();
}

function shape4(x,y,dim) {
  push();
  translate(x,y);
  scale(1,-1);
  fill(128,128,255,128);
  beginShape();
  vertex(0,0);
  vertex(dim*2,dim*2);
  vertex(0,dim*2);
  vertex(0,0);
  endShape();
  fill(255);
  translate(dim/s2*0.8,dim + dim/2);
  scale(1,-1);
  textSize(Math.round(dim/6));
  strmulti("DIGITAL\nPLATFORM",0,0,dim/7);
  pop();
}

function shape5(x,y,dim) {
  push();
  translate(x,y);
  scale(1,-1);
  fill(128,255,255,128);
  beginShape();
  vertex(0,0);
  vertex(dim*s2*2,0);
  vertex(dim*s2*2,dim*s2);
  vertex(dim*s2*2*0.75,dim*s2/2);
  vertex(dim*s2,dim*s2);
  vertex(0,0);
  endShape();
  fill(255);
  translate(dim*s2*1.2,dim/2*0.8);
  scale(1,-1);
  textSize(Math.round(dim/6));
  strmulti("OPERATIONAL BACKBONE",0,0,dim/7);
  pop();
}


function draw() {
  background(220);
  fill(255,0,0);
  var dim = 70;
  
  var tx = 10, ty = 480;
  
  // 1 Shared Customer Insights
  push();
  translate(tx,ty);
  shape1(0,0,dim);
  pop();
  
  // 2 Accountability Framework
  push();
  translate(tx,ty);
  translate(dim,-dim*2);
  rotate(PI / 4);
  shape2(0,0,dim);
  pop();
  
  // 3 External Development Platform
  push();
  translate(tx,ty);
  translate(dim*3,0);
  rotate(-PI / 2);
  shape3(0,0,dim);
  pop();
    
  // 4 Digital Platform
  push();
  translate(tx,ty);
  translate(0,-dim);
  shape4(0,0,dim);
  pop();
  
  // 5 Operational Backbone
  push();
  translate(tx,ty);
  translate(dim*3,0);
  rotate(-PI / 2 - PI / 4);
  shape5(0,0,dim);
  pop();
  
  tx = 270; ty = 480;

  // 2 Accountability Framework
  push();
  translate(tx,ty);
  translate(dim*s2*2,-dim*s2*2);
  rotate(PI);
  shape2(0,0,dim);
  pop();
  
  // 3 External Development Platform
  push();
  translate(tx,ty);
  translate(0,-dim*s2*2);
  rotate(PI / 4);
  shape3(0,0,dim);
  pop();
    
  // 4 Digital Platform
  push();
  translate(tx,ty);
  rotate(PI / 2 + PI / 4);
  translate(0,-dim);
  shape4(-2*dim,3*dim,dim);
  pop();
  
  // 5 Operational Backbone
  push();
  translate(tx,ty);
  translate(0,0);
  shape5(0,0,dim);
  pop();
  
}

Related Posts