Изданието на The Times от събота, 7 януари, разкри, че „десет от 11 тръстове на NHS са били обвинени в рутинно манипулиране на времето за реакция 999“, като са използвали вратичка, за да твърдят, че са достигнали до животозастрашаващи спешни случаи за по-малко от десет секунди.

В допълнение към това, резултатите от искане за свобода на информацията показаха, че само един от 13-те тръста е изпълнил целта от осем минути, за да отговори на обаждания на живот или смърт.

За нас в екипа на разработчиците този проект беше повод да изпробваме няколко неща.

Проект, ръководен от разработчици

През ноември отделих време да започна изграждането на прототип на това, което смятах, че можем да направим с набора от данни, върху който работи „Луис“. Исках основните функционалности да бъдат сортирани, преди да го предам на Design.

Рамкирането на проекта от самото начало, от гледна точка на данните и разработчиците, в крайна сметка улесни живота ни. Първата итерация, видяна по-горе, води проекта през неговия живот.

Това обаче е тънка линия, тъй като не искахме да позволим това да ограничи историята. Целта на първия ми прототип беше да направя останалата част от разработчиците много по-ефективна.

И някак си го направи. Ще ви спестя подробностите за непрекъснатото движение напред-назад между нас, новинарското бюро и дизайна, и просто ще ви кажа, че докато се решаваха цветовете, дизайните се проектираха и се изпращаше обратната връзка, аз бях извършване на водопроводната и задкулисната работа. Паралелизирането се чувства чудесно за всички, тъй като никой вече наистина не чака.

Наличието на работещ прототип на ранен етап ме постави в позиция, в която можех да имам доста добра представа какво искам от страна на данните. Работих в тясно сътрудничество с екипа за данни за настройване и масажиране на структурата на данните, за да бъде удобна и да се избегнат изчисления от страна на клиента.

Но най-важното е, че исках техническа осъществимост, за да управлявам проекта, в сътрудничество с екипите за данни и дизайн. Бонус точки, ако това може да се направи за кратко време.

React и D3 заедно

При стартирането на този проект се съсредоточих единствено върху лентовата диаграма. Целият код живееше в prototype клон, който беше мръсни прости HTML и JS файлове. След като съм доволен, веднага бих внедрил отново всичко в React.

Направете го да работи, на стъпки.

Архитектурно казано, „контейнерът“ отговаряше за извличането на данните и обработката на основна d3.csv() операция, предавайки вложена структура от данни надолу към компонента на диаграмата:

fetchData() {    
  const _this = this;    
  d3.csv("data/data_new2.csv", function(error, data) {       
    // takes our data and groups it by postcode      
    // we end up with one row per year      
    const data_nest = d3.nest()        
      .key(function(d) { return d.postcode})        
      .entries(data);       
    _this.setState ({        
       dataset: data_nest      
    })    
  });  
}

Компонентът на диаграмата ще изобрази SVG диаграма и на componentDidMount() / componentDidUpdate() ще извика стандартна draw() функция, в която написахме нашия стандартен D3 код.

// Component lifecycle handling  
componentDidMount() {    
  const dataset = this.props.dataset();  
}   
componentDidUpdate() {    
  const postcode = this.props.postcode;    
  const _this = this;    
  for (let i=0; i<this.props.data.length; i++) {      
    if(this.props.data[i].key === postcode) {        
      _this.draw(this.props.data[i].values, "year", "median");      
    }    
  }

Да, знам. const _this = this; е особено неелегантен. Както React, така и D3 използват доста широко this, а подценената долна черта ни позволява да прескочим обхвата и да се надяваме да се измъкнем, ако няма преглед на кода.

Резултати: зашеметяващ процент на ангажираност

Това приложение React беше вградено като компонент в статия в статиите както на настолен компютър, така и на таблет. От 16 000 показвания имахме повече от 14 000 търсения с пощенски код. Което се равнява на 87% степен на ангажираност!

Двата предложени пощенски кода (SE1 и N16) бяха съответно първи и пети най-търсени като цяло. Стратфорд на Ейвън (CV37) беше любопитно вторият най-търсен.

По-конкретно, 87% ангажираност е огромна и това означава, че нашето време е инвестирано добре в този проект.

Подобно приложение React „разгледайте нашите данни“, което пуснахме по-рано през декември, имаше едноцифрен процент на ангажираност:

Изглежда, че формулировката може да е изиграла важна роля. От много отворени възможности за избор в приложението за чуждестранна помощ, след това избрахме доста директното „въведете пощенския си код“. Ние предложихме търсения и за двата проекта.

От Katie Gibbons, Louis Goddard, Sam Joiner и от мен.
Можете да прочетете двете истории тук чрез регистрация и достъп до две статии на седмица безплатно:

„Тръстовете на линейките използват вратичка, за да претендират за по-бързо време за реакция“

„Търпеливо чакане: време за реакция на линейка във вашия район“