[{"data":1,"prerenderedAt":329},["ShallowReactive",2],{"/projects/headlight":3,"/projects/headlight-surround":301},{"id":4,"title":5,"additionalTags":6,"body":10,"description":20,"excerpt":277,"extension":278,"featured":279,"hero":21,"meta":280,"name":281,"navigation":282,"openSource":279,"path":283,"projectDate":284,"projectFolder":285,"seo":286,"sitemap":287,"status":267,"stem":291,"subtitle":292,"tags":293,"thumbnail":299,"__hash__":300},"projects/projects/4.headlight.md","Headlight",[7,8,9],"typescript","testing","leadership",{"type":11,"value":12,"toc":266},"minimark",[13,17,22,27,58,63,66,71,75,86,89,93,96,184,188,262],[14,15],"stats-table",{":stats":16},"[{\"label\": \"year\", \"value\": \"2015–2024\"}, {\"label\": \"observations captured\", \"value\": \"8M+\" }, {\"label\": \"projects onboarded\", \"value\": \"3,000+\"}]",[18,19],"full-img",{"alt":20,"src":21},"Comprehensive suite of e-construction web applications.","/projects/headlight/hero.webp",[23,24,26],"h2",{"id":25},"overview","Overview",[28,29,33,46],"div",{"className":30},[31,32],"not-prose","callout",[34,35,36,45],"p",{},[37,38,44],"a",{"className":39,"href":41,"rel":42},[40],"text-foreground","https://headlight.com",[43],"nofollow","HeadLight"," is a suite of advanced digital construction management applications.",[34,47,48,49,53,54,57],{},"For over 9 years at HeadLight (previously Pavia Systems) my involvement included ",[50,51,52],"strong",{},"UI/UX design"," for the native iOS application\nand leading the ",[50,55,56],{},"front-end development"," for the HeadLight Suite of web applications.",[59,60,62],"h3",{"id":61},"wireframe-to-final-product","Wireframe to Final Product",[34,64,65],{},"I was involved from the very beginning with designing mockups for the native IOS app and through to building & shipping web applications.",[67,68],"app-before-after",{"after":69,"before":70},"/projects/headlight/after.webp","/projects/headlight/before.webp",[59,72,74],{"id":73},"measuring-success","Measuring Success",[34,76,77,78,81,82,85],{},"The FieldBook apps would enable field personnel to capture ",[50,79,80],{},"millions of Observations"," across ",[50,83,84],{},"tens of thousands of construction projects",".",[34,87,88],{},"While the native iOS app was used primarily used for capturing in the field.\nThe web app which had feature-parity and was specifically geared for accessing project data by office personnel.",[59,90,92],{"id":91},"from-app-to-comprehensive-suite","From App to Comprehensive Suite",[34,94,95],{},"Moving to a shared code architecture, which AngularJS's module system was very well suited for,\nenabled us to quickly build and ship a entire suite specialized applications covering many aspects of e-construction.",[97,98,99,112],"table",{},[100,101,102],"thead",{},[103,104,105,109],"tr",{},[106,107,108],"th",{},"AngularJS Apps",[106,110,111],{},"VueJS Apps",[113,114,115,124,132,140,148,156,163,170,177],"tbody",{},[103,116,117,121],{},[118,119,120],"td",{},"FieldBook",[118,122,123],{},"Contract Admin",[103,125,126,129],{},[118,127,128],{},"Tracker",[118,130,131],{},"SamplePlan v2",[103,133,134,137],{},[118,135,136],{},"Portal",[118,138,139],{},"Materials v2",[103,141,142,145],{},[118,143,144],{},"Vault",[118,146,147],{},"Dashboards",[103,149,150,153],{},[118,151,152],{},"SamplePlan",[118,154,155],{},"Covid-19 Safety",[103,157,158,161],{},[118,159,160],{},"Profile Mgmt",[118,162],{},[103,164,165,168],{},[118,166,167],{},"Customer Mgmt",[118,169],{},[103,171,172,175],{},[118,173,174],{},"Project Mgmt",[118,176],{},[103,178,179,182],{},[118,180,181],{},"Materials",[118,183],{},[59,185,187],{"id":186},"technologies-utilized","Technologies Utilized",[97,189,190,200],{},[100,191,192],{},[103,193,194,197],{},[106,195,196],{},"Frontend",[106,198,199],{},"Testing",[113,201,202,210,218,226,234,241,248,255],{},[103,203,204,207],{},[118,205,206],{},"AngularJS",[118,208,209],{},"Mocha",[103,211,212,215],{},[118,213,214],{},"VueJS",[118,216,217],{},"Jest",[103,219,220,223],{},[118,221,222],{},"Bootstrap",[118,224,225],{},"Chai",[103,227,228,231],{},[118,229,230],{},"Git",[118,232,233],{},"Karma",[103,235,236,239],{},[118,237,238],{},"SCSS",[118,240],{},[103,242,243,246],{},[118,244,245],{},"Gulp",[118,247],{},[103,249,250,253],{},[118,251,252],{},"Grunt",[118,254],{},[103,256,257,260],{},[118,258,259],{},"TypeScript",[118,261],{},[263,264],"image-carousel",{":items":265},"[\"/projects/headlight/hl-01.png\",\"/projects/headlight/hl-02.png\",\"/projects/headlight/hl-03.png\"]",{"title":267,"searchDepth":268,"depth":268,"links":269},"",2,[270],{"id":25,"depth":268,"text":26,"children":271},[272,274,275,276],{"id":61,"depth":273,"text":62},3,{"id":73,"depth":273,"text":74},{"id":91,"depth":273,"text":92},{"id":186,"depth":273,"text":187},null,"md",false,{"url":41},"HeadLight Suite",true,"/projects/headlight","2024-05-01T00:00:00.000Z","headlight",{"description":20},{"loc":283,"lastmod":288,"changefreq":289,"priority":290},"2025-05-18","monthly",0.8,"projects/4.headlight","UI/UX + Front-end development + Leadership",[206,214,222,238,259,209,233,217,294,230,295,296,297,298],"Parcel","Docker","Quasar","Capacitor","Cordova","/projects/headlight/thumb.webp","E59q-E5CNVzernfQC3UwU9g2-JXG90Ej2dOtYjVeri8",[302,315],{"title":303,"path":304,"stem":305,"name":306,"description":307,"subtitle":308,"thumbnail":309,"tags":310,"children":-1},"Classflow","/projects/classflow","projects/4.classflow","ActivEngage2 & ClassFlow","Cloud-based classroom lesson delivery software","UI/UX + front-end development","/projects/classflow/thumb.webp",[311,222,312,313,314,230],"KendoUI","LESS","Graphic Design","UI/UX Design",{"title":316,"path":317,"stem":318,"name":319,"description":320,"subtitle":321,"thumbnail":322,"tags":323,"children":-1},"Enamel Pin","/projects/enamel-pin","projects/5.enamel-pin","Enamel Pin Design","Glow-in-the-dark enamel pin design","Graphic design + illustration + crowd funding","/projects/enamel-pin/thumb.webp",[324,313,325,326,327,328],"Illustration","Motion Graphics","Crowdfunding","Order fulfillment","Kickstarter",1784827428175]