Anime Tracking Platform Redesign
Background
MyAnimeList is one of the most widely used anime and manga tracking platforms, yet its interface feels dated and cluttered. This redesign reimagines the experience with a cleaner, modern system that improves navigation, personalization, and community interaction. The direction was informed by AniList’s contemporary UI, Steam’s community and library structure, and the existing MyAnimeList framework.
Goals
Research and Reference
To ground the redesign, I compared MyAnimeList’s existing interface with similar platforms that manage large libraries and communities:
AniList → Clean, modern UI and strong use of hierarchy for readability.
Steam → Robust community features and efficient library management patterns.
MyAnimeList (current) → Rich database and active forums, but with dated visuals, cluttered layouts, and inconsistent navigation.
These references helped me identify what works well elsewhere and what needed improvement in MAL, guiding decisions for a UI overhaul that feels familiar yet modern.
Moodboard
Visual direction inspired by modern anime platforms, community-driven design, and clean UI patterns.
Wireframes
The wireframes translated the heuristic findings into structure before visual refinement. Each layout focused on clarifying hierarchy, simplifying navigation, and improving visibility of system status identified during evaluation.
Style Guide
Defines colors, typography, and components to ensure consistency and readability across the redesign.
Key Redesign Highlights
The redesign focused on addressing usability gaps identified through a heuristic evaluation of MyAnimeList. Below are a few examples where applying usability principles led to meaningful improvements.
Click to access the Accessibility Component Heuristic evaluation
Click to access the Pagewise Heuristic Evaluation
🟥 Initial Design | 🟩 Revised Design
Click to open the prototype
An interactive prototype brings the redesigned MyAnimeList experience to life. Explore the new navigation, anime detail pages, and improved readability directly in the browser.
Reflection
Through heuristic evaluation, I identified key gaps in MyAnimeList’s UI, cluttered layouts, weak hierarchy, and dated visuals. The redesign showed how small, systematic changes in readability and navigation can greatly improve usability. Referencing AniList and Steam guided the balance between modern aesthetics and functionality.
Explore the Full Case Study
This overview highlights a few key redesigns, but the full case study goes deeper.
See all 10 heuristic-based evaluations, detailed before/after comparisons, moodboard, style guide, and the interactive prototype.