Andru Dunn - Logo

CV

About me

I enjoy the challenge of both creative and strategic thinking, solving problems and crafting great experiences.

I've worked across numerous multi-disciplinary teams, and have learnt a lot from the challenges of designing and developing solutions at scale in Britain's best loved retailer.

I'm an expert in Javascript and scalable UI applications. My background is design and I feel just as competent writing software as I am designing in Sketch or prototyping in Framer.

I'm currently working on the John Lewis & Partners design system, Mono. I've spent the last couple of years creating web applications with React, and over the past year worked with NodeJS and Kubernetes and loved every minute of it.

Finding efficiencies is part of my nature and something I thrive on. I'm continually learning and always interested in keeping up to date with new standards of best practice and seeing how I can apply that to day-to-day work.


Work History

ASOS

Web Engineer

February 2019 - Present
Tech + Tools Used:
    React icon
    Redux icon
    Node.JS icon
    JavaScript icon
    Webpack icon
    Sass icon
    ESLint icon
    Sketch
    HTML5 icon
    CSS3 icon
    Slack icon

Joined the team as a UI lead (contract) on the ASOS Marketplace digital transformation project.

John Lewis & Partners

Senior UI Developer

June 2016 - February 2019
Tech + Tools Used:
    React icon
    Redux icon
    Node.JS icon
    JavaScript icon
    Webpack icon
    Docker icon
    Kubernetes
    Sass icon
    ESLint icon
    Abstract
    Sketch
    GitLab icon
    HTML5 icon
    CSS3 icon
    AEM
    Nodemon icon
    NGINX icon
    Grafana icon
    Gulp icon
    Framer icon
    Adobe Illustrator icon
    Adobe Photoshop icon
    Slack icon
    Jira icon

I'm currently working on the John Lewis & Partners Design System – Mono. This work is not public yet, but I am putting together what I can share, including details on how I approached running workshops to define our Design Principles, how we drive adoption and how we maintain contribution, very soon.

Coming Soon

Mono, The John Lewis & Partners Design System

Focusing on reducing time spent across teams creating similar solutions to common problems.

During my time at JL, my main role has been developing UI for the John Lewis website and partner-facing applications, focused on building even better customer experiences. I've worked across many product teams, both contributing to existing apps and writing them from scratch.

I've written both client-side and server-side React apps, and am familiar with the challenges each of them bring. We also have older Java/Handlebars applications which I've had to work in, although we are moving away from this stack. Most recently I've been fortuitous to get stuck in with the infrastructure setup, working more with Docker and Kubernetes.

I adhere to web standards; always ensuring my work is cross-browser compliant, built with best practices and progressive enhancement in mind. I've been fortunate to work in an evironment where accessibility was a real focus for the business and sweating the details to ensure all customers had a great experience is something I'll take with me.

As Senior UI Developer I have been the authority on best practice in the UI space for how we design and build web experiences at John Lewis.

Over the years I've also been instrumental in establishing patterns for most frontend concerns including

  • Performance (standards, metrics and budgeting)
  • Accessibility (WCAG AA compliance)
  • Responsive Design (layouts, images, art direction)
  • Progressive Enhancement (+ percieved performance)
  • SEO (structured/open graph data, where relevant)
  • Analytics (mostly New Relic and Omniture)
  • MVT (we use Monetate to manage tests)
  • Testing (expectations + best practices)
  • Resilience (shielding customers from engineering mistakes)
  • Caching (efficient policies)
  • GDPR (cookies/customer permissions)

I have run countless workshops and delivered presentations on nearly all of these topics, and am often sought out to do so for new teams.

An astute testing approach is essential to engineering resilient software and web applications. We advocate TDD and utilise linting tools to reduce errors and improve developer experience. Tests for both quality and style help catch errors at both build-time and runtime, and common configs/practices help ensure some consistency in development across the multiple product teams. We currently favour Jest, Puppeteer, Prettier and ESLint as our basic toolchain. Over the years I've used various libraries including Mocha, Chai, Enzyme, Sinon and JSDom.

We use a mix of Gitlab CI and GoCD for our CI/CD. We favour failing pipelines to help ensure errors are found early and never reach our customers.

I'm proud to have established an ecosystem where we have common and shared resources for styles, components and patterns for all to reference. This has helped during the rapid scaling of teams over the past 18 months, where it's been ever more crucial to ensure consistency, not just for visual atenutiy but for familiarity of customer experience.

Shared resources currently exist as Sketch Libraries and NPM Modules, and are managed through Abstract and Git respectively, both of which I set up.

Key Projects:

▶ Lead the digital transformation to React

About 5 months into starting in my role as Senior UI Developer, I championed an assessment on our approach to developing the UI for our web applications. At the time we were 12 months into rebuilding JohnLewis.com, moving from a traditional JSP based application, to a MVC Java powered app, using Handlebars as the templating language for

I'm in the process of providing some insight into how journey developed and what we learnt along the way.

Coming Soon

Introducing React at John Lewis

The challenge of changing technology mid way through a rebuild, and how we got on.

▶ Lead the UI development strategy for delivering our rebrand

In September 2018 John Lewis rebranded as John Lewis & Partners. I managed the UI development strategy for the applications which make up JohnLewis.com, and some internal supporting applications.

This invloved establishing ways of working for all our product teams to enable the development of both the rebranded and live sites, so we could still deliver value throughout.

