Miracle-Ear

Modernising Hearing Innovation

Miracle-Ear, a subsidiary of Amplifon and the creator of the world’s first in-the-ear hearing aid, provides discreet and advanced hearing solutions. However, their existing website was outdated and struggling to engage an evolving demographic. The site was redesigned to present content in smaller, digestible sizes, simplifying the user experience by focusing on key actions relevant to the target audience, backed by analytical data insights.

Year

2019

Agency

Publicis Sapient

Role

UI Design, Motion Design, Illustration

Cover image showcasing the redesigned Miracle-Ear website interface.
The redesigned Miracle-Ear website aims to simplify user interactions and modernise the brand’s digital presence.

The atomic design approach was adopted to build a flexible design system tailored to different content types.

User interface components of the Miracle-Ear website, illustrating the design system.
A bespoke design system was developed, using the atomic design approach to structure the content and interface.

Branded Motion

The Miracle-Ear tone of voice was expressed through animation principles that conveyed a more energetic and light-hearted character. The animations were carefully crafted to enhance the user experience while adhering to accessibility standards.

Visual representation of Miracle-Ear’s tone of voice and its translation into motion principles.
Animation principles were aligned with the brand’s tone of voice, ensuring a light-hearted yet accessible experience.

After defining the motion principles, a unique loader animation inspired by the brand logo was created for the appointment booking pages.

A unique loader animation, reflecting the brand, was incorporated into the 'Appointment booking' page.
Light-hearted motion principles were applied to button animations, enhancing user interaction.
Energetic motion principles were applied to the 'Find a store' feature, reflecting the brand’s dynamic character.
Subtle reveal motion concept applied to smooth transitions during page scrolling.