[{"data":1,"prerenderedAt":1528},["ShallowReactive",2],{"content-query-NjQ8eXAhqF":3,"content-query-ahFGJS9S9P":173},{"_path":4,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":8,"description":7,"subtitle":9,"thumbnail":10,"tags":11,"order":12,"body":13,"_type":167,"_id":168,"_source":169,"_file":170,"_stem":171,"_extension":172},"/work/watchdrop","work",false,"","Watchdrop","2021-22 | Co-founder","/img/work/watchdrop/thumbnail.jpg","software",0,{"type":14,"children":15,"toc":159},"root",[16,97],{"type":17,"tag":18,"props":19,"children":22},"element","div",{"className":20},[21],"l-page__intro",[23,26,76,77],{"type":24,"value":25},"text","\n  ",{"type":17,"tag":18,"props":27,"children":30},{"className":28},[29],"l-page__intro__left",[31,33,39,40,45,46,51,52,57,58,63,64,69,70,75],{"type":24,"value":32},"\n    ",{"type":17,"tag":34,"props":35,"children":36},"p",{},[37],{"type":24,"value":38},"During the Covid lockdown, together with my business parter we saw a gap in the luxury watch auction market. Traditional watch auction houses typically charge 20-30% and have a slow consignment process. We conceived Watchdrop - a multi plaform watch auction web-app which would allow for online auctions running 24/7.",{"type":24,"value":32},{"type":17,"tag":34,"props":41,"children":42},{},[43],{"type":24,"value":44},"Users could use the platform to register, and once passed identity verification could list their watches for sale, manage auction settings, and browse and bid for others' watches, and make online payments if succesful.",{"type":24,"value":32},{"type":17,"tag":34,"props":47,"children":48},{},[49],{"type":24,"value":50},"I helped to plan, design and build the product as my business partner dealt with partnerships, customer service and business development. With only two of us, there was a lot to do and we each had to wear many hats.",{"type":24,"value":32},{"type":17,"tag":34,"props":53,"children":54},{},[55],{"type":24,"value":56},"Firstly I designed a simple logo and brand which looked modern and sophisticated. I then built the frontend of the web-app using Vue.js, whilst storing data on Contentful (a SaaS CMS), and hosted it on Netlify. Using Contentful Functions I was able to negate the need for a separate backend, which allowed us to develop new features more quickly.",{"type":24,"value":32},{"type":17,"tag":34,"props":59,"children":60},{},[61],{"type":24,"value":62},"User identity verification was handled via a Passbase integration. Auth with Auth0. A Stripe integration handled card payments and Sentry for observability.",{"type":24,"value":32},{"type":17,"tag":34,"props":65,"children":66},{},[67],{"type":24,"value":68},"Over a 18-month period we held over 250 live auctions. We also exhibited at the London Watch Show.",{"type":24,"value":32},{"type":17,"tag":34,"props":71,"children":72},{},[73],{"type":24,"value":74},"I successfully exited the company in 2022.",{"type":24,"value":25},{"type":24,"value":25},{"type":17,"tag":18,"props":78,"children":81},{"className":79},[80],"l-page__intro__right",[82,83,90,91,96],{"type":24,"value":32},{"type":17,"tag":84,"props":85,"children":87},"h3",{"id":86},"my-role",[88],{"type":24,"value":89},"My role",{"type":24,"value":32},{"type":17,"tag":34,"props":92,"children":93},{},[94],{"type":24,"value":95},"Co-founder, brand designer, app UI designer, data architect, front-end and back-end developer",{"type":24,"value":25},{"type":17,"tag":18,"props":98,"children":101},{"className":99},[100],"l-work__images",[102,111,117,125,131,139,145,153],{"type":17,"tag":34,"props":103,"children":104},{},[105],{"type":17,"tag":106,"props":107,"children":110},"img",{"alt":108,"src":109},"Watchdrop screenshot 1","/img/work/watchdrop/1.jpg",[],{"type":17,"tag":84,"props":112,"children":114},{"id":113},"homepage",[115],{"type":24,"value":116},"Homepage",{"type":17,"tag":34,"props":118,"children":119},{},[120],{"type":17,"tag":106,"props":121,"children":124},{"alt":122,"src":123},"Watchdrop screenshot 2","/img/work/watchdrop/2.jpg",[],{"type":17,"tag":84,"props":126,"children":128},{"id":127},"listing-page",[129],{"type":24,"value":130},"Listing page",{"type":17,"tag":34,"props":132,"children":133},{},[134],{"type":17,"tag":106,"props":135,"children":138},{"alt":136,"src":137},"Watchdrop screenshot 3","/img/work/watchdrop/3.jpg",[],{"type":17,"tag":84,"props":140,"children":142},{"id":141},"making-an-offer",[143],{"type":24,"value":144},"Making an offer",{"type":17,"tag":34,"props":146,"children":147},{},[148],{"type":17,"tag":106,"props":149,"children":152},{"alt":150,"src":151},"Watchdrop screenshot 4","/img/work/watchdrop/4.jpg",[],{"type":17,"tag":84,"props":154,"children":156},{"id":155},"my-account-offer-history",[157],{"type":24,"value":158},"My account > Offer history",{"title":7,"searchDepth":160,"depth":160,"links":161},2,[162,164,165,166],{"id":113,"depth":163,"text":116},3,{"id":127,"depth":163,"text":130},{"id":141,"depth":163,"text":144},{"id":155,"depth":163,"text":158},"markdown","content:work:watchdrop.md","content","work/watchdrop.md","work/watchdrop","md",[174,305,599,744,871,1003,1084,1212,1336,1398],{"_path":175,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":176,"description":177,"subtitle":178,"thumbnail":179,"tags":180,"order":12,"body":181,"_type":167,"_id":302,"_source":169,"_file":303,"_stem":304,"_extension":172},"/work/zinc-network","Zinc Network","Lorem ipsum","2018 | Lead developer | © Zinc Network","/img/work/zinc-network/thumbnail.jpg","website",{"type":14,"children":182,"toc":297},[183,240],{"type":17,"tag":18,"props":184,"children":186},{"className":185},[21],[187,188,205,206],{"type":24,"value":25},{"type":17,"tag":18,"props":189,"children":191},{"className":190},[29],[192,193,198,199,204],{"type":24,"value":32},{"type":17,"tag":34,"props":194,"children":195},{},[196],{"type":24,"value":197},"\n      I lead this project for the agency’s own website. We built it using\n      WordPress to store and edit the data, which was pulled into the Vue.js\n      front-end using the WordPress REST API. The result is a website that\n      is easy for content editors to manage the content, with a\n      modern front-end ready for the future and capable of eye-candy such\n      as smooth page transitions.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":200,"children":201},{},[202],{"type":24,"value":203},"\n      We built the site’s components, file and template structure to be\n      non-specific to the project, so that we could use it as a starting-point\n      for other website projects. The team learned a lot on the project,\n      learnings which they could take forward onto other JavaScript front-end\n      projects.\n    ",{"type":24,"value":25},{"type":24,"value":25},{"type":17,"tag":18,"props":207,"children":209},{"className":208},[80],[210,211,215,216,221,222,239],{"type":24,"value":32},{"type":17,"tag":84,"props":212,"children":213},{"id":86},[214],{"type":24,"value":89},{"type":24,"value":32},{"type":17,"tag":34,"props":217,"children":218},{},[219],{"type":24,"value":220},"Lead developer, leading one front and one backend developer",{"type":24,"value":32},{"type":17,"tag":34,"props":223,"children":224},{},[225,227,238],{"type":24,"value":226},"\n      ",{"type":17,"tag":228,"props":229,"children":235},"a",{"href":230,"className":231,"target":234},"https://zincnetwork.com",[232,233],"l-work__visit-website","btn--clear","_blank",[236],{"type":24,"value":237},"Visit Website",{"type":24,"value":32},{"type":24,"value":25},{"type":17,"tag":18,"props":241,"children":243},{"className":242},[100],[244,249,254,261,267,272,279,285,290],{"type":17,"tag":245,"props":246,"children":247},"h2",{"id":113},[248],{"type":24,"value":116},{"type":17,"tag":34,"props":250,"children":251},{},[252],{"type":24,"value":253},"The pages were constructed using reusable 'modules' which could be easily added and dragged into order in WordPress.",{"type":17,"tag":34,"props":255,"children":256},{},[257],{"type":17,"tag":106,"props":258,"children":260},{"alt":176,"src":259},"/img/work/zinc-network/1.jpg",[],{"type":17,"tag":245,"props":262,"children":264},{"id":263},"blog-section",[265],{"type":24,"value":266},"Blog section",{"type":17,"tag":34,"props":268,"children":269},{},[270],{"type":24,"value":271},"We created options for content editors to display images three preset sizes, so that they could add variety to their posts.",{"type":17,"tag":34,"props":273,"children":274},{},[275],{"type":17,"tag":106,"props":276,"children":278},{"alt":176,"src":277},"/img/work/zinc-network/2.jpg",[],{"type":17,"tag":245,"props":280,"children":282},{"id":281},"work-section",[283],{"type":24,"value":284},"Work section",{"type":17,"tag":34,"props":286,"children":287},{},[288],{"type":24,"value":289},"We created posts types for blog articles and case studies, which could be linked to in relevant areas across the site.",{"type":17,"tag":34,"props":291,"children":292},{},[293],{"type":17,"tag":106,"props":294,"children":296},{"alt":176,"src":295},"/img/work/zinc-network/3.jpg",[],{"title":7,"searchDepth":160,"depth":160,"links":298},[299,300,301],{"id":113,"depth":160,"text":116},{"id":263,"depth":160,"text":266},{"id":281,"depth":160,"text":284},"content:work:zinc-network.md","work/zinc-network.md","work/zinc-network",{"_path":306,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":307,"description":177,"subtitle":308,"thumbnail":309,"tags":11,"technologies":310,"order":311,"body":312,"_type":167,"_id":596,"_source":169,"_file":597,"_stem":598,"_extension":172},"/work/onvi","Onvi","2019-2022 | Lead frontend engineer | © Onvi Tech Ltd","/img/work/onvi/thumbnail.jpg","Vue.js, Vuex, Vue-ORM, Jest, Cypress",1,{"type":14,"children":313,"toc":586},[314,361,367,372,377,382],{"type":17,"tag":18,"props":315,"children":317},{"className":316},[21],[318,319,337,338],{"type":24,"value":32},{"type":17,"tag":18,"props":320,"children":322},{"className":321},[29],[323,325,330,331,336],{"type":24,"value":324},"\n        ",{"type":17,"tag":34,"props":326,"children":327},{},[328],{"type":24,"value":329},"I worked at Onvi, a startup in the hospitality sector. Onvi helps ambitious operators to start and grow their hospitality businesses with the tools to take orders and payments in person and online. Whether a gourmet food truck, cafe or local restaurant, Onvi powers hospitality businesses with a reimagined sleek and simple to manage modern POS and mobile Order & Pay system.",{"type":24,"value":324},{"type":17,"tag":34,"props":332,"children":333},{},[334],{"type":24,"value":335},"I greatly enjoyed being part of the team and helping the young company grow. I was promoted from senior frontend developer to frontend lead and oversaw four interesting projects:",{"type":24,"value":32},{"type":24,"value":32},{"type":17,"tag":18,"props":339,"children":341},{"className":340},[80],[342,343,347,348,353,354,360],{"type":24,"value":324},{"type":17,"tag":84,"props":344,"children":345},{"id":86},[346],{"type":24,"value":89},{"type":24,"value":324},{"type":17,"tag":34,"props":349,"children":350},{},[351],{"type":24,"value":352},"Lead frontend engineer, leading four frontend engineers, one website developer and one QA engineer.",{"type":24,"value":324},{"type":17,"tag":228,"props":355,"children":358},{"href":356,"className":357,"target":234},"https://onvi.com",[232,233],[359],{"type":24,"value":237},{"type":24,"value":32},{"type":17,"tag":245,"props":362,"children":364},{"id":363},"onvi-order",[365],{"type":24,"value":366},"Onvi Order",{"type":17,"tag":34,"props":368,"children":369},{},[370],{"type":24,"value":371},"Working at Onvi my first responsibilities were to build Vue components for our customer-facing mobile order and pay web-app, Onvi Order. The app was used by customers in bars and restaurants to order food and drink to their table. It was built from scratch, and so good coding practices were paramount. It also had to be fast to load on a range of mobile devices with poor internet connectivity, and intuitive.",{"type":17,"tag":34,"props":373,"children":374},{},[375],{"type":24,"value":376},"We used a TDD approach to ensure stability. I wrote Jest unit tests for each component and a suite of E2E tests using Cypress for each user flow. We later refactored the codebase to use Vuex-ORM which greatly simplified local data storage and retrieval, and helped to normalise the data.",{"type":17,"tag":34,"props":378,"children":379},{},[380],{"type":24,"value":381},"Since its launch in 2020 the app was used to place over 4m orders and take £63m in GMV. We secured some big names in the hospitality industry such as Crepe Affaire, Patisserie Valerie, Market Halls, Boxpark and many others, totalling 660 operators across 1400 sites.",{"type":17,"tag":18,"props":383,"children":385},{"className":384},[100],[386,394,400,408,417,423,428,433,440,446,451,456,463,469,474,479,484,492,498,503,510,516,521],{"type":17,"tag":34,"props":387,"children":388},{},[389],{"type":17,"tag":106,"props":390,"children":393},{"alt":391,"src":392},"Onvi image 1","/img/work/onvi/1.jpg",[],{"type":17,"tag":84,"props":395,"children":397},{"id":396},"order-process",[398],{"type":24,"value":399},"Order process",{"type":17,"tag":34,"props":401,"children":402},{},[403],{"type":17,"tag":106,"props":404,"children":407},{"alt":405,"src":406},"Onvi image 2","/img/work/onvi/2-hori.jpg",[],{"type":17,"tag":34,"props":409,"children":410},{},[411],{"type":17,"tag":412,"props":413,"children":414},"em",{},[415],{"type":24,"value":416},"We made the app's UI customisable to cater for different brand's style guidelines, with each brand's styles held within a JSON field on the CMS.",{"type":17,"tag":245,"props":418,"children":420},{"id":419},"onvi-control",[421],{"type":24,"value":422},"Onvi Control",{"type":17,"tag":34,"props":424,"children":425},{},[426],{"type":24,"value":427},"We built another web-app to provide menu and order management for Onvi Order. This app would be used by the operator (bar/restaurant) and we spent a lot of time making an intuitive drag-and-drop menu organisation tool. The app was also used to control stock availability, promotions and app UI customisations. Once again we built this with Vue and tests were written with Jest and Cypress.",{"type":17,"tag":34,"props":429,"children":430},{},[431],{"type":24,"value":432},"Later we wanted to add some sales analytics visualisations, and so I helped to conduct research into how we would best achieve this. We decided to do an integration with Sisense, a third party data visualisation service. We built this in a modular way, so that we could easily expand the feature in the future.",{"type":17,"tag":34,"props":434,"children":435},{},[436],{"type":17,"tag":106,"props":437,"children":439},{"alt":422,"src":438},"/img/work/onvi/control-analytics-framed.png",[],{"type":17,"tag":245,"props":441,"children":443},{"id":442},"onvi-serve",[444],{"type":24,"value":445},"Onvi Serve",{"type":17,"tag":34,"props":447,"children":448},{},[449],{"type":24,"value":450},"The business wanted to expand into the POS (point-of-sale) market, and so we created an iOS app to be used by operators in-venue. We needed to get this to market quickly, so for speed of development we again built this with Vue so that we could re-use a lot of our existing Vue components. We used Capacitor.js to build the web-app into a native iOS app for iPads and iPhones. The first app version was ready just six weeks after we started.",{"type":17,"tag":34,"props":452,"children":453},{},[454],{"type":24,"value":455},"The Till function of the app was used to place 270,000 orders in its first 8 months.",{"type":17,"tag":34,"props":457,"children":458},{},[459],{"type":17,"tag":106,"props":460,"children":462},{"alt":445,"src":461},"/img/work/onvi/onvi-serve.jpg",[],{"type":17,"tag":245,"props":464,"children":466},{"id":465},"onvicom",[467],{"type":24,"value":468},"Onvi.com",{"type":17,"tag":34,"props":470,"children":471},{},[472],{"type":24,"value":473},"I architected the build for the company website, which we built with Nuxt.js and used Contentful CMS. We broke the page designs down into generic reusable components, and made all the configuration options available in Contentful. This meant that content editors were able to easily create and maintain pages without any further development.",{"type":17,"tag":34,"props":475,"children":476},{},[477],{"type":24,"value":478},"I found and hired a web developer for the project and I mentored them during the build, helping to ensure the website was built to the same high standards as our other projects. I greatly enjoyed mentoring them and watching them grow as a developer.",{"type":17,"tag":34,"props":480,"children":481},{},[482],{"type":24,"value":483},"We integrated Salesforce forms to pass sales leads onto the sales team for quick response times.",{"type":17,"tag":34,"props":485,"children":486},{},[487],{"type":17,"tag":106,"props":488,"children":491},{"alt":489,"src":490},"Onvi website","/img/work/onvi/onvi-website.jpg",[],{"type":17,"tag":245,"props":493,"children":495},{"id":494},"onvi-core",[496],{"type":24,"value":497},"Onvi Core",{"type":17,"tag":34,"props":499,"children":500},{},[501],{"type":24,"value":502},"As the projects scaled, we soon faced issues with code duplication. To tackle this we extracted the common parts into a separate repo, and then imported that into each project repo. This involved some quite large refactors, and a lot of work to ensure the Vuex store worked with the imported modules, but it was worth it. It meant that our projects were developed more in sync with each other and minimised the amount of code within each project, too.",{"type":17,"tag":34,"props":504,"children":505},{},[506],{"type":17,"tag":106,"props":507,"children":509},{"alt":497,"src":508},"/img/work/onvi/onvi-core.png",[],{"type":17,"tag":245,"props":511,"children":513},{"id":512},"team-management",[514],{"type":24,"value":515},"Team management",{"type":17,"tag":34,"props":517,"children":518},{},[519],{"type":24,"value":520},"None of the above projects would have been possible without a tightly-knit team of highly skilled developers. I was promoted to frontend lead to guide the team to develop the best products possible. My responsibilities included:",{"type":17,"tag":522,"props":523,"children":524},"ul",{},[525,531,536,541,546,551,556,561,566,571,576,581],{"type":17,"tag":526,"props":527,"children":528},"li",{},[529],{"type":24,"value":530},"Daily line management and mentoring",{"type":17,"tag":526,"props":532,"children":533},{},[534],{"type":24,"value":535},"Leading daily standups and directing the team focus",{"type":17,"tag":526,"props":537,"children":538},{},[539],{"type":24,"value":540},"Leading feature kickoffs and reviews",{"type":17,"tag":526,"props":542,"children":543},{},[544],{"type":24,"value":545},"Attending leads meetings to determine future business and product focus",{"type":17,"tag":526,"props":547,"children":548},{},[549],{"type":24,"value":550},"Research",{"type":17,"tag":526,"props":552,"children":553},{},[554],{"type":24,"value":555},"Liaison with the backend team to discuss and decide on API changes",{"type":17,"tag":526,"props":557,"children":558},{},[559],{"type":24,"value":560},"Liaison with the support team, tracking error reports and investigating bugs",{"type":17,"tag":526,"props":562,"children":563},{},[564],{"type":24,"value":565},"Liaison with the design team",{"type":17,"tag":526,"props":567,"children":568},{},[569],{"type":24,"value":570},"Project dependency maintenance",{"type":17,"tag":526,"props":572,"children":573},{},[574],{"type":24,"value":575},"Writing documentation",{"type":17,"tag":526,"props":577,"children":578},{},[579],{"type":24,"value":580},"Code reviews",{"type":17,"tag":526,"props":582,"children":583},{},[584],{"type":24,"value":585},"App Store release management",{"title":7,"searchDepth":160,"depth":160,"links":587},[588,591,592,593,594,595],{"id":363,"depth":160,"text":366,"children":589},[590],{"id":396,"depth":163,"text":399},{"id":419,"depth":160,"text":422},{"id":442,"depth":160,"text":445},{"id":465,"depth":160,"text":468},{"id":494,"depth":160,"text":497},{"id":512,"depth":160,"text":515},"content:work:onvi.md","work/onvi.md","work/onvi",{"_path":600,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":601,"description":177,"subtitle":602,"thumbnail":603,"tags":180,"order":160,"body":604,"_type":167,"_id":741,"_source":169,"_file":742,"_stem":743,"_extension":172},"/work/educate-against-hate","Educate Against Hate","December 2015 | Front-end developer | © Breakthrough Media","/img/work/educate-against-hate/thumbnail.png",{"type":14,"children":605,"toc":734},[606,669],{"type":17,"tag":18,"props":607,"children":609},{"className":608},[21],[610,611,640,641],{"type":24,"value":25},{"type":17,"tag":18,"props":612,"children":614},{"className":613},[29],[615,616,621,622,627,628,633,634,639],{"type":24,"value":32},{"type":17,"tag":34,"props":617,"children":618},{},[619],{"type":24,"value":620},"\n      Online, young people are vulnerable to extremist ideologies, which play on\n      their insecurities as they struggle to find their place in the\n      world. ‘Educate Against Hate’ is a campaign aimed at\n      uniting parents, teachers and school leaders, arming them with the tools\n      to keep their young people safe. A carefully designed website, using\n      a typographical approach, allows users to apply their own experiences and\n      concerns to the content, without negative imagery present.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":623,"children":624},{},[625],{"type":24,"value":626},"\n      I was responsible for assisting the design team during the\n      wireframing stage, and the entire website build. The build was done with\n      WordPress, where architecting the different data types and relationships\n      was crucial to ensure the website was easy to update, and for content\n      editors to link content types together.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":629,"children":630},{},[631],{"type":24,"value":632},"\n      The designs were done my award-winning designer and friend Pete Rossi. My\n      focus was on developing the website as closely to the designs as\n      possible, since it needed to be pixel-perfect to ensure the design\n      language was communicated effectively. Having previously worked as a\n      designer, treating designs with this respect is something I take pride in.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":635,"children":636},{},[637],{"type":24,"value":638},"\n      Within two weeks of launch, the website gained over 60,000 views. The\n      project won bronze at the Cannes Lions International Festival of\n      Creativity 2016.\n    ",{"type":24,"value":25},{"type":24,"value":25},{"type":17,"tag":18,"props":642,"children":644},{"className":643},[80],[645,646,650,651,656,657,668],{"type":24,"value":32},{"type":17,"tag":84,"props":647,"children":648},{"id":86},[649],{"type":24,"value":89},{"type":24,"value":32},{"type":17,"tag":34,"props":652,"children":653},{},[654],{"type":24,"value":655},"Front-end developer – sole dev on the project",{"type":24,"value":32},{"type":17,"tag":34,"props":658,"children":659},{},[660,661,667],{"type":24,"value":226},{"type":17,"tag":228,"props":662,"children":665},{"href":663,"className":664,"target":234},"https://educateagainsthate.com",[232,233],[666],{"type":24,"value":237},{"type":24,"value":32},{"type":24,"value":25},{"type":17,"tag":18,"props":670,"children":672},{"className":671},[100],[673,677,685,691,698,704,711,717,722,727],{"type":17,"tag":245,"props":674,"children":675},{"id":113},[676],{"type":24,"value":116},{"type":17,"tag":34,"props":678,"children":679},{},[680],{"type":17,"tag":106,"props":681,"children":684},{"alt":682,"src":683},"Educate Against Hate website","/img/work/educate-against-hate/1.png",[],{"type":17,"tag":245,"props":686,"children":688},{"id":687},"hub-page",[689],{"type":24,"value":690},"Hub page",{"type":17,"tag":34,"props":692,"children":693},{},[694],{"type":17,"tag":106,"props":695,"children":697},{"alt":682,"src":696},"/img/work/educate-against-hate/2.png",[],{"type":17,"tag":245,"props":699,"children":701},{"id":700},"article-page",[702],{"type":24,"value":703},"Article page",{"type":17,"tag":34,"props":705,"children":706},{},[707],{"type":17,"tag":106,"props":708,"children":710},{"alt":682,"src":709},"/img/work/educate-against-hate/3.png",[],{"type":17,"tag":84,"props":712,"children":714},{"id":713},"popup-word-meaning",[715],{"type":24,"value":716},"Popup word meaning",{"type":17,"tag":34,"props":718,"children":719},{},[720],{"type":24,"value":721},"Across the site, all negative words are striked-out. When the user hovers over one of these words, this popup area appears. I used a Wordpress custom post type to store these definitions, and wrote Javascript to automatically insert the strikethrough styling and interaction for each word defined in this custom post type.",{"type":17,"tag":34,"props":723,"children":724},{},[725],{"type":24,"value":726},"The result is that content editors can easily maintain the words and definitions without need for a developer.",{"type":17,"tag":34,"props":728,"children":729},{},[730],{"type":17,"tag":106,"props":731,"children":733},{"alt":682,"src":732},"/img/work/educate-against-hate/4.png",[],{"title":7,"searchDepth":160,"depth":160,"links":735},[736,737,738],{"id":113,"depth":160,"text":116},{"id":687,"depth":160,"text":690},{"id":700,"depth":160,"text":703,"children":739},[740],{"id":713,"depth":163,"text":716},"content:work:educate-against-hate.md","work/educate-against-hate.md","work/educate-against-hate",{"_path":745,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":746,"description":177,"subtitle":747,"thumbnail":748,"tags":11,"order":160,"body":749,"_type":167,"_id":868,"_source":169,"_file":869,"_stem":870,"_extension":172},"/work/fairsquare","Fairsquare","2017-18 | Front-end developer | © Gravity London","/img/work/fairsquare/thumbnail.jpg",{"type":14,"children":750,"toc":863},[751,814],{"type":17,"tag":18,"props":752,"children":754},{"className":753},[21],[755,756,785,786],{"type":24,"value":25},{"type":17,"tag":18,"props":757,"children":759},{"className":758},[29],[760,761,766,767,772,773,778,779,784],{"type":24,"value":32},{"type":17,"tag":34,"props":762,"children":763},{},[764],{"type":24,"value":765},"\n      Fairsquare.com is a new way for users to purchase a car. It allows them to\n      search for specific cars, and compare lending products from various\n      lenders for that car on the one website – rather than having to visit\n      lenders’ websites individually.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":768,"children":769},{},[770],{"type":24,"value":771},"\n      Working in a front-end team of two, we built the site with Vue.js and\n      was my first large-scale Vue project, which taught me a great deal about\n      scaling sites with Vue. We built a library of re-usable components, adding\n      in enough prop options to each to handle all use cases required across the\n      site. Components could then be used in conjunction with one another, using\n      slots, so that page templates could be quickly built mostly entirely\n      from a hierarchy of components.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":774,"children":775},{},[776],{"type":24,"value":777},"\n      We made extensive use of Vuex, and used techniques such as data hydration\n      to resume a user’s car purchase state from localStorage if they leave the\n      site. Since a number of form pages were present in the process of buying a\n      car, this was crucial for optimum user experience and to minimise\n      drop-off.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":780,"children":781},{},[782],{"type":24,"value":783},"\n      Due to my previous experience I was also responsible for\n      the WordPress side of things, which was used to store blog posts, and\n      retrieve them using the WordPress REST API.\n    ",{"type":24,"value":25},{"type":24,"value":25},{"type":17,"tag":18,"props":787,"children":789},{"className":788},[80],[790,791,795,796,801,802,813],{"type":24,"value":32},{"type":17,"tag":84,"props":792,"children":793},{"id":86},[794],{"type":24,"value":89},{"type":24,"value":32},{"type":17,"tag":34,"props":797,"children":798},{},[799],{"type":24,"value":800},"Front-end developer – one of two on the project",{"type":24,"value":32},{"type":17,"tag":34,"props":803,"children":804},{},[805,806,812],{"type":24,"value":226},{"type":17,"tag":228,"props":807,"children":810},{"href":808,"className":809,"target":234},"https://www.fairsquare.com",[232,233],[811],{"type":24,"value":237},{"type":24,"value":32},{"type":24,"value":25},{"type":17,"tag":18,"props":815,"children":817},{"className":816},[100],[818,822,829,835,846,852],{"type":17,"tag":245,"props":819,"children":820},{"id":113},[821],{"type":24,"value":116},{"type":17,"tag":34,"props":823,"children":824},{},[825],{"type":17,"tag":106,"props":826,"children":828},{"alt":746,"src":827},"/img/work/fairsquare/1.jpg",[],{"type":17,"tag":245,"props":830,"children":832},{"id":831},"car-selection-steps",[833],{"type":24,"value":834},"Car selection steps",{"type":17,"tag":34,"props":836,"children":837},{},[838,842],{"type":17,"tag":106,"props":839,"children":841},{"alt":746,"src":840},"/img/work/fairsquare/2.jpg",[],{"type":17,"tag":106,"props":843,"children":845},{"alt":746,"src":844},"/img/work/fairsquare/3.jpg",[],{"type":17,"tag":245,"props":847,"children":849},{"id":848},"form-steps",[850],{"type":24,"value":851},"Form steps",{"type":17,"tag":34,"props":853,"children":854},{},[855,859],{"type":17,"tag":106,"props":856,"children":858},{"alt":746,"src":857},"/img/work/fairsquare/4.jpg",[],{"type":17,"tag":106,"props":860,"children":862},{"alt":746,"src":861},"/img/work/fairsquare/5.jpg",[],{"title":7,"searchDepth":160,"depth":160,"links":864},[865,866,867],{"id":113,"depth":160,"text":116},{"id":831,"depth":160,"text":834},{"id":848,"depth":160,"text":851},"content:work:fairsquare.md","work/fairsquare.md","work/fairsquare",{"_path":872,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":873,"description":177,"subtitle":874,"thumbnail":875,"tags":180,"order":163,"body":876,"_type":167,"_id":1000,"_source":169,"_file":1001,"_stem":1002,"_extension":172},"/work/afma","AFMA","October 2015","/img/work/afma/thumbnail.jpg",{"type":14,"children":877,"toc":994},[878,935],{"type":17,"tag":18,"props":879,"children":881},{"className":880},[21],[882,883,906,907],{"type":24,"value":32},{"type":17,"tag":18,"props":884,"children":886},{"className":885},[29],[887,888,893,894,899,900,905],{"type":24,"value":324},{"type":17,"tag":34,"props":889,"children":890},{},[891],{"type":24,"value":892},"The Armed Forces Muslim Association (AFMA) was set up in 2009, as a support network for Muslim military personnel. Increasingly, the armed forces have been manipulated by religious and far right extremists to promote their own narrative. AFMA wanted to counteract this by showing that Muslims could lead reconciled lives serving as British soldiers, while freely practicing their faith. ",{"type":24,"value":324},{"type":17,"tag":34,"props":895,"children":896},{},[897],{"type":24,"value":898},"The AFMA site is a celebration of the active Muslim presence in the Armed Forces. It shares the many stories of committed Muslim servicemen and women, including Asim Hafiz, the first Imam and Muslim Chaplain to the British Armed Forces, who proudly carry out their military duties in full without compromising their faith.",{"type":24,"value":324},{"type":17,"tag":34,"props":901,"children":902},{},[903],{"type":24,"value":904},"The site also serves as a recruitment drive for the Muslim community into the British Army, Royal Air Force, Royal Navy and Royal Marines.",{"type":24,"value":32},{"type":24,"value":32},{"type":17,"tag":18,"props":908,"children":910},{"className":909},[80],[911,912,916,917,921,922,934],{"type":24,"value":324},{"type":17,"tag":84,"props":913,"children":914},{"id":86},[915],{"type":24,"value":89},{"type":24,"value":324},{"type":17,"tag":34,"props":918,"children":919},{},[920],{"type":24,"value":655},{"type":24,"value":324},{"type":17,"tag":34,"props":923,"children":924},{},[925,927,933],{"type":24,"value":926},"\n            ",{"type":17,"tag":228,"props":928,"children":931},{"href":929,"className":930,"target":234},"http://afma.org.uk/",[232,233],[932],{"type":24,"value":237},{"type":24,"value":324},{"type":24,"value":32},{"type":17,"tag":18,"props":936,"children":938},{"className":937},[100],[939,943,950,956,963,969,976,982,987],{"type":17,"tag":245,"props":940,"children":941},{"id":113},[942],{"type":24,"value":116},{"type":17,"tag":34,"props":944,"children":945},{},[946],{"type":17,"tag":106,"props":947,"children":949},{"alt":873,"src":948},"/img/work/afma/1.jpg",[],{"type":17,"tag":245,"props":951,"children":953},{"id":952},"about-page",[954],{"type":24,"value":955},"About page",{"type":17,"tag":34,"props":957,"children":958},{},[959],{"type":17,"tag":106,"props":960,"children":962},{"alt":873,"src":961},"/img/work/afma/2.jpg",[],{"type":17,"tag":245,"props":964,"children":966},{"id":965},"join-the-armed-forces",[967],{"type":24,"value":968},"Join the Armed Forces",{"type":17,"tag":34,"props":970,"children":971},{},[972],{"type":17,"tag":106,"props":973,"children":975},{"alt":873,"src":974},"/img/work/afma/3.jpg",[],{"type":17,"tag":245,"props":977,"children":979},{"id":978},"overlay-menu",[980],{"type":24,"value":981},"Overlay Menu",{"type":17,"tag":34,"props":983,"children":984},{},[985],{"type":24,"value":986},"Menu animates over the page layout using CSS3 transitions.",{"type":17,"tag":34,"props":988,"children":989},{},[990],{"type":17,"tag":106,"props":991,"children":993},{"alt":873,"src":992},"/img/work/afma/4.jpg",[],{"title":7,"searchDepth":160,"depth":160,"links":995},[996,997,998,999],{"id":113,"depth":160,"text":116},{"id":952,"depth":160,"text":955},{"id":965,"depth":160,"text":968},{"id":978,"depth":160,"text":981},"content:work:afma.md","work/afma.md","work/afma",{"_path":1004,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":1005,"description":177,"subtitle":1006,"thumbnail":1007,"tags":180,"order":1008,"body":1009,"_type":167,"_id":1081,"_source":169,"_file":1082,"_stem":1083,"_extension":172},"/work/ummahsonic","Ummahsonic","2016","/img/work/ummahsonic/thumbnail.jpg",4,{"type":14,"children":1010,"toc":1079},[1011,1061],{"type":17,"tag":18,"props":1012,"children":1014},{"className":1013},[21],[1015,1016,1033,1034],{"type":24,"value":25},{"type":17,"tag":18,"props":1017,"children":1019},{"className":1018},[29],[1020,1021,1026,1027,1032],{"type":24,"value":32},{"type":17,"tag":34,"props":1022,"children":1023},{},[1024],{"type":24,"value":1025},"\n      Ummahsonic is an online radio station aimed at muslim teenagers living in\n      the UK. As part of a total rebrand, a new website was designed to showcase\n      the radio shows.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":1028,"children":1029},{},[1030],{"type":24,"value":1031},"\n      I worked as sole developer on this project, building the site from\n      scratch. Building with WordPress I used my custom starter template, I\n      integrated JPlayer which is the audio player used for the radio show\n      tracks. I built the site using AJAX so that the show player would continue\n      to play whilst the user navigates the site. I had to write some\n      significant JQuery/Javascript code for this to continue to function across\n      the site and to interact with the video player to ensure only one plays at\n      a time.\n    ",{"type":24,"value":25},{"type":24,"value":25},{"type":17,"tag":18,"props":1035,"children":1037},{"className":1036},[80],[1038,1039,1043,1044,1048,1049,1060],{"type":24,"value":32},{"type":17,"tag":84,"props":1040,"children":1041},{"id":86},[1042],{"type":24,"value":89},{"type":24,"value":32},{"type":17,"tag":34,"props":1045,"children":1046},{},[1047],{"type":24,"value":655},{"type":24,"value":32},{"type":17,"tag":34,"props":1050,"children":1051},{},[1052,1053,1059],{"type":24,"value":226},{"type":17,"tag":228,"props":1054,"children":1057},{"href":1055,"className":1056,"target":234},"http://ummahsonic.com",[232,233],[1058],{"type":24,"value":237},{"type":24,"value":32},{"type":24,"value":25},{"type":17,"tag":18,"props":1062,"children":1064},{"className":1063},[100],[1065,1072],{"type":17,"tag":34,"props":1066,"children":1067},{},[1068],{"type":17,"tag":106,"props":1069,"children":1071},{"alt":1005,"src":1070},"/img/work/ummahsonic/1.jpg",[],{"type":17,"tag":34,"props":1073,"children":1074},{},[1075],{"type":17,"tag":106,"props":1076,"children":1078},{"alt":1005,"src":1077},"/img/work/ummahsonic/2.jpg",[],{"title":7,"searchDepth":160,"depth":160,"links":1080},[],"content:work:ummahsonic.md","work/ummahsonic.md","work/ummahsonic",{"_path":1085,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":1086,"description":1087,"subtitle":1088,"thumbnail":1089,"tags":180,"myRole":1090,"url":1091,"order":1092,"body":1093,"_type":167,"_id":1209,"_source":169,"_file":1210,"_stem":1211,"_extension":172},"/work/raw-productions","RAW Productions","RAW are a London-based video production studio with clients such as EMI, Sony Music, Twitter, The British Heart Foundation and Vodafone.","2014","/img/work/raw-productions/thumbnail.jpg","UI designer & front-end developer","http://www.rawproductions.tv/",5,{"type":14,"children":1094,"toc":1207},[1095,1155],{"type":17,"tag":18,"props":1096,"children":1098},{"className":1097},[21],[1099,1100,1123,1124],{"type":24,"value":25},{"type":17,"tag":18,"props":1101,"children":1103},{"className":1102},[29],[1104,1105,1110,1111,1116,1117,1122],{"type":24,"value":32},{"type":17,"tag":34,"props":1106,"children":1107},{},[1108],{"type":24,"value":1109},"\n      RAW are a London-based video production studio with clients such as\n      EMI, Sony Music, Twitter, The British Heart Foundation and Vodafone.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":1112,"children":1113},{},[1114],{"type":24,"value":1115},"\n      As part of a company re-branding exercise they came to me to redesign and\n      rebuild their website. I worked closely with a copywriter to ensure the\n      brand’s message was inline with their goals, and from there designed the\n      site around the content. I built the website with WordPress, and to best\n      showcase their work I added features such as full-screen background video,\n      a popup video showreel and a filterable portfolio of work.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":1118,"children":1119},{},[1120],{"type":24,"value":1121},"\n      Since it’s introduction, the website relaunch has generated a 30%\n      increase in sales.\n    ",{"type":24,"value":25},{"type":24,"value":25},{"type":17,"tag":18,"props":1125,"children":1127},{"className":1126},[80],[1128,1129,1133,1134,1138,1139,1142,1143,1154],{"type":24,"value":32},{"type":17,"tag":84,"props":1130,"children":1131},{"id":86},[1132],{"type":24,"value":89},{"type":24,"value":32},{"type":17,"tag":34,"props":1135,"children":1136},{},[1137],{"type":24,"value":1090},{"type":24,"value":32},{"type":17,"tag":84,"props":1140,"children":1141},{"id":7},[],{"type":24,"value":32},{"type":17,"tag":34,"props":1144,"children":1145},{},[1146,1147,1153],{"type":24,"value":226},{"type":17,"tag":228,"props":1148,"children":1151},{"href":1149,"className":1150,"target":234},"http://www.rawproductions.tv",[232,233],[1152],{"type":24,"value":237},{"type":24,"value":32},{"type":24,"value":25},{"type":17,"tag":18,"props":1156,"children":1158},{"className":1157},[100],[1159,1167,1175,1183,1191,1199],{"type":17,"tag":34,"props":1160,"children":1161},{},[1162],{"type":17,"tag":106,"props":1163,"children":1166},{"alt":1164,"src":1165},"Raw Productions website image 1","/img/work/raw-productions/raw-1.jpg",[],{"type":17,"tag":34,"props":1168,"children":1169},{},[1170],{"type":17,"tag":106,"props":1171,"children":1174},{"alt":1172,"src":1173},"Raw Productions website image 2","/img/work/raw-productions/raw-2.jpg",[],{"type":17,"tag":34,"props":1176,"children":1177},{},[1178],{"type":17,"tag":106,"props":1179,"children":1182},{"alt":1180,"src":1181},"Raw Productions website image 3","/img/work/raw-productions/raw-3.jpg",[],{"type":17,"tag":34,"props":1184,"children":1185},{},[1186],{"type":17,"tag":106,"props":1187,"children":1190},{"alt":1188,"src":1189},"Raw Productions website image 4","/img/work/raw-productions/raw-4.jpg",[],{"type":17,"tag":34,"props":1192,"children":1193},{},[1194],{"type":17,"tag":106,"props":1195,"children":1198},{"alt":1196,"src":1197},"Raw Productions website image 5","/img/work/raw-productions/raw-5.jpg",[],{"type":17,"tag":34,"props":1200,"children":1201},{},[1202],{"type":17,"tag":106,"props":1203,"children":1206},{"alt":1204,"src":1205},"Raw Productions website image 6","/img/work/raw-productions/raw-6.jpg",[],{"title":7,"searchDepth":160,"depth":160,"links":1208},[],"content:work:raw-productions.md","work/raw-productions.md","work/raw-productions",{"_path":1213,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":1214,"description":177,"subtitle":1215,"thumbnail":1216,"tags":180,"order":1217,"body":1218,"_type":167,"_id":1333,"_source":169,"_file":1334,"_stem":1335,"_extension":172},"/work/ben-pentreath","Ben Pentreath","2009-12","/img/work/ben-pentreath/thumbnail.jpg",6,{"type":14,"children":1219,"toc":1331},[1220,1295],{"type":17,"tag":18,"props":1221,"children":1223},{"className":1222},[21],[1224,1225,1254,1255],{"type":24,"value":25},{"type":17,"tag":18,"props":1226,"children":1228},{"className":1227},[29],[1229,1230,1235,1236,1241,1242,1247,1248,1253],{"type":24,"value":32},{"type":17,"tag":34,"props":1231,"children":1232},{},[1233],{"type":24,"value":1234},"\n      Ben Pentreath Ltd is a small shop in London’s Bloomsbury selling a\n      carefully chosen range of new products and an ever-changing variety of\n      antiques, second-hand books and unusual presents.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":1237,"children":1238},{},[1239],{"type":24,"value":1240},"\n      They came to me to design and produce an e-commerce solution which could\n      sell their wide range of goods throughout the UK, 24 hours a day. We chose\n      upon an eclectic mix of typefaces, colours and bespoke photography to\n      create a vibrant and unique online shopping experience.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":1243,"children":1244},{},[1245],{"type":24,"value":1246},"\n      The online shop was expanded with a WordPress blog which as well as\n      handling blog updates, functions as a content management system for pages\n      detailing Ben’s growing architecture and interior design companies.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":1249,"children":1250},{},[1251],{"type":24,"value":1252},"\n      In its first year the website generated sales valued four times that of\n      the website’s design and build cost.\n    ",{"type":24,"value":25},{"type":24,"value":25},{"type":17,"tag":18,"props":1256,"children":1258},{"className":1257},[80],[1259,1260,1264,1265,1269,1270,1276,1277,1282,1283,1294],{"type":24,"value":32},{"type":17,"tag":84,"props":1261,"children":1262},{"id":86},[1263],{"type":24,"value":89},{"type":24,"value":32},{"type":17,"tag":34,"props":1266,"children":1267},{},[1268],{"type":24,"value":1090},{"type":24,"value":32},{"type":17,"tag":84,"props":1271,"children":1273},{"id":1272},"technologies",[1274],{"type":24,"value":1275},"Technologies",{"type":24,"value":32},{"type":17,"tag":34,"props":1278,"children":1279},{},[1280],{"type":24,"value":1281},"CubeCart, WordPress",{"type":24,"value":32},{"type":17,"tag":34,"props":1284,"children":1285},{},[1286,1287,1293],{"type":24,"value":226},{"type":17,"tag":228,"props":1288,"children":1291},{"href":1289,"className":1290,"target":234},"http://www.benpentreath.com",[232,233],[1292],{"type":24,"value":237},{"type":24,"value":32},{"type":24,"value":25},{"type":17,"tag":18,"props":1296,"children":1298},{"className":1297},[100],[1299],{"type":17,"tag":34,"props":1300,"children":1301},{},[1302,1307,1311,1315,1319,1323,1327],{"type":17,"tag":106,"props":1303,"children":1306},{"alt":1304,"src":1305},"Ben Pentreath website","/img/work/ben-pentreath/ben-pentreath-1.jpg",[],{"type":17,"tag":106,"props":1308,"children":1310},{"alt":1304,"src":1309},"/img/work/ben-pentreath/ben-pentreath-2.jpg",[],{"type":17,"tag":106,"props":1312,"children":1314},{"alt":1304,"src":1313},"/img/work/ben-pentreath/ben-pentreath-3.jpg",[],{"type":17,"tag":106,"props":1316,"children":1318},{"alt":1304,"src":1317},"/img/work/ben-pentreath/ben-pentreath-4.jpg",[],{"type":17,"tag":106,"props":1320,"children":1322},{"alt":1304,"src":1321},"/img/work/ben-pentreath/ben-pentreath-5.jpg",[],{"type":17,"tag":106,"props":1324,"children":1326},{"alt":1304,"src":1325},"/img/work/ben-pentreath/ben-pentreath-6.jpg",[],{"type":17,"tag":106,"props":1328,"children":1330},{"alt":1304,"src":1329},"/img/work/ben-pentreath/ben-pentreath-7.jpg",[],{"title":7,"searchDepth":160,"depth":160,"links":1332},[],"content:work:ben-pentreath.md","work/ben-pentreath.md","work/ben-pentreath",{"_path":1337,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":1338,"description":177,"subtitle":1339,"thumbnail":1340,"tags":180,"order":1341,"body":1342,"_type":167,"_id":1395,"_source":169,"_file":1396,"_stem":1397,"_extension":172},"/work/fanbookz","Fanbookz","JULY 2014 - MAY 2015 | Front-end developer | © Connected Ventures","/img/work/fanbookz/thumbnail.jpg",7,{"type":14,"children":1343,"toc":1393},[1344,1349,1354],{"type":17,"tag":34,"props":1345,"children":1346},{},[1347],{"type":24,"value":1348},"Fanbookz is the world's first football-only social network with over 200,000 monthly visits. I worked close to the start of the project building new features for the site, working with the designers to build designs into Twig templates and writing javascript components. I helped to code a Facebook-style inline comments system, the match predictor game, news, club and stats pages.",{"type":17,"tag":34,"props":1350,"children":1351},{},[1352],{"type":24,"value":1353},"As the site grew more popular I worked on optimising the site by using techniques like icon fonts and sprite sheets using Gulp, and rendering HTML on the front-end by passing JSON data through Mustache templates using Hogan.js.",{"type":17,"tag":18,"props":1355,"children":1357},{"className":1356},[100],[1358,1365,1372,1379,1386],{"type":17,"tag":34,"props":1359,"children":1360},{},[1361],{"type":17,"tag":106,"props":1362,"children":1364},{"alt":1338,"src":1363},"/img/work/fanbookz/1.jpg",[],{"type":17,"tag":34,"props":1366,"children":1367},{},[1368],{"type":17,"tag":106,"props":1369,"children":1371},{"alt":1338,"src":1370},"/img/work/fanbookz/2.jpg",[],{"type":17,"tag":34,"props":1373,"children":1374},{},[1375],{"type":17,"tag":106,"props":1376,"children":1378},{"alt":1338,"src":1377},"/img/work/fanbookz/3.jpg",[],{"type":17,"tag":34,"props":1380,"children":1381},{},[1382],{"type":17,"tag":106,"props":1383,"children":1385},{"alt":1338,"src":1384},"/img/work/fanbookz/4.jpg",[],{"type":17,"tag":34,"props":1387,"children":1388},{},[1389],{"type":17,"tag":106,"props":1390,"children":1392},{"alt":1338,"src":1391},"/img/work/fanbookz/5.jpg",[],{"title":7,"searchDepth":160,"depth":160,"links":1394},[],"content:work:fanbookz.md","work/fanbookz.md","work/fanbookz",{"_path":1399,"_dir":5,"_draft":6,"_partial":6,"_locale":7,"title":1400,"description":177,"subtitle":1401,"thumbnail":1402,"tags":180,"order":1403,"body":1404,"_type":167,"_id":1525,"_source":169,"_file":1526,"_stem":1527,"_extension":172},"/work/infiniti-cars","Infiniti Cars","JULY-OCT 2013 | Lead front-end developer | © TMW","/img/work/infiniti-cars/thumbnail.jpg",8,{"type":14,"children":1405,"toc":1523},[1406,1476],{"type":17,"tag":18,"props":1407,"children":1409},{"className":1408},[21],[1410,1411,1434,1435],{"type":24,"value":25},{"type":17,"tag":18,"props":1412,"children":1414},{"className":1413},[29],[1415,1416,1421,1422,1427,1428,1433],{"type":24,"value":32},{"type":17,"tag":34,"props":1417,"children":1418},{},[1419],{"type":24,"value":1420},"\n      I worked at agency TMW to produce this website for the European market for\n      car manufacturer Infiniti, as an integral part of the 15-man team which\n      included design, content, technical and project management staff, using\n      Agile methods.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":1423,"children":1424},{},[1425],{"type":24,"value":1426},"\n      The project had a very tight timeframe so it was decided to start with an\n      off-the-shelf WordPress theme to save time. I used this to create the\n      framework for the site, then created re-usable components to which the\n      content team could add their content. I dealt with all technical aspects\n      such as theme and plugin research, developing the theme to match the\n      designs, coding custom modules such as persistent navigation menus,\n      added an interactive map/dealer locator, and helped to plan\n      the frequent deployment processes. I advised the design team to help\n      them design within the restrictions of the theme’s functionality, and\n      likewise worked to remove technical restrictions based on design\n      requirements. The site is fully responsive and multi-lingual over five\n      languages.\n    ",{"type":24,"value":32},{"type":17,"tag":34,"props":1429,"children":1430},{},[1431],{"type":24,"value":1432},"\n      The project was a success, meeting deadlines and receiving praise from the\n      client.\n    ",{"type":24,"value":25},{"type":24,"value":25},{"type":17,"tag":18,"props":1436,"children":1438},{"className":1437},[80],[1439,1440,1444,1445,1450,1451,1457,1458,1463,1464,1475],{"type":24,"value":32},{"type":17,"tag":84,"props":1441,"children":1442},{"id":86},[1443],{"type":24,"value":89},{"type":24,"value":32},{"type":17,"tag":34,"props":1446,"children":1447},{},[1448],{"type":24,"value":1449},"Lead front-end developer – 3 month contract",{"type":24,"value":32},{"type":17,"tag":84,"props":1452,"children":1454},{"id":1453},"copyright",[1455],{"type":24,"value":1456},"Copyright",{"type":24,"value":32},{"type":17,"tag":34,"props":1459,"children":1460},{},[1461],{"type":24,"value":1462},"TMW",{"type":24,"value":32},{"type":17,"tag":34,"props":1465,"children":1466},{},[1467,1468,1474],{"type":24,"value":226},{"type":17,"tag":228,"props":1469,"children":1472},{"href":1470,"className":1471,"target":234},"http://www.infiniti.eu",[232,233],[1473],{"type":24,"value":237},{"type":24,"value":32},{"type":24,"value":25},{"type":17,"tag":18,"props":1477,"children":1479},{"className":1478},[100],[1480,1488,1495,1502,1509,1516],{"type":17,"tag":34,"props":1481,"children":1482},{},[1483],{"type":17,"tag":106,"props":1484,"children":1487},{"alt":1485,"src":1486},"Infiniti Cars website","/img/work/infiniti-cars/1.jpg",[],{"type":17,"tag":34,"props":1489,"children":1490},{},[1491],{"type":17,"tag":106,"props":1492,"children":1494},{"alt":1485,"src":1493},"/img/work/infiniti-cars/2.jpg",[],{"type":17,"tag":34,"props":1496,"children":1497},{},[1498],{"type":17,"tag":106,"props":1499,"children":1501},{"alt":1485,"src":1500},"/img/work/infiniti-cars/3.jpg",[],{"type":17,"tag":34,"props":1503,"children":1504},{},[1505],{"type":17,"tag":106,"props":1506,"children":1508},{"alt":1485,"src":1507},"/img/work/infiniti-cars/4.jpg",[],{"type":17,"tag":34,"props":1510,"children":1511},{},[1512],{"type":17,"tag":106,"props":1513,"children":1515},{"alt":1485,"src":1514},"/img/work/infiniti-cars/5.jpg",[],{"type":17,"tag":34,"props":1517,"children":1518},{},[1519],{"type":17,"tag":106,"props":1520,"children":1522},{"alt":1485,"src":1521},"/img/work/infiniti-cars/6.jpg",[],{"title":7,"searchDepth":160,"depth":160,"links":1524},[],"content:work:infiniti-cars.md","work/infiniti-cars.md","work/infiniti-cars",1793051153557]