Silver laptop mockup resting on a textured concrete pedestal, displaying the custom Banham Academy website homepage, conceptually showcasing the professional UI/UX design and real-world client frontend development featured in John Luba's web design portfolio.

DISCOVER PROJECT

Banham Academy

Banham Academy website design

A complete website redesign that modernised Banham Academy’s digital presence and improved the user experience for students and staff.

2023

SERVICES:

Website redesign UI/UX and branding Educational platform

Detailed website sitemap and information architecture diagram for the Banham Academy client project, conceptually illustrating the strategic UX planning, content hierarchy, and structural foundation of John Luba's web development process.
var(--variable-works-featured-01-alt)
Detailed website sitemap and information architecture diagram for the Banham Academy client project, conceptually illustrating the strategic UX planning, content hierarchy, and structural foundation of John Luba's web development process.

The challenge

Banham Academy needed to redesign their website with the goal of creating a modern, accessible, and professional online presence. The new site needed to reflect the Academy’s commitment to excellence in education and training while improving usability for students, parents, and partners. The project focused on reshaping both the user experience and the brand presentation, bringing the digital platform in line with Banham’s reputation for quality and innovation.

The process

The project began with stakeholder workshops to understand the Academy’s needs and the expectations of its users. I conducted a full content audit, mapped the user journeys, and identified major usability gaps. The research phase also included benchmarking against other leading education providers to determine what users expect from a contemporary learning platform. Based on these insights, I created low-fidelity wireframes that focused on simplifying navigation and clarifying key user flows. Once the structure was approved, I developed a new visual system built around Banham’s existing brand identity but refined it with a more cohesive colour palette, modern typography, and updated imagery. Prototypes were tested with students and staff to validate design decisions and ensure accessibility standards were met. The development phase focused on responsive layouts, performance optimisation, and integrating tools for course management and online enquiries.
Four UX strategy presentation slides for the Banham Academy client project, detailing web design recommendations, WCAG accessibility standards, and visual mood boards, conceptually highlighting the client consultation and creative ideation phase of John Luba's web development process.
var(--variable-works-process-01-alt)
Four UX strategy presentation slides for the Banham Academy client project, detailing web design recommendations, WCAG accessibility standards, and visual mood boards, conceptually highlighting the client consultation and creative ideation phase of John Luba's web development process.
Side-by-side digital wireframes for the Banham Academy website, featuring annotated layout blocks, placeholder text, and structural grids, conceptually representing the UI/UX prototyping phase and user journey mapping within John Luba's web design process.
var(--variable-works-process-02-alt)
Side-by-side digital wireframes for the Banham Academy website, featuring annotated layout blocks, placeholder text, and structural grids, conceptually representing the UI/UX prototyping phase and user journey mapping within John Luba's web design process.
Extended low-fidelity digital wireframes for Banham Academy's internal website pages, displaying detailed content hierarchy, layout blocks, and structural column grids, conceptually illustrating the comprehensive UX architecture and page flow design in John Luba's web development portfolio.
var(--variable-works-process-03-alt)
Extended low-fidelity digital wireframes for Banham Academy's internal website pages, displaying detailed content hierarchy, layout blocks, and structural column grids, conceptually illustrating the comprehensive UX architecture and page flow design in John Luba's web development portfolio.

The solution

The final design delivered a clear and engaging experience across all devices. The new homepage highlighted Banham Academy’s mission and offered direct pathways to courses, resources, and enrolment. A restructured navigation system helped users find relevant information faster, while consistent visual elements reinforced the brand identity.
High-fidelity responsive UI design mockups for the Banham Academy website, featuring side-by-side desktop and mobile viewport layouts with integrated brand photography, conceptually illustrating the final visual polish and cross-device accessibility in John Luba's web development portfolio.
var(--variable-works-final-01-alt)
High-fidelity responsive UI design mockups for the Banham Academy website, featuring side-by-side desktop and mobile viewport layouts with integrated brand photography, conceptually illustrating the final visual polish and cross-device accessibility in John Luba's web development portfolio.
Side-by-side full-page high-fidelity desktop UI mockups for the Banham Academy website, featuring clean visual hierarchy, integrated photography, and custom component design, conceptually showcasing the final digital branding and comprehensive web design execution in John Luba's portfolio.
var(--variable-works-final-02-alt)
Side-by-side full-page high-fidelity desktop UI mockups for the Banham Academy website, featuring clean visual hierarchy, integrated photography, and custom component design, conceptually showcasing the final digital branding and comprehensive web design execution in John Luba's portfolio.
Side-by-side high-fidelity desktop UI mockups for Banham Academy's internal service and course pages, featuring staggered content blocks, clean typography, and integrated photography, conceptually demonstrating the final visual pacing and complex information structuring in John Luba's web design portfolio.
var(--variable-works-final-03-alt)
Side-by-side high-fidelity desktop UI mockups for Banham Academy's internal service and course pages, featuring staggered content blocks, clean typography, and integrated photography, conceptually demonstrating the final visual pacing and complex information structuring in John Luba's web design portfolio.

The impact

