AI
AI
Insights
Insights
AI blog site redesign
AI blog site redesign
AI blog site redesign
Same Task, One Year Apart.
Same Task, One Year Apart.
Same Task, One Year Apart.
UX/UI Design
UX/UI Design
Interactive prototyping
Interactive prototyping
Responsive design
Responsive design
Project overview
Project overview
In both 2024 and 2025, I was given the same recruitment task: design a homepage for an AI news platform. This gave me a unique chance to revisit the same challenge a year later and reflect on how my design approach evolved. This case study highlights that growth.
In both 2024 and 2025, I was given the same recruitment task: design a homepage for an AI news platform. This gave me a unique chance to revisit the same challenge a year later and reflect on how my design approach evolved. This case study highlights that growth.
Goal
Goal
This redesign tackles the limitations of the previous version, leveraging my growth over the past year to deliver stronger hierarchy, better contrast, accessibility, responsiveness, and a cohesive design system.
This redesign tackles the limitations of the previous version, leveraging my growth over the past year to deliver stronger hierarchy, better contrast, accessibility, responsiveness, and a cohesive design system.
My process
My process
Research
Research
Looking for inspiration and current trends used in AI and technology
Exploration
Exploration
Talking with Figma Make to brainstorm ideas and find the best baseline
Styling
Styling
Building style guides that will be used throughout the project
Building type guide and color guide that to be used throughout the project
Design
Design
Deciding on the final look of the page and building layouts, components etc.
Prototype
Prototype
Building an interactive prototype to streamline design testing.
Adaptation
Adaptation
Ensuring that everything scale properly on every device
Before & After: Key Changes
Before & After: Key Changes
Before & After: Key Changes
My insights from the old design and how new version tackles these errors
My insights from the old design and how new version tackles these errors
My insights from the old design and how new version tackles these errors
1.
1.
Contrast & WCAG compliance
Contrast & WCAG compliance
I noticed how poor contrast hurt readability and accessibility in my previous version. In the 2025 update, I made clarity and compliance a priority.
I noticed how poor contrast hurt readability and accessibility in my previous version. In the 2025 update, I made clarity and compliance a priority.
2024
2024
Poor contrast - Low contrast and no button fills make them hard to read and fails WCAG standards.
Poor contrast - Low contrast and no button fills make them hard to read and fails WCAG standards.
2025
2025
Good contrast - Strong color separation and adequate contrast makes buttons and texts easy to see and accessible.
Good contrast - Strong color separation and adequate contrast makes buttons and texts easy to see and accessible.
2.
2.
Hero section
Hero section
In the 2024 version, the homepage lacked a hero section and pushed all news into one block, making it less engaging. In 2025, I introduced a featured story hero to capture attention, with latest news placed below for better flow.
In the 2024 version, the homepage lacked a hero section and pushed all news into one block, making it less engaging. In 2025, I introduced a featured story hero to capture attention, with latest news placed below for better flow.
Hero section
2.
2024
2024
No hero section - All news crammed into one grid, space wasted, less engaging.
No hero section - All news crammed into one grid, space wasted, less engaging.
2025
2025
Featured story as hero - Captures attention first, latest news follows for smoother flow.
Featured story as hero - Captures attention first, latest news follows for smoother flow.
3.
3.
Structure & hierarchy
Structure & hierarchy
In my previous design, oversized thumbnails crowded the layout and the icon-only “Read more” reduced accessibility. In the 2025 version, I balanced elements to make titles clear and interactions more visible, improving hierarchy and engagement, while freeing space for additional functions like save or share.
In my previous design, oversized thumbnails crowded the layout and the icon-only “Read more” reduced accessibility. In the 2025 version, I balanced elements to make titles clear and interactions more visible, improving hierarchy and engagement, while freeing space for additional functions like save or share.
2024
2024
Poor structure - Oversized thumbnails leave little room for titles; icon-only “Read more” reduces accessibility.
Poor structure - Oversized thumbnails leave little room for titles; icon-only “Read more” reduces accessibility.
2025
2025
Good sctructure - Balanced thumbnails allow clear titles; visible “Read more” boosts accessibility and engagement.
Good sctructure - Balanced thumbnails allow clear titles; visible “Read more” boosts accessibility and engagement.
4.
4.
Responsiveness & Scaling
Responsiveness & Scaling
The 2024 version was fixed to desktop layouts, limiting usability on other devices. In the 2025 version, I focused on responsive design, ensuring layouts adapt smoothly to mobile and tablet screens while maintaining clarity and hierarchy.
The 2024 version was fixed to desktop layouts, limiting usability on other devices. In the 2025 version, I focused on responsive design, ensuring layouts adapt smoothly to mobile and tablet screens while maintaining clarity and hierarchy.
2024
2024
No responsiveness - Layout fixed to desktop, limiting usability on smaller screens.
No responsiveness - Layout fixed to desktop, limiting usability on smaller screens.
2025
2025
Responsive design across all devices - Adapts smoothly across desktop, tablet, and mobile for consistent clarity and hierarchy.
Responsive design across all devices - Adapts smoothly across desktop, tablet, and mobile for consistent clarity and hierarchy.
See the designs in action
See the designs in action
See the designs in action
Choose the design you want to open in full screen version
Choose the design you want to open in full screen version
Let's make something great
Let's make
something great
Contact me through one of the options below