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
Tablet at Portrait dimensions: 768px
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
Tablet at Portrait dimensions: 768px
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
Tablet at Portrait dimensions: 768px
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
at Portrait dimensions: 768px
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
Tablet at Portrait dimensions: 768px
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)