Book cover with bold black background, vertical gray stripes on the left, and a gray rectangle with white text reading 'John Lewis & Partners'.

JOHN LEWIS - "ACTIVITY PLANNER" PROJECT

UX Designer - UI Designer

Working with Business Analysts and stakeholders at John Lewis head office, I led UX and UI design for a tablet and desktop web application. The platform enabled branches to plan and manage local events while maintaining visibility of centrally coordinated activity from head office, ensuring alignment between local execution and global strategy.

For this project I used:

  • Adobe XD

  • Adobe Illustrator

  • Adobe Photoshop

  • Balsamiq

  • Azure

Adobe Photoshop logo with a dark blue background and light blue letters 'Ps'
Adobe XD logo with pink text on a dark background with a pink border.
Icon representing Adobe Illustrator with an orange border and black background, displaying the letters "Ai" in orange.
  • Atom

  • HTML

  • CSS

  • Javascript

  • jQuery

  • NodeJS

USER JOURNEY

The Activity Planner supported four distinct user groups, each with defined permissions for viewing and editing events.

To ensure clarity and alignment, I created a detailed user journey framework outlining the actions, access levels, and interaction paths for each group, providing a clear reference for both design and development.

A digital activity planner user interface titled 'John Lewis Activity Planner' with sections for views, content filters, actions, and branch activities. The layout includes buttons for creating, editing, saving, publishing, and removing global and branch activities.

SKETCHES

During requirements discussions with stakeholders and Business Analysts, I used rapid sketching to visualise ideas in real time. This enabled quick alignment on functionality and overall direction, ensuring a shared understanding before moving into more detailed design stages.

INTERACTIVE STYLE GUIDE

After aligning with developers on the tech stack, I built an interactive style guide using HTML, CSS, and JavaScript. This provided a practical reference for implementation, allowing developers to explore components in context and reuse production-ready code snippets directly within their workflows.