Grazia UK
WebApp

Transform the weekly print publication into a dynamic web app with animated editions, enhancing user engagement. Delivering within a fixed go-live period, to ensure a seamless transition to digital while maintaining Grazia UK signature style and appeal.

Role: UX/UI Digital Developer

Project Type: Web App

Design Skills:Adobe Photoshop, Illustrator, inDesign, Animate

Developement Skills:HTML5, CSS3 (CSS keyframe animations)

Technologies: Web App (Apple iOS and Google Andriod)

website:https://graziadaily.co.uk

Office - "Trainer Mania Shopping Experience"

The shopping page is designed with a clear brand and product layout, ensuring a seamless and engaging user experience. The intuitive UI structure enhances navigation, making it easy for users to browse and interact with products. Each shoe in the animation features its own dedicated link, enabling effortless exploration and purchase within a smooth and visually dynamic interface.

Skills: Photoshop, Illustrator, HTML5, CSS3

Mobile at Portrait dimensions: 375px

Play animation

Tablet at Portrait dimensions: 768px

Play animation

Coach - "10 Hot Spring Looks"

Each handbag in the animation featured its own dedicated link, ensuring a smooth and interactive user journey. This design approach allowed users to effortlessly explore and purchase products within the app, enhancing the shopping experience with a visually dynamic and user-friendly interface.

Skills: Photoshop, HTML5, CSS3

Tablet at Landscape dimensions: 1024px

Play animation


Tablet at Portrait dimensions: 768px

Play animation

Cirque du Style - "Immersive Article Experience"

The article page features elegantly animated text, creating a dynamic and engaging reading experience.

Skills: Photoshop, inDesign, HTML5, CSS3

Mobile at Portrait dimensions: 375px

Play animation

Tablet at Portrait dimensions: 768px

Play animation

Kate Spade -"360% experience"

Swipe to seamlessly navigate through the spine-touch interface, creating an intuitive and engaging touch-screen experience.

Skills: Photoshop, inDesign, HTML5, CSS3

Mobile at Portrait dimensions: 375px

Tablet at Portrait dimensions: 768px

Riot Girls - "Immersive Article Experience"

The article page features animated text, creating a dynamic and engaging experience.

Skills: Photoshop, inDesign, HTML5, CSS3

Mobile at Portrait dimensions: 375px

Play animation

at Portrait dimensions: 768px

Play animation

Tumult Hype

A demo to progress the creation of a bespoke article page, enabling the integration of the Print Design team into the Web App workflow. Using Tumult Hype to streamline the animation process.

Skills: inDesign, Photoshop, Tumult Hype

Tablet at Portrait dimensions: 768px

Play animation

Tablet at Portrait dimensions: 768px

Play animation

How to use to Web App

In response to users struggling to navigate the Web App, a simplified layout was designed for both desktop and mobile (portrait orientation), improving clarity and overall user experience across devices.

Skills: Photoshop

iPad (iOS + Android)
Mobile (iOS + Android)