Designing an Intuitive, Impact-Driven Experience for Costa at Host Milano — +40% User Engagement.
Responsibilities: UX Design, Prototyping
Tools: Figma, Photoshop, Illustrator
Duration: 1 month
View mobile prototype →
View desktop prototype →
Challenge
o coincide with their presence at Host Milano, Costa requested a dynamic, engaging microsite to announce and activate their new B2B brand, Costa X. The digital experience needed to reflect Costa’s technology forward direction while enabling customer appointment bookings and showcasing product propositions.
Background
Costa Express has recently evolved into Costa X, a tech-led coffee platform aimed at providing coffee solutions for businesses. With backing from Coca Cola, the brand needed a strong debut at Host Milano, a major B2B hospitality event.
Considerations
I explored the brief for the any considerations before proceeding with wireframes. The key functionalities were identified as:
A VIP booking system for event appointments
An interactive product diagnostic tool with email capture
A content structure reflecting real-world application scenarios such as hotels and workspaces
Design principles
When creating solutions to the problem, I approached the design phase with three design principles. Therefore, providing a rationale and strategy behind my design decisions.
Informative – Clearly present Costa X’s propositions
Engaging – Showcase the brand through bold storytelling
Interactive – Encourage bookings and product exploration
Site map ideation
I developed a site map to define where content sits. I focused on developing the key customer journey such as:
How users book appointments from the homepage
How product offerings are categorised based on business lifestyle scenarios
This structure ensured that users could engage with the brand based on their sector needs, driving relevance and interest.
Exploration
I proceed with a mobile-first approach, I developed low-fidelity wireframes and rapidly iterated based on feedback. Mid-fidelity wireframes were refined through client and development input, aligning every decision with the brand’s voice and usability standards.
Design and iteration
The interface was designed to be clean, modern, and flexible, ensuring inclusivity and responsiveness across devices. I collaborated closely with developers, providing documentation and annotated guidance for smooth implementation. Iterations were efficient due to tight communication and mutual feedback loops.
Design solution
The final microsite successfully boosted Costa X’s presence at Host Milano, delivering an experience that combined brand clarity, user interactivity, and performance optimisation. It helped increase visibility, appointment bookings, and lead generation during the event.
Impact
↑
Brand visibility
500+
+40%
Demo sign-ups
User engagement
Key learnings
A mobile-first approach ensured seamless responsiveness
Well-placed CTAs increased appointments
Optimisation improved load times and reduced bounce rates