Following the redesign, Banham Academy saw measurable improvements in both engagement and usability. Online enquiries increased by 60% within the first three months, while the bounce rate on key pages dropped by nearly half. User feedback highlighted how much easier it was to navigate and find course information, particularly on mobile devices. The internal team also reported saving time through streamlined content management and clearer page templates. The new website successfully repositioned Banham Academy as a forward-thinking educational institution and strengthened its digital foundation for future growth. Since then Academy grew to open two more locations nationwide.

Visit the website here : https://www.banhamacademy.co.uk/

MORE PROJECTS

MORE PROJECTS

Banham Patent Locks

Doors video ads for Banham Patent Locks

A curated collection of video ads produced for multiple door campaigns, showcasing different creative approaches and storytelling styles.

Banham Patent Locks

Doors video ads for Banham Patent Locks

A curated collection of video ads produced for multiple door campaigns, showcasing different creative approaches and storytelling styles.

Banham Patent Locks

Doors video ads for Banham Patent Locks

A curated collection of video ads produced for multiple door campaigns, showcasing different creative approaches and storytelling styles.

Banham Patent Locks

Locks video ads for Banham Patent Locks

A curated collection of video ads produced for multiple lock campaigns, showcasing different creative approaches and storytelling styles.

Banham Patent Locks

Locks video ads for Banham Patent Locks

A curated collection of video ads produced for multiple lock campaigns, showcasing different creative approaches and storytelling styles.

Banham Patent Locks

Locks video ads for Banham Patent Locks

A curated collection of video ads produced for multiple lock campaigns, showcasing different creative approaches and storytelling styles.

Banham Patent Locks

Marketing brand campaign

Our goal was clear: shift from a purely product-driven strategy to a brand-led campaign that would raise awareness, strengthen equity, and build long-term trust.

Protect Family

Banham Patent Locks

Marketing brand campaign

Our goal was clear: shift from a purely product-driven strategy to a brand-led campaign that would raise awareness, strengthen equity, and build long-term trust.

Protect Family

Banham Patent Locks

Marketing brand campaign

Our goal was clear: shift from a purely product-driven strategy to a brand-led campaign that would raise awareness, strengthen equity, and build long-term trust.

Protect Family

Experimental

AI chat interface

A smarter interface for AI conversations

AI Chat Hero

Experimental

AI chat interface

A smarter interface for AI conversations

AI Chat Hero

Experimental

AI chat interface

A smarter interface for AI conversations

AI Chat Hero

Banham Patent Locks

Lavish storybook

A lush, tactile brochure designed for a premium security brand, bringing warmth and prestige to high-end products and services.

A book on a table with sunshine highlights

Banham Patent Locks

Lavish storybook

A lush, tactile brochure designed for a premium security brand, bringing warmth and prestige to high-end products and services.

A book on a table with sunshine highlights

Banham Patent Locks

Lavish storybook

A lush, tactile brochure designed for a premium security brand, bringing warmth and prestige to high-end products and services.

A book on a table with sunshine highlights

Banham Patent Locks

Crafted in Britain

A campaign celebrating authentic British craftsmanship—close-ups, tactile shots, and rich visuals that make precision feel personal.

Hot stumping lock

Banham Patent Locks

Crafted in Britain

A campaign celebrating authentic British craftsmanship—close-ups, tactile shots, and rich visuals that make precision feel personal.

Hot stumping lock

Banham Patent Locks

Crafted in Britain

A campaign celebrating authentic British craftsmanship—close-ups, tactile shots, and rich visuals that make precision feel personal.

Hot stumping lock

Banham Patent Locks

Heritage rebranded

A sleek identity refresh and site redesign for a legacy security brand—marrying tradition with modern minimalism and digital polish.

Lock and cylinder

Banham Patent Locks

Heritage rebranded

A sleek identity refresh and site redesign for a legacy security brand—marrying tradition with modern minimalism and digital polish.

Lock and cylinder

Banham Patent Locks

Heritage rebranded

A sleek identity refresh and site redesign for a legacy security brand—marrying tradition with modern minimalism and digital polish.

Lock and cylinder

Avvio

Be direct, be clear

A bold visual update and streamlined site—built around the mantra “Be More Direct,” designed for clarity and impact.

Avvio logo

Avvio

Be direct, be clear

A bold visual update and streamlined site—built around the mantra “Be More Direct,” designed for clarity and impact.

Avvio logo

Avvio

Be direct, be clear

A bold visual update and streamlined site—built around the mantra “Be More Direct,” designed for clarity and impact.

Avvio logo

Banham Keyholding

Unlocked storytelling

From script to screen: a short animated explainer turned live Sky TV spot—crafted to captivate and convert in 30 seconds.

Animation in situ

Banham Keyholding

Unlocked storytelling

From script to screen: a short animated explainer turned live Sky TV spot—crafted to captivate and convert in 30 seconds.

Animation in situ

Banham Keyholding

Unlocked storytelling

From script to screen: a short animated explainer turned live Sky TV spot—crafted to captivate and convert in 30 seconds.

Animation in situ
Have a project in mind?

Book a short intro call to discuss scope, fit, and next steps.

Have a project in mind?

Book a short intro call to discuss scope, fit, and next steps.

Have a project in mind?

Book a short intro call to discuss scope, fit, and next steps.