We used a mix of delivery approaches, broadly using Branch-by-Abstraction to enable multiple builds from Master, and a centralised resource of style resets to align apps agnostic of language. More of this is explained in detail in the post I'm just finishing up, detailing delivering the rebrand.

Coming Soon

John Lewis & Partners Rebrand

The John Lewis and partners rebrand was the biggest project I've worked on to date.

▶ John Lewis' first React, Node & Kubernetes stack

During planning a workshop on how we will deliver the rebrand in April 2018, I challenged Product Management that if we didn't use the rebrand as an opportunity to also progress our tech stack we never will.

I managed to get approval, and was given 6 weeks and 4 developers to prove that we could build the new homepage for the rebrand more efficiently in a new application, than in the legacy app.

With weekly demos to the online leadership team, and the rest of the programme, we were given the green light in our fifth week.

The new app was a step-change to how we write our applications, and one focused on resiliency given it'd initially be serving the homepage (3.5M views/week).

The app we built created a lot of firsts for John Lewis' as an organisation:

  • first large scale production NodeJS application
  • first SSR React app,
  • first app solely powered by Microservices

We benefited from our newly enabled Google Cloud Platform, and released the new app in August, in time to test its resiliency in the Summer Clearance traffic, ahead of the rebrand launch in September and peak traffic.

We then had 4 weeks to rebuild most of the UI to align to our rebrand, and had a smooth and successful deployment in September.

We had validated and demonstrated the benefits of efficiency we gained in the new app over the Java based Monolith, and are now focusing on how we can continue to improve as we experiment with Microfrontends and Edge Side Includes.

▶ Setup the new 'My Account' application, using React

Following on from the benefits realised in developing the Checkout, our first React based app, I lead the UI development for the Account app.

▶ UI development lead for the CMS upgrade project

Part of the aptly named Team Crayon, we architected the design for a headless CMS solution using Adobe Experience Manager to provide content for both Web and Native App clients. Our focus was on reducing effort in the authoring experience and to render the preview of content using the web application code.


Web Designer

October 2015 - June 2016
Tech + Tools Used:
    Adobe Photoshop icon
    Adobe Illustrator icon
    HTML5 icon
    CSS3 icon
    JavaScript icon
    jQuery icon
    Adobe Premiere icon

I was a web designer in the online operations team. My role was to interpret and create designs to match the needs and wants from around the business. These were then built in Adobe CQ5 and published on JohnLewis.com.

My key areas of responsibility were the designing content for the homepage, the Electricals categories, and MVT tests via Monetate. Not limited to these, as a team we flexed between picking up larger design campaigns such as Black Friday, Re:new_all and The Edit – the key marketing campaigns throughout the year.

By definition I am a problem solver, and I always seek to improve on processes to help make ourselves and the business more efficient. I was instrumental to creating and testing a new way of working for all online content, and then rolling this out to all departments after a successful trial with the Electrical, and Home Technology teams.


Waitrose & Partners

UI Designer & Frontend Developer

March 2014 - October 2015
Tech + Tools Used:
    HTML5 icon
    CSS3 icon
    JavaScript icon
    Sass icon
    Gulp icon
    Angular icon
    jQuery icon
    Adobe Photoshop icon
    Adobe Illustrator icon
    Adobe InDesign icon
    Adobe Premiere icon

I lead all in-house frontend development for Waitrose’s specialist shops. I worked within the online trading team, handling tight turnarounds and unexpected deadlines for onsite content. I was part of the in-house design team. Working alongside other designers and developers, we managed the multiple briefs and tasks that needed building across seven websites.

I managed, built and produced all modules for the content, merchandising and marketing teams’ briefs. As the content teams managed any updates to the HTML post-build, all markup was as clean as possible. I built using the BEM styling framework, using modifiers to simply create variants of modules.

All seven websites followed a shared theme of styles; to help maintain a core consistency, to feel distinctively Waitrose. This was managed through a bespoke set up of shared and site-specific SASS partials, using Grunt to do the legwork, for concatenation and compiling.

I strive for consistency and keeping to brand guidelines, and as such created a component library for the Waitrose specialist sites to adhere to. All modules I produce or sign off, will be compliant between browsers and devices that we’re specified to support. For functionality we used either vanillaJS or jQuery.

Our ethos was test and learn. I oversaw all of the multi-variant testing from a frontend perspective, and covered any bespoke build when needed. I also reported to my managers, on my work’s analytics, to consistently iterate and improve. I have experience with implementation and reporting of both Google Analytics and Adobe SiteCatalyst.

Waitrose Kitchen

Launched October 2015

Waitrose’s latest specialist shop. Largely kept look and feel of existing sites, but brought some new functionality for new content styles.

Telegraph Wine

Launched October 2015

The first white label partnership site for Waitrose Cellar. I led the UI development, and helped with UI design also.

Waitrose Florist & Waitrose Gifts

Launched March 2015

All elements are built mobile-first, ready for the ongoing Responsive Design project.

Waitrose Pet

Launched October 2014

I built and designed the UI module templates for the Waitrose Pet team to use.

Waitrose Cellar

Launched May 2014

I led the in-house frontend development for the site content. Over 40 rich content pages were built for launch, introducing over 10 new functional features.


Education

Graduated 1st Class Bsc(Hons) Marketing & Multimedia

2013 Roehampton University / Sep ‘10 - July ‘13

A Level Results (A*, B & C)

2010 Weald of Kent Grammar / Sep '08 - June '10

GCSE Results (A* x2, A x8, B x2, C)

2008 The Hayesbrook School / Sep ‘03 - June ’08