Social
Client
Self-led
Read time
Client
4 min
Self-led
Read Time
4 min
Category
Category
Digital Storytelling
Digital Storytelling
Are robots taking over?
Are robots taking over?
Role
Role
UI/UX Designer, Website Designer
UI/UX Designer, Website Designer
Year
Year
2023
2023
Duration
Duration
1.5 months
1.5 months
PROJECT OVERVIEW
Where chess meets AI
I designed Are Robots Taking Over?, a curated and content-driven website built with Readymag. The goal was to reframe a long-form interview with Garry Kasparov into an immersive, editorial UI/UX that explores the evolving relationship between humans and AI. This project focused on website design, content curation, and thematic storytelling.
PROBLEM STATEMENT
The problem with traditional editorials
Long-form interviews are often published in static, text-heavy formats that fail to hold attention or highlight the nuance of the conversation. For digital natives who are used to fast and interactive media, this makes even compelling topics like chess and AI feel distant or inaccessible. The task was to create an experience that feels more immersive, digestible, and engaging without diluting the depth of the content.
design opportunity
Bringing stories to life
There is an opportunity to reimagine how long-form editorial content is experienced by turning static interviews into immersive, scroll-based narratives. I plan to design a website that uses motion, layout, and interaction to highlight key ideas, emotions, and pacing, making complex topics like chess and AI more engaging and easier to absorb.
Design Process
Design Process
Research
Research
Design
Design
Test
Test
Deliver
Deliver
research
Exploring structure and storytelling
This was a school project where I designed my first website using Readymag. The task was to reframe a long-form interview into a more curated, immersive experience. To do this, I revised the content hierarchy, explored site layout references, and sketched out sitemaps to better understand how to present the material.
As someone who plays chess and is fascinated by artificial intelligence, especially through sci-fi films like Terminator, I was naturally drawn to the subject. I spent time analysing the interview’s context to better understand its scope, tone, and flow. This helped me define a visual direction that supported both the theme of man versus machine and the editorial UI/UX experience.
This was a school project where I designed my first website using Readymag. The task was to reframe a long-form interview into a more curated, immersive experience. To do this, I revised the content hierarchy, explored site layout references, and sketched out sitemaps to better understand how to present the material.
As someone who plays chess and is fascinated by artificial intelligence, especially through sci-fi films like Terminator, I was naturally drawn to the subject. I spent time analysing the interview’s context to better understand its scope, tone, and flow. This helped me define a visual direction that supported both the theme of man versus machine and the editorial UI/UX experience.
This was a school project where I designed my first website using Readymag. The task was to reframe a long-form interview into a more curated, immersive experience. To do this, I revised the content hierarchy, explored site layout references, and sketched out sitemaps to better understand how to present the material.
As someone who plays chess and is fascinated by artificial intelligence, especially through sci-fi films like Terminator, I was naturally drawn to the subject. I spent time analysing the interview’s context to better understand its scope, tone, and flow. This helped me define a visual direction that supported both the theme of man versus machine and the editorial UI/UX experience.
This was a school project where I designed my first website using Readymag. The task was to reframe a long-form interview into a more curated, immersive experience. To do this, I revised the content hierarchy, explored site layout references, and sketched out sitemaps to better understand how to present the material.
As someone who plays chess and is fascinated by artificial intelligence, especially through sci-fi films like Terminator, I was naturally drawn to the subject. I spent time analysing the interview’s context to better understand its scope, tone, and flow. This helped me define a visual direction that supported both the theme of man versus machine and the editorial UI/UX experience.
Have a nice project?
Have a nice project?
Get in touch
Get in touch
design strategy
Project goals
To design the website with clarity and intention, I focused on three key goals:
Create a visual experience that reflects the tension between human and machine
Use structure and hierarchy to guide users naturally through the interview’s themes
These goals helped me shape the layout, interactions, and overall tone of the site.
To design the website with clarity and intention, I focused on three key goals:
Create a visual experience that reflects the tension between human and machine
Use structure and hierarchy to guide users naturally through the interview’s themes
These goals helped me shape the layout, interactions, and overall tone of the site.
To design the website with clarity and intention, I focused on three key goals:
Create a visual experience that reflects the tension between human and machine
Use structure and hierarchy to guide users naturally through the interview’s themes
These goals helped me shape the layout, interactions, and overall tone of the site.
To design the website with clarity and intention, I focused on three key goals:
Create a visual experience that reflects the tension between human and machine
Use structure and hierarchy to guide users naturally through the interview’s themes
These goals helped me shape the layout, interactions, and overall tone of the site.
art direction
Shaping the visual language
To reflect the project’s blend of intellect and technology, I selected a visual style that feels both sophisticated and futuristic, guided by several references gathered through moodboarding.
I paired Cosi Times with Space Grotesk to balance editorial elegance with modern functionality. The serif typeface added weight to key moments in the text, while the sans-serif provided clean readability across the site. The colour palette featured light blue, black, and white, with a deep navy background that appeared almost black.
To reflect the project’s blend of intellect and technology, I selected a visual style that feels both sophisticated and futuristic, guided by several references gathered through moodboarding.
I paired Cosi Times with Space Grotesk to balance editorial elegance with modern functionality. The serif typeface added weight to key moments in the text, while the sans-serif provided clean readability across the site. The colour palette featured light blue, black, and white, with a deep navy background that appeared almost black.
To reflect the project’s blend of intellect and technology, I selected a visual style that feels both sophisticated and futuristic, guided by several references gathered through moodboarding.
I paired Cosi Times with Space Grotesk to balance editorial elegance with modern functionality. The serif typeface added weight to key moments in the text, while the sans-serif provided clean readability across the site. The colour palette featured light blue, black, and white, with a deep navy background that appeared almost black.
To reflect the project’s blend of intellect and technology, I selected a visual style that feels both sophisticated and futuristic, guided by several references gathered through moodboarding.
I paired Cosi Times with Space Grotesk to balance editorial elegance with modern functionality. The serif typeface added weight to key moments in the text, while the sans-serif provided clean readability across the site. The colour palette featured light blue, black, and white, with a deep navy background that appeared almost black.
prototyping
From concept to critique
I built the website using Readymag, a no-code platform that allowed me to focus fully on the visual design, user experience, and narrative flow without getting caught up in technical constraints. This gave me the freedom to experiment with layout, interaction, and theme while maintaining a consistent aesthetic that aligned with the project's concept.
The process was iterative. I went through several rounds of critique, which were largely constructive and helped refine the user journey. The feedback also highlighted the strength of my design sensibility, with many complimenting the cohesiveness of the visual language and the clarity of the experience.
I built the website using Readymag, a no-code platform that allowed me to focus fully on the visual design, user experience, and narrative flow without getting caught up in technical constraints. This gave me the freedom to experiment with layout, interaction, and theme while maintaining a consistent aesthetic that aligned with the project's concept.
The process was iterative. I went through several rounds of critique, which were largely constructive and helped refine the user journey. The feedback also highlighted the strength of my design sensibility, with many complimenting the cohesiveness of the visual language and the clarity of the experience.
I built the website using Readymag, a no-code platform that allowed me to focus fully on the visual design, user experience, and narrative flow without getting caught up in technical constraints. This gave me the freedom to experiment with layout, interaction, and theme while maintaining a consistent aesthetic that aligned with the project's concept.
The process was iterative. I went through several rounds of critique, which were largely constructive and helped refine the user journey. The feedback also highlighted the strength of my design sensibility, with many complimenting the cohesiveness of the visual language and the clarity of the experience.
I built the website using Readymag, a no-code platform that allowed me to focus fully on the visual design, user experience, and narrative flow without getting caught up in technical constraints. This gave me the freedom to experiment with layout, interaction, and theme while maintaining a consistent aesthetic that aligned with the project's concept.
The process was iterative. I went through several rounds of critique, which were largely constructive and helped refine the user journey. The feedback also highlighted the strength of my design sensibility, with many complimenting the cohesiveness of the visual language and the clarity of the experience.
reflection
Final thoughts
Overall, I’m proud of how the project came together. The final website successfully delivers an immersive, visually cohesive experience that reflects the theme and intent behind the content. The process allowed me to push my creative boundaries while staying grounded in usability and structure.
As an extension of this work, I also created a social media–inspired chess learning platform on Instagram. It’s designed to teach beginners how to play chess using similar design principles and visual language from the website. You can explore and test it through this link, and I’ve also embedded the full website below for anyone to try.
Overall, I’m proud of how the project came together. The final website successfully delivers an immersive, visually cohesive experience that reflects the theme and intent behind the content. The process allowed me to push my creative boundaries while staying grounded in usability and structure.
As an extension of this work, I also created a social media–inspired chess learning platform on Instagram. It’s designed to teach beginners how to play chess using similar design principles and visual language from the website. You can explore and test it through this link, and I’ve also included the link of the full website below for anyone to try (only designed for desktop).
Overall, I’m proud of how the project came together. The final website successfully delivers an immersive, visually cohesive experience that reflects the theme and intent behind the content. The process allowed me to push my creative boundaries while staying grounded in usability and structure.
As an extension of this work, I also created a social media–inspired chess learning platform on Instagram. It’s designed to teach beginners how to play chess using similar design principles and visual language from the website. You can explore and test it through this link, and I’ve also included the link of the full website below for anyone to try (only designed for desktop).
Overall, I’m proud of how the project came together. The final website successfully delivers an immersive, visually cohesive experience that reflects the theme and intent behind the content. The process allowed me to push my creative boundaries while staying grounded in usability and structure.
As an extension of this work, I also created a social media–inspired chess learning platform on Instagram. It’s designed to teach beginners how to play chess using similar design principles and visual language from the website. You can explore and test it through this link, and I’ve also embedded the full website below for anyone to try.