Carlos deArtola monogramCARLOS DE ARTOLA
APPENDIX D

Brand Band

Figure numbers run on through the bands.

HANDLE
brand-band
LIVES IN
src/components/OutcomeMarks.jsx (BrandOutcomeBand)
USED ON
Dashboards outcome
PROPS
brand · descriptor · metrics · figOffset
EXAMPLE
LIVE

As it renders.

  1. 01

    Ameris Bank

    CONSUMER BANKING
    1. FIG. 01SUPPORT TICKETS, INDEXED
      10059BEFOREAFTER-41
      41%

      fewer statement-export support tickets after statements moved onto the dashboard

    2. FIG. 02SAME WIDTH, NO SCROLL
      200%

      zoom with no horizontal scroll

    3. FIG. 03ON THE DASHBOARD
      1

      statements table on the dashboard itself, a download per row

CODE
COPY AND PASTE

How it is called.

JSX
import { BrandOutcomeBand } from '../components/OutcomeMarks.jsx'

<ol>
  <BrandOutcomeBand index={0} count={3} brand="Ameris Bank" descriptor="Consumer banking"
    metrics={[
      ['41%', 'fewer statement-export support tickets', { kind: 'slope', after: 59 }],
      ['200%', 'zoom with no horizontal scroll', { kind: 'zoom', from: 100, to: 200 }],
      ['1', 'statements table on the dashboard', { kind: 'glyph', shape: 'table' }],
    ]} />
</ol>
RULES

What must stay true.

Figure numbers run on through the bands.